:root{--studio-accent:#142d63;background:white}header{padding:18px 3.5%;gap:26px}#home{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--studio-accent);font-size:25px}#studio-logo{width:84px;height:42px;object-fit:contain}main{max-width:1700px;padding:20px 3.5%}.editor-heading{text-align:center;margin:0 0 24px}.editor-heading h1{font-size:24px;margin:8px 0}.editor-heading p{font-size:12px;color:#667382;margin:10px 0}.editor-heading>a{font-size:13px;margin:0 15px}.workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px}.product-preview{position:sticky;top:18px;align-self:start;min-width:0}#stage{height:570px;min-height:390px;border-radius:0;background:#eaf0f2}.views{position:static;margin:14px 0;flex-wrap:wrap}.views button{background:white;color:var(--studio-accent);border:1px solid #cdd4df}.preview-instructions{text-align:center;font-size:12px;color:#647382}#status{text-align:center;font-size:12px;padding:0 12px}.studio-options{padding:0;border:0;border-radius:0;max-height:none!important;overflow:visible!important;background:white;min-width:0}.studio-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;border-bottom:1px solid #dce2e6;padding-bottom:16px}.studio-steps button{font-size:11px;line-height:1.5;display:flex;align-items:center;flex-direction:column;background:white;border:0;padding:8px 3px;color:#6a7483;min-width:0}.studio-steps b{display:grid;place-items:center;background:#edf0f5;width:29px;height:29px;border-radius:50%;margin-bottom:5px}.studio-steps [aria-current=step]{color:var(--studio-accent);font-weight:bold}.studio-steps [aria-current=step] b{background:var(--studio-accent);color:white}.studio-panel{padding:22px 0;min-height:360px}.studio-panel h2{font-size:21px;margin:0 0 14px}.studio-panel>p{font-size:13px;color:#526372}.studio-panel input:not([type=color]),.studio-panel select{width:100%;min-width:0}.studio-panel label{margin:12px 0;font-size:13px}.studio-panel input[type=color]{width:56px}.studio-panel .design-controls{gap:12px}#design-library>h2,#design-library>p{display:none}.design-controls>label{border-bottom:1px solid #e9ecf0;padding:10px 0;margin:0;grid-template-columns:minmax(0,1fr) auto;align-items:center}.design-controls>label select{max-width:260px}.design-controls>button{font-size:12px}.studio-accordion,.personalization-item{border:1px solid #dbe1e9;border-radius:7px;padding:14px;margin:14px 0}.studio-accordion summary,.personalization-item summary{font-size:14px;font-weight:600;cursor:pointer}.studio-accordion>label{margin:14px 0}.personalization-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.personalization-item input[type=range]{padding:0}.personalization-item button{font-size:12px}.step-navigation{display:flex;justify-content:space-between;border-top:1px solid #dce2e6;padding-top:18px;gap:12px}.step-navigation button,#tools>button{background:var(--studio-accent);color:white;border:0;padding:14px 18px}.step-navigation button:disabled{opacity:.35}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(max-width:850px){.workspace{grid-template-columns:1fr;gap:20px}.product-preview{position:static}#stage{height:440px;min-height:320px}.studio-options{padding:0}.studio-panel{min-height:0}.editor-heading h1{font-size:20px}.design-controls>label{grid-template-columns:1fr auto}.design-controls>label select{max-width:210px}}@media(max-width:450px){#stage{height:350px}.studio-steps button{font-size:10px}.studio-steps{gap:0}header span{display:none}#home{font-size:18px}#studio-logo{width:64px}.design-controls>label select{max-width:170px}}
/* Source reference: Champro 26 editor, captured 28 September 2026. */
:root{--studio-accent:#007bbd;--studio-slate:#464d5a;--studio-line:#d1dce2}
#editor>.studio-steps{grid-template-columns:repeat(4,1fr);background:var(--studio-slate);gap:0;padding:0;border:0;min-height:54px;margin-bottom:22px}
#editor>.studio-steps button{flex-direction:row;justify-content:center;font-size:15px;text-transform:uppercase;font-weight:700;color:white;background:transparent;border-radius:0;padding:17px 10px}
#editor>.studio-steps button[aria-current=step]{background:white;color:var(--studio-slate);box-shadow:inset 0 3px var(--studio-accent)}
.studio-steps b{display:none}
.workspace{grid-template-columns:minmax(0,2.75fr) minmax(330px,1fr);gap:24px}
.editor-heading{text-align:left;position:relative;padding-right:160px;margin:10px 0 20px}.editor-heading h1{font-size:26px;text-transform:uppercase}.editor-heading #back-designs{position:absolute;right:0;top:8px;border:1px solid var(--studio-accent);padding:11px 16px;text-decoration:none;margin:0}
#stage{height:650px;background:#fff;border:0}.product-preview{top:12px}.views{justify-content:center;border:1px solid var(--studio-line);padding:9px;width:max-content;max-width:100%;margin:0 auto}.views button{border:0;border-radius:0;font-size:12px}.studio-panel{padding:0 0 20px}.studio-panel>h2{font-size:16px;text-transform:uppercase}.studio-panel>p{font-size:12px;line-height:1.5}.studio-options{color:var(--studio-slate)}
.personalization-item,.studio-accordion{border:0;border-radius:0;padding:0;margin:0 0 12px}.personalization-item>summary,.studio-accordion>summary{padding:12px 10px;background:#e7eef4;font-weight:500;text-transform:uppercase;border-bottom:1px solid var(--studio-line);list-style-position:inside}.personalization-item[open]>summary{background:#687882;color:white}.personalization-item>.personalization-item{margin:12px 8px}.personalization-item>.personalization-item>summary{font-size:12px;background:#e7eef4;color:var(--studio-slate)}.personalization-item>label,.personalization-item>button{margin:12px 10px}.personalization-item>label{display:grid;gap:8px}.personalization-item>button{border:1px solid var(--studio-accent);color:var(--studio-accent);background:white;border-radius:2px}
.stock-art-library{padding:8px 10px}.stock-art-library .personalization-item>summary{background:white;color:var(--studio-slate);font-size:13px}.stock-art-library .personalization-item[open]>summary{background:#e7eef4}.stock-art-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:15px 0}.stock-art-grid button{padding:3px;background:#fff;border:1px solid #464d5a;border-radius:2px;aspect-ratio:1;min-width:0}.stock-art-grid img{width:100%;height:100%;object-fit:contain}.stock-art-grid button:hover,.stock-art-grid button:focus-visible{outline:2px solid var(--studio-accent);outline-offset:2px}.stock-art-grid [hidden]{display:none}.artwork-selection{width:72px;height:72px;object-fit:contain;display:block;margin:12px}.source-swatches{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.source-swatches button{width:26px;height:26px;border:1px solid #687882;padding:0;border-radius:2px}.source-swatches button[aria-pressed=true]{outline:2px solid var(--studio-accent);outline-offset:2px}.source-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:10px 0}.source-tiles button{background:white;padding:4px;border:1px solid var(--studio-line);font-size:10px;border-radius:2px}.source-tiles button[aria-pressed=true]{border:2px solid var(--studio-accent)}.source-tiles img{width:100%;height:54px;object-fit:contain;display:block}.design-controls>label{grid-template-columns:1fr;padding:12px 0}.design-controls>label>input[type=color]{height:30px}.design-controls>label select{max-width:none}.source-location{border:0;border-bottom:1px solid var(--studio-line);margin-bottom:10px}.source-location>summary{background:#687882;color:white;padding:12px;text-transform:uppercase;font-size:13px;cursor:pointer}.source-location>label{display:block;margin:12px 8px}.source-location input[type=color]{display:block;margin:8px 0}
@media(max-width:1050px){.workspace{grid-template-columns:minmax(0,1.6fr) minmax(300px,1fr)}#stage{height:580px}.stock-art-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:767px){main{padding:12px}.workspace{display:flex;flex-direction:column;gap:14px}.product-preview{position:static}#stage{height:360px;min-height:260px}.editor-heading{padding-right:0}.editor-heading #back-designs{position:static;display:inline-block;margin:8px 0}.editor-heading h1{font-size:20px}#editor>.studio-steps{position:sticky;top:0;z-index:5;margin-bottom:14px}#editor>.studio-steps button{font-size:10px;padding:12px 3px}.studio-options{width:100%}.stock-art-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
.source-mode{margin:8px 0;border-bottom:1px solid var(--studio-line);padding:0 8px 10px}.source-mode>summary{padding:10px 4px;cursor:pointer;text-transform:uppercase;font-size:13px}.source-mode>label{display:block;margin:12px 0}.source-mode>label>select{display:block;margin:8px 0}.source-mode input[type=color]{display:block;margin:8px 0}.stock-art-grid button:disabled{opacity:.35;cursor:not-allowed}.product-preview:fullscreen{background:white;display:grid;grid-template-rows:1fr auto auto auto}.product-preview:fullscreen #stage{height:100%;min-height:0}
.roster-table{width:100%;border-collapse:collapse;font-size:11px}.roster-table td,.roster-table th{padding:4px 2px;text-align:left}.roster-table input{padding:7px 4px;width:100%;min-width:0}.roster-table button{font-size:10px;padding:5px 2px;background:white;border:0;color:#a22}.roster-table td:nth-child(1){width:30%}.roster-table td:nth-child(2),.roster-table td:nth-child(3),.roster-table td:nth-child(4){width:17%}#roster>button{margin:12px 5px 12px 0;padding:10px;font-size:12px}#roster label{display:block}#roster textarea{width:100%;min-height:80px;margin:8px 0 25px}
@media(min-width:768px){.editor-heading{min-height:100px;padding-right:140px}.editor-heading h1{font-size:22px;line-height:1.2}.editor-heading #back{font-size:12px;padding:0;border:0}.editor-heading p{margin:10px 0 4px}#stage{height:calc(100vh - 300px);min-height:360px;max-height:680px}.studio-options{max-height:calc(100vh - 165px)!important;overflow:auto!important;padding-right:8px}.product-preview{position:sticky;top:12px}.workspace{align-items:start}}
body,button,input,select,textarea{font-family:Roboto,Arial,sans-serif}.editor-heading h1{font-family:Korolev,Arial,sans-serif}.studio-steps button,.studio-panel>h2,.source-location>summary{font-family:Industry,Arial,sans-serif}.source-picker-select{position:absolute;width:1px!important;height:1px;opacity:0;pointer-events:none;clip-path:inset(50%)}.personalization-item>.source-swatches{margin:8px 10px}.source-picker-select:focus-visible{position:static;width:100%!important;height:auto;opacity:1;pointer-events:auto;clip-path:none}
@media(min-width:1051px){main{max-width:none;padding:16px}.workspace{grid-template-columns:minmax(0,2.1fr) minmax(360px,1fr)}.editor-heading h1{font-size:32px}.editor-heading{padding-right:0}.editor-heading #back-designs{position:static;display:inline-block;margin:8px 0}.editor-heading{min-height:140px}#stage{height:calc(100vh - 450px)}}.step-navigation.top{border:0;padding:0 0 24px}.step-navigation.top button{padding:10px 15px;font-size:12px}.step-navigation.top button:first-child{color:var(--studio-accent);background:white;border:1px solid var(--studio-accent)}
#mobile-controls{display:none}@media(max-width:767px){#mobile-controls{display:block;position:fixed;right:0;top:42%;z-index:12;writing-mode:vertical-rl;min-height:145px;border:0;border-radius:0;background:var(--studio-slate);color:white;padding:16px 10px;font-size:12px;text-transform:uppercase}#editor .studio-options{position:fixed;z-index:10;left:0;top:110px;bottom:0;width:calc(100% - 42px);padding:16px;background:white;overflow:auto!important;max-height:none!important;transform:translateX(-110%);visibility:hidden}#editor.controls-open .studio-options{transform:translateX(0);visibility:visible}#editor>.studio-steps{top:0;z-index:13}.product-preview{padding-right:25px}#stage{height:calc(100vh - 390px);min-height:300px}.stock-art-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.editor-heading #back-designs{padding:8px 10px}.editor-heading h1{font-size:23px}.studio-panel>h2{font-size:15px}}
.preview-zoom{flex:0 0 100%;display:flex;flex-direction:column;align-items:center;font-size:11px;gap:5px;margin:0 0 8px}.preview-zoom input{width:230px;max-width:80%;height:15px;padding:0}
.studio-options button{border-radius:2px}
.stock-art-library .personalization-item{margin:0}.stock-art-library .personalization-item>summary{font-size:16px;padding:11px 10px}.stock-art-grid{grid-template-columns:repeat(auto-fill,60px);gap:12px}.logo-upload{position:relative;display:block!important;width:max-content;max-width:calc(100% - 20px);margin:18px auto!important;padding:11px 16px;background:var(--studio-accent);color:white;border-radius:2px;cursor:pointer;text-transform:uppercase;font-size:12px!important}.logo-upload input{position:absolute;width:1px!important;height:1px;opacity:0;overflow:hidden}.logo-upload:focus-within{outline:2px solid var(--studio-slate);outline-offset:3px}@media(max-width:767px){#editor .studio-options{top:var(--drawer-top,132px)}body.studio-drawer-open{overflow:hidden}.stock-art-grid{grid-template-columns:repeat(auto-fill,60px)}.studio-options{border-right:1px solid var(--studio-line)}}