:root{
  --paper:#F8F4F1;
  --surface:#FEFCFA;
  --surface-2:#F1ECE7;
  --ink:#463E36;
  --text:#6B6357;
  --muted:#8B8177;
  --line:#D9D2CB;
  --brand:#5A5046;
  --brand-2:#655D50;
  --danger:#9B493F;
  --success:#5F745E;
  --cabinet-base:#F5EDE3;
  --cabinet-color-adjustment:sepia(.16) saturate(.7) hue-rotate(-12deg) brightness(.98);
  --shadow:0 20px 60px rgba(70,62,54,.09);
  --radius:24px;
  --sans:"Inter","Noto Sans TC",sans-serif;
  --serif:"Noto Serif TC",serif;
  --app-header-height:70px;
}

*,*::before,*::after{box-sizing:border-box}
html{max-width:100%;overflow-x:hidden;scroll-behavior:smooth}
body{margin:0;min-width:0;max-width:100%;overflow-x:hidden;background:var(--paper);color:var(--text);font-family:var(--sans);line-height:1.65;-webkit-font-smoothing:antialiased}
button,input{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
button{color:inherit}
a{color:inherit}
[hidden]{display:none!important}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

.skip-link{position:fixed;top:8px;left:8px;z-index:9999;transform:translateY(-150%);padding:9px 14px;background:var(--ink);color:#fff;border-radius:8px;text-decoration:none}
.skip-link:focus{transform:none}

.app-header{height:var(--app-header-height);position:sticky;top:0;z-index:100;background:rgba(248,244,241,.94);border-bottom:1px solid rgba(217,210,203,.82);backdrop-filter:blur(16px) saturate(140%)}
.app-header-inner{position:relative;width:min(1240px,100%);height:100%;margin:0 auto;padding:0 20px;display:flex;align-items:center;justify-content:space-between}
.brand{height:100%;display:flex;align-items:center;text-decoration:none}
.brand img{display:block;width:auto;height:42px}
.header-copy{position:absolute;left:50%;transform:translateX(-50%);display:none;align-items:baseline;gap:10px;color:var(--brand)}
.header-copy span{font-size:.72rem;font-weight:600;letter-spacing:.28em}
.header-copy small{font-size:.66rem;color:var(--muted);letter-spacing:.08em;white-space:nowrap}
.text-button{border:0;background:transparent;padding:8px 0;font-size:.76rem;font-weight:500;color:var(--muted);cursor:pointer}
.text-button:hover{color:var(--ink)}
.header-actions{display:flex;align-items:center;gap:16px}
.header-actions a{text-decoration:none}

.view{display:none;min-width:0;max-width:100%;min-height:calc(100svh - var(--app-header-height))}
.view.is-active{display:block;animation:view-in .35s ease both}
@keyframes view-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.eyebrow{margin:0 0 12px;color:var(--muted);font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase}
h1,h2,p{margin-top:0}
h1,h2{color:var(--ink);font-family:var(--serif);font-weight:500;line-height:1.28}
.lead{max-width:35em;color:var(--text);font-size:.94rem}

/* Category */
.category-view{padding:46px 20px 70px}
.category-inner{width:min(1040px,100%);margin:0 auto}
.category-inner>h1{max-width:8em;margin-bottom:18px;font-size:clamp(2.25rem,10vw,4.4rem)}
.category-inner>.lead{margin-bottom:34px}
.category-grid{display:grid;gap:12px}
.category-card{position:relative;min-height:190px;padding:22px;border:1px solid var(--line);border-radius:20px;background:rgba(254,252,250,.6);display:flex;flex-direction:column;align-items:flex-start;text-align:left;overflow:hidden}
button.category-card{width:100%;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
button.category-card:hover{transform:translateY(-3px);border-color:var(--brand);box-shadow:var(--shadow)}
.category-card-primary{background:var(--brand)!important;color:#fff;border-color:var(--brand)!important}
.category-number{font-size:.65rem;letter-spacing:.16em;opacity:.7}
.category-name{margin-top:auto;font-family:var(--serif);font-size:2rem;color:var(--ink)}
.category-card-primary .category-name{color:#fff}
.category-description{font-size:.78rem;color:var(--muted)}
.category-card-primary .category-description{color:rgba(255,255,255,.72)}
.category-arrow{margin-top:15px;font-size:.78rem;font-weight:600;letter-spacing:.06em}
.is-disabled{opacity:.58}
.coming-soon{position:absolute;top:18px;right:18px;font-size:.6rem;letter-spacing:.1em;color:var(--muted)}
.resume-button{width:100%;margin-top:16px;padding:14px 18px;border:1px solid var(--line);border-radius:14px;background:transparent;color:var(--brand);font-weight:500;cursor:pointer}
.resume-button:hover{background:var(--surface)}

/* Builder */
.builder-view{padding-bottom:86px}
.builder-layout{display:grid;gap:0;width:min(1180px,100%);margin:0 auto}
.plan-panel,.control-panel{padding:28px 20px}
.plan-panel{min-width:0;padding-bottom:0}
.control-panel{background:var(--surface)}
.panel-heading h1,.panel-heading h2{margin-bottom:8px}
.panel-heading h1{font-size:clamp(1.65rem,7vw,2.6rem)}
.panel-heading h2{font-size:1.75rem}
.panel-heading>p:last-child{margin-bottom:0;font-size:.8rem;color:var(--muted)}
.plan-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.plan-heading-tools{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.total-width{flex:0 0 auto;text-align:right}
.total-width small{display:block;font-size:.64rem;color:var(--muted)}
.total-width strong{display:block;color:var(--ink);font-size:1.3rem;font-weight:500}

.plan-viewport{position:relative;margin:22px -20px 0;min-height:402px;overflow-x:auto;overflow-y:hidden;border-block:1px solid var(--line);background:linear-gradient(180deg,#fff 0%,#F5F1ED 100%);scrollbar-width:auto;scrollbar-color:var(--brand) var(--surface-2);overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.plan-viewport::-webkit-scrollbar{height:14px}
.plan-viewport::-webkit-scrollbar-track{background:var(--surface-2);border-top:1px solid var(--line)}
.plan-viewport::-webkit-scrollbar-thumb{min-width:52px;border:3px solid var(--surface-2);border-radius:999px;background:var(--brand)}
.plan-viewport::after{content:"";position:absolute;left:0;right:0;bottom:67px;height:1px;background:rgba(90,80,70,.22);pointer-events:none}
.plan-canvas{position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:flex-start;min-width:100%;width:max-content;min-height:390px;padding:40px 40px 68px;gap:0}
.plan-canvas:empty{pointer-events:none}
.empty-plan{position:absolute;z-index:3;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;text-align:center;color:var(--muted)}
.empty-plan-mark{width:60px;height:150px;margin-bottom:18px;border:1px solid var(--line);background:rgba(255,255,255,.45);box-shadow:inset 0 -38px 0 rgba(217,210,203,.2)}
.empty-plan strong{color:var(--ink);font-weight:500}
.empty-plan p{max-width:22em;margin:5px 0 0;font-size:.76rem}
.empty-add-button{margin-top:14px;padding:9px 15px;border:1px solid var(--brand);border-radius:999px;background:var(--brand);color:#fff;font-size:.72rem;font-weight:600;cursor:pointer}
.empty-add-button span{margin-right:3px;font-size:1rem}
.plan-module{position:relative;flex:0 0 auto;height:332px;aspect-ratio:var(--module-width) / 250;min-width:40px;transition:filter .2s ease,transform .2s ease}
.plan-module-select{position:relative;display:block;width:100%;height:100%;padding:0;border:0;background:transparent;cursor:pointer;touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.plan-module-select img{pointer-events:none;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.plan-module:hover,.plan-module.is-selected{z-index:3;filter:drop-shadow(0 10px 12px rgba(70,62,54,.18));transform:translateY(-3px)}
.plan-module .module-storage-image,.wizard-module-preview .module-storage-image{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:fill;background:#eee9e4}
.cabinet-preview-container{container-type:size}
.module-cabinet-shell{position:relative;z-index:1;display:block;width:100%;height:100%;overflow:hidden;background:var(--cabinet-base);isolation:isolate;container-type:size;pointer-events:none}
.storage-option-image .module-cabinet-shell{flex:0 0 auto;width:auto;height:100%;max-width:100%;aspect-ratio:var(--module-width)/250}
.module-cabinet-shell>.cabinet-part,.module-cabinet-shell>.cabinet-hanging-rod,.module-cabinet-shell>.cabinet-storage-group{position:absolute;display:block;max-width:none;margin:0;padding:0;border:0;object-fit:fill;pointer-events:none;user-select:none;-webkit-user-drag:none}
.module-cabinet-shell>.cabinet-part{filter:var(--cabinet-color-adjustment)}
.module-cabinet-shell>.cabinet-back-panel{z-index:0;top:var(--cabinet-panel-height);left:var(--cabinet-side);width:var(--cabinet-inner);height:var(--cabinet-inner-height)}
.module-cabinet-shell>.cabinet-hanging-rod{z-index:1;border-radius:999px;background:linear-gradient(180deg,#928D86 0%,#4B4844 48%,#77716A 100%);box-shadow:0 1px 2px rgba(45,42,38,.3)}
.module-cabinet-shell>.cabinet-storage-group{z-index:2;display:flex;align-items:flex-start;justify-content:space-evenly;overflow:visible}
.module-cabinet-shell .cabinet-storage-item{display:block;flex:0 0 auto;width:auto;height:100%;max-width:none;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}
.module-cabinet-shell>.cabinet-quilt-group{align-items:flex-end}
.module-cabinet-shell>.cabinet-short-clothes-group{justify-content:center}
.module-cabinet-shell .cabinet-short-clothes{max-width:100%;object-fit:fill}
.module-cabinet-shell>.cabinet-storage-shelf{z-index:3;object-fit:fill}
.module-cabinet-shell>.cabinet-drawer-front{z-index:2;object-fit:fill}
.module-cabinet-shell>.cabinet-drawer-top-panel{z-index:3;object-fit:fill}
.module-cabinet-shell>.cabinet-drawer-label{position:absolute;z-index:4;display:flex;align-items:center;justify-content:center;margin:0;padding:0;color:rgba(72,64,56,.76);font-family:"Noto Sans TC","Microsoft JhengHei",sans-serif;font-size:clamp(7px,var(--drawer-label-size,2.4cqh),14px);font-weight:600;line-height:1;text-align:center;white-space:nowrap;pointer-events:none;user-select:none}
.module-cabinet-shell>.cabinet-toe-kick{z-index:4;top:var(--cabinet-toe-top);left:0;width:100%;height:var(--cabinet-toe-height);object-fit:fill}
.module-cabinet-shell>.cabinet-top-panel{z-index:5;top:0;left:var(--cabinet-side);width:var(--cabinet-inner);height:var(--cabinet-panel-height);object-fit:fill}
.module-cabinet-shell>.cabinet-bottom-panel{z-index:5;top:var(--cabinet-bottom-top);left:var(--cabinet-side);width:var(--cabinet-inner);height:var(--cabinet-panel-height);object-fit:fill}
.module-cabinet-shell>.cabinet-left-panel{z-index:6;top:0;left:0;width:var(--cabinet-side);height:var(--cabinet-body-height);object-fit:fill}
.module-cabinet-shell>.cabinet-right-panel{z-index:6;top:0;right:0;width:var(--cabinet-side);height:var(--cabinet-body-height);object-fit:fill}
.module-cabinet-shell>.cabinet-dimension-layer{position:absolute;z-index:99;inset:0;display:none;font-family:"Noto Sans TC","Microsoft JhengHei",sans-serif;pointer-events:none;user-select:none}
.show-cabinet-dimensions .module-cabinet-shell>.cabinet-dimension-layer{display:block}
.cabinet-preview-container>.cabinet-external-dimension-layer{position:absolute;z-index:99;inset:0;display:none;font-family:"Noto Sans TC","Microsoft JhengHei",sans-serif;pointer-events:none;user-select:none}
.show-cabinet-dimensions .cabinet-preview-container.has-door>.cabinet-external-dimension-layer{display:block}
.show-cabinet-dimensions .cabinet-preview-container.has-door>.module-cabinet-shell>.cabinet-dimension-layer{display:none}
.cabinet-dimension-marker{position:absolute;left:2px;right:2px;height:0;display:flex;align-items:center;justify-content:center;border-top:1px solid rgba(91,79,67,.58);transform:translateY(-50%)}
.cabinet-dimension-marker::before{content:"";position:absolute;left:0;top:-2px;width:1px;height:5px;background:rgba(91,79,67,.62)}
.cabinet-dimension-marker.is-top{transform:none}
.cabinet-dimension-label{position:relative;padding:1px 3px;border:1px solid rgba(111,96,82,.4);border-radius:3px;background:rgba(255,252,248,.94);color:#4F453C;font-size:clamp(6px,1.8cqh,10px);font-weight:700;line-height:1.05;letter-spacing:-.03em;white-space:nowrap;box-shadow:0 1px 3px rgba(70,62,54,.1);transform:translateY(calc(-50% - 4px))}
.cabinet-dimension-marker.is-top .cabinet-dimension-label{transform:translateY(calc(50% + 3px))}
.module-door-overlay{position:absolute;z-index:2;inset:0;display:block;width:100%;height:100%;object-fit:fill!important;background:transparent!important;pointer-events:none}
.module-badge{position:absolute;z-index:100;top:-32px;left:50%;transform:translateX(-50%);min-width:28px;height:28px;padding:0 8px;border-radius:999px;display:flex;align-items:center;justify-content:center;background:var(--brand);color:#fff;border:2px solid #fff;font-family:inherit;font-size:.62rem;font-weight:600;box-shadow:0 4px 12px rgba(70,62,54,.2);cursor:pointer}
.module-badge:hover,.module-badge[aria-expanded="true"]{background:var(--ink);transform:translateX(-50%) scale(1.06)}
.module-badge:disabled{opacity:1;cursor:default}
.module-number-badge{min-width:30px;padding:0 6px;pointer-events:none;cursor:default;font-size:.58rem;letter-spacing:.04em}
.module-badge.module-number-badge:hover{background:var(--brand);transform:translateX(-50%)}
.module-action-menu{position:absolute;z-index:120;top:3px;left:50%;transform:translateX(-50%);min-width:112px;padding:6px;border:1px solid var(--line);border-radius:11px;display:grid;gap:3px;background:rgba(254,252,250,.98);box-shadow:0 10px 28px rgba(70,62,54,.2)}
.module-action-menu[hidden]{display:none!important}
.module-action-menu button{width:100%;padding:8px 10px;border:0;border-radius:7px;background:transparent;color:var(--text);font-family:inherit;font-size:.64rem;font-weight:600;text-align:left;white-space:nowrap;cursor:pointer}
.module-action-menu button:hover,.module-action-menu button:focus-visible{outline:0;background:var(--surface-2);color:var(--ink)}
.module-action-menu .module-action-delete{color:var(--danger)}
.module-action-menu .module-action-delete:hover,.module-action-menu .module-action-delete:focus-visible{background:rgba(155,73,63,.09);color:var(--danger)}
.module-plan-meta{position:absolute;z-index:6;top:calc(100% + 7px);left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:3px;pointer-events:none;white-space:nowrap}
.module-dimension{padding:2px 7px;border:1px solid rgba(217,210,203,.9);border-radius:999px;background:rgba(254,252,250,.96);color:var(--ink);font-size:.56rem;font-weight:600;line-height:1.35;box-shadow:0 2px 7px rgba(70,62,54,.08)}
.module-config-tags{width:100%;display:flex;flex-direction:column;flex-wrap:nowrap;align-items:center;justify-content:center;gap:2px}
.module-config-tag{padding:2px 6px;border:1px solid #D9D2CB;border-radius:999px;background:#E9E2DC;color:#655D50;font-size:.49rem;font-weight:600;line-height:1.35;letter-spacing:.02em}
.plan-add-button{flex:0 0 58px;height:86px;margin:0 20px 118px;border:1px dashed var(--brand);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(254,252,250,.82);color:var(--brand);cursor:pointer}
.plan-add-button span{font-size:1.65rem;line-height:1}
.plan-add-button small{margin-top:5px;font-size:.62rem}
.plan-add-button:hover{border-style:solid;background:var(--brand);color:#fff}
.image-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:8px;border:1px solid var(--line);background:#F1ECE7;color:var(--muted);font-size:.58rem;text-align:center;writing-mode:vertical-rl}
.plan-scrollbar{display:block;width:100%;height:24px;margin:8px 0 0;appearance:none;-webkit-appearance:none;background:transparent;cursor:ew-resize}
.plan-scrollbar::-webkit-slider-runnable-track{height:9px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2)}
.plan-scrollbar::-webkit-slider-thumb{width:54px;height:17px;margin-top:-5px;border:2px solid var(--surface);border-radius:999px;appearance:none;-webkit-appearance:none;background:var(--brand);box-shadow:0 2px 8px rgba(70,62,54,.24)}
.plan-scrollbar::-moz-range-track{height:9px;border:1px solid var(--line);border-radius:999px;background:var(--surface-2)}
.plan-scrollbar::-moz-range-thumb{width:54px;height:17px;border:2px solid var(--surface);border-radius:999px;background:var(--brand);box-shadow:0 2px 8px rgba(70,62,54,.24)}
.plan-reorder-bar{margin:10px 0 0;padding:10px 12px;border:1px solid rgba(92,81,69,.22);border-radius:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--surface-2);color:var(--text);font-size:.7rem}
.plan-reorder-bar[hidden]{display:none!important}
.plan-reorder-bar>span{white-space:nowrap}
.plan-reorder-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:6px}
.plan-reorder-actions button{min-height:32px;padding:6px 10px;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--text);font-family:inherit;font-size:.63rem;font-weight:600;cursor:pointer}
.plan-reorder-actions button:disabled{opacity:.35;cursor:not-allowed}
.plan-reorder-actions .is-cancel{background:transparent;color:var(--muted)}
.plan-reorder-actions .is-confirm{border-color:var(--brand);background:var(--brand);color:#fff}

.module-details-panel{padding:12px 20px 20px;border-top:0}
.module-list-wrap{border:1px solid var(--line);border-radius:16px;background:rgba(254,252,250,.7);overflow:hidden}
.module-list-title{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 16px;cursor:pointer}
.module-list-title::-webkit-details-marker{display:none}
.module-list-title>span:first-child{display:flex;flex-direction:column}
.module-list-title small{font-size:.61rem;color:var(--muted);letter-spacing:.08em}
.module-list-title strong{font-size:.86rem;color:var(--ink);font-weight:600}
.footer-summary-actions{flex:0 0 auto;display:flex;align-items:center;gap:10px}
.footer-dimension-toggle{display:inline-flex;align-items:center;gap:5px;color:var(--muted);font-size:.6rem;font-weight:500;white-space:nowrap;cursor:pointer}
.footer-dimension-toggle input{width:14px;height:14px;margin:0;accent-color:var(--brand);cursor:pointer}
.footer-dimension-toggle:has(input:checked){color:var(--ink)}
.module-list-help{display:flex;align-items:center;gap:7px;font-size:.65rem;color:var(--brand)}
.module-list-help::after{content:"＋";width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);font-size:.9rem}
.module-list-wrap[open] .module-list-help::after{content:"−"}
.module-drag-help{margin:0;padding:0 16px 12px;font-size:.66rem;color:var(--muted)}
.module-list{display:grid;gap:8px}
.module-list-wrap .module-list{padding:0 10px 10px}
.module-row{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;padding:10px 11px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.module-row.is-selected{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
.module-row-index{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);color:var(--brand);font-size:.68rem;font-weight:600}
.module-row-main{min-width:0;padding:3px;border:0;border-radius:7px;background:transparent;text-align:left;cursor:default}
.module-row-main:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.module-row-copy strong{display:block;color:var(--ink);font-size:.76rem;font-weight:600}
.module-row-price{display:block;margin-top:6px;color:var(--brand);font-size:.72rem;font-weight:700}
.module-row-details{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.module-row-details span{padding:2px 6px;border-radius:999px;background:var(--surface-2);color:var(--text);font-size:.59rem;white-space:nowrap}
.module-row-actions{display:flex;gap:3px}
.icon-button{width:31px;height:31px;border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer;display:grid;place-items:center;font-size:.78rem}
.icon-button:hover{background:var(--surface-2);color:var(--ink)}
.icon-button:disabled{opacity:.25;cursor:not-allowed}
.icon-button.is-danger:hover{background:rgba(155,73,63,.09);color:var(--danger)}
.plan-module.is-drag-source{opacity:.16;filter:none;transform:none}
.plan-module.is-reorder-target{z-index:5;filter:drop-shadow(0 10px 14px rgba(70,62,54,.22));transform:translateY(-4px)}
.plan-module.is-reorder-target .plan-module-select{cursor:grab}
.plan-module.is-reorder-target .plan-module-select:active{cursor:grabbing}
.plan-drag-ghost{position:fixed!important;z-index:1000!important;margin:0!important;pointer-events:none;transform:rotate(1deg) scale(1.035)!important;filter:drop-shadow(0 18px 24px rgba(70,62,54,.3))!important}
.plan-drag-ghost .module-action-menu{display:none!important}
body.is-reordering{cursor:grabbing;user-select:none}
body.is-reordering .plan-canvas>.plan-module:not(.is-drag-source){animation:module-wiggle .18s ease-in-out infinite alternate}
body.is-reorder-mode .plan-canvas>.plan-module:not(.is-reorder-target){animation:module-wiggle .18s ease-in-out infinite alternate}
@keyframes module-wiggle{from{transform:rotate(-.25deg)}to{transform:rotate(.25deg)}}

/* Composer */
.composer-dialog{position:fixed;z-index:350;inset:0;display:flex;align-items:flex-end;justify-content:center}
.composer-backdrop{position:absolute;inset:0;background:rgba(70,62,54,.42);backdrop-filter:blur(4px)}
.composer-sheet{position:relative;width:100%;max-height:96dvh;overflow-y:auto;padding-bottom:calc(16px + env(safe-area-inset-bottom));border-radius:24px 24px 0 0;box-shadow:0 -20px 70px rgba(70,62,54,.24);transform:translateY(18px);opacity:0;transition:transform .24s ease,opacity .24s ease}
.composer-dialog.is-visible .composer-sheet{transform:none;opacity:1}
.sheet-grip{width:44px;height:5px;margin:-12px auto 18px;border-radius:999px;background:var(--line)}
.control-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}
.control-heading h2{margin:0;font-size:1.6rem}
.control-heading .eyebrow{margin-bottom:5px}
.sheet-close{flex:0 0 auto;width:38px;height:38px;padding:0;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;background:transparent;color:var(--brand);font-size:1.2rem;line-height:1;cursor:pointer}
.composer-close{position:absolute;z-index:8;top:18px;right:18px;background:var(--surface)}
.sheet-close:hover{border-color:var(--brand);background:var(--surface-2)}
body.has-composer{overflow:hidden}
.composer-progress{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:8px 42px 14px 0;padding:0;list-style:none}
.composer-progress li{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--muted);font-size:.6rem;text-align:center}
.composer-progress li::before{content:"";position:absolute;z-index:0;top:14px;left:-50%;width:100%;height:1px;background:var(--line)}
.composer-progress li:first-child::before{display:none}
.composer-progress span{position:relative;z-index:1;width:29px;height:29px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;background:var(--surface);font-size:.58rem;font-weight:600}
.composer-progress small{font-size:.58rem;letter-spacing:.08em}
.composer-progress li.is-active,.composer-progress li.is-complete{color:var(--brand)}
.composer-progress li.is-active span{border-color:var(--brand);background:var(--brand);color:#fff;box-shadow:0 4px 12px rgba(70,62,54,.18)}
.composer-progress li.is-complete span{border-color:var(--brand);background:var(--surface-2);color:var(--brand)}
.composer-progress li.is-complete::before,.composer-progress li.is-active::before{background:var(--brand)}
.composer-stage{animation:composer-stage-in .22s ease both}
@keyframes composer-stage-in{from{opacity:0;transform:translateX(7px)}to{opacity:1;transform:none}}
.stage-heading{margin-bottom:20px}
.stage-heading .eyebrow{margin-bottom:5px}
.stage-heading h3{margin:0;color:var(--ink);font-family:var(--serif);font-size:1.35rem;font-weight:500;line-height:1.35;outline:0}
.stage-heading>p:last-child{margin:6px 0 0;color:var(--muted);font-size:.7rem}
.width-control{margin-top:14px}
.width-control>label,.storage-fieldset legend{display:block;margin-bottom:6px;color:var(--ink);font-size:.72rem;font-weight:600}
.width-input-wrap{display:flex;align-items:baseline;border-bottom:1px solid var(--ink);padding:0 4px 5px}
.width-input-wrap input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:var(--ink);font-family:var(--serif);font-size:2.7rem;line-height:1;text-align:center;-moz-appearance:textfield}
.width-input-wrap input::-webkit-inner-spin-button,.width-input-wrap input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.width-input-wrap span{font-size:.82rem;color:var(--muted)}
.width-range{width:100%;margin:10px 0 8px;accent-color:var(--brand)}
.width-presets{display:grid;grid-template-columns:repeat(8,1fr);gap:4px}
.width-presets button{min-width:0;padding:7px 0;border:1px solid var(--line);border-radius:7px;background:transparent;color:var(--muted);font-size:.58rem;cursor:pointer}
.width-presets button:hover,.width-presets button.is-active{border-color:var(--brand);background:var(--brand);color:#fff}
.width-message{min-height:32px;margin:8px 0 0;padding:7px 10px;border-radius:9px;background:var(--surface-2);font-size:.64rem;color:var(--text)}
.width-message.is-error{background:rgba(155,73,63,.08);color:var(--danger)}
.width-message.is-warning{background:rgba(150,115,58,.1);color:#775F2E}

.storage-fieldset{min-width:0;margin:0;padding:0;border:0}
.storage-preview-tools{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin:-30px 0 6px}
.option-note{margin:0;font-size:.67rem;color:var(--muted)}
.dimension-toggle{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:5px 8px;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--text);font-size:.62rem;font-weight:600;cursor:pointer;user-select:none}
.dimension-toggle input{width:14px;height:14px;margin:0;accent-color:var(--brand)}
.dimension-toggle:has(input:checked){border-color:var(--brand);background:var(--surface-2);color:var(--brand)}
.storage-options{display:flex;gap:8px;overflow-x:auto;overscroll-behavior-x:contain;padding:2px 2px 8px;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:var(--brand) var(--surface-2)}
.storage-option{position:relative;flex:0 0 clamp(158px,42vw,205px);min-width:0;padding:7px 7px 9px;border:1px solid var(--line);border-radius:14px;background:var(--paper);cursor:pointer;scroll-snap-align:start;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.storage-option:hover{transform:translateY(-2px);border-color:var(--brand)}
.storage-option.is-selected{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand)}
.storage-option.is-locked{cursor:not-allowed;opacity:.46;filter:grayscale(.35)}
.storage-option.is-locked:hover{border-color:var(--line);transform:none}
.storage-option.is-selected.is-locked{opacity:.72;border-color:var(--danger);box-shadow:0 0 0 2px rgba(155,73,63,.45)}
.storage-option-label .storage-option-lock{display:block;margin-top:4px;color:var(--danger);font-size:.58rem;font-weight:500}
.storage-option-image{height:clamp(145px,22dvh,180px);display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:9px;background:linear-gradient(180deg,#fff,#f3efeb)}
.storage-option img{display:block;width:100%;height:100%;object-fit:contain}
.storage-option-label{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:8px;margin-top:8px;color:var(--ink);text-align:left}
.storage-option-label strong{grid-column:1;display:block;font-size:.72rem;font-weight:600}
.storage-option-label small{grid-column:1;display:block;margin-top:2px;color:var(--muted);font-size:.59rem;font-weight:400}
.storage-option-label::after{content:"";grid-column:2;grid-row:1/3;width:16px;height:16px;border:1px solid var(--line);border-radius:50%;background:#fff}
.storage-option.is-selected .storage-option-label::after{border:5px solid var(--brand)}
.storage-option.is-missing{cursor:not-allowed;opacity:.55}
.storage-option .missing-copy{padding:20px;color:var(--muted);font-size:.68rem;text-align:center}

.confirmed-cabinet{margin-bottom:14px;padding:11px 13px;border:1px solid var(--line);border-radius:11px;background:var(--paper);color:var(--text);font-size:.7rem}
.confirmed-cabinet strong{color:var(--ink);font-weight:600}
.binary-choice-grid,.handle-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.wizard-choice{position:relative;min-width:0;padding:14px 11px;border:1px solid var(--line);border-radius:14px;display:flex;flex-direction:column;align-items:center;background:var(--paper);color:var(--text);text-align:center;cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s}
.wizard-choice:hover{transform:translateY(-2px);border-color:var(--brand)}
.wizard-choice.is-selected{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand);background:var(--surface)}
.wizard-choice strong{margin-top:8px;color:var(--ink);font-size:.73rem;font-weight:600}
.wizard-choice small{margin-top:2px;color:var(--muted);font-size:.59rem;line-height:1.5}
.text-only-choice{min-height:82px;justify-content:center;padding:16px}
.text-only-choice strong{margin-top:0;font-size:.82rem}
.door-direction-section{margin-top:20px}
.choice-group-title{margin:0 0 9px;color:var(--ink);font-size:.72rem;font-weight:600}
.door-direction-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.door-direction-card{min-width:0;min-height:76px;padding:12px;border:1px solid var(--line);border-radius:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--paper);cursor:pointer;text-align:center;transition:.2s}
.door-direction-card:hover{border-color:var(--brand);transform:translateY(-2px)}
.door-direction-card.is-selected{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand)}
.door-direction-card strong{display:block;color:var(--ink);font-size:.69rem;font-weight:600}
.door-direction-card small{display:block;margin-top:2px;color:var(--muted);font-size:.58rem}
.wizard-preview{min-height:310px;margin-top:20px;padding:16px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,#fff,#F5F1ED)}
.wizard-preview:empty{display:none}
.wizard-module-preview{position:relative;height:280px;aspect-ratio:var(--module-width)/250;min-width:34px;overflow:hidden;filter:drop-shadow(0 8px 12px rgba(70,62,54,.12))}
.wizard-preview.is-final{min-height:350px}
.wizard-preview.is-final .wizard-module-preview{height:320px}
.composer-summary{display:grid;grid-template-columns:1fr auto;margin:12px 0 0;padding:0;border:1px solid var(--line);border-radius:13px;overflow:hidden;background:var(--paper)}
.composer-summary dt,.composer-summary dd{margin:0;padding:9px 12px;border-bottom:1px solid var(--line);font-size:.68rem}
.composer-summary dt:last-of-type,.composer-summary dd:last-of-type{border-bottom:0}
.composer-summary dt{color:var(--muted)}
.composer-summary dd{color:var(--ink);font-weight:600;text-align:right}

.composer-actions{position:sticky;z-index:4;bottom:calc(-16px - env(safe-area-inset-bottom));display:grid;gap:8px;margin-top:10px;padding:10px 0 calc(16px + env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(254,252,250,0),var(--surface) 12px)}
.composer-actions-split{grid-template-columns:1fr 1.35fr}
.text-cancel-button{grid-column:1/-1;min-height:34px;padding:4px;border:0;background:transparent;color:var(--muted);font-size:.68rem;cursor:pointer}
.text-cancel-button:hover{color:var(--danger)}
.primary-button,.secondary-button,.danger-button,.finish-button{min-height:50px;border-radius:12px;padding:12px 18px;display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;text-decoration:none;font-size:.8rem;font-weight:600;cursor:pointer;transition:background .2s ease,transform .2s ease,border-color .2s ease}
.primary-button,.finish-button{background:var(--brand);color:#fff}
.primary-button:hover,.finish-button:hover{background:var(--ink);transform:translateY(-1px)}
.primary-button:disabled,.finish-button:disabled{background:#C7C0B9;color:#F7F4F1;cursor:not-allowed;transform:none}
.secondary-button{border-color:var(--line);background:transparent;color:var(--brand)}
.secondary-button:hover{border-color:var(--brand);background:var(--surface-2)}
.danger-button{background:var(--danger);color:#fff}

.builder-footer{position:fixed;z-index:80;left:0;right:0;bottom:0;min-height:74px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;gap:14px;background:rgba(254,252,250,.96);border-top:1px solid var(--line);backdrop-filter:blur(14px)}
.builder-footer small{display:block;font-size:.6rem;color:var(--muted)}
.builder-footer strong{display:block;color:var(--ink);font-size:.75rem;font-weight:600}
.finish-button{min-height:46px;white-space:nowrap}

/* Summary */
.summary-view{padding:46px 20px 70px}
.summary-inner{width:min(980px,100%);min-width:0;margin:0 auto}
.summary-inner>h1{max-width:10em;margin-bottom:16px;font-size:clamp(2.15rem,9vw,4rem)}
.summary-card{min-width:0;max-width:100%;margin-top:30px;padding:16px;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:var(--shadow)}
.summary-metrics{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line)}
.summary-metrics>div{padding:10px 8px 15px;text-align:center}
.summary-metrics>div+div{border-left:1px solid var(--line)}
.summary-metrics small{display:block;font-size:.57rem;color:var(--muted)}
.summary-metrics strong{display:block;margin-top:3px;color:var(--ink);font-size:.83rem;font-weight:600}
.summary-plan{min-height:380px;padding:24px 12px 60px;display:flex;align-items:flex-end;justify-content:center;gap:0;overflow-x:auto;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#fff,#F5F1ED)}
.summary-plan .plan-module{height:300px;cursor:default}
.summary-plan .plan-module:hover{filter:none;transform:none}
.summary-list{display:grid;gap:0;margin:0;padding:4px 0 0;list-style:none}
.summary-list li{display:flex;justify-content:space-between;gap:18px;padding:11px 4px;border-bottom:1px solid var(--line);font-size:.72rem}
.summary-list li:last-child{border-bottom:0}
.summary-list strong{color:var(--ink);font-weight:600}
.summary-list span{color:var(--muted);text-align:right}
.case-reference{margin-top:14px;padding:12px 15px;border:1px solid var(--line);border-radius:13px;display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(254,252,250,.72)}
.case-reference small{color:var(--muted);font-size:.65rem;letter-spacing:.08em}
.case-reference strong{color:var(--ink);font-family:"Inter",sans-serif;font-size:.8rem;letter-spacing:.08em}
.summary-actions{display:grid;gap:9px;margin:18px auto 0;width:min(420px,100%)}
.summary-disclaimer{margin:12px 0 0;text-align:center;font-size:.64rem;color:var(--muted)}

/* Dialog and toast */
.toast{position:fixed;z-index:500;left:50%;bottom:96px;transform:translate(-50%,16px);max-width:calc(100% - 32px);padding:9px 15px;border-radius:999px;background:var(--ink);color:#fff;font-size:.7rem;opacity:0;pointer-events:none;transition:.25s ease;white-space:nowrap;box-shadow:0 10px 30px rgba(70,62,54,.22)}
.toast.is-visible{opacity:1;transform:translate(-50%,0)}
.confirm-dialog{position:fixed;z-index:400;inset:0;display:grid;place-items:center;padding:20px}
.dialog-backdrop{position:absolute;inset:0;background:rgba(70,62,54,.42);backdrop-filter:blur(4px)}
.dialog-card{position:relative;width:min(400px,100%);padding:26px;border-radius:20px;background:var(--surface);box-shadow:0 30px 90px rgba(70,62,54,.25)}
.dialog-card h2{margin-bottom:8px;font-size:1.5rem}
.dialog-card>p:not(.eyebrow){margin-bottom:20px;font-size:.8rem;color:var(--muted)}
.dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dialog-actions-single{grid-template-columns:1fr}
.access-dialog{position:fixed;z-index:410;inset:0;display:grid;place-items:center;padding:16px}
.access-card{position:relative;width:min(650px,100%);max-height:calc(100dvh - 32px);overflow-y:auto;padding:28px;border-radius:22px;background:var(--surface);box-shadow:0 30px 90px rgba(70,62,54,.28)}
.access-card-simple{width:min(520px,100%);padding:64px 24px 24px}
.access-card h2{margin:0 40px 8px 0;font-size:1.65rem}
.access-intro{margin-bottom:20px;color:var(--muted);font-size:.76rem}
.access-options{display:grid;gap:10px}
.access-option{position:relative;width:100%;min-height:152px;padding:18px;border:1px solid var(--line);border-radius:16px;display:flex;flex-direction:column;align-items:flex-start;background:var(--paper);color:var(--text);text-align:left;cursor:pointer;transition:border-color .2s,transform .2s,box-shadow .2s}
.access-option:hover{transform:translateY(-2px);border-color:var(--brand);box-shadow:0 12px 32px rgba(70,62,54,.09)}
.access-option-member{background:var(--brand);border-color:var(--brand);color:#fff}
.access-option-member:hover{border-color:var(--ink);background:var(--ink)}
.access-option-label{font-size:.61rem;font-weight:600;letter-spacing:.13em;opacity:.68}
.access-option strong{margin-top:18px;color:var(--ink);font-family:var(--serif);font-size:1.12rem;font-weight:500}
.access-option-member strong{color:#fff}
.access-option small{margin-top:4px;color:var(--muted);font-size:.67rem}
.access-option-member small{color:rgba(255,255,255,.68)}
.access-option-action{margin-top:auto;padding-top:15px;font-size:.7rem;font-weight:600}
.access-option:disabled{opacity:.52;cursor:not-allowed;transform:none;box-shadow:none}
.access-card-simple .access-option{min-height:96px;align-items:center;justify-content:center;text-align:center}
.access-card-simple .access-option strong{margin:0;font-family:var(--sans);font-size:.86rem;font-weight:600}
.member-benefit{margin:14px 0 0;text-align:center;color:var(--muted);font-size:.64rem}
.delivery-dialog{position:fixed;z-index:420;inset:0;display:grid;place-items:center;padding:16px}
.delivery-card{position:relative;width:min(520px,100%);max-height:calc(100dvh - 32px);overflow-y:auto;padding:26px;border-radius:20px;background:var(--surface);box-shadow:0 30px 90px rgba(70,62,54,.28)}
.delivery-card h2{margin:0 38px 8px 0;font-size:1.55rem}
.delivery-intro{margin-bottom:20px;color:var(--muted);font-size:.76rem}
.dialog-close{position:absolute;top:18px;right:18px;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;background:var(--paper);color:var(--brand);font-size:1.15rem;line-height:1;cursor:pointer}
.dialog-close:hover{border-color:var(--brand)}
.delivery-form{display:grid;gap:13px}
.delivery-name-row{display:grid;grid-template-columns:minmax(0,1fr) 96px;gap:10px}
.delivery-field{display:grid;gap:6px}
.delivery-field label{color:var(--ink);font-size:.72rem;font-weight:600}
.delivery-field input,.delivery-field select{width:100%;min-height:46px;padding:10px 12px;border:1px solid var(--line);border-radius:11px;background:var(--paper);outline:none;color:var(--ink);font:inherit}
.delivery-field select{cursor:pointer}
.delivery-field input:focus,.delivery-field select:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(90,80,70,.1)}
.delivery-salutation-field select{padding-inline:10px}
.delivery-consent{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:9px;padding:11px 12px;border-radius:11px;background:var(--surface-2);color:var(--text);font-size:.68rem;cursor:pointer}
.delivery-consent input{margin-top:3px;accent-color:var(--brand)}
.privacy-notice{border-top:1px solid var(--line);padding-top:10px;color:var(--muted);font-size:.64rem}
.privacy-notice summary{color:var(--brand);cursor:pointer;font-weight:600}
.privacy-notice p{margin:8px 0 0}
.delivery-status{display:none;padding:10px 12px;border-radius:10px;font-size:.7rem}
.delivery-status.is-visible{display:block}
.delivery-status.is-error{background:rgba(155,73,63,.09);color:var(--danger)}
.delivery-status.is-success{background:rgba(95,116,94,.1);color:var(--success)}
.delivery-submit{width:100%}
.delivery-submit:disabled{opacity:.58;cursor:wait;transform:none}
.delivery-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.delivery-success{padding:22px 4px 2px;text-align:center}
.delivery-success-mark{width:52px;height:52px;margin:0 auto 14px;border-radius:50%;display:grid;place-items:center;background:var(--brand);color:#fff;font-size:1.35rem;font-weight:700}
.delivery-success h2{margin:0 0 10px;font-size:1.55rem}
.delivery-success p{margin:0 auto 22px;max-width:28em;color:var(--ink);font-size:.86rem;line-height:1.8}
.delivery-success a{color:var(--brand);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.delivery-success .delivery-member-invite{margin-bottom:14px;color:var(--muted);font-size:.72rem}
.delivery-success .primary-button{width:100%;color:#fff;text-decoration:none}
.delivery-skip-button{margin-top:10px;padding:8px 14px;border:0;background:transparent;color:var(--muted);font-size:.7rem;cursor:pointer}
.delivery-skip-button:hover{color:var(--brand)}
body.has-dialog{overflow:hidden}

.estimate-list-button{display:inline-flex;align-items:center;gap:7px}
.estimate-list-button span{min-width:21px;height:21px;padding:0 6px;border-radius:999px;display:inline-grid;place-items:center;background:var(--brand);color:#fff;font-size:.62rem}
.active-case-card{width:100%;margin:24px 0 2px;padding:16px 18px;border:1px solid var(--line);border-radius:15px;display:flex;align-items:center;justify-content:space-between;gap:18px;background:var(--surface);color:var(--text);text-align:left;cursor:pointer}
.active-case-card>span{display:grid;gap:3px}.active-case-card>span:last-child{text-align:right}
.active-case-card small{color:var(--muted);font-size:.62rem}.active-case-card strong{font-size:.78rem}
.case-group-list{display:grid;min-width:0;max-width:100%;gap:18px;margin-top:20px}
.case-group-card{min-width:0;max-width:100%;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:var(--paper)}
.case-group-heading{padding:16px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:14px}
.case-group-heading h2{margin:0;font-family:var(--serif);font-size:1.2rem;font-weight:500}
.case-group-heading p{margin:4px 0 0;color:var(--muted);font-size:.67rem}
.case-group-heading-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.case-group-price{display:grid;gap:2px;text-align:right;white-space:nowrap}
.case-group-price small{color:var(--muted);font-size:.56rem}
.case-group-price strong{color:var(--brand);font-size:.72rem;font-weight:600}
.case-group-edit{padding:9px 12px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--text);font-size:.66rem;cursor:pointer;white-space:nowrap}
.case-group-delete{padding:9px 12px;border:1px solid rgba(155,73,63,.28);border-radius:999px;background:transparent;color:var(--danger);font-size:.66rem;cursor:pointer;white-space:nowrap}
.case-group-delete:hover{border-color:var(--danger);background:rgba(155,73,63,.08)}
.case-group-preview{margin:0;padding:18px;min-height:280px;border-bottom:1px solid var(--line);overflow-x:auto}
.case-group-preview .plan-module{height:260px;min-width:72px}
.case-group-modules{margin:0;padding:0 18px 16px}
.summary-member-link{display:grid;place-items:center;text-decoration:none}
.summary-actions{gap:10px}
.module-row-price.is-estimate{font-size:.62rem}
.case-estimate-summary{min-width:0;max-width:100%;margin-top:14px;padding:20px;border:1px solid var(--line);border-radius:18px;background:var(--brand);color:#fff;box-shadow:var(--shadow)}
.case-estimate-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:22px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.2)}
.case-estimate-heading small{display:block;margin-bottom:3px;color:rgba(255,255,255,.64);font-size:.57rem;letter-spacing:.1em}
.case-estimate-heading h2{margin:0;color:#fff;font-family:var(--serif);font-size:1.35rem;font-weight:500}
.case-region-field{display:grid;gap:5px;min-width:190px}
.case-region-field span{font-size:.58rem;color:rgba(255,255,255,.72)}
.case-region-field select{width:100%;min-height:42px;padding:8px 34px 8px 11px;border:1px solid rgba(255,255,255,.35);border-radius:10px;background:#fff;color:var(--ink);font:inherit;font-size:.72rem}
.case-region-field select:disabled{opacity:.7;cursor:wait}
.case-estimate-rows{display:grid;margin-top:5px}
.case-estimate-rows>div{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.15);font-size:.7rem}
.case-estimate-rows>div:last-child{border-bottom:0}
.case-estimate-rows span{color:rgba(255,255,255,.72)}
.case-estimate-rows strong{color:#fff;font-weight:600;text-align:right}
.case-estimate-total{padding-top:15px!important;font-size:.82rem!important}
.case-estimate-total strong{font-size:1rem}
@media(max-width:639px){
  .app-header-inner{padding-inline:14px}
  .brand img{height:38px}
  .header-actions{min-width:0;gap:8px}.header-actions .text-button{font-size:.6rem}
  #memberCenterLink{display:none}
  .builder-layout,.plan-panel,.module-details-panel{min-width:0;max-width:100%}
  .builder-view.is-active{animation:builder-view-fade .25s ease both}
  .plan-viewport{min-height:clamp(490px,68dvh,530px)}
  .plan-canvas{min-height:clamp(478px,67dvh,518px);padding:28px 28px 68px}
  .plan-module{height:clamp(370px,55dvh,410px)}
  .module-details-panel{padding-top:20px}
  .plan-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
  .plan-heading>div:first-child{min-width:0}
  .plan-heading-tools{min-width:0;max-width:44vw;gap:4px}
  .dimension-toggle-main{max-width:100%;padding:4px 6px;gap:4px;font-size:.54rem;white-space:nowrap}
  .dimension-toggle-main input{width:12px;height:12px}
  .total-width{min-width:0}
  .total-width small{font-size:.55rem}
  .total-width strong{font-size:1.08rem;white-space:nowrap}
  .builder-footer{min-width:0;padding-inline:12px;gap:8px}
  .builder-footer>div{min-width:0}
  .builder-footer small{font-size:.56rem}
  .builder-footer strong{overflow:hidden;font-size:.68rem;text-overflow:ellipsis;white-space:nowrap}
  .finish-button{flex:0 1 auto;min-width:0;max-width:46vw;padding-inline:12px;font-size:.7rem}
  .active-case-card{align-items:flex-start}
  .case-group-heading{align-items:stretch;flex-direction:column;padding:14px}
  .case-group-heading h2{font-size:1.25rem}
  .case-group-heading p{font-size:.6rem}
  .case-group-heading-actions{display:flex;width:100%;align-items:center;justify-content:space-between}
  .case-group-price{text-align:left;white-space:normal}
  .case-group-price small{font-size:.52rem}
  .case-group-price strong{font-size:.94rem}
  .case-group-edit{padding:8px 11px;font-size:.6rem}
  .case-group-delete{padding:8px 11px;font-size:.6rem}
  .summary-list li{align-items:flex-start;flex-direction:column;gap:3px;padding:9px 0;font-size:.6rem}
  .summary-list strong{font-size:.65rem}
  .summary-list span{max-width:100%;text-align:left;overflow-wrap:anywhere;font-size:.56rem;line-height:1.55}
  .case-reference{align-items:flex-start;flex-direction:column;gap:5px}
  .case-reference strong{max-width:100%;overflow-wrap:anywhere}
  .case-estimate-heading{display:grid;align-items:start}
  .case-estimate-heading h2{font-size:1.45rem}
  .case-region-field{width:100%;min-width:0}
  .case-estimate-rows>div{align-items:flex-start;font-size:.63rem}
  .case-estimate-rows strong{max-width:68%;overflow-wrap:anywhere;font-size:.76rem}
  .case-estimate-total strong{font-size:1.18rem}
}

@keyframes builder-view-fade{from{opacity:0}to{opacity:1}}

@media(min-width:640px){
  .app-header-inner{padding-inline:24px}
  .header-copy{display:flex}
  .category-view{padding-top:70px}
  .category-grid{grid-template-columns:repeat(3,1fr)}
  .resume-button{width:auto}
  .plan-panel,.control-panel{padding:34px 30px}
  .plan-panel{padding-bottom:0}
  .composer-dialog{align-items:center;padding:28px}
  .composer-sheet{width:min(920px,100%);max-height:94dvh;padding:24px 28px 18px;border-radius:24px;box-shadow:0 30px 90px rgba(70,62,54,.28)}
  .sheet-grip{display:none}
  .width-control{display:grid;grid-template-columns:minmax(130px,.3fr) minmax(0,1fr);column-gap:20px;align-items:center}
  .width-control>label{grid-column:1/-1}
  .width-input-wrap{grid-column:1;grid-row:2/4}
  .width-range{grid-column:2;grid-row:2;margin:2px 0 6px}
  .width-presets{grid-column:2;grid-row:3}
  .width-message{grid-column:1/-1;grid-row:4}
  .module-details-panel{padding:12px 30px 34px}
  .plan-viewport{margin-inline:-30px}
  .plan-canvas{padding-inline:36px}
  .plan-module{height:430px}
  .plan-viewport,.plan-canvas{min-height:490px}
  .summary-actions{grid-template-columns:1fr}
  .summary-card{padding:22px}
  .access-options{grid-template-columns:1fr 1fr}
}

@media(min-width:1024px){
  .plan-panel{padding:42px 36px 0}
  .control-panel{padding:38px 36px}
  .composer-sheet{padding:24px 30px 18px}
  .composer-stage[data-composer-stage="1"]{display:block}
  .composer-stage[data-composer-stage="1"][hidden]{display:none!important}
  .plan-viewport{margin-inline:-36px;min-height:540px}
  .plan-canvas{min-height:528px;padding-inline:52px}
  .plan-module{height:470px}
  .module-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .module-details-panel{padding:12px 36px 44px}
  .summary-actions{grid-template-columns:1fr}
  .builder-footer{left:0;width:100%;border-left:0}
}

@media(max-width:380px){
  .app-header-inner{padding-inline:14px}
  .brand img{height:38px}
  .category-view,.plan-panel,.control-panel,.summary-view{padding-inline:16px}
  .plan-viewport{margin-inline:-16px}
  .width-presets{grid-template-columns:repeat(4,1fr)}
  .storage-option-image{height:clamp(140px,21dvh,170px)}
  .module-row{grid-template-columns:auto minmax(0,1fr)}
  .module-row-actions{grid-column:2;justify-content:flex-end;border-top:1px solid var(--line);padding-top:5px}
  .plan-reorder-bar{align-items:stretch;flex-direction:column}
  .plan-reorder-actions{display:grid;grid-template-columns:1fr 1fr}
}

@media(max-width:319px){
  .category-view,.plan-panel,.control-panel,.summary-view{padding-inline:12px}
  .plan-viewport{margin-inline:-12px}
  .plan-heading-tools{max-width:48vw}
  .dimension-toggle-main{font-size:.5rem}
  .builder-footer{padding-inline:8px;gap:6px}
  .finish-button{max-width:48vw;padding-inline:9px;font-size:.66rem}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}
  body.is-reordering .plan-canvas>.plan-module:not(.is-drag-source),body.is-reorder-mode .plan-canvas>.plan-module:not(.is-reorder-target){animation:none}
}

/* Planner v8 — full-screen, minimal four-step flow */
.planner-breadcrumb{position:absolute;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:9px;color:var(--muted);font-size:.7rem;letter-spacing:.08em;white-space:nowrap}
.planner-breadcrumb a{text-decoration:none;color:var(--ink)}
.planner-breadcrumb a:hover{text-decoration:underline;text-underline-offset:4px}

.plan-heading{align-items:flex-end;padding:10px 0 2px}
.plan-heading h1{margin:0;font-size:clamp(1.8rem,5vw,2.8rem)}
.total-width small{font-size:.58rem;letter-spacing:.08em}
.total-width strong{font-size:1rem}
.empty-add-button{width:68px;height:68px;margin:0;padding:0;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink);font-size:2rem;font-weight:300;transition:border-color .2s ease,background .2s ease,transform .2s ease}
.empty-add-button:hover,.empty-add-button:focus-visible{border-color:var(--ink);background:var(--surface);transform:scale(1.04);outline:none}
.empty-add-button span{margin:0;font-size:2rem;line-height:1}

.composer-dialog{align-items:stretch;padding:0;background:var(--paper)}
.composer-backdrop,.sheet-grip{display:none}
.composer-sheet{width:100%;height:100dvh;max-height:none;overflow:hidden;padding:0;border-radius:0;box-shadow:none;background:var(--paper);display:grid;grid-template-rows:auto minmax(0,1fr);transform:translateY(10px)}
.composer-close{top:16px;right:18px;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:var(--paper);font-size:1.25rem}
.composer-progress{width:min(760px,calc(100% - 108px));margin:0 auto;padding:20px 0 14px}
.composer-progress li{gap:5px;font-size:.58rem}
.composer-progress span{width:32px;height:32px;background:var(--paper)}
.composer-progress li.is-active span{background:var(--ink);border-color:var(--ink)}
.composer-progress li.is-complete span{background:var(--paper);border-color:var(--ink)}
.composer-progress li.is-complete::before,.composer-progress li.is-active::before{background:var(--ink)}
.composer-stage.is-active{grid-row:2;min-height:0;overflow-y:auto;width:min(1180px,100%);margin:0 auto;padding:18px clamp(20px,4vw,52px) calc(28px + env(safe-area-inset-bottom));display:flex;flex-direction:column}
.composer-stage>.stage-heading{width:min(760px,100%);margin:0 auto 18px;text-align:center}
.composer-stage>.stage-heading .eyebrow{margin-bottom:6px}
.composer-stage>.stage-heading h3{margin:0;color:var(--ink);font-family:var(--serif);font-size:clamp(1.55rem,4vw,2.35rem);font-weight:500}
.composer-actions{position:static;flex:0 0 auto;width:min(720px,100%);margin:22px auto 0;padding:0;background:none}
.composer-actions .primary-button,.composer-actions .secondary-button{min-height:48px;border-radius:0}

.storage-fieldset{flex:1;min-height:0;margin:0;padding:0;border:0}
.storage-options{height:100%;min-height:310px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;overflow:visible;padding:0;scroll-snap-type:none}
.storage-option{width:100%;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;padding:10px 10px 12px;border-radius:0;background:var(--paper);scroll-snap-align:none}
.storage-option-image{height:auto;min-height:250px;border-radius:0;background:var(--paper)}
.storage-option-label{display:block;margin-top:10px;text-align:center}
.storage-option-label strong{font-size:.76rem;font-weight:500}
.storage-option-label::after{position:absolute;top:12px;right:12px;display:block}
.width-control{width:min(760px,100%);margin:20px auto 0;padding:0 6px;display:block;text-align:center}
.width-output{display:block;margin-bottom:7px;color:var(--ink);font-family:var(--serif);font-size:1.35rem}
.width-range{width:100%;height:30px;accent-color:var(--ink);cursor:ew-resize}
.width-range.is-stepping{filter:contrast(1.08)}
.width-range::-webkit-slider-thumb{transition:transform .08s ease}
.width-range.is-stepping::-webkit-slider-thumb{transform:scale(1.1)}

.binary-choice-grid{width:min(720px,100%);margin:8px auto 0}
.door-direction-section,.handle-section{width:min(720px,100%);margin:22px auto 0}
.choice-group-title{text-align:center;letter-spacing:.08em}
.door-direction-options,.handle-options{grid-template-columns:repeat(2,minmax(0,1fr))}
.door-direction-card,.wizard-choice{border-radius:0;background:transparent}
.handle-section .handle-options{display:grid;gap:10px}

.material-stage{overflow:hidden!important}
.material-lock-bar{width:min(900px,100%);margin:0 auto 14px;padding:11px 13px;border:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:14px}
.material-lock-copy{display:grid;gap:1px}
.material-lock-bar strong{color:var(--ink);font-size:.72rem;font-weight:500}
.material-lock-bar small{color:var(--muted);font-size:.61rem}
.material-lock-bar button{padding:7px 11px;border:1px solid var(--line);background:transparent;font-size:.66rem;cursor:pointer}
.material-lock-icon{display:none;position:relative;width:58px;height:62px;flex:0 0 auto}
.material-lock-icon::before{content:"";position:absolute;top:2px;left:50%;width:28px;height:29px;transform:translateX(-50%);border:2px solid var(--ink);border-bottom:0;border-radius:17px 17px 0 0}
.material-lock-icon::after{content:"";position:absolute;left:50%;bottom:2px;width:46px;height:34px;transform:translateX(-50%);border:2px solid var(--ink);background:var(--paper)}
.material-lock-icon i{position:absolute;z-index:1;left:50%;bottom:13px;width:5px;height:11px;transform:translateX(-50%);border-radius:4px;background:var(--ink)}
.material-selectors{width:min(900px,100%);margin:0 auto 12px;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.material-selectors label{display:grid;gap:5px;color:var(--muted);font-size:.62rem;letter-spacing:.06em}
.material-selectors select{width:100%;min-height:42px;padding:0 12px;border:1px solid var(--line);border-radius:0;background:var(--surface);color:var(--ink)}
.material-target-tabs{width:min(900px,100%);margin:0 auto 8px;display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line)}
.material-target-tabs button{padding:10px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted);font-size:.72rem;cursor:pointer}
.material-target-tabs button.is-active{border-bottom-color:var(--ink);color:var(--ink)}
.material-status{width:min(900px,100%);margin:0 auto 8px;color:var(--muted);font-size:.64rem;text-align:right}
.material-choice-grid{flex:1;min-height:0;width:min(900px,100%);margin:0 auto;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;overflow-y:auto;padding:2px 4px 14px 2px;scrollbar-width:thin;scrollbar-color:var(--brand) var(--surface-2)}
.material-choice{min-width:0;padding:6px;border:1px solid var(--line);background:var(--paper);cursor:pointer;text-align:left;transition:border-color .18s ease,transform .18s ease}
.material-choice:hover{border-color:var(--ink);transform:translateY(-2px)}
.material-choice.is-selected{border-color:var(--ink);box-shadow:0 0 0 2px var(--ink)}
.material-choice:disabled{cursor:default;opacity:.72;transform:none}
.material-choice img{display:block;width:100%;aspect-ratio:7/17;object-fit:cover;background:var(--surface-2)}
.material-choice>span{display:grid;gap:2px;padding:7px 2px 2px}
.material-choice small{overflow:hidden;color:var(--muted);font-size:.54rem;text-overflow:ellipsis;white-space:nowrap}
.material-choice strong{overflow:hidden;color:var(--ink);font-size:.65rem;font-weight:500;text-overflow:ellipsis;white-space:nowrap}

.confirmation-materials{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.confirmation-material{min-height:108px;padding:0;border:1px solid var(--line);display:grid;grid-template-columns:72px 1fr;background:var(--paper);color:inherit;font:inherit;text-align:left;cursor:pointer;transition:border-color .18s ease,background .18s ease}
.confirmation-material:hover,.confirmation-material:focus-visible{border-color:var(--ink);background:var(--surface);outline:0}
.confirmation-material img{width:72px;height:108px;object-fit:cover}
.confirmation-material>span{display:flex;flex-direction:column;justify-content:center;padding:12px}
.confirmation-material small{color:var(--muted);font-size:.6rem}
.confirmation-material strong{color:var(--ink);font-size:.78rem;font-weight:500}
.material-adjust-dialog .dialog-card{text-align:center}
.material-adjust-dialog .dialog-card>p:not(.eyebrow){margin-bottom:20px}

@media(max-width:720px){
  .planner-breadcrumb{position:static;transform:none;margin-right:auto;margin-left:14px;font-size:.62rem}
  .header-actions{gap:9px}
  .composer-progress{width:calc(100% - 78px);padding:13px 0 8px}
  .composer-progress small{font-size:.5rem}
  .composer-close{top:9px;right:9px;width:36px;height:36px}
  .composer-stage.is-active{padding:10px 14px calc(18px + env(safe-area-inset-bottom))}
  .storage-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-height:0}
  .storage-option{padding:7px}
  .storage-option-image{min-height:clamp(180px,28dvh,280px)}
  .width-control{margin-top:13px}
  .width-output{font-size:1.1rem}
  .material-stage{overflow-y:auto!important}
  .material-choice-grid{flex:0 0 auto;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}
  .material-selectors{grid-template-columns:1fr 1fr}
  .material-lock-bar{align-items:flex-start}
  .confirmation-materials{grid-template-columns:1fr 1fr}
  .composer-summary{margin-bottom:8px}
}

@media(max-width:390px){
  .storage-option-image{min-height:155px}
  .composer-progress li:nth-child(3) small{letter-spacing:0}
  .material-selectors{grid-template-columns:1fr}
  .confirmation-materials{grid-template-columns:1fr}
}

/* Planner v8.1 — mobile-first guided selection */
.composer-stage.is-active{padding-bottom:calc(104px + env(safe-area-inset-bottom))}
.composer-actions{position:fixed;z-index:20;left:0;right:0;bottom:0;width:100%;max-width:none;margin:0;padding:12px max(16px,calc((100vw - 720px)/2)) calc(12px + env(safe-area-inset-bottom));background:rgba(248,244,241,.96);border-top:1px solid var(--line);backdrop-filter:blur(14px)}
.composer-actions-split{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)}

.material-guide{width:min(900px,100%);margin:0 auto 10px;display:flex;align-items:center;justify-content:center;gap:0;color:var(--muted)}
.material-guide span{position:relative;display:flex;align-items:center;gap:7px;padding:0 24px;font-size:.65rem}
.material-guide span+span::before{content:"";position:absolute;left:-14px;width:28px;height:1px;background:var(--line)}
.material-guide b{width:26px;height:26px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;font-size:.55rem;font-weight:500}
.material-guide span.is-active{color:var(--ink)}
.material-guide span.is-active b{border-color:var(--ink);background:var(--ink);color:#fff}
.material-guide span.is-complete b{border-color:var(--ink);color:var(--ink)}
.material-guide-heading{width:min(900px,100%);margin:0 auto 8px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.material-guide-title{margin:0;color:var(--ink);font-family:var(--serif);font-size:1rem}
.material-back-body{padding:5px 0;border:0;background:transparent;color:var(--muted);font-size:.62rem;cursor:pointer}
.material-selected-body{width:min(900px,100%);margin:0 auto 10px;padding:6px;border:1px solid var(--line);display:grid;grid-template-columns:42px 1fr;background:var(--surface)}
.material-selected-body img{width:42px;height:54px;object-fit:cover}
.material-selected-body>span{display:flex;flex-direction:column;justify-content:center;padding:0 9px}
.material-selected-body small{color:var(--muted);font-size:.56rem}
.material-selected-body strong{color:var(--ink);font-size:.68rem;font-weight:500}
.material-choice-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.material-choice img{height:clamp(210px,52vw,300px);aspect-ratio:auto;object-fit:cover}

.confirmation-layout{flex:1;min-height:0;width:min(960px,100%);margin:12px auto 0;display:grid;grid-template-columns:minmax(220px,.78fr) minmax(0,1.22fr);gap:18px}
.confirmation-layout .wizard-preview{min-height:0;height:100%;margin:0;padding:20px;border-radius:0}
.confirmation-layout .wizard-preview.is-final .wizard-module-preview{height:min(58dvh,520px)}
.confirmation-info{min-width:0;overflow-y:auto;padding-right:4px}
.confirmation-info .composer-summary{margin:0;border-radius:0}
.confirmation-info .confirmation-materials{margin-top:10px}

.module-row-materials{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.module-row-material{min-width:0;display:grid;grid-template-columns:30px minmax(0,1fr);align-items:center;border:1px solid var(--line);background:var(--paper)}
.module-row-material img{width:30px;height:38px;object-fit:cover}
.module-row-material>span{min-width:0;display:grid;padding:3px 7px}
.module-row-material small{color:var(--muted);font-size:.49rem}
.module-row-material strong{overflow:hidden;color:var(--ink);font-size:.55rem;font-weight:500;text-overflow:ellipsis;white-space:nowrap}

@media(max-width:720px){
  .composer-stage.is-active{padding:8px 0 calc(96px + env(safe-area-inset-bottom))}
  .composer-stage>.stage-heading{padding:0 14px;margin-bottom:10px}
  .composer-actions{padding-inline:12px}
  .composer-actions .primary-button,.composer-actions .secondary-button{min-height:50px}

  .composer-stage[data-composer-stage="1"] .storage-fieldset{flex:0 0 auto;width:100%;overflow:visible}
  .composer-stage[data-composer-stage="1"] .storage-options{height:auto;min-height:calc(100dvh - 250px);display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;padding:0 14px 8px;scroll-snap-type:x mandatory;scroll-padding-inline:14px;scrollbar-width:none}
  .composer-stage[data-composer-stage="1"] .storage-options::-webkit-scrollbar{display:none}
  .composer-stage[data-composer-stage="1"] .storage-option{flex:0 0 calc(100vw - 28px);width:calc(100vw - 28px);min-height:calc(100dvh - 250px);padding:8px 8px 10px;scroll-snap-align:center;scroll-snap-stop:always}
  .composer-stage[data-composer-stage="1"] .storage-option-image{min-height:calc(100dvh - 310px)}
  .composer-stage[data-composer-stage="1"] .storage-option-label{position:relative;z-index:2;min-height:30px;margin-top:10px;padding-bottom:5px;overflow:visible;line-height:1.4}
  .composer-stage[data-composer-stage="1"] .storage-option-label strong{overflow:visible;line-height:1.4;white-space:normal}
  .composer-stage[data-composer-stage="1"] .width-control{margin:26px auto 0;padding:0 18px}
  .composer-stage[data-composer-stage="1"] .width-output{margin-bottom:2px;font-size:1rem}

  .material-stage{overflow:hidden!important;padding-inline:14px!important}
  .material-selectors{grid-template-columns:1fr 1fr;margin-bottom:8px}
  .material-guide{margin-bottom:8px}
  .material-guide-heading{margin-bottom:6px}
  .material-status{margin-bottom:5px}
  .material-choice-grid{flex:1;min-height:0;grid-template-columns:repeat(2,minmax(0,1fr));overflow-y:auto;gap:8px;padding-bottom:12px}
  .material-choice img{height:clamp(210px,52vw,280px);aspect-ratio:auto}
  .material-choice>span{padding-top:5px}

  .confirmation-layout{margin-top:4px;padding:0 10px;grid-template-columns:minmax(118px,.72fr) minmax(0,1.28fr);gap:8px}
  .confirmation-layout .wizard-preview{padding:8px}
  .confirmation-layout .wizard-preview.is-final .wizard-module-preview{height:min(58dvh,460px)}
  .confirmation-info .composer-summary{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
  .confirmation-info .composer-summary dt,.confirmation-info .composer-summary dd{padding:7px 8px;font-size:.57rem}
  .confirmation-info .confirmation-materials{grid-template-columns:1fr;gap:6px}
  .confirmation-info .confirmation-material{min-height:64px;grid-template-columns:44px 1fr}
  .confirmation-info .confirmation-material img{width:44px;height:64px}
  .confirmation-info .confirmation-material>span{padding:7px}
  .confirmation-info .confirmation-material small{font-size:.5rem}
  .confirmation-info .confirmation-material strong{font-size:.6rem}
  .module-row-material{max-width:100%}
}

@media(max-width:390px){
  .composer-stage[data-composer-stage="1"] .storage-options,.composer-stage[data-composer-stage="1"] .storage-option{min-height:calc(100dvh - 240px)}
  .composer-stage[data-composer-stage="1"] .storage-option-image{min-height:calc(100dvh - 300px)}
  .material-selectors{grid-template-columns:1fr}
  .confirmation-layout{grid-template-columns:minmax(105px,.68fr) minmax(0,1.32fr)}
}

/* Planner v8.2 — deliberate selection and compact planning header */
.plan-scrollbar{display:none!important}
.plan-viewport,.plan-module-select{touch-action:pan-x pan-y}
.builder-view .plan-canvas>.plan-module{height:var(--plan-module-zoom-height,64dvh)}
.storage-carousel{position:relative;height:100%;min-height:0}
.storage-arrow{display:none}
.material-back-body{display:none!important}
.material-lock-bar{transition:border-color .2s ease,background .2s ease}
.material-lock-bar.is-locked{flex:1;min-height:clamp(260px,45dvh,430px);margin-top:8px;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:rgba(254,252,250,.72)}
.material-lock-bar.is-locked .material-lock-icon{display:block}
.material-lock-bar.is-locked .material-lock-copy{gap:5px}
.material-lock-bar.is-locked strong{font-family:var(--serif);font-size:1.05rem}
.material-lock-bar.is-locked button{min-width:148px;margin-top:22px;padding:11px 16px;border-color:var(--ink);background:var(--ink);color:#fff}
.material-lock-bar.is-unlocked{border-color:var(--ink);background:rgba(90,80,70,.06)}
.material-lock-bar.is-unlocked button{border-color:var(--ink);background:var(--ink);color:#fff}
.confirmation-layout{grid-template-columns:minmax(270px,1.08fr) minmax(0,.92fr)}
.confirmation-layout .wizard-preview{display:flex;align-items:center;justify-content:center}
.confirmation-layout .wizard-preview.is-final .wizard-module-preview{width:min(76%,290px);height:min(58dvh,520px);aspect-ratio:auto}

@media(max-width:720px){
  .app-header-inner{padding-inline:10px}
  .brand img{height:34px}
  .planner-breadcrumb{min-width:0;margin-left:8px;gap:5px;font-size:.55rem;letter-spacing:.025em}
  .planner-breadcrumb span{white-space:nowrap}
  .header-actions{gap:5px}
  .header-actions .text-button{font-size:.6rem}
  .plan-panel{padding-top:0}
  .plan-viewport{margin-top:0}

  .composer-stage[data-composer-stage="1"] .storage-carousel{height:auto;min-height:calc(100dvh - 250px)}
  .storage-arrow{position:absolute;z-index:8;top:50%;display:grid;width:44px;height:44px;margin:0;padding:0;place-items:center;transform:translateY(-50%);border:1px solid rgba(255,255,255,.55);border-radius:50%;background:rgba(38,34,30,.62);color:#fff;font-size:1.75rem;line-height:1;box-shadow:0 8px 22px rgba(0,0,0,.16);backdrop-filter:blur(8px);cursor:pointer}
  .storage-arrow-prev{left:24px}
  .storage-arrow-next{right:24px}
  .storage-arrow:disabled{opacity:.24;cursor:default}

  .material-lock-bar.is-locked{min-height:calc(100dvh - 310px);margin-inline:0}
  .confirmation-layout{grid-template-columns:minmax(150px,1.18fr) minmax(0,.82fr);gap:7px}
  .confirmation-layout .wizard-preview.is-final .wizard-module-preview{width:min(86%,250px);height:min(58dvh,460px)}
  .confirmation-info .composer-summary{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
}

@media(max-width:390px){
  .planner-breadcrumb{font-size:.51rem}
  .confirmation-layout{grid-template-columns:minmax(132px,1.15fr) minmax(0,.85fr)}
}

/* Planner v8.2.2 — edge-aligned previews and simplified totals */
.storage-option,.storage-option:hover,.storage-option.is-selected{border:0!important;background:transparent!important;box-shadow:none!important;transform:none}
.storage-option-image{background:transparent!important}
.confirmation-layout{align-items:start}
.confirmation-layout .wizard-preview{align-self:start;height:auto!important;min-height:0!important;margin:0!important;padding:0!important;align-items:flex-start!important;border:0!important;background:transparent!important;box-shadow:none!important;overflow:visible}
.confirmation-layout .wizard-preview.is-final .wizard-module-preview{margin:0 auto}
.builder-total-width strong{font-family:var(--serif);font-size:1.12rem;font-weight:500;letter-spacing:.02em}

@media(max-width:720px){
  .builder-total-width strong{font-size:1rem}
  .plan-viewport{min-height:clamp(570px,calc(100dvh - 170px),760px)}
  .plan-canvas{min-height:clamp(558px,calc(100dvh - 182px),748px);padding:20px 22px 50px}
  .module-details-panel{padding-top:28px}
}

/* Planner v8.3.1 — confirmation preview follows the selected cabinet width */
.confirmation-layout .wizard-preview.is-final .wizard-module-preview{width:auto!important;max-width:100%;aspect-ratio:var(--module-width)/250!important}

/* Planner v8.4 — gesture-only zoom and unified cabinet actions */
.builder-footer{justify-content:flex-end}
.module-details-panel{margin-top:32px;padding-bottom:calc(112px + env(safe-area-inset-bottom))}
.module-list-title strong{font-size:.95rem}
.plan-module-select[aria-expanded="true"]{outline:2px solid rgba(90,80,70,.72);outline-offset:3px}
.module-action-menu{top:18px;left:0;min-width:126px;transform:none}
.module-action-menu .module-action-edit{color:var(--ink)}

/* Planner v8.5 — dedicated cabinet browsing area with fixed list controls */
.builder-view .plan-viewport{height:80dvh;min-height:80dvh;max-height:80dvh}
.builder-view .plan-canvas{height:100%;min-height:100%}
.builder-footer{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:10px;padding:8px 12px calc(8px + env(safe-area-inset-bottom))}
.builder-footer .module-details-panel{grid-column:1;min-width:0;margin:0;padding:0}
.builder-footer .module-list-wrap{min-width:0;background:rgba(248,244,241,.96)}
.builder-footer .module-list-title{min-height:52px;padding:8px 12px}
.builder-footer .module-list-title strong{overflow:visible;font-size:.78rem;line-height:1.35;text-overflow:clip;white-space:normal}
.builder-footer .module-list-title small{font-size:.54rem}
.builder-footer .module-list-help{font-size:.58rem;white-space:nowrap}
.builder-footer .finish-button{grid-column:2;min-height:52px;align-self:end}
.builder-footer .module-list-wrap[open] .module-list{max-height:min(42dvh,420px);overflow-y:auto}
.builder-footer>.plan-reorder-bar{grid-column:1/-1;width:100%;margin:0;justify-content:flex-end;background:rgba(241,236,231,.98);box-shadow:0 -8px 24px rgba(70,62,54,.08)}

@media(max-width:720px){
  .builder-footer{grid-template-columns:minmax(0,1fr) minmax(108px,30vw);gap:8px;padding-inline:8px}
  .builder-footer .module-list-title{gap:7px;padding-inline:10px}
  .builder-footer .module-list-title strong{font-size:.7rem}
  .builder-footer .footer-summary-actions{gap:7px}
  .builder-footer .footer-dimension-toggle{gap:4px;font-size:.54rem}
  .builder-footer .footer-dimension-toggle input{width:13px;height:13px}
  .builder-footer .module-list-help{font-size:.52rem}
  .builder-footer .module-list-help::after{width:22px;height:22px}
  .builder-footer .finish-button{width:100%;max-width:none;padding-inline:9px}
  .builder-footer .module-list-wrap[open]{position:fixed;z-index:90;left:8px;right:8px;bottom:calc(70px + env(safe-area-inset-bottom));max-height:52dvh;overflow:auto;box-shadow:0 -14px 38px rgba(70,62,54,.16)}
}

/* Planner v8.6 — cabinets start at 80% of the browsing area and zoom by gesture */
.builder-view .plan-viewport{overscroll-behavior:contain}
.builder-view .plan-canvas{align-items:flex-end}

/* Planner v8.7 — deliberate list editing and pannable 50–200% canvas */
.builder-view .plan-viewport{overflow:auto;border-block:0;cursor:grab;scrollbar-width:none}
.builder-view .plan-viewport::after{display:none}
.builder-view .plan-viewport::-webkit-scrollbar{display:none}
.builder-view .plan-viewport.is-panning{cursor:grabbing;user-select:none}
.builder-view .plan-canvas{height:auto;min-height:100%}
.builder-view .plan-module-select{touch-action:none}

/* Planner v9.3 — one material scroller with fixed bottom controls */
.composer-stage.material-stage.is-active{display:block;min-height:0;overflow-x:hidden!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;animation:none!important;transform:none!important}
.composer-stage.material-stage .material-choice-grid{display:grid;flex:none!important;height:auto!important;max-height:none!important;min-height:unset!important;overflow:visible!important}
.composer-stage.material-stage .stage-heading,
.composer-stage.material-stage .material-selectors,
.composer-stage.material-stage .material-guide,
.composer-stage.material-stage .material-guide-heading,
.composer-stage.material-stage .material-status,
.composer-stage.material-stage .material-lock-bar,
.composer-stage.material-stage .material-selected-body{position:static!important;inset:auto!important}
.composer-stage.material-stage .composer-actions{position:fixed!important;z-index:30!important;left:0!important;right:0!important;bottom:0!important;width:100%!important;max-width:none!important;margin:0!important;padding:12px max(16px,calc((100vw - 720px)/2)) calc(12px + env(safe-area-inset-bottom))!important;background:rgba(248,244,241,.97)!important;border-top:1px solid var(--line)!important;backdrop-filter:blur(14px)}
.builder-footer{background:var(--paper);border-top:0;backdrop-filter:none}
.material-scroll-top{position:fixed;z-index:19;right:18px;bottom:calc(82px + env(safe-area-inset-bottom));width:42px;height:42px;padding:0;border:1px solid rgba(90,80,70,.35);border-radius:50%;display:grid;place-items:center;background:rgba(248,244,241,.92);color:var(--ink);font-size:1.15rem;line-height:1;box-shadow:0 8px 24px rgba(70,62,54,.15);backdrop-filter:blur(10px);cursor:pointer}
.material-scroll-top:hover,.material-scroll-top:focus-visible{border-color:var(--ink);outline:0}

@media(max-width:720px){
  .composer-stage.material-stage .composer-actions{padding-inline:12px!important}
  .material-scroll-top{right:12px;bottom:calc(78px + env(safe-area-inset-bottom));width:40px;height:40px}
}

/* Planner v9.7 — single-scrollbar responsive desktop workspace */
@media(min-width:721px){
  body.is-builder-view{height:100dvh;overflow:hidden}
  body.is-builder-view #mainContent{height:calc(100dvh - var(--app-header-height));overflow:hidden}
  body.is-builder-view .builder-view.is-active{height:100%;min-height:0;padding-bottom:76px;overflow:hidden}
  .builder-view .builder-layout{width:100%;max-width:none;height:100%;min-height:0}
  .builder-view .plan-panel{height:100%;min-height:0;padding:0 36px}
  .builder-view .plan-viewport{height:100%;min-height:0;max-height:none;margin:0 -36px;overflow:hidden}
  .builder-view .plan-canvas{height:100%;min-height:100%;justify-content:center;padding:clamp(46px,6dvh,72px) clamp(52px,5vw,84px) 60px}
}

/* Planner v9.7.5 — keep the mobile storage label, slider and action visible */
@media(max-width:720px){
  .composer-stage[data-composer-stage="1"].is-active{overflow:hidden}
  .composer-stage[data-composer-stage="1"] .storage-fieldset{flex:1 1 auto;min-height:0;overflow:hidden}
  .composer-stage[data-composer-stage="1"] .storage-carousel,
  .composer-stage[data-composer-stage="1"] .storage-options,
  .composer-stage[data-composer-stage="1"] .storage-option{height:100%;min-height:0}
  .composer-stage[data-composer-stage="1"] .storage-carousel{overflow:hidden}
  .composer-stage[data-composer-stage="1"] .storage-options{overflow-x:auto;overflow-y:hidden}
  .composer-stage[data-composer-stage="1"] .storage-option{grid-template-rows:minmax(0,1fr) auto}
  .composer-stage[data-composer-stage="1"] .storage-option-image{height:100%;min-height:0}
  .composer-stage[data-composer-stage="1"] .width-control{flex:0 0 auto;margin:12px auto 0;padding:0 18px 8px}
  .composer-stage[data-composer-stage="1"] .width-output{margin-bottom:4px}
}

/* Planner v9.7.6 — selection marker follows the storage label on every device */
.composer-stage[data-composer-stage="1"] .storage-option-label{
  display:flex!important;
  min-height:44px;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  text-align:center!important;
}
.composer-stage[data-composer-stage="1"] .storage-option-label strong,
.composer-stage[data-composer-stage="1"] .storage-option-label small{
  width:100%;
  text-align:center;
}
.composer-stage[data-composer-stage="1"] .storage-option-label::after{
  position:static!important;
  inset:auto!important;
  display:block!important;
  flex:0 0 16px;
  margin:7px auto 0;
  box-sizing:border-box;
}
/* Live cabinet workspace: a stable preview beside/before the controls. */
.composer-sheet.has-live-preview{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
.has-live-preview>.composer-progress{grid-column:1/-1}
.composer-live-preview{grid-column:1;grid-row:2;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px 36px 90px;background:#f0ebe4;border-right:1px solid var(--line);overflow:hidden}
.composer-live-preview[hidden]{display:none}
.composer-live-preview>p{margin:0;text-align:center;color:var(--ink);font-size:14px;line-height:1.7}
.composer-live-preview>small{font-size:11px;color:var(--muted)}
#livePreviewCabinet{flex:1;min-height:0;width:100%;display:flex;align-items:center;justify-content:center;padding:14px}
#livePreviewCabinet .wizard-module-preview{height:100%;max-height:580px;width:auto;max-width:90%;aspect-ratio:var(--module-width)/250;filter:drop-shadow(0 10px 18px #514b4218)}
#livePreviewCabinet .has-door-material-preview{background-size:100% 100%}
#livePreviewCabinet .has-door-material-preview>.module-cabinet-shell{visibility:hidden}
#livePreviewCabinet .has-door-material-preview>.module-door-overlay{mix-blend-mode:multiply}
.has-live-preview>.composer-stage.is-active{grid-column:2;grid-row:2;display:block;min-height:0;overflow-y:auto!important;padding:28px 32px 100px}
.has-live-preview .composer-stage>.stage-heading{text-align:left;margin-bottom:22px}
.has-live-preview .stage-heading h3{font-size:26px}
.has-live-preview .binary-choice-grid,.has-live-preview .door-direction-section,.has-live-preview .handle-section{width:100%;margin:18px 0}
.has-live-preview .wizard-choice,.has-live-preview .door-direction-card{min-height:76px;padding:14px}
.has-live-preview .choice-group-title{text-align:left;font-size:14px}
.has-live-preview .material-selectors{width:100%;margin-inline:0}
.has-live-preview .material-choice-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.has-live-preview .material-choice img{width:100%;height:auto;aspect-ratio:1;object-fit:cover}
.has-live-preview .material-choice strong{font-size:13px}
.has-live-preview .material-choice small{font-size:11px}
.has-live-preview .material-lock-bar.is-locked{min-height:0}
.has-live-preview .composer-stage .composer-actions{position:fixed!important;left:50%!important;right:0!important;bottom:0!important;width:50%!important;max-width:none!important;margin:0!important;padding:14px 32px calc(14px + env(safe-area-inset-bottom))!important;background:var(--paper)!important;border-top:1px solid var(--line);z-index:30}
@media(max-width:720px){
 .composer-sheet.has-live-preview{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(180px,32svh) minmax(0,1fr)}
 .composer-live-preview{grid-column:1;grid-row:2;padding:8px 20px 10px;gap:4px;border-right:0;border-bottom:1px solid var(--line)}
 .composer-live-preview>p{font-size:12px}
 .composer-live-preview>small{font-size:10px}
 #livePreviewCabinet{padding:4px 10px}
 .has-live-preview>.composer-stage.is-active{grid-column:1;grid-row:3;padding:20px 18px 90px}
 .has-live-preview .stage-heading .eyebrow{display:none}
 .has-live-preview .stage-heading h3{font-size:22px}
 .has-live-preview .composer-stage>.stage-heading{margin-bottom:14px}
 .has-live-preview .material-choice-grid{gap:10px}
 .has-live-preview .composer-stage .composer-actions{left:0!important;width:100%!important;padding:12px 14px calc(12px + env(safe-area-inset-bottom))!important}
}
@media(max-width:720px) and (max-height:620px){
 .composer-sheet.has-live-preview{grid-template-rows:auto minmax(130px,29svh) minmax(0,1fr)}
 .composer-live-preview>small{display:none}
}
@media(prefers-reduced-motion:no-preference){#livePreviewCabinet .module-door-overlay{animation:preview-door-in .35s ease-out}}
@keyframes preview-door-in{from{opacity:.3;transform:scaleX(.94)}to{opacity:1;transform:scaleX(1)}}
/* Material workspace: filters span both columns, samples scroll independently. */
.material-toolbar{grid-column:1/-1;grid-row:2;width:100%;padding:10px 24px 14px;border-bottom:1px solid var(--line);background:var(--paper)}
.material-toolbar[hidden]{display:none}
.material-toolbar .material-selectors{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%;max-width:800px;margin:0 auto 10px!important}
.material-toolbar .material-selectors label{min-width:0}
.material-toolbar select{width:100%;min-width:0}
.material-quick-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.material-quick-filters button{min-height:36px;padding:6px 13px;border:1px solid var(--line);background:transparent;color:var(--ink);font:inherit;font-size:13px;border-radius:2px;cursor:pointer}
.material-quick-filters button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.composer-sheet.is-material-workspace{grid-template-rows:auto auto minmax(0,1fr)}
.is-material-workspace>.composer-live-preview,.is-material-workspace>.composer-stage.is-active{grid-row:3}
#livePreviewCabinet .has-door-material-preview>.module-cabinet-shell{visibility:visible}
#livePreviewCabinet .has-door-material-preview>.module-door-overlay{z-index:4;opacity:.48;mix-blend-mode:multiply}
@media(max-width:720px){
 .composer-sheet.is-material-workspace{grid-template-columns:minmax(0,40%) minmax(0,60%);grid-template-rows:auto auto minmax(0,1fr)}
 .is-material-workspace>.composer-live-preview{grid-column:1;grid-row:3;padding:10px 8px 88px;border-right:1px solid var(--line);border-bottom:0;gap:8px}
 .is-material-workspace>.composer-stage.is-active{grid-column:2;grid-row:3;padding:12px 10px 90px}
 .is-material-workspace #livePreviewCabinet{padding:2px;width:100%}
 .is-material-workspace #livePreviewCabinet .wizard-module-preview{height:min(52svh,500px);max-width:100%}
 .is-material-workspace #livePreviewTitle{font-size:12px}
 .is-material-workspace #livePreviewCaption{font-size:11px;line-height:1.6;overflow-wrap:anywhere}
 .is-material-workspace .composer-live-preview>small{display:block;font-size:10px;text-align:center;line-height:1.6}
 .is-material-workspace .material-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 8px}
 .is-material-workspace .material-choice img{aspect-ratio:1;height:auto}
 .is-material-workspace .material-choice strong{font-size:12px;white-space:normal}
 .is-material-workspace .material-choice small{font-size:10px;overflow-wrap:anywhere}
 .is-material-workspace .stage-heading,.is-material-workspace .material-selected-body{display:none!important}
 .is-material-workspace .material-guide-title{font-size:12px}
 .is-material-workspace .material-guide{gap:10px;margin-bottom:10px}
 .is-material-workspace .material-status{font-size:11px;line-height:1.6}
 .material-toolbar{padding:8px 12px 10px}
 .material-toolbar .material-selectors{gap:10px;margin-bottom:8px!important}
 .material-toolbar .material-selectors span{font-size:11px}
 .material-toolbar select{height:36px;padding:5px 8px;font-size:13px}
 .material-quick-filters{flex-wrap:nowrap;justify-content:flex-start;gap:6px;overflow-x:auto}
 .material-quick-filters button{flex:none;font-size:12px;padding:6px 11px}
 .is-material-workspace .material-lock-bar{display:block;padding:10px;font-size:12px}
}
/* One fixed action bar, outside the scrolling step panels. */
.composer-sheet{padding-bottom:calc(82px + env(safe-area-inset-bottom))!important;transform:none!important;animation:none!important}
.composer-action-bar{position:absolute;z-index:150;left:0;right:0;bottom:0;min-height:76px;background:var(--paper);border-top:1px solid var(--line);padding:12px 20px calc(12px + env(safe-area-inset-bottom))}
.composer-action-bar .composer-actions{position:static!important;width:min(720px,100%)!important;max-width:none!important;margin:0 auto!important;padding:0!important;background:none!important;border:0!important}
.composer-action-bar .composer-actions[hidden]{display:none!important}
.has-live-preview .composer-action-bar{left:50%}
.composer-stage.is-active{padding-bottom:24px}
.composer-live-preview{padding-bottom:24px}
#livePreviewTitle{display:none!important}
#livePreviewCabinet{align-items:flex-end}
.module-cabinet-shell>.cabinet-back-panel.has-material-preview{filter:none}
.live-door-material{position:absolute;inset:0;z-index:3;background-size:100% 100%;background-color:#a89a86;opacity:.6;pointer-events:none;border:1px solid #7d7366}
.has-door-material-preview>.module-door-overlay{z-index:4;opacity:.5;mix-blend-mode:multiply}
.door-direction-guide{position:absolute;inset:0;z-index:7;width:100%;height:100%;pointer-events:none}
.door-direction-guide path{fill:none;stroke:#fff;stroke-width:1;stroke-dasharray:3 2;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 1px #544a4066)}
.has-door>.module-door-overlay{visibility:hidden}
.live-door-material,#livePreviewCabinet .live-door-material{bottom:var(--door-toe-height,4%)}
.door-direction-guide{height:calc(100% - var(--door-toe-height,4%))}
.door-direction-guide .door-center-seam{stroke:#7d7366;stroke-dasharray:none;filter:none}
.door-handle-layer{position:absolute;inset:0;z-index:8;display:block;width:100%;height:100%;opacity:1;pointer-events:none;overflow:visible}
#livePreviewCaption{min-height:3.4em}
html:has(body.has-composer){overflow:hidden}
.storage-option-image{align-items:flex-end!important}
.storage-option-image .module-cabinet-shell{height:calc(100% * var(--module-height,250) / 250);aspect-ratio:var(--module-width)/var(--module-height,250)}
.wizard-module-preview,.confirmation-layout .wizard-preview.is-final .wizard-module-preview{aspect-ratio:var(--module-width)/var(--module-height,250)!important}
#livePreviewCabinet .wizard-module-preview{height:calc(100% * var(--height-ratio,1));max-height:calc(580px * var(--height-ratio,1))}
.plan-module{aspect-ratio:var(--module-width)/var(--module-height,250)}
.builder-view .plan-canvas>.plan-module{height:calc(var(--plan-module-zoom-height,64dvh) * var(--height-ratio,1))}
.size-controls{display:grid!important;grid-template-columns:minmax(0,1fr);gap:4px;flex:0 0 auto!important;margin:12px auto!important;width:min(760px,100%)}
.size-control-row{display:grid;grid-template-columns:44px minmax(0,1fr) 66px;align-items:center;gap:14px;min-height:44px}
.size-control-row label{display:block;text-align:left;font-size:13px;line-height:1.5}
.size-control-row output{font-family:var(--serif);font-size:15px;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.size-control-row .width-range{grid-column:2;grid-row:1;margin:0;min-width:0}
@media(max-width:720px){
 .composer-sheet.has-live-preview{grid-template-columns:minmax(0,40%) minmax(0,60%);grid-template-rows:auto minmax(0,1fr)}
 .composer-sheet.is-material-workspace{grid-template-rows:auto auto minmax(0,1fr)}
 .has-live-preview>.composer-live-preview{grid-column:1;grid-row:2;padding:12px 8px;gap:8px;border-right:1px solid var(--line);border-bottom:0}
 .has-live-preview>.composer-stage.is-active{grid-column:2;grid-row:2;padding:12px 10px 24px}
 .is-material-workspace>.composer-live-preview,.is-material-workspace>.composer-stage.is-active{grid-row:3}
 .has-live-preview .composer-action-bar{left:0;padding-inline:12px}
 .has-live-preview .wizard-choice,.has-live-preview .door-direction-card{padding:12px 8px;min-height:72px}
 .has-live-preview .binary-choice-grid,.has-live-preview .door-direction-options,.has-live-preview .handle-options{grid-template-columns:1fr;gap:8px}
 .has-live-preview .choice-group-title{font-size:13px}
 #livePreviewCabinet{padding:4px 2px;align-items:flex-end}
 #livePreviewCabinet .wizard-module-preview,.is-material-workspace #livePreviewCabinet .wizard-module-preview{height:calc(min(62svh,560px) * var(--height-ratio,1));max-width:100%}
 .size-controls{padding:0 16px!important;margin:8px auto!important;gap:2px}
 .size-control-row{grid-template-columns:36px minmax(0,1fr) 60px;gap:10px}
 .material-quick-filters{flex-wrap:wrap}
 .composer-action-bar .primary-button,.composer-action-bar .secondary-button{padding:10px 8px;font-size:12px;line-height:1.45}
}
/* Fit the entire cabinet into the remaining preview area, including short phones. */
#livePreviewCabinet{container-type:size}
#livePreviewCabinet .wizard-module-preview,.is-material-workspace #livePreviewCabinet .wizard-module-preview{
 height:min(calc(100cqh * var(--height-ratio,1)),calc(100cqw * var(--module-height,250) / var(--module-width,50)),calc(580px * var(--height-ratio,1)));
 max-height:100%;max-width:100%;width:auto;
}
.confirmation-layout .wizard-preview.is-final .wizard-module-preview{
 width:min(100%,calc(min(58dvh,520px) * var(--module-width,50) / var(--module-height,250)))!important;
 height:auto!important;
}

/* A quiet illustrated entrance. The character lives only in the category view. */
.category-view{padding:46px 24px 54px;background:radial-gradient(ellipse at 80% 22%,#e9e1d54a,transparent 54%),var(--paper)}
.category-inner{width:min(1080px,100%)}
.category-intro{margin-bottom:30px}
.category-intro .eyebrow{letter-spacing:.2em;font-size:11px}
.category-intro h1{font-size:clamp(34px,4vw,48px);line-height:1.4;letter-spacing:.035em;margin:0 0 14px}
.category-intro .lead{font-size:14px;line-height:1.9;margin:0;color:var(--muted)}
.category-grid{grid-template-columns:minmax(0,1.8fr) minmax(0,1fr);gap:16px}
.category-card{border-radius:8px}
.category-card-primary{grid-row:1/3;min-height:352px;padding:28px;background:#fdfbf7!important;border-color:#d7cdc0!important;color:var(--ink);isolation:isolate}
.category-card-primary:hover{border-color:#a99881!important;box-shadow:0 14px 35px #786b5510;transform:translateY(-2px)}
.category-card-primary .category-number{position:relative;z-index:2;font-size:11px;letter-spacing:.15em;color:#8f7f6b;opacity:1}
.category-card-copy{position:relative;z-index:2;display:block;width:43%;margin:28px 0 22px}
.category-card-primary .category-name{display:block;margin:0 0 12px;color:var(--ink);font-size:36px;line-height:1.2}
.category-card-primary .category-description{display:block;color:#92836f;font-size:13px;line-height:1.9}
.category-card-primary .category-arrow{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;width:152px;margin-top:auto;padding:13px 17px;background:var(--brand);color:#fff;border-radius:3px;font-size:13px;font-weight:500}
.category-arrow>span{font-size:18px;transition:transform .2s ease}
.category-card-primary:hover .category-arrow>span{transform:translateX(3px)}
.category-art{position:absolute;z-index:1;right:28px;top:24px;width:250px;height:300px;pointer-events:none;mix-blend-mode:multiply}
.category-guide{position:absolute;right:-18px;bottom:0;display:block;width:204px;height:auto;max-width:none;mix-blend-mode:multiply;transform-origin:50% 90%}
.category-thought{position:absolute;left:0;top:0;display:flex;align-items:center;justify-content:center;width:120px;height:106px;padding:8px 8px 17px;border:1px solid #cebea9;border-radius:48% 52% 46% 54% / 51% 47% 53% 49%;background:#fdfbf7;color:#a79378}
.category-thought::before,.category-thought::after{content:'';position:absolute;border:1px solid #cebea9;border-radius:50%;background:#fdfbf7}
.category-thought::before{width:10px;height:8px;right:17px;bottom:-13px}
.category-thought::after{width:5px;height:5px;right:6px;bottom:-24px}
.category-thought-cabinet{display:block;width:61px;height:81px;overflow:visible}
.thought-clothes{fill:#ddd3c3;stroke:#b3a28b;stroke-width:.9}
.thought-box{fill:#e6ddcf;stroke:#b3a28b}
.category-thought-layout{opacity:0}
.category-thought-layout.thought-layout-a{opacity:1}
.category-thought-dots{position:absolute;left:0;bottom:8px;display:flex;justify-content:center;gap:5px;width:100%}
.category-thought-dots i{position:relative;width:3px;height:3px;border-radius:50%;background:#dfd5c8}
.category-thought-dots i::after{content:'';position:absolute;inset:0;border-radius:inherit;background:#9e8b72;opacity:0}
.category-thought-dots .thought-layout-a::after{opacity:1}
.category-grid>.is-disabled{min-height:168px;padding:24px;background:#fcfaf680;border-color:#e1d9cf;opacity:1}
.category-grid>.is-disabled .category-name{font-size:26px;margin-top:22px;margin-bottom:6px;color:#9b8f7f}
.category-grid>.is-disabled .category-description{font-size:12px;color:#a99e91}
.category-grid>.is-disabled .category-number{font-size:10px;color:#a29483}
.category-grid .coming-soon{top:24px;right:24px;font-size:10px;color:#ab9e8d}
.category-type-icon{position:absolute;right:24px;top:58px;width:65px;height:49px;color:#c6baaa}
.category-inner>.active-case-card{margin-bottom:18px;border-radius:6px}
@media(max-width:720px){
 .category-view{padding:28px 18px 36px}
 .category-intro{margin-bottom:24px}
 .category-intro h1{font-size:34px;line-height:1.4;margin-bottom:12px}
 .category-intro .lead{font-size:13px}
 .category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .category-card-primary{grid-column:1/-1;grid-row:auto;min-height:352px;padding:22px}
 .category-card-copy{margin:24px 0 18px;width:46%}
 .category-card-primary .category-name{font-size:32px}
 .category-card-primary .category-description{font-size:12px;line-height:1.8}
 .category-card-primary .category-arrow{width:100%;margin-top:auto;padding:12px 16px}
 .category-art{right:12px;top:42px;width:144px;height:228px}
 .category-guide{right:-4px;bottom:0;width:144px}
 .category-thought{width:112px;height:84px;padding:5px 8px 14px}
 .category-thought-cabinet{width:46px;height:61px}
 .category-thought::before{left:23px;right:auto;bottom:-11px;width:8px;height:6px}
 .category-thought::after{left:35px;right:auto;bottom:-20px;width:4px;height:4px}
 .category-thought-dots{bottom:6px}
 .category-grid>.is-disabled{min-height:154px;padding:16px 14px}
 .category-grid>.is-disabled .category-name{font-size:23px;margin-top:33px}
 .category-grid>.is-disabled .category-description{font-size:11px;line-height:1.7}
 .category-grid .coming-soon{right:14px;top:17px;font-size:9px}
 .category-type-icon{right:14px;top:43px;width:45px;height:34px}
}

@media(min-width:721px) and (max-width:960px){
 .category-art{right:18px;width:220px}
 .category-guide{right:-25px;width:188px}
 .category-thought{width:112px;height:100px}
}
@keyframes category-storage-thought{0%,27%{opacity:1}33.333%,93.667%{opacity:0}100%{opacity:1}}
@media(prefers-reduced-motion:no-preference){
 .category-view.is-active .category-thought-layout,.category-view.is-active .category-thought-dots i::after{animation:category-storage-thought 10.8s ease-in-out infinite}
 .category-view.is-active .thought-layout-b,.category-view.is-active .category-thought-dots .thought-layout-b::after{animation-delay:-7.2s}
 .category-view.is-active .thought-layout-c,.category-view.is-active .category-thought-dots .thought-layout-c::after{animation-delay:-3.6s}
 .category-card-primary:hover .category-thought-layout,.category-card-primary:focus-visible .category-thought-layout,.category-card-primary:hover .category-thought-dots i::after,.category-card-primary:focus-visible .category-thought-dots i::after{animation-play-state:paused}
}

/* Motion stays inside the controls; it never moves the fixed footer or the floor line. */
.live-door-material>.finish-previous{position:absolute;inset:0;background-size:100% 100%;background-repeat:no-repeat;pointer-events:none}
.finish-previous{pointer-events:none!important}
.finish-previous.is-fading{animation:finish-dissolve .24s ease-out both}
@keyframes finish-dissolve{from{opacity:1}to{opacity:0}}
@keyframes panel-soft-in{from{opacity:.4}to{opacity:1}}
@keyframes door-soft-in{from{opacity:0}to{opacity:.6}}
@keyframes category-guide-arrive{from{opacity:0;transform:translateY(7px) rotate(-3deg)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:no-preference){
 .category-view.is-active .category-guide{animation:category-guide-arrive .65s .12s ease-out both}
 .composer-stage.is-active,.composer-stage.material-stage.is-active{animation:panel-soft-in .22s ease-out both!important;transform:none!important}
 .composer-progress span{transition:background .22s ease,border-color .22s ease,color .22s ease,box-shadow .22s ease}
 .door-appearing{animation:door-soft-in .24s ease-out both}
 .material-choice{transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;transform:none}
 .material-choice.is-selected{box-shadow:inset 0 0 0 1px var(--ink)}
 .composer-action-bar button:active{transform:translateY(1px)}
}
@media(prefers-reduced-motion:reduce){
 .category-view .category-guide,.composer-stage.is-active,.finish-previous.is-fading,.door-appearing{animation:none!important}
 .category-card,.category-arrow>span,.composer-progress span{transition:none!important}
}

/* Handle choices show the difference between a raised pull and a recessed grip. */
.has-live-preview .handle-choice{display:grid;grid-template-columns:84px minmax(0,1fr);gap:16px;align-items:center;min-height:132px;padding:14px 16px;text-align:left;transform:none;transition:border-color .2s,box-shadow .2s,background .2s}
.handle-diagram{display:block;width:84px;height:98px;max-width:100%;pointer-events:none}
.handle-choice-copy{display:block;min-width:0}
.handle-choice .handle-choice-copy strong{display:block;margin:0;font-size:14px;line-height:1.5}
.handle-choice .handle-choice-copy small{display:block;margin:5px 0 0;font-size:11px;line-height:1.7}
@media(max-width:720px){
 .has-live-preview .handle-choice{grid-template-columns:60px minmax(0,1fr);gap:10px;min-height:94px;padding:11px 10px}
 .handle-diagram{width:60px;height:70px}
 .handle-choice .handle-choice-copy small{margin-top:3px}
}

/* Match the public pages: 1240px wrap, 24/44px inset, 40/44px brand mark. */
.app-header-inner{padding-inline:24px}
.app-header .brand{flex-shrink:0}
.app-header .brand img{height:40px;width:auto}
@media(min-width:760px){
  :root{--app-header-height:80px}
  .app-header-inner{padding-inline:44px}
  .app-header .brand img{height:44px}
}


/* Free combination entry; wardrobe layout is shared. */
.category-card-custom{min-height:168px;padding:24px;text-decoration:none;background:#fcfaf6;border-color:#d7cdc0}
.category-card-custom .category-name{font-size:26px;margin-top:22px;margin-bottom:6px}
.category-card-custom .category-description{font-size:12px}
.category-card-custom .coming-soon{color:var(--brand)}
@media(max-width:720px){.category-card-custom{min-height:154px;padding:16px 14px}.category-card-custom .category-name{font-size:23px;margin-top:33px}.category-card-custom .category-description{font-size:11px}}
