:root{--studio-line:#e0e4e9}
html:has(.studio-page){scroll-behavior:auto;overflow:hidden}
body.studio-page{height:100dvh;overflow:hidden;background:#f0f2f4;color:#17202b;font-size:14px}
.studio-header{height:68px;padding:0 22px;display:flex;align-items:center;gap:25px;background:#111720;color:white;border-bottom:1px solid #29323d}
.studio-header .brand{gap:9px}.studio-header .brand-mark{width:32px;height:32px}.studio-header .brand-name{font-size:20px}
.studio-back{font-size:12px;color:#c6d0dd}.studio-header-title{font-size:13px;font-weight:700;color:#aab7c7}
.studio-top-actions{margin-left:auto;display:flex;gap:12px;align-items:center}
.studio-top-actions .download-button{min-height:42px;padding:6px 13px;border-radius:10px;gap:18px;font-size:11px;box-shadow:none}
.studio-top-actions .download-button small{font-size:9px}.studio-top-actions .download-button i{width:27px;height:27px;border-radius:7px}
.studio-quote{display:inline-flex;align-items:center;justify-content:center;padding:12px 16px;border-radius:10px;background:#d8ef49;color:#172018;font-size:12px;font-weight:800}
.studio-grid{display:grid;grid-template-columns:270px minmax(0,1fr) minmax(290px,.82fr);grid-template-rows:minmax(0,1fr) 158px;gap:14px;height:calc(100dvh - 68px);padding:14px;max-width:none;margin:0}
.studio-settings{grid-row:1 / 3;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;background:#fff;border:1px solid var(--studio-line);border-radius:16px;padding:20px 17px}
.studio-kicker{font-size:9px!important;font-weight:800;letter-spacing:.12em;color:#557185!important;margin:0 0 11px!important}
.studio-page .designer-heading{position:static;max-width:none;margin:0;padding:0}
.studio-page .designer-heading h1{margin:0;letter-spacing:-.04em;line-height:1.15;font-size:27px}
.studio-page .designer-heading h1 span{display:block}.studio-page .designer-heading h1 span+span{font-size:20px;color:#2451ca;margin-top:4px}
.studio-page .designer-heading>p{font-size:11px;line-height:1.6;margin:12px 0;color:#687281}
.studio-page .designer-heading ul{font-size:10px;padding-top:12px;gap:7px}.studio-page .designer-heading li{gap:8px}
.studio-page .model-label{font-size:11px;margin:16px 0 6px}.studio-page .model-select{min-height:39px;font-size:11px;margin-bottom:14px;padding:0 9px}
.studio-page .designer-heading .template-source{font-size:10px;margin:9px 0}
.studio-template-notes{font-size:10px;color:#78818d;margin:12px 0}.studio-template-notes summary{cursor:pointer}.studio-template-notes p{font-size:10px!important;line-height:1.6;margin-top:8px!important}
.studio-page .designer-controls{padding:0;gap:0}.studio-page .control-block{grid-template-columns:23px minmax(0,1fr);gap:10px;padding:16px 0}
.studio-page .control-step{width:22px;height:22px;font-size:9px}.studio-page .control-title,.studio-page .control-group>label,.studio-page .color-control label{font-size:10px}
.studio-page .control-block p{font-size:10px}.studio-page .upload-button,.studio-page .text-button{padding:9px 11px;font-size:10px}
.studio-page .control-row{grid-template-columns:minmax(0,1fr) 35px 35px;gap:8px}.studio-page .color-control input{width:33px}
.studio-page .text-input{min-height:36px;font-size:11px;padding:0 8px;border-radius:8px}
.studio-page #artwork-fit{min-height:36px;font-size:10px;padding:6px}.studio-page .template-guide-option{font-size:10px}
.studio-page .print-options{margin:14px 0 0;padding:12px 8px}.studio-page .print-options legend{font-size:11px}.studio-page .print-options label{font-size:10px}.studio-page .print-options small{font-size:9px}
.studio-page .designer-actions{padding-top:8px}.studio-page .reset-button{padding:6px 0;font-size:10px}
.studio-page .privacy-note,.studio-page .designer-status{font-size:10px;line-height:1.6}.studio-small-links{display:flex;gap:16px;margin-top:16px;font-size:10px;color:#748092}
.studio-editor{min-height:0;min-width:0;display:flex;flex-direction:column;border:1px solid var(--studio-line);border-radius:16px;background:#e6e9ed;overflow:hidden}
.studio-panel-heading{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:13px 16px;background:#fff;border-bottom:1px solid var(--studio-line)}
.studio-panel-heading h2{margin:0;font-family:inherit;font-size:12px;font-weight:800;letter-spacing:0}.studio-panel-heading span{font-size:10px;color:#7a8593}
.studio-page .designer-preview{padding:12px;min-height:0;flex:1;display:flex;flex-direction:column;gap:10px;background:transparent}
.studio-page .preview-modes{display:flex;justify-content:center;gap:5px;margin:0}
.studio-page .preview-modes button{border:1px solid #d5dbe4;background:#fff;border-radius:20px;color:#657187;font-size:10px;padding:7px 12px;cursor:pointer}
.studio-page .preview-modes button[aria-pressed=true]{background:#24374b;color:white;border-color:#24374b}
.studio-page .canvas-wrap{flex:1;min-height:0;width:100%;max-width:none;display:flex;align-items:center;justify-content:center;margin:0}
.studio-page #design-canvas{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;box-shadow:0 5px 26px #1e334d13;border-radius:8px}
.studio-page .canvas-hint{display:none}.studio-editor-help{font-size:10px;text-align:center;color:#7b8695;margin:0 0 12px}
.studio-page .guide-key{margin:0;color:#495b73;font-size:9px}.studio-page .guide-key[hidden]{display:none}
.studio-results{display:flex;flex-direction:column;gap:10px;min-height:0;min-width:0}
.studio-result{flex:1;min-height:0;border:1px solid var(--studio-line);border-radius:16px;background:#fff;overflow:hidden;display:flex;flex-direction:column}
.studio-result-canvas{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#eef0f2}
.studio-result canvas{width:100%;height:100%;object-fit:contain;display:block}
.studio-preview-note{font-size:9px;line-height:1.4;color:#7f8995;margin:0}
.studio-models{grid-column:2 / 4;min-height:0;background:white;border:1px solid var(--studio-line);border-radius:16px;padding:11px 14px}
.studio-models-heading{display:flex;align-items:center;gap:18px;margin-bottom:8px}
.studio-models-heading h2{font-family:inherit;font-size:12px;font-weight:800;letter-spacing:0;margin:0}.studio-models-heading p{font-size:10px;color:#7e8996;margin:0}
.studio-page .design-comparison{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.studio-page .design-comparison-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;height:101px;padding:6px;border:1px solid #dce2e9;border-radius:10px;background:#f7f8fa;cursor:pointer}
.studio-page .design-comparison-card canvas{width:100%;height:68px;object-fit:contain}.studio-page .design-comparison-card span{font-size:9px;font-weight:800}
.studio-page .design-comparison-card.is-selected{background:#eaf1ff;border:2px solid #3877dc}
.studio-page button:focus-visible,.studio-page a:focus-visible{outline:3px solid #7bafff;outline-offset:2px}
@media(min-width:1600px){.studio-grid{grid-template-columns:300px minmax(0,1.2fr) minmax(350px,.85fr);grid-template-rows:minmax(0,1fr) 185px;padding:20px;gap:20px}.studio-page .design-comparison-card{height:125px}.studio-page .design-comparison-card canvas{height:90px}.studio-models-heading{margin-bottom:10px}}
@media(max-width:1050px) and (min-width:801px){.studio-grid{grid-template-columns:225px minmax(0,1fr) minmax(235px,.8fr);gap:9px;padding:9px}.studio-settings{padding:15px 12px}.studio-header-title{display:none}.studio-models-heading p{display:none}}
@media(max-width:800px){html:has(.studio-page){overflow:auto}.studio-page{height:auto!important;overflow:auto!important}.studio-header{height:62px;position:sticky;top:0;z-index:20;padding:0 12px;gap:12px}.studio-header-title,.studio-back{display:none}.studio-header .brand-name{font-size:17px}.studio-top-actions{gap:7px}.studio-top-actions .download-button{font-size:9px;padding:5px 8px;gap:7px}.studio-quote{font-size:10px;padding:11px}.studio-grid{height:auto;grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:10px;padding:10px}.studio-settings{grid-column:1 / 3;grid-row:auto;max-height:45vh}.studio-editor{grid-column:1 / 3;height:65vh}.studio-results{grid-column:1 / 3;display:grid;grid-template-columns:1fr 1fr}.studio-result{height:240px}.studio-preview-note{grid-column:1 / 3}.studio-models{grid-column:1 / 3;overflow:auto}.studio-page .design-comparison{grid-template-columns:repeat(6,110px)}.studio-models-heading p{display:none}}