:root{--canvas: #eeefeb;--surface: #fafbf9;--surface-raised: #fff;--ink: #272d27;--muted: #697167;--line: #dfe3da;--line-soft: #edf0e8;--accent: #546448;--accent-hover: #424f38;--selected: #e8ecdf;--warning: #826334;--warning-bg: #f3efe4;--overlay: #1a211950;--olive: #747862;--linen: #c3bba9;--chalk: #e0ddd4;--graphite: #424e4d;--s1: 4px;--s2: 8px;--s3: 12px;--s4: 16px;--s5: 20px;--s6: 24px;--s8: 32px;--xs: 12px;--sm: 13px;--base: 14px;--md: 16px;--lg: 18px;--radius: 6px;--dialog-radius: 10px;--shadow: 0 3px 14px #24301f12;--header-height: 64px;--footer-height: 30px;--panel-width: 288px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--ink);background:var(--canvas);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box;letter-spacing:0}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{font-size:var(--sm);line-height:1.5}button,input{font:inherit}button{cursor:pointer;color:inherit;border:0;background:none}button,input{-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible,summary:focus-visible,#scene:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button{transition:background-color .15s,color .15s}button:active{opacity:.8}button:disabled{cursor:default;opacity:.5}svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}h1,h2,h3,p{margin:0}#app{height:100dvh;display:flex;flex-direction:column}.app-header{min-height:var(--header-height);display:flex;align-items:center;justify-content:space-between;gap:var(--s4);padding:0 var(--s5);background:var(--surface);border-bottom:1px solid var(--line);z-index:4}.identity{display:flex;align-items:center;gap:var(--s3);min-width:195px}.identity>svg{color:var(--accent);width:27px;height:27px;stroke-width:1.7}.identity h1{font-size:var(--md);font-weight:650;line-height:1.4}.identity span{font-size:var(--xs);color:var(--muted)}.view-tabs{display:flex;background:var(--line-soft);padding:var(--s1);border-radius:var(--radius)}.view-tabs button{padding:var(--s2) var(--s4);border-radius:var(--s1);min-height:36px;white-space:nowrap;font-weight:500;color:var(--muted)}.view-tabs button[aria-pressed=true]{background:var(--surface-raised);color:var(--ink);box-shadow:0 1px 3px #24301f10}.view-tabs button:hover{color:var(--ink)}.header-actions{display:flex;gap:var(--s2);justify-content:flex-end;min-width:195px}.quiet-button{font-size:var(--sm);padding:0 var(--s3);min-height:44px;border-radius:var(--radius)}.quiet-button:hover,.icon-button:hover{background:var(--line-soft)}.icon-button{width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;border-radius:var(--radius);font-size:24px}.workspace{flex:1;min-height:0;display:flex;position:relative}.viewport{position:relative;min-width:0;flex:1;overflow:hidden;background:var(--canvas)}#scene{width:100%;height:100%;position:absolute;inset:0;touch-action:none;outline-offset:-3px}#scene canvas{display:block;width:100%;height:100%}.view-caption{position:absolute;top:var(--s6);left:var(--s6);pointer-events:none;display:flex;flex-direction:column;padding:var(--s2) var(--s3);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);gap:2px;box-shadow:var(--shadow)}.view-caption strong{font-size:var(--sm);font-weight:600}.view-caption span{font-size:var(--xs);color:var(--muted)}.view-actions{position:absolute;top:var(--s6);right:var(--s6);display:flex;gap:var(--s1);padding:2px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}.view-actions .icon-button{width:38px;height:38px;flex-basis:38px}.view-bottom{position:absolute;bottom:var(--s6);left:var(--s6);right:var(--s6);display:flex;align-items:center;gap:var(--s4);justify-content:space-between;pointer-events:none}.view-bottom button{pointer-events:auto}.primary-button{color:var(--surface-raised);background:var(--accent);border:1px solid #ffffff30;min-height:48px;padding:0 var(--s4);display:flex;align-items:center;justify-content:center;gap:var(--s3);border-radius:var(--radius);box-shadow:var(--shadow);font-weight:550;font-size:var(--base);white-space:nowrap}.primary-button:hover{background:var(--accent-hover)}.primary-button kbd{font-family:inherit;font-size:10px;font-weight:400;padding:2px var(--s1);border:1px solid #ffffff40;border-radius:3px;color:#ffffffc9}.control-help,.scale-note{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s2) var(--s3);color:var(--muted);font-size:var(--xs)}.control-help{display:flex;align-items:center;gap:var(--s2)}.mouse-symbol{width:12px;height:17px;border:1px solid var(--muted);border-radius:6px;position:relative}.mouse-symbol:before{content:"";width:1px;height:4px;background:var(--muted);position:absolute;top:3px;left:5px}.scale-note{font-variant-numeric:tabular-nums}.inspector{width:var(--panel-width);flex:0 0 var(--panel-width);background:var(--surface);border-left:1px solid var(--line);display:flex;flex-direction:column;z-index:5}.inspector[hidden]{display:none}.inspector-title{display:flex;align-items:center;justify-content:space-between;min-height:60px;padding:0 var(--s5);border-bottom:1px solid var(--line-soft)}.inspector-title h2{font-size:var(--base);font-weight:650}.panel-scroll{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;min-height:0}.space-summary,.settings-section,.dimensions-section{padding:var(--s4) var(--s5);border-bottom:1px solid var(--line)}.summary-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);font-size:var(--xs)}.summary-heading>span{color:var(--muted)}.text-button{color:var(--accent);font-size:var(--xs);min-height:32px;text-align:left;padding:0;white-space:nowrap}.text-button:hover{text-decoration:underline}#mini-plan{width:100%;height:171px;display:block;margin:var(--s1) 0 var(--s3)}.clearance-row{display:flex;justify-content:space-between;align-items:baseline;padding:var(--s1) 0;font-size:var(--xs)}.clearance-row strong{font-size:var(--base);font-variant-numeric:tabular-nums;font-weight:600}.clearance-row:first-of-type strong{color:var(--warning)}.note{margin-top:var(--s3);color:var(--warning);background:var(--warning-bg);border-left:2px solid var(--warning);padding:var(--s2) var(--s3);font-size:var(--xs);line-height:1.55}.note:empty{display:none}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--s3)}.section-heading h3{font-size:var(--sm);font-weight:650}.section-heading>span{color:var(--muted);font-size:var(--xs)}.toggle-row,.color-row{display:flex;align-items:center;justify-content:space-between;min-height:44px;gap:var(--s2)}.toggle-row{cursor:pointer}.toggle-row input{position:absolute;opacity:0}.switch{width:30px;height:18px;border-radius:12px;background:var(--line);position:relative;flex:0 0 auto}.switch:after{content:"";position:absolute;width:12px;height:12px;border-radius:50%;left:3px;top:3px;background:var(--surface-raised);transition:transform .15s}.toggle-row input:checked+.switch{background:var(--accent)}.toggle-row input:checked+.switch:after{transform:translate(12px)}.toggle-row input:focus-visible+.switch{outline:2px solid var(--accent);outline-offset:3px}.swatches{display:flex;gap:var(--s1)}.swatch{width:27px;height:32px;position:relative}.swatch:before{content:"";position:absolute;inset:6px 3px;border-radius:50%;background:var(--swatch);border:1px solid #00000018}.swatch[aria-pressed=true]:after{content:"";position:absolute;inset:2px -1px;border:1px solid var(--accent);border-radius:50%}.olive{--swatch: var(--olive)}.linen{--swatch: var(--linen)}.chalk{--swatch: var(--chalk)}.graphite{--swatch: var(--graphite)}.eye-label{display:flex;align-items:center;justify-content:space-between;margin-top:var(--s3)}.eye-label output{font-size:var(--xs);font-variant-numeric:tabular-nums;color:var(--muted)}input[type=range]{display:block;width:100%;height:26px;accent-color:var(--accent);margin:var(--s1) 0 0;cursor:pointer}.section-note,.derived-note{color:var(--muted);font-size:var(--xs);line-height:1.55}.section-note{margin:calc(-1 * var(--s1)) 0 var(--s3)}details{border-top:1px solid var(--line-soft)}summary{font-weight:550;cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:space-between;list-style:none}summary::-webkit-details-marker{display:none}summary:after{content:"+";color:var(--muted);font-size:var(--md);font-weight:400}details[open] summary:after{content:"−"}.field{display:grid;grid-template-columns:minmax(0,1fr) 60px;column-gap:var(--s2);padding:var(--s2) 0;align-items:center}.field label{display:flex;flex-direction:column;font-size:var(--xs)}.field label small{color:var(--muted);font-size:10px;line-height:1.6}.field label small.measured{color:var(--accent)}.field input{width:60px;min-height:34px;padding:var(--s1) var(--s2);border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-raised);text-align:right;color:var(--ink);font-variant-numeric:tabular-nums;appearance:textfield;-moz-appearance:textfield}.field input::-webkit-inner-spin-button,.field input::-webkit-outer-spin-button{appearance:none;margin:0}.field input:invalid{border-color:var(--warning)}.derived-note{margin:var(--s2) 0 var(--s3)}.panel-footer{padding:var(--s4) var(--s5) var(--s6);display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s1)}.panel-footer p{width:100%;color:var(--muted);font-size:10px;margin-bottom:var(--s1)}.app-footer{min-height:var(--footer-height);display:flex;align-items:center;justify-content:space-between;gap:var(--s3);padding:0 var(--s5);background:var(--surface);border-top:1px solid var(--line);color:var(--muted);font-size:10px;z-index:6}.app-footer>span{display:flex;align-items:center;gap:var(--s2)}.legend-square{width:6px;height:6px;background:var(--warning);opacity:.7}.mobile-only{display:none}#crosshair{display:none;position:absolute;top:50%;left:50%;width:5px;height:5px;border-radius:50%;border:1px solid #ffffffc9;background:#00000060;pointer-events:none}body.walking #crosshair{display:block}body.locked .view-caption,body.locked .view-actions,body.locked .control-help{opacity:0;pointer-events:none}#walk-message{position:absolute;bottom:92px;left:50%;transform:translate(-50%);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:var(--s2) var(--s3);font-size:var(--xs);text-align:center;max-width:calc(100% - 48px);pointer-events:none;opacity:0;transition:opacity .15s}#walk-message.visible{opacity:1}#touch-controls{display:none;position:absolute;bottom:94px;left:var(--s5);text-align:center;touch-action:none}#touch-controls>div{display:flex;gap:var(--s1)}#touch-controls button{width:44px;height:44px;margin-bottom:var(--s1);border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);font-size:var(--lg);touch-action:none}#touch-controls button.active{background:var(--selected)}#plan-labels{position:absolute;inset:0;pointer-events:none}.plan-label{position:absolute;transform:translate(-50%,-50%);padding:3px var(--s2);background:var(--surface);border:1px solid var(--line);border-radius:var(--s1);font-size:var(--xs);white-space:nowrap;color:var(--ink)}.plan-label.dimension{color:var(--accent);border:0;background:transparent;font-weight:600}.plan-label.vertical{writing-mode:vertical-rl;transform:translate(-50%,-50%) rotate(180deg)}.plan-label.warning{color:var(--warning)}#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--s4);background:var(--canvas);z-index:10}#loading[hidden]{display:none}.loading-mark{width:30px;height:30px;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:loading 1s linear infinite}@keyframes loading{to{transform:rotate(360deg)}}#error{position:absolute;left:var(--s6);right:var(--s6);top:45%;background:var(--surface);border:1px solid var(--line);padding:var(--s6);z-index:11}dialog{width:min(1060px,calc(100vw - 32px));max-height:calc(100dvh - 48px);padding:var(--s6);background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--dialog-radius)}dialog::backdrop{background:var(--overlay)}.dialog-heading{display:flex;justify-content:space-between;gap:var(--s4);margin-bottom:var(--s5)}.dialog-heading h2{font-size:var(--lg);margin-bottom:var(--s1)}.dialog-heading p{font-size:var(--sm);color:var(--muted)}.reference-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4)}figure{margin:0}figure img{display:block;width:100%;aspect-ratio:1.5;object-fit:contain;background:var(--canvas)}figcaption{font-size:var(--xs);margin-top:var(--s2);color:var(--muted)}@media(max-width:1100px){.scale-note{display:none}.view-bottom{justify-content:space-between}.header-actions,.identity{min-width:150px}}@media(max-width:800px){:root{--header-height: 112px}.app-header{flex-wrap:wrap;gap:0;padding:var(--s2) var(--s4);align-content:center}.identity{flex:1}.identity span{display:none}.identity h1{font-size:var(--base)}.identity>svg{width:23px;height:23px}.header-actions{min-width:0}.view-tabs{order:3;flex:0 0 100%;margin-top:var(--s1)}.view-tabs button{flex:1;min-height:36px;padding:var(--s2) var(--s2);font-size:var(--xs)}.inspector{position:absolute;right:0;top:0;bottom:0;width:min(320px,100%);box-shadow:-6px 0 22px #24301f12}.mobile-only{display:grid}.inspector-title{min-height:52px}.view-caption{left:var(--s3);top:var(--s3);padding:var(--s2)}.view-caption span{font-size:10px}.view-caption strong{font-size:var(--xs)}.view-actions{right:var(--s3);top:var(--s3)}.view-actions .icon-button{width:34px;height:38px;flex-basis:34px}.view-bottom{bottom:var(--s5);left:var(--s3);right:var(--s3);justify-content:center;flex-wrap:wrap;gap:var(--s2)}.control-help{order:2;font-size:10px;padding:var(--s1) var(--s2)}.primary-button{min-height:46px}.app-footer{padding:0 var(--s3);font-size:9px}.app-footer #footer-status{display:none}.reference-grid{grid-template-columns:minmax(0,1fr)}.dialog-heading p{font-size:var(--xs)}dialog{padding:var(--s4)}body.walking #touch-controls{display:block}.primary-button kbd,body.walking .control-help{display:none}#walk-message{bottom:204px}.plan-label{font-size:10px;padding:2px var(--s1)}}@media(max-width:380px){.desktop-label{display:none}.view-caption{max-width:calc(100% - 106px)}.view-caption span{line-height:1.5}.control-help{flex-basis:auto}.view-bottom{flex-direction:column}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.15s!important;transition-duration:0ms!important}}
