*{box-sizing:border-box}body{margin:0;color:#202b27;background:#fff;font:14px/1.5 var(--sans)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;background:white;border:1px solid #dcded9;border-radius:8px;min-height:44px;padding:10px 14px;transition:background .15s}button:hover{background:#eef1ed}button:focus-visible,a:focus-visible{outline:3px solid #997032;outline-offset:4px}header{height:88px;border-bottom:1px solid #e5e6e1;display:flex;align-items:center;justify-content:space-between;padding:0 36px;gap:20px}.brand{font:30px var(--serif);text-decoration:none;color:#243e33}.brand span{display:block;font:9px sans-serif;letter-spacing:2.8px}.studio{font-size:11px;letter-spacing:3px}.studio span{color:#8b806c;margin-left:15px}.back{color:#38463f;font-size:12px;text-decoration:none}main{display:grid;grid-template-columns:minmax(0,1fr) 380px;min-height:calc(100vh - 88px)}.viewer{position:sticky;top:0;height:calc(100vh - 88px);min-height:650px;background:#f5f4f0;overflow:hidden}.intro{position:absolute;z-index:1;top:34px;left:40px;right:24px;pointer-events:none}.eyebrow{font-size:10px;letter-spacing:2.3px;font-weight:650;color:#617064}h1{font:clamp(26px,3vw,43px)/1.16 var(--serif);margin:12px 0}p{color:#667169}.intro>p:last-child{font-size:13px;margin:0}#scene{position:absolute;inset:130px 0 115px}#scene canvas{display:block;width:100%;height:100%;touch-action:none}#loading{position:absolute;top:48%;width:100%;text-align:center}.viewbar{position:absolute;bottom:117px;display:flex;gap:6px;left:50%;transform:translateX(-50%);align-items:center;background:#ffffffdd;padding:5px;border-radius:12px;box-shadow:0 6px 24px #23332a0a}.viewbar button{border:0;background:transparent;white-space:nowrap;padding:8px 12px}.viewbar span{height:20px;border-left:1px solid #ddd}.hint{position:absolute;bottom:81px;left:0;width:100%;text-align:center;font-size:11px}.caption{position:absolute;bottom:0;padding:20px 40px;border-top:1px solid #23332a16;width:100%;display:flex;flex-direction:column;gap:3px}.caption span:first-child{font-size:8px;letter-spacing:2px}.caption strong{font-size:13px;font-weight:500}.caption span:last-child{font-size:10px;color:#737b75}aside{padding:28px 27px;border-left:1px solid #e5e6e1}.panel-head h2{font:25px var(--serif);margin:8px 0}.panel-head p:last-child{margin:0 0 25px;font-size:12px}fieldset{border:0;padding:0;margin:0 0 25px;min-width:0}legend{font-size:12px;font-weight:600;width:100%;margin-bottom:12px}legend>span{font-size:10px;color:#77837a;margin-right:12px}legend b{float:right;font-size:11px;font-weight:400;color:#607065}.swatches{display:flex;gap:13px;flex-wrap:wrap}.swatch{border-radius:50%;height:36px;min-height:36px;width:36px;padding:0;border:3px solid white;box-shadow:0 0 0 1px #ddd}.swatch[aria-pressed=true]{box-shadow:0 0 0 2px #284a3b}.segments{display:flex;gap:7px}.segments button{flex:1;padding:8px 6px;font-size:11px}.segments button[aria-pressed=true],.stone[aria-pressed=true]{border-color:#264b39;background:#f1f5f0;box-shadow:inset 0 0 0 1px #264b39}.stones{display:grid;gap:7px}.stone{display:flex;text-align:left;align-items:center;gap:12px;width:100%;font-size:12px;padding:8px}.stone i{height:35px;width:51px;border-radius:4px;border:1px solid #ddd;background-size:cover}.stone small{display:block;font-size:10px;color:#667169}.actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.actions button{font-size:11px}.actions .primary{background:#254638;color:white;border-color:#254638}.actions .primary:hover{background:#183729}#status{font-size:11px;min-height:32px}.quote{display:block;text-align:center;text-decoration:none;color:#254638;font-size:12px;font-weight:600;border-top:1px solid #e0e4de;padding-top:16px}.fine{font-size:10px;line-height:1.7}.viewer.dark{background:#101512;color:#f1f3ee}.dark .intro p,.dark .hint,.dark .caption span{color:#a7b3a8}.dark .caption{border-color:#ffffff25}.dark .viewbar{color:#25382d}button:disabled{opacity:.5;cursor:wait}@media(min-width:1500px){main{grid-template-columns:minmax(0,1fr) 420px}aside{padding:35px 40px}}@media(max-width:800px){header{height:72px;padding:0 20px}.brand{font-size:24px}.studio{font-size:9px;letter-spacing:1.2px}.back{display:none}main{display:block}.viewer{position:relative;height:570px;min-height:0}.intro{top:24px;left:24px}.intro>p:last-child{max-width:270px;font-size:12px}#scene{inset:118px 0 115px}.caption{padding:16px 24px}aside{border:0;padding:26px 24px;max-width:580px;margin:auto}.swatch{width:40px;height:40px;min-height:40px}.panel-head p:last-child{margin-bottom:24px}h1{font-size:31px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* Edition 02: quiet, coordinated viewing surfaces. */
body{--paper:#f1eee7;--surface:#f7f4ee;--ink:#303c35;--muted:#5d6b61;--line:#d4d3c9;--selected:#e1e7dc;--accent:#354f3e;background:var(--paper);color:var(--ink)}
header{background:var(--paper);border-color:var(--line)}.brand,.back{color:var(--ink)}.studio{color:var(--muted)}aside{background:var(--paper);border-color:var(--line)}p,.fine,#status,.stone small,legend b{color:var(--muted)}.eyebrow,legend>span{color:var(--muted)}.viewer{background:#e5e1d9;min-height:700px}.intro{top:28px;left:34px}.intro h1{font-size:clamp(28px,2.8vw,42px)}#scene{inset:130px 0 115px}.caption{padding:20px 34px;border-color:#b9bcae55}.caption span:last-child{color:var(--muted)}
button{background:var(--surface);border-color:var(--line);color:var(--ink)}button:hover{background:var(--selected)}button:focus-visible,a:focus-visible{outline-color:#88714d}.swatches{gap:11px}.swatch{height:31px;width:31px;min-height:31px;border-color:var(--paper);background-size:cover;box-shadow:0 0 0 1px #b7b9ae}.swatch:hover{transform:translateY(-1px)}.swatch[aria-pressed=true]{box-shadow:0 0 0 2px var(--accent)}.segments button[aria-pressed=true],.stone[aria-pressed=true]{background:var(--selected);border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.stone i{width:55px;height:42px;border-color:var(--line)}.stone{padding:9px}.viewbar{background:#f1eee7ed;box-shadow:0 4px 24px #323b3812;padding:4px;gap:2px}.viewbar button{padding:8px 9px;font-size:11px}.viewbar button:hover{background:#dbe0d5}.hint{color:#5d6b61}.actions .primary{background:var(--accent);border-color:var(--accent)}.quote{color:var(--ink);border-color:var(--line)}
body.dusk{--paper:#3a4440;--surface:#414d46;--ink:#e8e9e1;--muted:#c0c8be;--line:#5b665e;--selected:#53624f;--accent:#c2cdaa}.dusk .viewer{background:#323b38}.dusk .studio span{color:var(--muted)}.dusk .caption{border-color:#65706566}.dusk .viewbar{background:#414d46eb}.dusk .viewbar button:hover{background:#53624f}.dusk .viewbar span{border-color:#7c867c}.dusk .hint{color:var(--muted)}.dusk .actions .primary{color:#263128}.dusk .actions .primary:hover{background:#d5dec7}.dusk .swatch{border-color:var(--paper)}.dusk button:focus-visible,.dusk a:focus-visible{outline-color:#dfceaa}
@media(max-width:800px){.viewer{min-height:0;height:590px}.intro{top:23px;left:24px}.intro h1{font-size:29px}#scene{inset:127px 0 119px}.caption{padding:17px 24px}.viewbar{bottom:122px}.viewbar button{padding:8px}.swatch{height:34px;width:34px;min-height:34px}.swatches{gap:10px}.hint{bottom:87px}}
@media(prefers-reduced-motion:reduce){.swatch:hover{transform:none}}
@media(max-width:800px){.swatches{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}.swatch{width:100%;max-width:34px;height:auto;aspect-ratio:1;min-height:30px}}
#scene{position:absolute}#photo-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}.render-action{width:100%;font-weight:600;border-color:var(--accent);background:var(--selected)}.render-note{font-size:10px;margin:7px 0 16px}

/* Edition 04: larger controls, richer choices, readable contrast. */
[hidden]{display:none!important}.studio-skip{position:fixed;top:-100px;left:12px;z-index:50;background:#fff;color:#173d32;padding:12px}.studio-skip:focus{top:10px}
body{font-size:16px}p,.fine,#status,.stone small,legend b{color:var(--muted)}.panel-head p:last-child,.intro>p:last-child{font-size:14px}legend{font-size:14px}legend>span,legend b{font-size:12px}.segments button,.actions button,.quote{font-size:14px}.stone{font-size:14px;min-height:65px}.stone small{font-size:12px;line-height:1.4}.stone i{flex:none;width:62px;height:44px}.stones{max-height:330px;overflow-y:auto;padding:3px;scrollbar-gutter:stable;overscroll-behavior:contain}.stone-search-label{font-size:13px;display:flex;justify-content:space-between;margin:0 0 8px}.stone-search-label span{color:var(--muted)}#stone-search{font:16px/1.4 inherit;font-family:inherit;font-size:16px;width:100%;padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);margin-bottom:10px}#stone-search::placeholder{color:var(--muted);opacity:1}.material-note,.render-note,.fine,#status{font-size:12px;line-height:1.6}.light-label{display:flex;justify-content:space-between;font-size:13px}.light-label b{font-weight:500}#daylight{width:100%;accent-color:var(--accent);height:44px;cursor:pointer}.light-ends{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}.light-tour{width:100%;margin:12px 0;font-size:14px}.led-label{display:flex;gap:10px;align-items:center;font-size:14px;min-height:44px}.led-label input{width:20px;height:20px;accent-color:var(--accent)}.share-action{grid-column:1/-1}.quote{background:var(--accent);color:var(--paper)!important;border-radius:8px;padding:14px;margin-top:16px;border:0}.caption strong{font-size:15px}.caption span:last-child,.hint{font-size:12px}.caption span:first-child{font-size:10px}.viewbar button{font-size:13px}.back{font-size:14px;text-decoration:underline}.swatch{min-height:40px;width:40px;height:40px}.swatches{gap:10px}.dusk .quote{background:#e4ebdf;color:#20372a!important}.dusk input[type=range],.dusk input[type=checkbox]{accent-color:#c3d3bb}#status input{width:100%;font-size:14px;padding:10px;color:var(--ink);background:var(--surface);border:1px solid var(--line)}
@media(max-width:800px){.back{display:block;font-size:12px;max-width:72px}.studio{display:none}.viewer{height:610px}.intro h1{font-size:30px}.stones{max-height:320px}.swatches{gap:8px}.swatch{width:36px;height:36px;min-height:36px}.segments button{font-size:13px}.viewbar{gap:0;max-width:calc(100% - 20px)}.viewbar button{padding:8px;min-width:35px}.viewbar span{display:none}}
/* Edition 05: the preview stays visible while every control scrolls independently. */
body{height:100dvh;overflow:hidden}header{height:78px}main{height:calc(100dvh - 78px);min-height:0;overflow:hidden}.viewer{height:100%;min-height:0}aside{height:100%;overflow-y:auto;overscroll-behavior:contain;scroll-padding-top:76px;padding:0 24px 30px}.control-tabs{display:flex;gap:6px;position:sticky;top:0;z-index:5;background:var(--paper);padding:12px 0;margin-bottom:20px;overflow-x:auto;border-bottom:1px solid var(--line);scrollbar-width:thin}.control-tabs button{flex:none;padding:8px 10px;font-size:12px;min-height:42px;white-space:nowrap}.control-tabs button[aria-pressed=true]{background:var(--accent);color:var(--paper)}.panel-head{margin-top:14px}.control-label{display:block;font-size:13px;margin:16px 0 9px}.layouts,#hardware{display:grid;grid-template-columns:1fr 1fr}#colors{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:13px;justify-items:center}.swatch{height:44px;width:44px;min-height:44px;max-width:none}.glow-action{width:100%;margin-top:12px;color:var(--ink);border-color:var(--accent);background:var(--selected);font-size:14px}.led-label{line-height:1.4}.led-label input{flex:none}.led-label:has(input:disabled){opacity:.65}.stones{max-height:340px}.intro{top:22px}.intro h1{font-size:clamp(24px,2.4vw,38px)}.intro>p:last-child{font-size:13px}#scene{inset:118px 0 115px}input:focus-visible{outline:3px solid #9c762f;outline-offset:3px}
@media(max-width:900px){header{height:62px;padding:0 18px}.brand{font-size:23px}.brand span{font-size:8px}.studio{display:none}.back{display:block;font-size:12px;max-width:90px}main{height:calc(100dvh - 62px);display:grid;grid-template-columns:1fr;grid-template-rows:53% 47%}.viewer{height:100%;min-height:0;position:relative}.intro{top:8px;left:16px;right:16px}.intro .eyebrow,.intro>p:last-child{display:none}.intro h1{font-size:22px;margin:3px 0;line-height:1.15}#scene{inset:34px 0 73px}.viewbar{bottom:36px;padding:0 4px;gap:0;max-width:calc(100% - 16px);height:38px}.viewbar button{min-height:36px;padding:4px 9px;font-size:12px}.hint{display:none}.caption{padding:6px 16px;height:35px;justify-content:center}.caption span{display:none}.caption strong{font-size:12px;font-weight:600}.caption span:last-child{display:none}aside{width:100%;max-width:none;height:100%;border-top:1px solid var(--line);padding:0 18px 24px;margin:0;background:var(--paper)}.control-tabs{margin:0 -18px 18px;padding:8px 12px;gap:6px;box-shadow:0 3px 10px #00000008;top:0}.control-tabs button{font-size:12px;min-height:40px;padding:8px 12px}.panel-head{display:none}fieldset{margin-bottom:22px}.segments button{font-size:13px;min-height:44px}.swatch{height:44px;width:44px;min-height:44px}.stones{max-height:none;overflow:visible}.stone{min-height:64px}.render-note,.fine{font-size:12px}.actions button{min-height:46px}.quote{min-height:48px}.control-tabs button[aria-pressed=true]{border-color:var(--accent)}}
@media(max-height:620px) and (max-width:900px){main{grid-template-rows:50% 50%}.intro h1{font-size:18px}#scene{inset:26px 0 65px}.viewbar{bottom:30px}.caption{height:30px}.brand span{display:none}header{height:50px}main{height:calc(100dvh - 50px)}}

.render-quality{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.85rem;margin:18px 0 12px}.render-quality select{max-width:65%;padding:10px;border:1px solid #8d958a;border-radius:8px;background:#f7f5ef;color:#263b31;font:inherit}.dusk .render-quality select{background:#39463f;color:#f5f5ed}

.swatches.floors{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.swatches.floors .swatch.floor-swatch{width:100%;height:auto;min-height:0;aspect-ratio:1/1;border-radius:10px;background-size:cover;background-position:center;background-color:#d8cfc0}

.dim{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 10px;margin:0 0 14px}
.dim label{font-size:12px;font-weight:600}
.dim output{font-size:12px;color:#5d6b61;font-variant-numeric:tabular-nums}
.dim input[type=range]{grid-column:1/-1;width:100%;accent-color:#2f5442;min-height:32px}
#room-options .material-note,#appliance-options .material-note{margin-top:4px}
.dim[hidden]{display:none}
.off{opacity:.4;pointer-events:none}
.segments button:disabled{opacity:.35;cursor:not-allowed}

.qty{border:1px solid #d9dccf;border-radius:12px;padding:6px 14px;background:#fff}
.qhead{margin:10px 0 4px;font-size:10px;letter-spacing:1.6px;text-transform:uppercase;font-weight:700;color:#7a6a4a}
.qrow{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid #eef0ea;font-size:12px}
.qrow b{font-variant-numeric:tabular-nums;white-space:nowrap}
.qrow.total{border-bottom:0;font-weight:700}
.qrow.total span{color:#202b27}
.btn-send{display:block;margin:12px 0 6px;text-align:center;padding:13px 14px;border-radius:10px;background:#254638;color:#fff;font-weight:600;font-size:13px;text-decoration:none}
.btn-send:hover{background:#183729}
#dimsbtn[aria-pressed=true]{background:#dfe6dc;font-weight:600}
@media(max-width:480px){.viewbar button{padding:8px 6px;font-size:10.5px}}

.fit-note{font-size:12px;color:#8a3b22;background:#fbefe9;border-radius:8px;padding:8px 10px;margin:6px 0}

.presets{display:grid;gap:7px;margin-bottom:6px}
.presets button{text-align:left;font-size:12px;font-weight:600;padding:9px 12px}
.presets button small{display:block;font-weight:400;font-size:11px;color:#667169;margin-top:2px}
.presets button[aria-pressed=true]{border-color:#264b39;background:#f1f5f0;box-shadow:inset 0 0 0 1px #264b39}
.sched{list-style:none;margin:4px 0 6px;padding:0;display:flex;flex-wrap:wrap;gap:5px}
.sched li{font-size:11px;background:#f2f1ec;border:1px solid #e2e2da;border-radius:6px;padding:3px 7px;font-variant-numeric:tabular-nums}
.qnote{font-size:11px;color:#667169;margin:8px 0 6px;line-height:1.5}

.btn-print{width:100%;margin:0 0 8px;font-size:12px}
.sq{margin-top:14px;border-top:1px solid #e3e5dd;padding-top:4px}
.sq-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}
.sq input,.sq select,.sq textarea{width:100%;min-height:44px;border:1px solid #d6d9cf;border-radius:8px;padding:10px 12px;font:inherit;font-size:16px;background:#fff;color:#202b27}
.sq textarea{min-height:76px;resize:vertical;margin:8px 0 4px}
.sq-full{margin-bottom:0}
.sq-lbl{font-size:12px;font-weight:600;margin:6px 0 6px;color:#202b27}
.sq-checks{display:grid;grid-template-columns:1fr 1fr;gap:4px 10px;margin-bottom:10px}
.sq-checks label{display:flex;gap:7px;align-items:center;font-size:12px;color:#33413a}
.sq-checks input{width:16px;min-height:16px;height:16px;accent-color:#2f5442}
.sq .btn-send{width:100%;border:0;cursor:pointer;font:inherit;font-weight:600;font-size:14px}
.sq-err{color:#a33a2b;font-size:12px}
.sq-done{display:flex;flex-direction:column;gap:6px;background:#eef5ef;border:1px solid #cfe0d2;border-radius:12px;padding:14px;margin-top:10px}
.sq-done b{font-size:14px}.sq-done span{font-size:12px;color:#40524a}.sq-done a{font-size:13px;font-weight:600;color:#1d4a37}
@media(max-width:420px){.sq-row,.sq-checks{grid-template-columns:1fr}}

/* v10: moving appliances, tile calculator */
.drag-note{font-size:13px;background:var(--selected,#eef1ed);border:1px solid var(--line,#dcded9);border-radius:8px;padding:9px 11px;margin:0 0 12px;color:var(--ink,#202b27)!important}
.drag-note b{color:#8a6a2e}
.movepad{display:flex;align-items:center;gap:6px;margin:4px 0 14px;flex-wrap:wrap}.movepad span{font-size:13px;color:var(--muted,#667169);margin-left:6px}.movepad span:first-child{margin-left:0}.movepad button{min-height:40px;min-width:46px;padding:6px 10px;font-size:14px}
#scene.can-grab canvas{cursor:grab}#scene.dragging canvas{cursor:grabbing}
.drag-tip{position:absolute;z-index:2;top:10px;left:50%;transform:translateX(-50%);margin:0;background:#1f3a2f;color:#fff!important;font-size:13px;padding:8px 14px;border-radius:999px;box-shadow:0 6px 20px #0003;white-space:nowrap;pointer-events:none;animation:tipIn .5s ease .8s both,tipOut .6s ease 9s forwards}
.drag-tip b{color:#f1d9a6}.drag-tip.used{display:none}
@keyframes tipIn{from{opacity:0;transform:translate(-50%,-6px)}}@keyframes tipOut{to{opacity:0;visibility:hidden}}
@media(max-width:900px){.drag-tip{top:auto;bottom:80px;font-size:12px;padding:6px 12px}}
.tilecalc{margin:18px 0 6px}.tc-presets{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 10px}.tc-presets button{min-height:36px;font-size:12px;padding:6px 10px}
.tc-row{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,.8fr) minmax(0,.9fr) auto 36px;gap:6px;align-items:center;margin-bottom:6px}
.tc-row input{min-width:0;font:14px inherit;font-family:inherit;padding:9px 8px;border:1px solid var(--line,#dcded9);border-radius:7px;background:var(--surface,#fff);color:var(--ink,#202b27)}
.tc-row b{font-size:13px;white-space:nowrap}.tc-row button{min-height:36px;padding:0}
.tc-add{width:100%;min-height:40px;font-size:13px;border-style:dashed}
@media(max-width:480px){.tc-row{grid-template-columns:1fr 1fr auto 36px}.tc-row input:first-child{grid-column:1/-1}}
#hobwalls{margin-bottom:16px}

/* v11: kitchen shape picker */
.shapes{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.shape{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 4px 7px;min-height:74px;font-size:11px;line-height:1.15;text-align:center}
.shape svg{width:44px;height:33px;fill:var(--accent,#264b39);opacity:.85}.shape svg .o{fill:none;stroke:var(--accent,#264b39);stroke-width:1.6}
.shape[aria-pressed=true]{border-color:var(--accent,#264b39);background:var(--selected,#eef1ed);box-shadow:inset 0 0 0 1px var(--accent,#264b39)}
.flip-btn{width:100%;margin:9px 0 2px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:600}
.flip-btn small{font-weight:400;font-size:12px;color:var(--muted,#667169)}
.flip-btn[aria-pressed=true]{border-color:var(--accent,#264b39);background:var(--selected,#eef1ed)}
#sinkwalls,#hobwalls,#fridges{flex-wrap:wrap}#sinkwalls button,#hobwalls button,#fridges button{flex:1 1 30%}
@media(max-width:480px){.shapes{grid-template-columns:repeat(4,1fr);gap:5px}.shape{font-size:10px;min-height:68px}.shape svg{width:36px;height:27px}}
/* A quieter material studio. The model stays visible while mobile controls scroll. */
:root{--serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;--sans:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;--paper:#f7f4ed;--surface:#fffdf8;--ink:#24372f;--muted:#58675e;--line:#d7d4c9;--selected:#e8ece3;--accent:#23483b}
body:not(.dusk) .viewer{background:radial-gradient(ellipse at 38% 30%,#f3efe7,#e2dfd5)}
header{border-bottom:1px solid var(--line)}.panel-head h2,.intro h1{font-weight:500;letter-spacing:-.025em}.eyebrow{letter-spacing:.19em}
fieldset{padding-bottom:22px;border-bottom:1px solid var(--line)}legend{letter-spacing:.01em}.stone{border-radius:10px}.stone i{border-radius:5px}.stone[aria-pressed=true]{box-shadow:inset 0 0 0 1px var(--accent),0 3px 10px #20372a0a}
.viewbar{border:1px solid #b6bcb166;border-radius:999px;box-shadow:0 8px 28px #1d332416;backdrop-filter:blur(12px)}.viewbar button{border-radius:999px}.control-tabs button{border-radius:999px}
button:focus-visible,a:focus-visible{outline:3px solid #9b752e;outline-offset:3px}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.smart-dock{display:none}.finish-search-label{display:block;font-size:13px;margin:16px 0 6px}#finish-search{width:100%;min-height:44px;border:1px solid var(--line);border-radius:8px;padding:10px 12px;font:inherit;font-size:16px;background:var(--surface);color:var(--ink)}.finish-filters{display:flex;gap:7px;margin:12px 0 18px}.finish-filters button{min-height:40px;padding:8px 13px;font-size:12px;border-radius:999px}.finish-filters button[aria-pressed=true]{background:var(--accent);color:var(--paper)}#finish-empty{font-size:13px;line-height:1.5}
#colors{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:stretch}.finish-card.swatch{width:100%;height:auto;min-height:82px;max-width:none;border:1px solid var(--line);border-radius:9px;background:var(--surface);box-shadow:none;display:flex;flex-direction:column;gap:6px;padding:7px;align-items:center}.finish-card i{display:block;width:100%;height:36px;background-size:cover;border-radius:4px;border:1px solid #00000010}.finish-card span{font-size:11px;line-height:1.2;color:var(--ink);white-space:normal}.finish-card[aria-pressed=true]{background:var(--selected);border:2px solid var(--accent);padding:6px;box-shadow:none}.finish-card[hidden],#smart-menu[hidden],#finish-empty[hidden]{display:none!important}
@media(max-width:900px){
 main{grid-template-rows:48% 52%}.control-tabs{display:none}.smart-dock{display:block;position:sticky;top:0;z-index:8;margin:0 -18px 20px;padding:8px;background:var(--paper);border-bottom:1px solid var(--line);box-shadow:0 5px 15px #24372f0a}.smart-bar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.smart-bar button{padding:8px 3px;min-height:54px;border-radius:10px;min-width:0;font-size:12px}.smart-bar span{display:block;font-weight:600}.smart-bar small{display:block;font-size:9px;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.85}.smart-bar button[aria-pressed=true],#smart-more[aria-expanded=true]{background:var(--accent);color:var(--paper);border-color:var(--accent)}
 #smart-menu{padding:10px 6px 6px;max-height:calc(52dvh - 130px);overflow-y:auto;overscroll-behavior:contain}#smart-menu p{margin:4px 0 10px;font-size:13px;font-weight:600}.smart-menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.smart-menu-grid button,#smart-undo,#smart-close{min-height:44px;font-size:12px;padding:8px}#smart-undo,#smart-close{margin-top:8px;width:calc(50% - 4px)}aside{scroll-padding-top:84px}.intro h1{font-size:20px}.viewbar{border-radius:12px}#colors{grid-template-columns:repeat(3,minmax(0,1fr))}.finish-card.swatch{min-height:82px}.finish-card span{font-size:12px}
}

/* v12: item menu, kitchen items, guide */
.in-kitchen{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;margin:0 0 14px}
.in-kitchen .ik{display:flex;align-items:center;gap:8px;font-size:13px;min-height:34px}
.in-kitchen input{width:18px;height:18px;accent-color:var(--accent,#264b39)}
.item-pop{position:absolute;z-index:6;min-width:200px;max-width:250px;background:#fffdf8;border:1px solid #d9d5c9;border-radius:12px;box-shadow:0 18px 40px -12px rgba(20,35,28,.35);padding:10px;display:flex;flex-direction:column;gap:6px}
.item-pop b{font:600 13px/1.2 inherit;padding:2px 4px 4px;letter-spacing:.02em}
.item-pop button{min-height:36px;padding:7px 10px;text-align:left;font-size:13px;border-radius:8px}
.item-pop button:first-of-type{border-color:#c9b48d}
.item-pop small{font-size:11px;color:#6b746e;padding:2px 4px}
.guide{position:fixed;inset:0;z-index:50;background:rgba(18,28,24,.45);display:grid;place-items:center;padding:20px;backdrop-filter:blur(3px)}
.guide[hidden]{display:none}
.guide-card{position:relative;max-width:520px;width:100%;max-height:calc(100dvh - 40px);overflow:auto;background:#fbf9f4;border-radius:18px;padding:28px 28px 22px;box-shadow:0 30px 80px -20px rgba(0,0,0,.45)}
.guide-card h2{font:26px/1.15 var(--serif);margin:6px 0 14px;color:#1d2a24}
.guide-card ol{margin:0;padding-left:20px;display:grid;gap:10px;font-size:14px;line-height:1.5;color:#33413a}
.guide-card li b{color:#1d2a24}
.g-nav{font-size:12px;margin:14px 0}
.g-go{width:100%;min-height:46px;background:#254638;color:#fff;border-color:#254638;font-weight:600}
.g-go:hover{background:#183729}
.g-x{position:absolute;top:12px;right:12px;width:36px;min-height:36px;padding:0;border-radius:50%;font-size:20px;line-height:1}
#help{font-weight:600}
@media(max-width:600px){.guide-card{padding:22px 18px}.guide-card h2{font-size:22px}}

/* v13: feature rail, compare, photo match */
.spot{position:absolute;z-index:4;right:16px;top:118px;display:flex;flex-direction:column;gap:8px}
.spot button{display:flex;align-items:center;gap:9px;min-height:42px;padding:8px 14px 8px 10px;border-radius:999px;background:rgba(255,253,248,.92);border:1px solid rgba(38,75,57,.18);box-shadow:0 6px 18px -8px rgba(20,35,28,.35);font-size:13px;font-weight:600;color:#1f3a2f;backdrop-filter:blur(6px);justify-content:flex-start}
.spot button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.spot button:hover{background:#fff}
.spot button[aria-pressed=true]{background:#254638;color:#fff;border-color:#254638}
.spot .sp-new{background:linear-gradient(135deg,#b49462,#94743f);color:#fff;border-color:transparent}
.spot .sp-new:hover{filter:brightness(1.06);background:linear-gradient(135deg,#b49462,#94743f)}
@media(max-width:900px){.spot{top:auto;bottom:80px;left:8px;right:8px;flex-direction:row;overflow-x:auto;scrollbar-width:none;gap:6px;padding:2px}.spot::-webkit-scrollbar{display:none}.spot button{flex:none;min-height:36px;padding:6px 11px 6px 8px;font-size:12px}.spot button svg{width:17px;height:17px}}
@media(max-height:620px) and (max-width:900px){.spot{bottom:66px}}
.compare{position:absolute;inset:0;z-index:5;pointer-events:none}
.compare img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;clip-path:inset(0 var(--cut,50%) 0 0)}
.compare::after{content:"";position:absolute;top:0;bottom:0;left:calc(100% - var(--cut,50%));width:3px;margin-left:-1px;background:#fff;box-shadow:0 0 12px rgba(0,0,0,.4)}
.compare input{position:absolute;left:0;right:0;bottom:120px;width:100%;pointer-events:auto;opacity:.01;height:60%;top:15%;cursor:ew-resize}
.cmp-cap{position:absolute;top:12px;left:12px;right:12px;display:flex;justify-content:space-between}.cmp-cap span{background:rgba(20,35,28,.78);color:#fff;font-size:12px;font-weight:600;padding:6px 10px;border-radius:999px}
.cmp-close{position:absolute;left:50%;transform:translateX(-50%);bottom:164px;pointer-events:auto;border-radius:999px;background:#254638;color:#fff;border-color:#254638;font-weight:600}
.pm{position:fixed;inset:0;z-index:60;background:rgba(18,28,24,.5);display:grid;place-items:center;padding:16px;backdrop-filter:blur(3px)}.pm[hidden]{display:none}
.pm-card{position:relative;width:100%;max-width:620px;max-height:calc(100dvh - 32px);overflow:auto;background:#fbf9f4;border-radius:18px;padding:24px;box-shadow:0 30px 80px -20px rgba(0,0,0,.45)}
.pm-card h2{font:24px/1.15 var(--serif);margin:6px 0 10px;color:#1d2a24}
.pm-x{position:absolute;top:12px;right:12px;width:36px;min-height:36px;padding:0;border-radius:50%;font-size:20px}
.pm-up{display:block;margin:14px 0}.pm-up input{position:absolute;opacity:0;width:1px;height:1px}
.pm-up span{display:flex;align-items:center;justify-content:center;min-height:54px;border-radius:12px;background:#254638;color:#fff;font-weight:600;cursor:pointer}
.pm-ask{font-size:15px;color:#1d2a24!important;margin:4px 0 8px}
.pm-photo{position:relative;border-radius:12px;overflow:hidden;background:#ddd}.pm-photo canvas{display:block;width:100%;height:auto;cursor:crosshair}
#pm-dot{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 2px #254638;pointer-events:none}
.pm-chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.pm-chips span{font-size:12px;padding:5px 10px;border-radius:999px;background:#eef1ed;color:#264b39}
.pm-q{font-weight:600;color:#1d2a24!important;margin:12px 0 6px}
.pm-shapes{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.pm-len{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:12px 0;font-size:14px}.pm-len input{width:110px;padding:9px;border:1px solid #d9d5c9;border-radius:8px;font:inherit;background:#fff}
.pm-acts{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pm-acts a{display:flex;align-items:center;justify-content:center;text-align:center;min-height:44px;border:1px solid #1e7a4b;border-radius:8px;color:#1e7a4b;font-weight:600;text-decoration:none;font-size:13px;padding:6px}
.pm-done{background:#254638;color:#fff;border-color:#254638;font-weight:600}
.pm-note{font-size:12px;margin:12px 0 0}
@media(max-width:520px){.pm-card{padding:18px}.pm-shapes{grid-template-columns:repeat(4,1fr)}.pm-acts{grid-template-columns:1fr}}
.pm-chips span{display:inline-flex;align-items:center;gap:6px}.pm-chips span i{width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.2);display:inline-block}.pm-chips span.on{background:#e3ece5;font-weight:600}

.render-ov{position:absolute;inset:0;z-index:7;display:grid;place-items:center;background:rgba(245,243,238,.35);backdrop-filter:blur(2px)}.render-ov[hidden]{display:none}
.ro-card{width:min(360px,86%);background:#fffdf8;border-radius:16px;padding:18px 18px 14px;box-shadow:0 24px 60px -18px rgba(20,35,28,.45);display:flex;flex-direction:column;gap:8px}
.ro-card b{font:20px/1.2 var(--serif);color:#1d2a24}.ro-card span{font-size:13px;color:#5f6b64}
.ro-bar{height:8px;border-radius:99px;background:#e6e2d8;overflow:hidden}.ro-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#254638,#b49462);transition:width .4s}
.ro-card small{font-size:12px;color:#5f6b64}.ro-card button{align-self:flex-end;min-height:36px}
.render-done{position:absolute;z-index:6;left:50%;transform:translateX(-50%);top:16px;display:flex;gap:8px}.render-done[hidden]{display:none}
.render-done button{border-radius:999px;font-weight:600;box-shadow:0 8px 20px -10px rgba(0,0,0,.35)}#rd-dl{background:#254638;color:#fff;border-color:#254638}
.ro-bar{position:relative}.ro-bar::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:translateX(-100%);animation:roShine 1.6s infinite}@keyframes roShine{to{transform:translateX(100%)}}@media(prefers-reduced-motion:reduce){.ro-bar::after{animation:none}}

.pm-ups{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0 6px}.pm-ups .pm-up{margin:0}.pm-up.alt span{background:#fff;color:#254638;border:1.5px solid #254638}
.pm-tip{font-size:12px;margin:4px 0 0}
.photo-start{width:100%;display:flex;align-items:center;gap:12px;text-align:left;margin:0 0 14px;padding:12px 14px;border-radius:12px;border:0;background:linear-gradient(135deg,#b49462,#94743f);color:#fff;font-size:22px}
.photo-start span{display:flex;flex-direction:column;gap:2px}.photo-start b{font-size:14px}.photo-start small{font-size:12px;opacity:.9}
.photo-start:hover{filter:brightness(1.05);background:linear-gradient(135deg,#b49462,#94743f)}
@media(max-width:900px){.spot #sp-photo{order:-1}}
@media(max-width:520px){.pm-ups{grid-template-columns:1fr}}
.segments.dimmed{opacity:.45}.style-note{margin-top:8px}
/* ---------- photo wizard ---------- */
.pm-card{max-width:680px;padding:22px 24px 18px;border-radius:20px;background:#fbfaf6}
.pm-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.pm-top .eyebrow{margin:0;color:#8a6d3b}
.pm-card h2{font:500 28px/1.12 var(--serif,'Cormorant Garamond',Georgia,serif);margin:4px 0 12px;color:#1d2a24;letter-spacing:-.2px}
.pm-x{position:static;flex:none;width:44px;min-height:44px;border-radius:50%;font-size:22px;line-height:1}
.pm-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;list-style:none;margin:0 0 16px;padding:0;counter-reset:s}
.pm-steps li{display:flex;align-items:center;gap:8px;padding:8px 0 0;border-top:3px solid #e3e0d6;font-size:12px;color:#7a8179;cursor:pointer;font-weight:500}
.pm-steps li b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#ece9e0;font-size:11px;color:#56605a;flex:none}
.pm-steps li.done{border-color:#9b7a43;color:#3d4a43}.pm-steps li.done b{background:#9b7a43;color:#fff}
.pm-steps li[aria-current]{border-color:#254638;color:#1d2a24;font-weight:650}.pm-steps li[aria-current] b{background:#254638;color:#fff}
.pm-lead{font-size:15px;line-height:1.55;color:#4b5650!important;margin:0 0 14px}
.pm-big{display:flex;width:100%;gap:14px;align-items:center;text-align:left;padding:14px 16px;min-height:68px;border-radius:14px;background:linear-gradient(135deg,#254638,#1b362b);color:#fff;border:0;box-shadow:0 10px 24px -14px #183729}
.pm-big:hover{background:linear-gradient(135deg,#2c5243,#1f3d31)}.pm-big b{display:block;font-size:15px}.pm-big small{display:block;font-size:12px;opacity:.8;font-weight:400;margin-top:2px}
.pm-ico{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#ffffff1f;font-size:20px;flex:none}
.pm-ups{margin:10px 0 4px}.pm-up span{min-height:52px;gap:8px;font-size:14px}.pm-up input:focus-visible+span{outline:3px solid #9c762f;outline-offset:3px}
.pm-tips{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}.pm-tips li{position:relative;padding-left:26px;font-size:13px;line-height:1.5;color:#56605a}
.pm-tips li:before{content:"✓";position:absolute;left:0;top:0;width:18px;height:18px;border-radius:50%;background:#efe7d6;color:#8a6d3b;font-size:11px;display:grid;place-items:center;font-weight:700}
.pm-ask{font-size:15px;line-height:1.5;margin:0 0 10px}
.pm-photo{position:relative;width:fit-content;max-width:100%;margin:0 auto;border-radius:14px;overflow:hidden;background:#e8e5dc;box-shadow:0 1px 0 #0000000d}
.pm-photo canvas{display:block;max-width:100%;max-height:min(52dvh,460px);width:auto;height:auto;cursor:crosshair}
.pm-pins{position:absolute;inset:0;pointer-events:none}.pm-pins[hidden]{display:none}
.pm-pin{position:absolute;pointer-events:auto;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center;gap:0;min-height:0;padding:0;border:0;background:none;touch-action:none;cursor:grab;filter:drop-shadow(0 3px 6px #0006)}
.pm-pin span{order:-1;background:#fff;color:#1d2a24;font-size:12px;font-weight:650;padding:5px 10px;border-radius:999px;white-space:nowrap}
.pm-pin i{width:3px;height:14px;background:#fff}.pm-pin i:after{content:"";position:absolute;bottom:-9px;left:50%;width:18px;height:18px;margin-left:-9px;border-radius:50%;background:#254638;border:3px solid #fff;box-sizing:border-box}
.pm-pin.on span{background:#254638;color:#fff}.pm-pin.on i:after{background:#c79c55}.pm-pin.drag{cursor:grabbing;transform:translate(-50%,-100%) scale(1.08)}
.pm-pin:hover{background:none}.pm-pin:focus-visible{outline:none}.pm-pin:focus-visible span{outline:3px solid #c79c55}
.pm-scan{position:absolute;inset:0;background:#10201a40;display:grid;place-items:center}.pm-scan[hidden]{display:none}.pm-scan i{position:absolute;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,#e8c27f,transparent);box-shadow:0 0 18px #e8c27f;animation:pmscan 1.4s ease-in-out infinite alternate}
@keyframes pmscan{from{top:4%}to{top:96%}}
.pm-chips{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 4px}
.pm-chip{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:6px 12px;border-radius:999px;font-size:13px;background:#f1efe8;border:1px solid #e1ddd2;color:#2f3d36}
.pm-chip i{width:16px;height:16px;border-radius:50%;border:1px solid #0003;flex:none}.pm-chip[aria-pressed=true]{background:#254638;border-color:#254638;color:#fff}
.pm-chip.ex{border-style:dashed}.pm-chip[hidden]{display:none}
.pm-help{font-size:12.5px;line-height:1.55;margin:8px 0 0;color:#6a736d!important}
.pm-meas{position:absolute;inset:0;width:100%;height:100%;touch-action:none}.pm-meas[hidden]{display:none}
.pm-meas .mz{fill:#c79c5522;stroke:none}.pm-meas .ln{stroke:#e9c27a;filter:drop-shadow(0 0 2px #000a)}.pm-meas .hit{stroke:transparent;cursor:ns-resize}.pm-meas .v .hit{cursor:ew-resize}
.pm-meas circle{fill:#fff;stroke:#c79c55;stroke-width:4;cursor:grab;filter:drop-shadow(0 2px 3px #0008)}.pm-meas text{fill:#fff;font-weight:700;font-family:Inter,system-ui,sans-serif;paint-order:stroke;stroke:#000a;stroke-width:3px}
.pm-meas .mdim line{stroke:#fff}.pm-meas .mdim rect{fill:#254638}.pm-meas .mdim text{stroke:none}
.pm-seg{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:12px 0 8px}.pm-seg button{min-height:42px;font-size:13px}.pm-seg button[aria-pressed=true]{background:#254638;color:#fff;border-color:#254638}
.pm-ref{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;margin:8px 0}.pm-ref select{max-width:60%;min-height:42px;padding:8px;border:1px solid #d9d5c9;border-radius:10px;background:#fff;font:inherit;font-size:13px;color:#1d2a24}
.pm-result{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 10px;margin:10px 0;padding:12px 14px;border-radius:14px;background:#f2ede1;border:1px solid #e5dccb}
.pm-result span{font-size:12px;color:#6b6252;text-transform:uppercase;letter-spacing:1.2px;font-weight:600}.pm-result strong{font:600 26px/1.1 var(--serif,'Cormorant Garamond',Georgia,serif);color:#1d2a24;grid-row:span 2;align-self:center}.pm-result small{font-size:12px;color:#6a736d;grid-column:1}
.pm-len{font-size:13px}.pm-ftin{display:inline-flex;align-items:center;gap:6px}.pm-len input{width:96px;min-height:42px;font-size:16px}
.pm-q{font-size:14px;font-weight:500;margin:4px 0 10px}.pm-shapes{grid-template-columns:repeat(4,1fr);gap:7px}
.pm-shapes .shape{min-height:84px;font-size:12px}.pm-flip{width:100%;margin:10px 0;min-height:44px;font-size:13px}.pm-flip[aria-pressed=true]{background:#f1f5f0;border-color:#254638}
.pm-nav{display:flex;justify-content:space-between;gap:8px;margin-top:14px;position:sticky;bottom:-18px;background:linear-gradient(#fbfaf600,#fbfaf6 30%);padding:14px 0 4px}
.pm-nav button{min-height:50px;padding:10px 18px;font-size:14px}.pm-nav .pm-done{flex:1;max-width:320px;font-weight:650}
.pm-note{font-size:11.5px;color:#7a817b!important}
.pm-livebox{position:fixed;inset:0;z-index:80;background:#000;display:flex;align-items:center;justify-content:center}.pm-livebox[hidden]{display:none}
.pm-livebox video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pm-grid{position:absolute;inset:0;pointer-events:none}.pm-grid i{position:absolute;background:#ffffff59}.pm-grid i:nth-child(1){left:33.3%;top:0;bottom:0;width:1px}.pm-grid i:nth-child(2){left:66.6%;top:0;bottom:0;width:1px}.pm-grid i:nth-child(3){top:33.3%;left:0;right:0;height:1px}.pm-grid i:nth-child(4){top:66.6%;left:0;right:0;height:1px}
.pm-level{position:absolute;top:max(18px,env(safe-area-inset-top));left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:8px 14px 8px 10px;border-radius:999px;background:#000a;color:#fff;font-size:13px;font-weight:600}
.pm-level i{width:46px;height:3px;background:#f2c46d;border-radius:2px;transition:transform .08s}.pm-level.ok{background:#1d6b47e6}.pm-level.ok i{background:#fff}
.pm-livehint{position:absolute;bottom:130px;left:0;right:0;text-align:center;color:#fff!important;font-size:14px;text-shadow:0 1px 4px #000}
.pm-livebar{position:absolute;bottom:max(20px,env(safe-area-inset-bottom));left:0;right:0;display:flex;justify-content:space-around;align-items:center}
.pm-livebar button{background:#0008;color:#fff;border:1px solid #fff5;border-radius:999px;min-width:92px}
.pm-shot{width:76px;height:76px;min-width:76px!important;border-radius:50%!important;background:#fff0!important;border:4px solid #fff!important;padding:4px}.pm-shot i{display:block;width:100%;height:100%;border-radius:50%;background:#fff}.pm-shot:active i{transform:scale(.92)}
@media(max-width:600px){.pm{padding:0;place-items:stretch}.pm-card{max-width:none;max-height:100dvh;height:100dvh;border-radius:0;padding:max(14px,env(safe-area-inset-top)) 16px 12px}
 .pm-card h2{font-size:24px}.pm-steps li span{display:none}.pm-steps li{justify-content:center}.pm-shapes{grid-template-columns:repeat(4,1fr);gap:5px}.pm-shapes .shape{min-height:76px;font-size:11px;padding:6px 3px}
 .pm-photo canvas{max-height:46dvh}.pm-ref{flex-direction:column;align-items:stretch}.pm-ref select{max-width:none}.pm-nav{bottom:-12px}}
@media(prefers-reduced-motion:reduce){.pm-scan i{animation:none;top:50%}}

/* typography: same pairing as the main website */
body{font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,.brand,.panel-head h2{font-family:var(--serif);font-weight:500;letter-spacing:-.2px}
.intro h1{font-size:clamp(26px,2.4vw,38px);line-height:1.08;margin:6px 0}.panel-head h2{font-size:30px}.brand{font-size:32px}
.caption strong{font-family:var(--serif);font-size:19px;font-weight:600;letter-spacing:.1px}
.eyebrow,legend>span,.qhead{font-family:var(--sans);letter-spacing:2.4px}
@media(max-width:900px){.intro h1{font-size:25px}.brand{font-size:25px}.caption strong{font-size:16px}}
.pm-nav .pm-done:hover,.pm-seg button[aria-pressed=true]:hover,.pm-chip[aria-pressed=true]:hover{background:#1b362b;color:#fff}.pm-big:focus-visible,.pm-chip:focus-visible,.pm-nav button:focus-visible{outline:3px solid #b98a3e;outline-offset:3px}
.segments.wrap{flex-wrap:wrap}.segments.wrap button{flex:1 1 30%}
/* ---------- walk mode HUD ---------- */
#scene.walking canvas{cursor:grab}#scene.walking canvas:active{cursor:grabbing}
.walk-hud{position:absolute;left:18px;bottom:172px;z-index:6;display:flex;align-items:flex-end;gap:12px;pointer-events:none}.walk-hud[hidden]{display:none}
.walk-hud>*{pointer-events:auto}
.joy{position:relative;width:118px;height:118px;border-radius:50%;background:radial-gradient(circle,#ffffff40,#ffffff22 60%,#ffffff14);border:2px solid #ffffffb3;box-shadow:0 8px 24px -10px #0007,inset 0 0 0 1px #0000001a;backdrop-filter:blur(4px);touch-action:none;cursor:grab;flex:none}
.joy i{position:absolute;left:50%;top:50%;width:48px;height:48px;margin:-24px 0 0 -24px;border-radius:50%;background:#fff;box-shadow:0 4px 12px #0005;transition:transform .08s}
.joy:before{content:"";position:absolute;inset:10px;border-radius:50%;border:1px dashed #ffffff80}
.walk-btns{display:flex;flex-wrap:wrap;gap:6px;max-width:330px}.walk-btns button{min-height:42px;padding:8px 13px;border-radius:999px;background:#fffdf8eb;border:1px solid #264b3933;font-size:13px;font-weight:600;color:#1f3a2f;box-shadow:0 6px 18px -8px #14231c59}
.walk-btns .walk-exit{background:#254638;color:#fff;border-color:#254638}
.walk-tip{position:absolute;left:0;bottom:calc(100% + 8px);margin:0;white-space:nowrap;font-size:12px;color:#fff!important;background:#1d2a24c4;padding:6px 11px;border-radius:999px;pointer-events:none}
/* ---------- full screen button + modes ---------- */
.fs-btn{position:absolute;z-index:6;right:16px;bottom:119px;width:44px;min-height:44px;height:44px;padding:0;border-radius:12px;background:#f1eee7ed;border:1px solid #264b3926;display:grid;place-items:center;box-shadow:0 4px 18px #323b3814}
.fs-btn svg{width:22px;height:22px;fill:none;stroke:#1f3a2f;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.fs-btn .fs-out{display:none}.is-fs .fs-btn .fs-in{display:none}.is-fs .fs-btn .fs-out{display:block}
.viewer:fullscreen{width:100vw;height:100vh;max-height:none;background:#e5e1d9}.viewer:-webkit-full-screen{width:100vw;height:100vh;background:#e5e1d9}
body.pseudo-fs{overflow:hidden}body.pseudo-fs .viewer{position:fixed!important;inset:0;z-index:200;width:100vw;height:100dvh!important;min-height:0}
.viewer.is-fs .intro,.viewer.is-fs .caption,.viewer.is-fs .hint{display:none}.viewer.is-fs #scene{inset:0 0 64px 0}.viewer.is-fs .viewbar{bottom:12px}.viewer.is-fs .fs-btn{bottom:12px}.viewer.is-fs .spot{top:16px}.viewer.is-fs .walk-hud{bottom:70px}
/* ---------- phones: bigger 3D view, nothing covering it ---------- */
@media(max-width:900px){
 main{grid-template-rows:62% 38%}
 .viewer .intro,.viewer .caption,.hint{display:none}
 #scene{inset:0 0 88px 0}
 .spot{top:auto!important;bottom:44px;left:6px;right:6px}
 .viewbar{bottom:4px;height:38px}
 .fs-btn{top:8px;right:8px;bottom:auto;width:40px;height:40px;min-height:40px;background:#f7f4edd9}
 .walk-hud{left:10px;bottom:96px;gap:8px}.joy{width:104px;height:104px}.joy i{width:42px;height:42px;margin:-21px 0 0 -21px}
 .walk-btns{max-width:200px}.walk-btns button{min-height:38px;padding:6px 11px;font-size:12px}.walk-tip{white-space:normal;width:max-content;max-width:calc(100vw - 40px);font-size:11px}
 .viewer.is-fs #scene{inset:0 0 88px 0}.viewer.is-fs .spot{top:auto!important;bottom:44px}.viewer.is-fs .viewbar{bottom:4px}.viewer.is-fs .fs-btn{top:8px;bottom:auto}.viewer.is-fs .walk-hud{bottom:96px}
}
@media(max-height:620px) and (max-width:900px){main{grid-template-rows:56% 44%}#scene{inset:0 0 82px 0}.spot{bottom:40px}}
.walk-tip{transition:opacity .6s}.walk-tip.gone{opacity:0}
@media(max-width:900px){.joy{width:90px;height:90px}.joy i{width:38px;height:38px;margin:-19px 0 0 -19px}.joy:before{inset:8px}.walk-hud{gap:6px}.walk-btns{max-width:150px;gap:5px}.walk-btns button{min-height:36px;padding:5px 10px}}
/* cabinet editor popover */
.item-pop.cab-pop{max-width:300px;min-width:260px;gap:5px;padding:12px 12px 10px}
.cab-pop .cp-l{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#6b746e;font-weight:600;margin-top:4px}
.cab-pop .cp-row{display:flex;flex-wrap:wrap;gap:5px}.cab-pop .cp-row button{flex:1 1 auto;min-height:34px;padding:6px 9px;font-size:12.5px;text-align:center;border-color:#d9d5c9}
.cab-pop .cp-row button[aria-pressed=true]{background:#254638;color:#fff;border-color:#254638}
.cab-pop .cp-w{align-items:center}.cab-pop .cp-w output{min-width:52px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}
.cab-pop .cp-code{color:#8a6d3b;padding:0 4px}.cab-pop .cp-warn{color:#9a4b2b}
.cab-pop .cp-x{position:absolute;top:6px;right:6px;width:32px;min-height:32px;padding:0;border:0;background:none;font-size:20px;text-align:center}
.cab-pop b{padding-right:30px}

@media(max-width:900px){.item-pop.cab-pop{position:fixed;left:8px!important;right:8px;top:auto!important;bottom:8px;max-width:none;z-index:120;max-height:60dvh;overflow:auto}}
.item-pop.cab-pop.full{max-width:400px;min-width:340px;max-height:min(80vh,640px);overflow:auto;overscroll-behavior:contain}
.cab-pop .cp-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.cab-pop .cp-tile{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;min-height:76px;padding:7px 4px 6px;font-size:11px;line-height:1.2;text-align:center;border-radius:10px;border-color:#dcd7cb}
.cab-pop .cp-tile svg{width:34px;height:34px;flex:none;fill:#f6f2e8;stroke:#3a4a42;stroke-width:1.5;stroke-linejoin:round}
.cab-pop .cp-tile svg .k{fill:#3a4a42;stroke:#3a4a42;stroke-width:1.4;stroke-linecap:round}
.cab-pop .cp-tile svg .f{fill:#cfe1e8;stroke:#7b98a3}
.cab-pop .cp-tile[aria-pressed=true]{background:#eef3ec;border-color:#254638;box-shadow:inset 0 0 0 1.5px #254638}
.cab-pop .cp-tile[aria-pressed=true] span{font-weight:700;color:#1d3a2e}
.cab-pop .cp-sizes button{flex:1 1 17%;min-height:32px;padding:4px;font-size:12px}
.cab-pop .cp-more{background:#254638;color:#fff;border-color:#254638}.cab-pop .cp-tip{color:#6b746e}
@media(max-width:900px){.item-pop.cab-pop.full{min-width:0;max-height:70dvh}.cab-pop .cp-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.cab-pop .cp-exact{align-items:center}.cab-pop .cp-exact input{width:84px;min-height:36px;border:1px solid #d9d5c9;border-radius:8px;padding:6px 8px;font:inherit;font-size:16px}.cab-pop .cp-exact span{font-size:13px;color:#6b746e}
#smart-redo{min-height:44px;font-size:12px;padding:8px;margin-top:8px}#smart-undo,#smart-redo,#smart-close{width:calc(33.3% - 5px)!important}
@media(max-width:900px){.viewbar{overflow-x:auto;scrollbar-width:none;justify-content:flex-start}.viewbar::-webkit-scrollbar{display:none}.viewbar button{flex:none}}

.studio span{color:#6a604f}
#scene:focus-visible{outline:3px solid var(--accent,#2d5a45);outline-offset:-3px;border-radius:6px}#scene:focus:not(:focus-visible){outline:none}
.g-keys{font-size:12.5px;line-height:1.9}.g-keys kbd{display:inline-block;min-width:1.6em;padding:0 .35em;margin:0 1px;border:1px solid #cfc8bb;border-bottom-width:2px;border-radius:5px;background:#fbf9f5;font:600 11px/1.5 var(--sans);text-align:center;color:#25302b}@media(pointer:coarse){.g-keys{display:none}}
.two-tone{margin:14px 0 4px;padding:12px 14px;border:1px solid var(--line,#e2ddd2);border-radius:12px;background:rgba(255,255,255,.5)}.two-tone .control-label{margin:0 0 8px}.tt-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:6px 0;font-size:13px}.tt-row span{color:var(--ink,#202b27);font-weight:600}.tt-row select{flex:1;max-width:62%;min-height:40px;padding:6px 10px;border:1px solid var(--line,#d8d2c6);border-radius:9px;background:#fff;font:inherit;color:inherit}.tt-row select:focus-visible{outline:3px solid var(--accent,#2d5a45);outline-offset:1px}.tt-row select:disabled{opacity:.5}.two-tone .material-note{margin:6px 0 0}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.mydesigns{margin:16px 0 8px;padding:14px;border:1px solid var(--line,#e2ddd2);border-radius:14px;background:rgba(255,255,255,.55)}.mydesigns h3{margin:0 0 4px;font:600 15px/1.3 var(--sans);color:var(--ink,#202b27)}.mydesigns h3 small{font-weight:500;color:var(--muted,#69726d)}.md-help{margin:0 0 10px;font-size:12.5px;color:var(--muted,#69726d)}
.md-save{display:flex;gap:8px}.md-save input{flex:1;min-width:0;min-height:42px;padding:8px 12px;border:1px solid var(--line,#d8d2c6);border-radius:10px;font:inherit;background:#fff;color:inherit}.md-save button{min-height:42px;padding:0 14px;border-radius:10px;border:0;background:var(--accent,#2d5a45);color:#fff;font-weight:600}
.md-save input:focus-visible,.md-save button:focus-visible,.md-item button:focus-visible{outline:3px solid var(--accent,#2d5a45);outline-offset:2px}
.md-list{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px}.md-empty{font-size:12.5px;color:var(--muted,#69726d)}
.md-item{display:grid;grid-template-columns:72px 1fr auto auto;align-items:center;gap:10px;padding:6px;border:1px solid var(--line,#e6e1d6);border-radius:10px;background:#fff}.md-item img{width:72px;height:45px;object-fit:cover;border-radius:6px;background:#eee9df}.md-item div{min-width:0}.md-item b{display:block;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.md-item small{font-size:11.5px;color:var(--muted,#69726d)}.md-item button{min-height:36px;padding:0 12px;border-radius:8px;border:1px solid var(--line,#d8d2c6);background:#fbfaf7;font-weight:600}.md-item .md-del{min-width:36px;padding:0;font-size:18px;line-height:1;color:#7a3b2e}
body.dusk .mydesigns,body.dusk .two-tone{background:rgba(255,255,255,.06)}
.seg-sub{margin:-2px 0 10px 26px}.seg-sub button{font-size:12px;min-height:34px}
.back{white-space:nowrap}@media(max-width:900px){.back{max-width:none!important}}
.isl-fins{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px;margin:4px 0 6px}.isl-fins button{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 4px 7px;border:1px solid var(--line,#dcd6ca);border-radius:12px;background:#fff;font-size:11.5px;line-height:1.2;color:var(--ink,#202b27);min-height:44px}.isl-fins button i{width:34px;height:34px;border-radius:50%;background-size:cover;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}.isl-fins button i.match{background:conic-gradient(#d9d5c9 0 25%,#bda17c 0 50%,#35434e 0 75%,#83907d 0)}.isl-fins button[aria-pressed=true]{border-color:var(--accent,#2d5a45);box-shadow:0 0 0 2px var(--accent,#2d5a45) inset}.isl-fins button:disabled{opacity:.45;cursor:not-allowed}.isl-fins button:focus-visible{outline:3px solid var(--accent,#2d5a45);outline-offset:2px}.isl-note{margin:0 0 10px}
#scene.taping canvas{cursor:crosshair!important}
.dcheck{margin:12px 0 14px;padding:12px 14px;border:1px solid var(--line,#e2ddd2);border-radius:12px;background:rgba(255,255,255,.5)}.dcheck .qhead small{font-weight:500;color:var(--muted,#69726d);margin-left:6px}#dcheck{list-style:none;margin:6px 0 4px;padding:0;display:grid;gap:8px}#dcheck li{padding:8px 10px;border-radius:9px;background:#fff;border-left:4px solid #8aa58f}#dcheck li.warn{border-left-color:#c49a45}#dcheck li.bad{border-left-color:#b5523d}#dcheck b{display:block;font-size:13px;font-weight:600;color:var(--ink,#202b27)}#dcheck span{display:block;font-size:12px;color:var(--muted,#5f6862);margin-top:2px;line-height:1.45}
.wp-size{display:grid;gap:6px;margin:6px 0 4px}.wp-row{display:grid;grid-template-columns:60px 36px 1fr 36px;align-items:center;gap:6px}.wp-row span{font-size:12.5px;font-weight:600;color:var(--ink,#202b27)}.wp-row button{min-height:36px;border-radius:9px;border:1px solid var(--line,#d8d2c6);background:#fbfaf7;font-size:18px;line-height:1;padding:0}.wp-row output{text-align:center;font-weight:700;font-size:14px}
.wp-styles{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0}.wp-styles button{flex:1 1 auto;min-height:34px;padding:0 10px;border-radius:9px;border:1px solid var(--line,#d8d2c6);background:#fff;font-size:12px}.wp-styles button[aria-pressed=true]{border-color:var(--accent,#2d5a45);box-shadow:inset 0 0 0 2px var(--accent,#2d5a45)}.wp-reset{font-size:12px}
.wp-row button:focus-visible,.wp-styles button:focus-visible{outline:3px solid var(--accent,#2d5a45);outline-offset:2px}
/* Precision measurement controls */
.tape-tools{position:absolute;z-index:12;left:50%;top:100px;transform:translateX(-50%);width:min(390px,calc(100% - 32px));padding:12px 14px;background:rgba(248,247,243,.97);color:#172a23;border:1px solid #c9c6ba;border-radius:14px;box-shadow:0 8px 25px #172a2320;display:flex;gap:8px;flex-wrap:wrap;align-items:center}.tape-tools[hidden]{display:none}.tape-tools select,.tape-tools button,.pm-fine select,.pm-fine button,#pm-unit{font:inherit;min-height:44px;background:#fff;color:#172a23;border:1px solid #b8beb8;border-radius:8px;padding:8px}.tape-tools output{font-weight:600;width:100%;font-size:14px}.tape-tools small{font-size:11px;color:#4d5d54}.pm-fine{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:12px 0}.pm-fine button{min-width:44px}.pm-check{display:flex;gap:10px;align-items:center;line-height:1.5;margin:16px 0;font-size:13px}.pm-check input{min-width:22px;min-height:22px;accent-color:#254c3e}.pm-error{color:#a02820;font-weight:600;font-size:13px}.pm-ftin input{min-width:0;width:110px}.tape-tools :focus-visible,.pm-fine :focus-visible{outline:3px solid #a67631;outline-offset:2px}@media(max-width:700px){.tape-tools{top:62px;padding:8px 12px;width:calc(100% - 24px)}.tape-tools label{font-size:12px}.tape-tools small{font-size:10px}}

/* A cool mist studio backdrop, distinct from the warm website paper. */
.viewer{background:#d5e1df}.dusk .viewer{background:#334952}#photo-image{z-index:2;background:#d5e1df}.dusk #photo-image{background:#334952}

body:not(.dusk) .viewer{background:#d5e1df}

.wp-lab{display:block;font-size:12px;font-weight:600;color:#4d5d54;margin:8px 0 2px}

/* Comfortable, reachable editing controls on touch screens. */
#scene canvas{touch-action:none;-webkit-user-select:none;user-select:none}
.viewbar button{min-height:44px;touch-action:manipulation}
#pan-view[aria-pressed=true],#cabinet-list{background:#254638;color:#fff;border-color:#254638}
.cab-pop .cp-x{width:44px;min-height:44px;background:#f8f6f0;border:1px solid #ddd6c8;border-radius:50%;z-index:2}
.cab-pop .cp-row button,.cab-pop .cp-sizes button{min-height:44px}
.cabinet-picker>button:not(.cp-x){display:block;width:100%;margin:6px 0;padding:12px;text-align:left}
.item-pop.cab-pop{box-shadow:0 18px 70px #172a2340;border:1px solid #d5cdbd;border-radius:20px;padding:20px}
.cab-pop> b{display:block;padding-right:44px;font-size:17px;margin-bottom:8px}
.cab-pop .cp-tile{min-height:90px;font-size:12px;padding:9px 4px}
@media(max-width:900px){
 .item-pop.cab-pop,.item-pop.cab-pop.full{left:8px!important;right:8px;bottom:max(8px,env(safe-area-inset-bottom));top:auto!important;width:auto;max-width:none;max-height:58dvh;min-width:0;padding:18px 14px 24px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
 .cab-pop .cp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .cab-pop .cp-tile{min-height:88px}
 .viewbar{gap:6px;padding:8px;scroll-snap-type:x proximity}
 .viewbar button{scroll-snap-align:start;padding:10px 12px}
 .hint{font-size:12px;line-height:1.5}
}

.actual-size{font-size:12px;line-height:1.65;background:#edf1eb;border:1px solid #cfd9cf;border-radius:12px;padding:12px;color:#254638}

.cab-pop .cp-x{position:sticky;top:0;right:auto;align-self:flex-end;flex:0 0 44px;margin-top:-12px;margin-bottom:-32px;box-shadow:0 2px 8px #172a2312}