.catalog-page .header{gap:18px;flex-wrap:wrap}.catalog-nav{gap:18px;flex-wrap:wrap}.catalog-nav button{background:none;color:inherit;font:inherit;font-size:12px;min-height:44px}.catalog-nav a{min-height:44px;display:flex;align-items:center}.catalog-page .brand{flex-shrink:0}.catalog-page .header-actions{margin-left:auto}#catalog-menu{display:none;background:#e4f6fb;padding:8px 12px;border-radius:10px}.try-design{width:100%;min-height:44px;background:#fff4bd;color:#755917;font-size:12px;font-weight:600}.design-studio{margin:0 0 50px;border:1px solid #d4e8eb;border-radius:26px;background:#fff;overflow:hidden}.studio-heading{padding:28px 32px;background:linear-gradient(110deg,#fff6b5,#fff0f7 62%,#e5f8fc);display:flex;justify-content:space-between;align-items:center;gap:24px}.studio-heading h2{font-size:30px;letter-spacing:-.7px;margin:8px 0}.studio-heading p{font-size:13px;line-height:1.7;margin:0;color:#586e79}.studio-mode{display:flex;background:#fff;border:1px solid #d5e8ec;border-radius:24px;padding:4px;gap:4px;flex-shrink:0}.studio-mode button{padding:12px 18px;min-height:44px;border-radius:22px;background:transparent;color:#244454}.studio-mode button[aria-pressed=true]{background:#ffdf35}.studio-workspace{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(270px,.9fr);gap:32px;padding:28px 32px}.studio-preview{min-width:0}.preview-frame{position:relative;background:#f2f8f7;border-radius:20px;overflow:hidden;border:1px solid #dfedef}.preview-frame canvas{display:block;width:100%;height:auto;touch-action:none;cursor:grab;outline-offset:-4px}.preview-frame canvas:active{cursor:grabbing}.preview-badge{position:absolute;top:14px;left:14px;pointer-events:none;font-size:10px;color:#315c6a;background:#ffffffed;border-radius:20px;padding:8px 12px}.preview-tools{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:11px;margin-top:12px}.preview-tools label{display:flex;align-items:center;gap:7px;min-height:36px}.preview-tools input{accent-color:#ce3878}.preview-tools span{color:#bb3471;font-weight:600}.studio-side h3{font-size:18px;margin:0 0 16px}.studio-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.studio-fields label,.edit-fields label{font-size:11px;font-weight:600;display:grid;gap:7px;color:#486370}.studio-fields select,.edit-fields input{width:100%;min-height:44px;border:1px solid #cee3e9;border-radius:10px;padding:10px;background:#faffff;color:#244454;font:inherit;font-size:13px}.studio-colors{margin:20px 0}.studio-colors>span{display:block;font-size:11px;font-weight:600;margin-bottom:8px}.swatches{display:flex;gap:12px}.swatches button{width:38px;height:38px;border-radius:50%;border:3px solid #fff;outline:1px solid #c9dbdf}.swatches button[aria-pressed=true]{outline:3px solid #bd3173;outline-offset:2px}.studio-selection{margin-top:22px;padding-top:20px;border-top:1px solid #e3edef}.selection-list{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0;max-height:120px;overflow:auto}.selection-list button{display:flex;align-items:center;gap:7px;border:1px solid #d3e6e9;background:#fff;border-radius:10px;padding:6px 10px;font-size:11px;min-height:44px;color:#315a69}.selection-list button[aria-pressed=true]{border-color:#cc3b7a;background:#fff0f6}.selection-list img{width:28px;height:32px;object-fit:contain}.edit-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.edit-fields input[type=range]{padding:0;accent-color:#cf3e7d}.edit-fields .wide{grid-column:1/-1}.edit-dimensions{font-size:12px;color:#b12d67;margin:12px 0}.edit-actions{display:flex;gap:8px;flex-wrap:wrap}.edit-actions button{background:#eef7fa;border-radius:10px;padding:9px 12px;font-size:11px;min-height:44px;color:#315968}.edit-actions .delete{color:#b02a65;background:#fff0f6}.studio-primary{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:22px}.studio-primary button{padding:12px 9px;min-height:44px;border-radius:12px;color:#365166;font-size:12px;background:#ffe23e}.studio-primary button:nth-child(2){background:#dff6fc}.studio-primary button:nth-child(3){background:#ffe3ef}.studio-primary button:nth-child(4){background:#edf7ef}.studio-note{font-size:11px;line-height:1.7;color:#6b7c84;margin:16px 0 0}.studio-status{min-height:21px;font-size:12px;color:#a52f68;margin:12px 0}.design-browser{padding:26px 32px;border-top:1px solid #e0edf0;background:#fcffff}.design-browser-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:18px}.design-browser h3{font-size:19px;margin:0}.design-search{min-height:44px;width:min(100%,280px);border:1px solid #cde3e9;border-radius:12px;padding:10px 14px;font:inherit;font-size:12px;background:#fff}.design-filter-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}.design-filter-row button{border-radius:22px;min-height:40px;background:#edf7fa;color:#315e70;padding:9px 14px;font-size:11px}.design-filter-row button[aria-pressed=true]{background:#ffde37;color:#4b501f}.design-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.design-tile{border:1px solid #d8e9ec;border-radius:14px;background:white;overflow:hidden;text-align:left;padding:10px;min-width:0;transition:transform .2s,border-color .2s}.design-tile:hover{transform:translateY(-3px);border-color:#ec7cab}.design-tile img{width:100%;height:114px;object-fit:contain;background:linear-gradient(135deg,#fffaf1,#f1fbff);border-radius:9px}.design-tile span{display:block;font-size:12px;font-weight:600;color:#315566;margin-top:9px}.design-tile small{display:block;font-size:10px;color:#78858a;margin:5px 0}.design-tile b{display:block;font-size:11px;color:#bd3070;font-weight:500}.design-empty{font-size:13px;color:#667e87;padding:22px;background:#fff9df;border-radius:12px}.package-library{margin:30px 0}.package-library>summary{cursor:pointer;list-style:none;padding:20px;border:1px solid #d8e8ec;border-radius:14px;background:#f2faff;font-size:17px;font-weight:600}.package-library>summary::after{content:' +';float:right}.package-library[open]>summary::after{content:' −'}.package-library .catalog-controls{margin-top:22px}.design-studio button:focus-visible,.design-studio select:focus-visible,.design-studio input:focus-visible{outline:3px solid #2299ad;outline-offset:3px}
@media(max-width:1100px){.catalog-nav{order:3;width:100%;justify-content:center;gap:24px}.catalog-page .header{padding-top:14px;padding-bottom:8px}.studio-heading{display:block}.studio-mode{width:max-content;margin-top:18px}.design-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.studio-workspace{gap:22px;padding:24px}.studio-heading,.design-browser{padding:24px}}
@media(max-width:760px){#catalog-menu{display:block}.catalog-nav{display:none!important;justify-content:flex-start;gap:14px}.catalog-nav.is-open{display:flex!important}.studio-workspace{grid-template-columns:1fr;padding:16px;gap:22px}.studio-heading,.design-browser{padding:20px 16px}.studio-heading h2{font-size:25px}.studio-heading p{font-size:12px}.studio-mode button{font-size:12px;padding:10px 15px}.studio-preview{max-width:430px;margin:0 auto;width:100%}.preview-frame canvas{object-fit:contain}.design-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.design-tile{padding:7px}.design-tile img{height:85px}.design-tile span{font-size:11px}.design-browser-heading{display:block}.design-search{width:100%;margin-top:12px}.catalog-page .header-actions{gap:8px}.catalog-page .brand>span{display:none}.studio-note{font-size:11px}.catalog-intro{margin-bottom:26px}.studio-heading .eyebrow{font-size:10px}.catalog-main{padding-left:4%;padding-right:4%}}
@media(prefers-reduced-motion:reduce){.design-tile{transition:none}.design-tile:hover{transform:none}}.design-studio{overflow:clip}.studio-preview{position:sticky;top:18px;align-self:start}.studio-side .design-browser{padding:18px 0;background:none}.studio-side .design-browser-heading{display:block;margin-bottom:12px}.studio-side .design-search{width:100%;max-width:none;margin-top:12px}.studio-side .design-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-height:330px;overflow:auto;padding:3px}.studio-side .design-tile img{height:72px}.studio-side .design-tile span{font-size:10px}.studio-side .design-tile small{display:none}.studio-side .design-tile b{font-size:10px}.studio-side .design-browser h3{font-size:16px}.studio-side .design-filter-row{gap:5px;margin-bottom:8px}.studio-side .design-filter-row button{padding:7px 10px;font-size:10px;min-height:36px}.studio-selection{margin-top:10px}.studio-side .design-count{margin-bottom:10px}@media(max-width:760px){.studio-preview{position:static}.studio-side .design-grid{max-height:310px}.studio-side .design-tile img{height:78px}}.viewer-controls{margin-top:14px;display:grid;gap:9px}.view-interaction,.view-presets,.view-zoom{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.viewer-controls button{min-height:42px;border-radius:12px;background:#edf7fa;color:#31586b;font-size:11px;padding:9px 12px}.view-interaction button{flex:1}.view-interaction button[aria-pressed=true]{background:#ffdf37;color:#5c561c}.view-presets button{flex:1;padding:9px 6px}.view-zoom span{font-size:10px;color:#b22c6b;flex-basis:100%;margin-top:4px}.spec-pending{font-size:11px;color:#8b6521;background:#fff8db;padding:9px;border-radius:8px}.design-tile:disabled{opacity:.55;cursor:not-allowed}.design-tile:disabled b{font-size:9px}.studio-side .design-tile .spec-label{display:block;font-size:9px;color:#687780}.preview-frame canvas{outline-offset:-4px}.preview-frame{min-height:160px}.custom-upload{margin:18px 0;padding:16px;background:#faf5ef;border:1px solid #e8ded2;border-radius:16px}.custom-upload h3{font-size:15px;margin:0 0 12px}.custom-upload label{display:block;font-size:11px;color:#586b74;margin-bottom:10px}.custom-upload input{display:block;margin-top:6px;width:100%;min-height:38px;border:1px solid #ddd3c9;border-radius:8px;background:white;color:#315466;padding:8px;font:inherit}.custom-upload input[type=file]{font-size:11px}.custom-upload button{width:100%;min-height:42px;border-radius:10px;background:#ffe66d;color:#4c4b36;font-size:12px}.custom-upload button:disabled{opacity:.6}.custom-upload .studio-note{font-size:10px;line-height:1.6;margin-bottom:0}.view-presets button{min-width:60px}.preview-frame{background:#cec7c0;border-color:#ddd5ce}
/* Photo fitting studio: the preview leads, choices stay in two clear groups. */
.studio-intro-removed[hidden]{display:none!important}
.catalog-page-actions{margin-bottom:16px}
.design-studio{border:0;border-radius:0;background:#fffdf9;overflow:visible;scroll-margin-top:24px}
.studio-heading{background:none;padding:16px 0 28px;align-items:end;border-bottom:1px solid #deded7}
.studio-heading h2{font-size:clamp(28px,3vw,42px);line-height:1.25;font-weight:600;margin:0 0 12px;letter-spacing:-.02em;color:#285466}
.studio-heading p{color:#53656b;font-size:14px}
.studio-mode{background:#f0eee7;border:0;border-radius:8px;padding:4px}
.studio-mode button{border-radius:6px;padding:11px 18px;font-size:13px}
.studio-mode button[aria-pressed=true]{background:#fff;box-shadow:0 2px 5px #293b4420;color:#a72962}
.studio-workspace{grid-template-columns:minmax(0,1.2fr) minmax(340px,1fr);gap:44px;padding:30px 0}
.studio-preview{top:20px;position:sticky}
.preview-frame{background:#f0eeeb;border:0;border-radius:8px}
.preview-frame canvas{max-height:670px;object-fit:contain;cursor:grab}
.preview-badge{top:auto;bottom:16px;left:50%;transform:translateX(-50%);background:#ffffffd9;color:#53646a;padding:7px 13px;font-size:11px;white-space:nowrap}
.viewer-controls{display:flex;justify-content:space-between;gap:12px;margin-top:12px}
.view-presets{gap:4px;background:#eeece6;padding:3px;border-radius:6px}
.viewer-controls button{background:none;border-radius:4px;min-height:38px;padding:7px 13px;font-size:12px}
.view-presets button[aria-pressed=true]{background:#fff;color:#ab2963;box-shadow:0 1px 4px #00000012}
.view-zoom{gap:4px}.view-zoom button{border:1px solid #deded7;background:#fffdf9}
.template-note{margin:10px 0 0!important;font-size:10px;color:#617077}
.preview-actions{display:flex;gap:10px;margin-top:18px}.preview-actions button{min-height:44px;border-radius:6px;padding:12px 22px;background:#ffdf35;color:#284c5b;font-size:13px;font-weight:600;flex:1}.preview-actions button+button{background:#fffdf9;border:1px solid #cbd5d7}
.studio-status{font-size:12px;color:#516a76;line-height:1.7}
.studio-side h3{font-size:18px;margin:0 0 18px;color:#285466}
.studio-fields{gap:12px 16px}.studio-fields label{font-size:11px;color:#53676e}
.studio-fields select,.design-search{background:#fff;border:1px solid #cbd5d7;border-radius:5px}
.studio-colors{display:flex;justify-content:space-between;align-items:center;margin:18px 0 24px;gap:12px}.studio-colors>span{margin:0;color:#53676e}.swatches{gap:10px}.swatches button{width:28px;height:28px}.swatches button[aria-pressed=true]{outline-width:2px}
.studio-side .design-browser{border-top:1px solid #deded7;padding:24px 0 18px;margin:0;background:none}
.studio-side .design-browser-heading{margin-bottom:14px}.studio-side .design-search{margin-top:0;font-size:12px;min-height:42px}
.studio-side .design-filter-row{flex-wrap:nowrap;overflow-x:auto;padding-bottom:8px;gap:5px;margin-bottom:0;scrollbar-width:thin;scrollbar-color:#c2c9c7 transparent}
.studio-side .design-filter-row button{background:transparent;border:1px solid #dde2df;border-radius:4px;white-space:nowrap;color:#51676f;padding:7px 10px;font-size:11px;min-height:32px;flex-shrink:0}.studio-side .design-filter-row button[aria-pressed=true]{background:#fff0b8;border-color:#e4ce73;color:#64531b}
.studio-side .design-count{margin:8px 0!important;font-size:10px;color:#617077}
.studio-side .design-grid{max-height:360px;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:2px 4px 2px 2px;scrollbar-width:thin;scrollbar-color:#bcc7c5 transparent}
.studio-side .design-tile{padding:8px;border:1px solid #e1e5e0;border-radius:5px;background:#fff;box-shadow:none;transition:border-color .15s,background .15s;}
.studio-side .design-tile:hover{transform:none;border-color:#ae477a;background:#fffafc}
.studio-side .design-tile[aria-pressed=true]{border-color:#b52a69;background:#fff5fa}
.studio-side .design-tile img{height:90px;background:#f6f6f2;border-radius:2px}
.studio-side .design-tile span{font-size:11px;color:#355466;margin-top:8px}
.studio-side .design-tile b{display:none}.studio-side .design-tile .spec-label{display:none}
.studio-selection,.upload-disclosure,.tools-disclosure{border-top:1px solid #deded7;padding:0;margin:0;background:none}
.studio-side details>summary{font-size:13px;color:#355466;cursor:pointer;min-height:48px;display:flex;align-items:center;justify-content:space-between;list-style:none}.studio-side details>summary::after{content:'+';font-size:20px;font-weight:400}.studio-side details[open]>summary::after{content:'−'}
.studio-primary{margin:0 0 16px;gap:10px}.studio-primary button,.studio-primary button:nth-child(n){background:#f0f2ef;border:1px solid #d5ddda;border-radius:5px;color:#355466}
.custom-upload{margin:0 0 18px;border:0;background:#f5f4ed;padding:16px;border-radius:5px}.custom-upload h3{display:none}.custom-upload button{border-radius:5px}
.spec-pending{background:none;color:#657077;padding:0;font-size:10px}.edit-dimensions{color:#355466;font-size:12px}
.edit-actions button{background:#f0f2ef;border-radius:4px}.edit-fields input{border-radius:5px;background:#fff;border-color:#cbd5d7}.selection-list button{border-radius:5px}.studio-side input[type=range]{accent-color:#a72b64}
.design-studio ::selection{background:#ffe68d;color:#284c5b}.design-studio input{caret-color:#b52a69}
@media(max-width:1050px){.studio-workspace{gap:24px;grid-template-columns:minmax(0,1fr) minmax(310px,1fr)}.studio-heading{display:block}.studio-mode{margin-top:20px}.studio-side .design-tile img{height:76px}}
@media(max-width:760px){.studio-workspace{display:flex;flex-direction:column;padding:20px 0;gap:26px}.studio-preview{position:static;max-width:none}.preview-frame canvas{max-height:450px}.studio-heading{padding:10px 0 20px}.studio-heading h2{font-size:27px}.studio-mode{width:100%}.studio-mode button{flex:1}.studio-side .design-grid{max-height:340px}.studio-side .design-tile img{height:85px}.studio-colors{margin-bottom:20px}.preview-actions{margin-top:14px}.studio-heading p{font-size:12px}.catalog-main{padding-top:32px}.studio-note{font-size:11px}}
.preview-frame canvas{width:min(100%,520px);height:auto;max-height:none;margin-inline:auto;object-fit:initial}
@media(max-width:760px){.preview-frame canvas{width:min(100%,340px);height:auto;max-height:none}}

.garment-photo-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:18px}.garment-photo-options button{padding:4px 4px 8px;background:#fff;border:1px solid #c6d8df;border-radius:10px;cursor:pointer;color:#285466;min-width:0}.garment-photo-options button[aria-pressed="true"]{border:2px solid #ba3272;padding:3px 3px 7px}.garment-photo-options img{display:block;width:100%;height:106px;object-fit:contain;background:#f4f3ef;border-radius:6px}.garment-photo-options span{display:block;font-size:12px;margin-top:6px}.garment-photo-options button:focus-visible{outline:3px solid #285466;outline-offset:3px}.studio-colors .swatches{flex-wrap:wrap}@media(max-width:760px){.garment-photo-options{grid-template-columns:repeat(3,minmax(0,1fr))}.garment-photo-options img{height:118px}}
.studio-colors:has(+ .garment-photo-options) .swatches{display:none}.studio-fields label:has(#studio-audience){order:-1}

.viewer-controls{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.preview-angle{flex:1;min-width:180px;font-size:13px;font-weight:600}.preview-angle output{float:right}.preview-angle input{display:block;width:100%;margin-top:8px;accent-color:#bf2876}.fixed-size{font-size:11px;color:#497181}.viewer-controls>button{padding:9px 14px}.garment-photo-options img{object-fit:contain}@media(max-width:600px){.preview-angle{flex-basis:100%}}

.art-outline{position:absolute;border:1px dashed #bc3673;pointer-events:none;box-sizing:border-box}.art-rotate-handle{position:absolute;transform:translate(-50%,-50%);width:30px;height:30px;min-height:30px;padding:0;border-radius:50%;border:1px solid #c33678;background:#fff;color:#b82c6c;font-size:21px;line-height:28px;cursor:grab;touch-action:none;box-shadow:0 2px 8px #0002;z-index:3}.art-rotate-handle:active{cursor:grabbing}.art-rotate-handle[hidden],.art-outline[hidden]{display:none}.studio-side .design-tile .spec-label{display:block;font-size:10px;color:#55717a}.studio-selection[open] .selection-list{display:flex;flex-wrap:wrap;gap:6px}.selection-list button img{width:28px;height:32px;object-fit:contain}.viewer-controls{justify-content:space-between}.fixed-size{font-size:12px}.preview-badge{font-size:10px}