*{box-sizing:border-box}body{margin:0;font:14px/1.4 system-ui,sans-serif;color:#173f46;background:#e9edef;overflow:hidden}button,input,select{font:inherit}button,select,input{border:1px solid #cad4d7;border-radius:8px;padding:10px 12px;min-height:44px;background:#fff;color:#173f46}button{cursor:pointer;font-weight:600}button:disabled{opacity:.5;cursor:default}button:hover:not(:disabled){background:#e8f0ef}button[aria-pressed=true],#create-render{background:#173f46;color:white}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #39a7b1;outline-offset:2px}input,select{width:100%}input[type=color]{padding:4px}#stage{position:fixed;inset:0;width:100vw;height:100dvh}#stage canvas{width:100%;height:100%;display:block;touch-action:none}#tools{position:absolute;top:12px;left:12px;right:12px;display:flex;gap:6px;align-items:center;flex-wrap:wrap;transition:opacity .18s}#tools select{width:auto;max-width:180px}#message{position:absolute;left:12px;bottom:12px;background:#ffffffeb;padding:8px 12px;max-width:calc(100% - 140px);border-radius:8px;font-size:13px;pointer-events:none}#pad{display:none;position:absolute;right:12px;bottom:12px;grid-template-columns:44px 44px;gap:4px}.walking #pad{display:grid}#pad button{padding:8px;touch-action:none;user-select:none}#finish{position:absolute;left:12px;top:118px;background:#ffffffd9;border-radius:6px;padding:5px 9px;font-size:12px;pointer-events:none;max-width:calc(100% - 24px)}#studio-status{position:absolute;bottom:64px;left:12px;right:120px;max-width:650px;background:#ffffffed;border-radius:8px;padding:8px 12px;pointer-events:none}#studio-status:empty{display:none}#drawer{position:absolute;right:12px;top:70px;bottom:76px;width:min(380px,calc(100% - 24px));background:#fffffff5;box-shadow:0 8px 40px #12272e33;border:1px solid #d9e1e2;border-radius:12px;display:flex;flex-direction:column;z-index:5;overflow:hidden}#drawer[hidden]{display:none}#drawer header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid #dce4e4}#drawer h2{font-size:18px;margin:0}#drawer-content{padding:16px;overflow:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:12px}#drawer-content p{margin:0}#drawer-content h3{font-size:16px;margin:10px 0 0}#drawer img,#drawer canvas{width:100%;height:auto;border-radius:8px;background:#e5e9e9}#drawer a{color:#146979;font-weight:600}.hint{color:#586b71;font-size:14px}.studio-field{display:flex;flex-direction:column;gap:5px}.prop-catalogue{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-height:340px;overflow:auto}.prop-catalogue button{text-align:left;min-height:70px;display:flex;flex-direction:column;justify-content:center;gap:3px}.prop-catalogue small{font-size:12px;color:#687a7e;text-transform:capitalize;font-weight:400}.placed-item,.studio-actions{display:flex;gap:6px;flex-wrap:wrap}.placed-item>button:first-child{flex:1;text-align:left}.prop-edit{padding:12px;background:#edf3f3;border-radius:8px;display:flex;flex-wrap:wrap;gap:8px}.prop-edit label{flex:1;min-width:120px}.camera-card{display:flex;flex-direction:column;gap:8px;border:1px solid #d5dfe1;border-radius:10px;padding:12px}.camera-card small{color:#66777c}.camera-card .earlier-render{color:#965d27}.camera-card button{padding:8px 10px}.walking.ui-idle:not(.panel-open) #tools,.walking.ui-idle:not(.panel-open) #finish,.walking.ui-idle:not(.panel-open) #message{opacity:0;pointer-events:none}#reveal-tools{position:absolute;top:12px;right:12px;display:none}.walking.ui-idle:not(.panel-open) #reveal-tools{display:block}#tools:focus-within{opacity:1!important;pointer-events:auto!important}@media(max-width:800px){#tools{flex-wrap:nowrap;overflow:auto;padding-bottom:4px}#tools>*{flex-shrink:0}#finish{top:68px}#drawer{top:116px}#message{font-size:12px}}@media(prefers-reduced-motion:reduce){#tools{transition:none}}
/* The framed canvas is also the exported camera image: no UI is captured. */
#stage{display:flex;align-items:center;justify-content:center;background:#20292d}#stage canvas{flex:none;width:auto;height:auto;max-width:100%;max-height:100%}
#tools{right:auto;max-width:calc(100% - 24px);padding:7px;background:#f7f7f2ed;border:1px solid #ffffff8c;border-radius:13px;box-shadow:0 4px 24px #17292d16;backdrop-filter:blur(14px);flex-wrap:nowrap;z-index:6}#tools button{font-weight:500}.view-switch{display:flex;gap:3px;padding:3px;background:#e6eae8;border-radius:9px}.view-switch button{border:0}#create-render{font-weight:650!important}#more-tools{position:relative}#more-tools summary{list-style:none;cursor:pointer;padding:12px;min-height:44px;white-space:nowrap}#more-tools summary:after{content:'⌄';margin-left:8px}#room-tools-body{position:absolute;right:0;top:calc(100% + 12px);display:flex;flex-direction:column;gap:7px;width:220px;padding:12px;background:#f7f7f2;border:1px solid #d4dcdc;border-radius:12px;box-shadow:0 8px 32px #0002}#room-tools-body select{max-width:100%;width:100%}#more-tools:not([open]) #room-tools-body{display:none}#finish{top:92px}#drawer{top:92px;bottom:78px}#drawer textarea{font:13px/1.5 ui-monospace,monospace;width:100%;resize:vertical;padding:10px;border:1px solid #cad4d7;border-radius:8px}#drawer details summary{cursor:pointer;padding:5px 0;color:#41585d}#drawer ul{padding-left:20px;font-size:14px;color:#53656a}#drawer li{margin:8px 0}.camera-card .studio-actions button:last-child{background:#173f46;color:white}.camera-card details button{margin:6px 6px 0 0;font-size:13px}
@media(max-width:800px){#tools{padding:4px;gap:4px;overflow:visible;max-width:calc(100% - 16px);left:8px;top:8px;flex-wrap:wrap}#tools button{padding:8px;min-height:44px}#finish{display:none}#drawer{top:128px;right:8px;bottom:66px}#room-tools-body{position:fixed;top:124px;right:8px;max-height:calc(100dvh - 145px);overflow:auto}}

.photo-preview-grid{display:grid;gap:14px}.photo-preview-grid figure{margin:0}.photo-preview-grid figcaption{font-size:14px;margin-top:5px;color:#41585d}.photo-preview-grid img{display:block;aspect-ratio:16/9;object-fit:contain}

/* Download controls stay outside the image scroller, including short screens. */
#drawer header,#drawer-actions{flex-shrink:0}#drawer-content{min-height:0}#drawer-actions{padding:12px 16px;background:#f5f8f6;border-bottom:1px solid #dce4e4}#drawer-actions[hidden]{display:none}.pdf-delivery-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.pdf-delivery-controls a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 12px;border:1px solid #cad4d7;border-radius:8px;background:#fff;text-decoration:none;font-size:14px}.pdf-delivery-controls a[hidden]{display:none}#drawer .pdf-primary{background:#173f46;color:#fff;font-size:14px;font-weight:600}.pdf-delivery .hint{margin:8px 0 0;font-size:14px}.photo-preview-grid img{max-height:200px}.photo-preview-grid{flex-shrink:0}
@media(max-height:550px){#drawer{top:8px;bottom:8px;z-index:9}#drawer header{padding:8px 12px}#drawer-actions{padding:8px 12px}.pdf-delivery .hint{font-size:13px}}
.spec-section{border-top:1px solid #d9e1dc;padding:16px 0}.spec-section summary{font-weight:650;cursor:pointer;padding:6px 0 12px}.spec-section .studio-field,.spec-section .field{display:grid;gap:6px;margin-bottom:12px}.spec-section select,.spec-section input{width:100%;min-height:42px;box-sizing:border-box}.spec-section .planner-selection-fields{display:grid;gap:12px}.spec-create{position:sticky;bottom:0;width:100%;padding:16px!important;background:#173f45!important;color:#fff!important;border-radius:12px;box-shadow:0 -8px 20px #fff}

#drawer.render-review-open{width:min(900px,calc(100vw - 32px));max-height:calc(100dvh - 120px)}
.render-camera-review{padding:24px 0;border-top:1px solid #d4dddd;display:grid;gap:14px}.render-camera-review h3{font-size:1.3rem;margin:0}.render-camera-review select{max-width:100%}.render-compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.render-compare figure{margin:0}.render-compare img{width:100%;height:auto;aspect-ratio:16/10;object-fit:contain;background:#e9eded}.render-compare figcaption{font-size:.875rem;line-height:1.5}.render-upload{display:grid;gap:10px;padding:18px;border:1px dashed #8aa3a4;border-radius:12px;background:#f3f7f5;font-weight:600}.render-upload small{font-weight:400}.render-empty{display:grid;place-items:center;background:#f0f3f1;padding:22px;text-align:center}.render-error{padding:14px;background:#fff0e7;color:#733d21;border-radius:8px}.render-download{padding:9px 0;display:inline-block}.render-demo-preview{width:min(1000px,94vw);max-height:90dvh;overflow:auto;border:0;border-radius:16px;padding:24px}.render-demo-preview img{width:100%;height:auto}.render-demo-preview::backdrop{background:#123236cc}
@media(max-width:650px){.render-compare{grid-template-columns:1fr}#drawer.render-review-open{width:calc(100vw - 16px);max-height:calc(100dvh - 96px)}.render-upload input{max-width:100%}}

.spec-section summary small{display:block;font-size:14px;font-weight:400;color:#586b71;margin-top:4px}.spec-section>.spec-section{padding:10px 0}.spec-section p{margin:8px 0!important}.spec-section button{margin-top:8px}#drawer-content>strong{font-size:16px}#drawer-content>button{width:100%}

#viewer-loading{position:absolute;z-index:8;left:50%;top:50%;transform:translate(-50%,-50%);width:min(400px,calc(100% - 32px));padding:22px;background:#ffffffed;color:#173f46;border:1px solid #cad4d7;border-radius:12px;text-align:center;box-shadow:0 8px 30px #0002;font-size:16px}
#viewer-loading[hidden]{display:none}#viewer-loading p{margin:0}#viewer-loading button{margin-top:16px;min-height:44px;background:#173f46;color:#fff}#viewer-loading button[hidden]{display:none}
#reveal-tools[hidden],#more-tools[hidden],#exit-room[hidden]{display:none!important}
#finish:empty{display:none!important}

#enter-vr[hidden]{display:none!important}

/* Lee 9 Oct 2026: subtle 'tap to open' hotspots in the walkthrough */
.kc-hotspots{position:fixed;inset:0;pointer-events:none;z-index:6;overflow:hidden}
.kc-hotspot{position:absolute;left:0;top:0;display:inline-flex;align-items:center;gap:8px;min-height:0;padding:6px 13px 6px 8px;border:1px solid rgba(255,255,255,.32);border-radius:999px;background:rgba(16,22,28,.62);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font:600 12.5px/1.2 system-ui,-apple-system,"Segoe UI",Arial,sans-serif;letter-spacing:.01em;white-space:nowrap;box-shadow:0 6px 18px rgba(0,0,0,.22);opacity:0;visibility:hidden;transition:opacity .35s ease,visibility 0s linear .35s;pointer-events:none;cursor:pointer}
.kc-hotspot.show{opacity:1;visibility:visible;transition:opacity .35s ease;pointer-events:auto}
.kc-hotspot:hover:not(:disabled){background:rgba(16,22,28,.8)}
.kc-hotspot-dot{position:relative;width:10px;height:10px;border-radius:50%;background:#f6d78e;box-shadow:0 0 0 3px rgba(246,215,142,.25),0 0 12px 3px rgba(246,215,142,.7);flex:none}
.kc-hotspot-dot::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1.5px solid rgba(246,215,142,.55);animation:kc-hotspot-pulse 2.4s ease-out infinite}
@keyframes kc-hotspot-pulse{0%{transform:scale(.55);opacity:.9}100%{transform:scale(1.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.kc-hotspot-dot::after{animation:none}}
.render-lighting{display:grid;gap:6px;border:1px solid #d8dcdf;border-radius:8px;padding:8px 10px;margin:8px 0;font-size:13px}.render-lighting label{display:flex;align-items:center;gap:6px;justify-content:space-between}.render-lighting input[type=range]{flex:1}.lighting-presets{display:flex;gap:6px;flex-wrap:wrap}