.app{min-height:calc(100vh - 95px)}.designer-page{--designer-border:var(--color-border);--designer-card:var(--color-surface);--designer-subtle:color-mix(in srgb, var(--color-bg) 78%, var(--color-surface));--designer-text:var(--color-text);--designer-muted:var(--color-muted);--designer-input:var(--color-surface);--designer-danger:#b42318;--designer-focus:var(--color-accent);--designer-dimension:#263238;min-height:calc(100vh - 95px);color:var(--designer-text);padding:24px clamp(16px,3vw,48px) 48px}html[data-theme=dark] .designer-page{--designer-danger:#ff928a;--designer-dimension:#f1f5f9}.designer-workspace{grid-template-columns:minmax(0,1.5fr) minmax(360px,1fr);align-items:start;gap:24px;max-width:1600px;margin:0 auto;display:grid}.designer-next-step{border:1px solid var(--designer-border);background:var(--designer-card);border-radius:16px;justify-content:space-between;align-items:center;gap:24px;max-width:1600px;margin:24px auto 0;padding:24px clamp(18px,3vw,32px);display:flex}.designer-next-step h2{margin:0;font-size:1.2rem}.designer-next-step p{color:var(--designer-muted);margin:8px 0 0}.designer-next-step .designer-next-step-note{font-size:.85rem}.designer-next-step a{background:var(--color-accent);color:var(--color-accent-contrast);border-radius:8px;flex:none;padding:11px 16px;font-weight:600;text-decoration:none}.designer-next-step a:hover{background:var(--color-accent-hover)}.designer-next-step a:focus-visible,.designer-download:focus-visible,.designer-reset:focus-visible{outline:2px solid var(--designer-focus);outline-offset:3px}.designer-next-step-actions{flex-wrap:wrap;flex:none;gap:10px;display:flex}.designer-download{border:1px solid var(--designer-border);color:var(--designer-text);font:inherit;cursor:pointer;background:0 0;border-radius:8px;padding:10px 16px;font-weight:600}.designer-download:hover:not(:disabled){border-color:var(--color-accent)}.designer-download:disabled{cursor:progress;opacity:.7}.designer-reset{color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.preview,.controls{background:var(--designer-card);border:1px solid var(--designer-border);border-radius:16px;min-width:0;box-shadow:0 8px 28px #0000000f}.preview{flex-direction:column;align-items:center;min-height:min(72vh,760px);max-height:calc(100vh - 40px);padding:clamp(16px,2.5vw,32px);display:flex;position:sticky;top:20px;overflow:auto}.preview-toolbar{justify-content:space-between;align-items:center;gap:16px;width:100%;margin-bottom:16px;display:flex}.preview-actions{align-items:center;gap:8px;display:flex}.preview-collapse-toggle{border:1px solid var(--designer-border);background:var(--designer-card);min-height:44px;color:var(--designer-text);font:inherit;cursor:pointer;border-radius:9px;padding:8px 12px;font-size:.8rem;display:none}.preview-title,.settings-heading h2{margin:0;font-size:1.3rem;font-weight:700;line-height:1.2}.preview-caption{color:var(--designer-muted);margin:5px 0 0;font-size:.85rem}.preview-instruction{text-align:center;width:100%}.preview-toggle{border:1px solid var(--color-accent);background:var(--color-accent);min-height:44px;color:var(--color-accent-contrast);font:inherit;cursor:pointer;border-radius:9px;padding:9px 16px;font-size:.9rem;font-weight:700}.preview-toggle:hover{background:var(--color-accent-hover)}.preview-hint{width:100%;color:var(--designer-muted);text-align:center;margin:0 0 10px;font-size:.8rem}#preview{width:min(100%,620px);height:auto;max-height:min(64vh,650px);display:block;overflow:visible}#preview [data-section-index]{cursor:pointer;transition:filter .16s,opacity .16s}#preview [data-section-index].is-selected{filter:drop-shadow(0 0 5px var(--color-accent))}#preview [data-section-index]:focus-visible{filter:drop-shadow(0 0 7px var(--color-accent));outline:none}#preview .dimension-line{stroke:var(--designer-dimension);stroke-width:1px;opacity:.55}#preview .dimension-label{fill:var(--designer-dimension);opacity:.7;letter-spacing:.02em;font-size:9px;font-weight:500}.preview-dimensions{width:100%;max-width:52rem;color:var(--designer-text);grid-template-columns:auto auto;justify-content:center;gap:4px 16px;margin:12px 0 0;font-size:.85rem;line-height:1.4;display:grid}.preview-dimensions dt{opacity:.65;text-align:right}.preview-dimensions dd{font-variant-numeric:tabular-nums;margin:0;font-weight:600}.preview-dimensions:empty{display:none}#preview3d{background:linear-gradient(145deg, var(--designer-subtle), var(--designer-border));cursor:grab;touch-action:none;border-radius:12px;width:100%;max-width:720px;height:min(62vh,620px)}#preview3d:active{cursor:grabbing}.controls{flex-direction:column;max-height:calc(100vh - 40px);display:flex;position:sticky;top:20px;overflow:hidden}.designer-tabs{border-bottom:1px solid var(--designer-border);scrollbar-width:thin;gap:4px;padding:10px;display:flex;overflow-x:auto}.designer-tab{min-height:44px;color:var(--designer-muted);font:inherit;white-space:nowrap;cursor:pointer;background:0 0;border:0;border-radius:8px;flex:1 0 auto;padding:8px 12px;font-size:.86rem;font-weight:650}.designer-tab:hover{background:var(--designer-subtle);color:var(--designer-text)}.designer-tab[aria-selected=true]{background:var(--color-accent);color:var(--color-accent-contrast)}.settings-panel{overscroll-behavior:contain;min-height:260px;padding:clamp(18px,2vw,28px);overflow-y:auto}.settings-heading{margin-bottom:22px}.settings-heading p{color:var(--designer-muted);margin:7px 0 0;font-size:.9rem;line-height:1.5}.standard-size-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.standard-size-option{border:1px solid var(--designer-border);background:var(--designer-card);min-height:68px;color:var(--designer-text);font:inherit;text-align:left;cursor:pointer;border-radius:10px;flex-direction:column;justify-content:center;align-items:flex-start;gap:4px;padding:12px;display:flex}.standard-size-option:hover{border-color:var(--color-accent)}.standard-size-option:focus-visible{outline:2px solid var(--designer-focus);outline-offset:2px}.standard-size-option strong{font-size:.95rem}.standard-size-option span,.standard-size-status{color:var(--designer-muted);font-size:.8rem}.standard-storage-choice{color:var(--designer-text);flex-direction:column;gap:8px;margin-bottom:16px;font-size:.86rem;font-weight:650;display:flex}.standard-storage-choice select{border:1px solid var(--designer-border);background:var(--designer-input);min-height:44px;color:var(--designer-text);font:inherit;border-radius:9px;padding:9px 11px}.standard-size-options{border:1px solid var(--designer-border);background:var(--designer-subtle);border-radius:12px;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:20px 0 0;padding:14px;display:grid}.standard-size-options legend{color:var(--designer-text);padding-inline:6px;font-size:.9rem;font-weight:700}.standard-option-field{color:var(--designer-text);flex-direction:column;gap:7px;font-size:.86rem;font-weight:650;display:flex}.standard-option-field select{border:1px solid var(--designer-border);background:var(--designer-input);min-height:44px;color:var(--designer-text);font:inherit;border-radius:9px;padding:9px 11px}.standard-option-toggle{border:1px solid var(--designer-border);background:var(--designer-card);min-height:60px;color:var(--designer-text);cursor:pointer;border-radius:9px;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;display:flex}.standard-option-toggle span{flex-direction:column;gap:4px;display:flex}.standard-option-toggle strong{font-size:.84rem}.standard-option-toggle small{color:var(--designer-muted);font-size:.76rem;font-weight:400}.standard-option-toggle input{width:20px;height:20px;accent-color:var(--color-accent);flex:none}.standard-option-toggle input:disabled,.standard-option-field select:disabled{opacity:.52;cursor:not-allowed}.standard-size-option-note{color:var(--designer-muted);margin:8px 0 0;font-size:.8rem;line-height:1.5}.standard-size-status{margin:14px 0 0;line-height:1.5}.form-field,.controls fieldset.form-field{min-width:0;color:var(--designer-text);border:0;flex-direction:column;gap:9px;margin:0 0 20px;padding:0;font-size:.9rem;font-weight:650;display:flex}.controls fieldset.form-field legend{margin-bottom:10px;padding:0;font-size:.9rem;font-weight:650}.form-field>label{font-weight:650}.input-with-unit{border:1px solid var(--designer-border);background:var(--designer-input);border-radius:10px;align-items:center;min-height:48px;display:flex}.input-with-unit input{border-radius:inherit;width:100%;min-width:0;min-height:46px;color:var(--designer-text);font:inherit;background:0 0;border:0;padding:10px 12px}.input-with-unit span{color:var(--designer-muted);padding:0 14px;font-weight:500}.settings-panel select,.settings-panel input[type=number],.section-row input,.section-row select{border:1px solid var(--designer-border);background:var(--designer-input);min-height:44px;color:var(--designer-text);font:inherit;border-radius:9px;padding:9px 11px}.settings-panel input:disabled,.settings-panel select:disabled{opacity:.52;cursor:not-allowed}.total-height-card{border:1px solid var(--designer-border);background:var(--designer-subtle);border-radius:12px;grid-template-columns:1fr auto;gap:4px 12px;margin-top:26px;padding:16px;display:grid}.total-height-card strong{font-size:1.1rem}.total-height-card .helper-text{grid-column:1/-1}.helper-text,.controls .hint{color:var(--designer-muted);font-size:.82rem;font-weight:400;line-height:1.5}.controls .hint.warning{border:1px solid color-mix(in srgb, var(--designer-danger) 36%, transparent);background:color-mix(in srgb, var(--designer-danger) 9%, var(--designer-card));color:var(--designer-danger);border-radius:9px;margin:0 0 14px;padding:10px 12px;font-weight:600}.sections-panel,.finish-panel{border:1px solid var(--designer-border);background:var(--designer-subtle);border-radius:12px;flex-direction:column;gap:12px;margin-bottom:20px;padding:14px;display:flex}.sections-header{color:var(--designer-text);font-size:.9rem;font-weight:700}.sections-list{flex-direction:column;gap:10px;display:flex}.section-row{border:1px solid var(--designer-border);background:var(--designer-card);border-radius:12px;flex-direction:column;gap:12px;padding:12px;transition:border-color .16s,box-shadow .16s;display:flex}.section-row.is-selected{border-color:var(--color-accent);box-shadow:0 0 0 2px color-mix(in srgb, var(--color-accent) 28%, transparent)}.section-row-header{justify-content:space-between;align-items:center;gap:8px;display:flex}.section-row .section-title{text-align:left;white-space:normal;min-width:0;color:var(--designer-text);text-overflow:ellipsis;white-space:nowrap;border-color:#0000;flex:1;justify-content:flex-start;padding:6px 8px;font-size:.9rem;font-weight:700;overflow:hidden}.section-row-actions{flex-shrink:0;gap:4px;display:flex}.section-row-fields,.compartments-row{flex-direction:column;gap:10px;display:flex}.section-row-fields[hidden],.compartments-row[hidden]{display:none}.row-field{color:var(--designer-muted);flex-direction:column;gap:6px;font-size:.8rem;font-weight:600;display:flex}.section-row button,.sections-add button{border:1px solid var(--designer-border);background:var(--designer-card);min-width:40px;min-height:40px;color:var(--designer-text);font:inherit;cursor:pointer;border-radius:8px;padding:7px 10px;font-size:.8rem}.section-row button:hover,.sections-add button:hover{border-color:var(--color-accent)}.section-row button:disabled{opacity:.4;cursor:not-allowed}.section-row button.remove-btn,.compartment-remove{color:var(--designer-danger)}.compartments-row{border-top:1px solid var(--designer-border);padding-top:10px}.compartment-chip{border:1px dashed var(--designer-border);background:var(--designer-card);border-left:3px solid #8a8d90;border-radius:9px;flex-direction:column;gap:8px;min-width:0;padding:10px 42px 10px 10px;display:flex;position:relative}.compartment-chip.chip-storage{border-left-color:#8a5a3c}.compartment-width-note{color:var(--designer-muted);padding:4px 0;font-size:.78rem;font-weight:600}.compartment-remove{position:absolute;top:8px;right:8px}.add-compartment-btn{border-style:dashed!important}.sections-add{gap:8px;display:flex}.sections-add button{flex:1;min-height:44px;font-weight:650}.finish-panel .sections-header span{color:var(--designer-muted);font-weight:500}.swatches{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;display:grid}.swatch{aspect-ratio:1;border:2px solid var(--designer-border);cursor:pointer;border-radius:10px;width:100%;min-height:44px}.swatch:hover,.swatch.selected{border-color:var(--color-accent);box-shadow:0 0 0 2px var(--designer-card) inset, 0 0 0 2px var(--color-accent)}.segmented-options{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.segmented-options label{cursor:pointer;position:relative}.segmented-options input{opacity:0;width:1px;height:1px;position:absolute}.segmented-options span{border:1px solid var(--designer-border);background:var(--designer-input);min-height:48px;color:var(--designer-text);border-radius:9px;justify-content:center;align-items:center;font-weight:650;display:flex}.segmented-options input:checked+span{border-color:var(--color-accent);box-shadow:0 0 0 1px var(--color-accent) inset}.segmented-options input:focus-visible+span{outline:2px solid var(--designer-focus);outline-offset:2px}.segmented-options input:disabled+span{opacity:.5;cursor:not-allowed}.toggle-field{border:1px solid var(--designer-border);background:var(--designer-card);cursor:pointer;border-radius:10px;justify-content:space-between;align-items:center;gap:16px;min-height:64px;margin:0 0 12px;padding:12px 14px;display:flex}.toggle-field span{flex-direction:column;gap:4px;display:flex}.toggle-field strong{font-size:.9rem}.toggle-field small{color:var(--designer-muted);font-size:.8rem}.toggle-field input{width:22px;height:22px;accent-color:var(--color-accent)}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden;border:0!important;min-height:0!important;padding:0!important}@media (width<=1023px){.designer-next-step{flex-direction:column;align-items:stretch}.designer-next-step a{align-self:flex-start}.designer-page{padding:12px 16px 32px}.designer-workspace{flex-direction:column;gap:12px;display:flex}.preview{z-index:10;border-radius:0 0 14px 14px;width:100%;min-height:0;max-height:42svh;padding:12px;top:0;overflow:auto}.preview-toolbar{margin-bottom:6px}.preview-collapse-toggle{justify-content:center;align-items:center;display:inline-flex}.preview-title{font-size:1rem}.preview-caption,.preview-instruction{display:none}#preview{width:auto;max-width:100%;max-height:27svh}#preview3d{height:28svh;min-height:160px}.preview.is-collapsed{max-height:none;padding-block:8px;overflow:hidden}.preview.is-collapsed #preview,.preview.is-collapsed #preview3d,.preview.is-collapsed .preview-hint{display:none}.preview.is-collapsed .preview-toolbar{margin-bottom:0}.controls{width:100%;max-height:none;position:static;overflow:visible}.designer-tabs{background:var(--designer-card)}.designer-tab{flex:none;padding-inline:15px}.settings-panel{min-height:360px;overflow:visible}}@media (width<=480px){.designer-page{padding-inline:10px}.preview{padding:10px}.preview-toggle{min-height:40px;padding:7px 12px}.settings-panel{padding:16px}.standard-size-list,.standard-size-options{grid-template-columns:1fr}.swatches{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}
