:root{color-scheme:dark;--paper:#f1f0e8;--muted:#b7bcb4;--ink:#1c2520;--accent:#dae7b8}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#222b25;color:var(--paper);font:13px -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}button,input,select{font:inherit}button{cursor:pointer;color:inherit;border:1px solid #ffffff29;background:#20292199;border-radius:5px;padding:12px 16px;transition:background .2s}button:hover{background:#465044}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button:disabled{opacity:.45;cursor:wait}button[hidden],[hidden]{display:none!important}#viewport{position:absolute;inset:0}#viewport canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none}header{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:28px 32px;pointer-events:none;background:linear-gradient(#101c1680,transparent)}header>*{pointer-events:auto}.identity{display:flex;gap:15px;align-items:center;font-size:11px;font-weight:600;letter-spacing:.16em;text-shadow:0 1px 8px #0005}.brand{font:32px Georgia,serif;border-right:1px solid #ffffff4d;padding-right:15px;letter-spacing:-.06em}.identity div span{display:block;font-size:8px;letter-spacing:.14em;color:#d4d9d1;margin-top:7px}nav{display:flex;gap:8px}nav button{backdrop-filter:blur(15px)}.veil{position:absolute;inset:0;display:flex;align-items:center;background:linear-gradient(90deg,#101c17f5 0%,#14221de6 34%,#14221d3b 100%),url("assets/preview.png") center/cover;padding:9vw;transition:opacity .5s}.intro{max-width:600px}.eyebrow{font-size:10px;letter-spacing:.2em;color:var(--accent);margin-bottom:26px}h1{font:clamp(42px,5.6vw,80px)/1.08 Georgia,serif;letter-spacing:-.045em;font-weight:400;margin:0 0 24px}.intro p{font-size:15px;line-height:1.9;color:#c5cfc5;margin-bottom:32px}.primary{background:var(--accent);color:#243025;border:0;font-weight:600;min-height:49px;display:flex;justify-content:space-between;align-items:center;gap:45px}.primary:hover{background:#e5f0ca}.intro-note{font-size:10px;color:#b9c1b5;margin-top:21px}.load{height:2px;background:#ffffff24;max-width:285px;margin-bottom:10px}#progress{height:2px;background:var(--accent);width:2%;transition:width .3s}#status{font-size:11px;color:var(--muted);margin-bottom:22px;max-width:360px}.intro-footer{position:absolute;bottom:34px;left:9vw;right:4vw;display:flex;justify-content:space-between;color:#c4ccc0;font-size:9px;letter-spacing:.12em}#hud{position:absolute;bottom:0;left:0;right:0;padding:30px 32px;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(transparent,#1420198c);pointer-events:none;font-size:11px}#hud>div{display:flex;align-items:center;gap:10px}.muted{color:var(--muted)}.separator{opacity:.4;margin:0 5px}.live-dot{height:5px;width:5px;border-radius:50%;background:var(--accent)}body.intro #hud{display:none}#doorHint{display:flex;align-items:center}#doorHint button{backdrop-filter:blur(12px);font-size:12px}kbd{font:10px -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;padding:4px 6px;border:1px solid #ffffff30;border-radius:3px;background:#ffffff08;white-space:nowrap}#doorHint kbd{margin-right:8px}.panel-heading{display:flex;justify-content:space-between;align-items:center;font:22px Georgia,serif}.panel-heading button{border:0;padding:0 5px;font:26px Georgia;background:transparent}.acc-body p{line-height:1.8}.acc-body .primary{width:100%;margin:25px 0 10px}#reset{width:100%;font-size:11px}label{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:23px;font-size:12px}input[type=range]{width:130px;accent-color:var(--accent)}select{background:#28342d;border:1px solid #ffffff30;color:var(--paper);padding:5px}.keyrow{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff10;padding:12px 0;font-size:11px}.small{font-size:10px}#roomList{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:14px 0 0}#roomList button{font-size:11px;padding:10px;text-align:left;display:flex;gap:8px;align-items:center}.num{flex:none;display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--accent);color:#243025;font-weight:700;font-size:11px}/* 430px leaves room for the panel title, the other section headers and the view buttons, so only short screens scroll. */
#plan{width:100%;height:clamp(260px,calc(100vh - 430px),900px);height:clamp(260px,calc(100dvh - 430px),900px);margin-top:6px}#plan svg{width:100%;height:100%}#plan .wall{fill:#c2c7b1}#plan .room{fill:#ffffff0a;stroke:#ffffff30;stroke-width:.02}#plan .you{fill:none;stroke:var(--accent);stroke-width:.08;pointer-events:none}#plan .view{cursor:pointer}#plan .view circle{fill:var(--accent);stroke:#17211d;stroke-width:.05}#plan .view line{stroke:var(--accent);stroke-width:.09;stroke-linecap:round}#plan .view text{fill:#243025;font:700 .34px sans-serif;text-anchor:middle;dominant-baseline:central;pointer-events:none}#plan .view:hover circle{fill:#fff}#touchControls{display:none;position:absolute;bottom:90px;left:25px;right:25px;justify-content:space-between;align-items:end;pointer-events:none;color:#fff9;font-size:10px}#joystick{width:108px;height:108px;border-radius:50%;background:#ffffff12;border:1px solid #ffffff30;position:relative;pointer-events:auto;touch-action:none}#stick{position:absolute;top:34px;left:34px;width:40px;height:40px;border-radius:50%;background:#ffffff50}body.intro #touchControls{display:none}@media(pointer:coarse){#touchControls{display:flex}}@media(max-width:700px){header{padding:20px;flex-wrap:wrap;gap:12px}nav{margin-left:auto}#doorButton span{display:inline;font-size:11px}.identity{font-size:9px;letter-spacing:.07em}.identity div span{font-size:6px}.brand{font-size:27px}nav button{padding:10px}nav button span{display:none}.veil{padding:25px}.intro-footer{left:25px;bottom:24px}.intro-footer span,.desktop{display:none!important}#hud{padding:22px}.intro p{font-size:14px}.eyebrow{font-size:8px}#hud>div{gap:5px}}

@media(pointer:coarse){#doorButton kbd{display:none}}

#fov{width:95px}#fovValue{font-size:11px;color:var(--muted)}

#viewport canvas{cursor:grab}#viewport canvas:active{cursor:grabbing}



#sunDate{font:inherit;color:inherit;background:#ffffff0b;border:1px solid #ffffff24;padding:8px;border-radius:6px;color-scheme:dark}#sunTimeValue{font-variant-numeric:tabular-nums}#sunTime{width:100%;accent-color:#c8d5aa;margin:12px 0 22px}.season-buttons{display:flex;gap:6px}.season-buttons button{font-size:12px;padding:9px 8px;flex:1}#lightStatus{font-size:11px;color:#c7cfba}#hud{gap:12px}#hud .desktop{font-size:10px}@media(max-width:1100px){#hud .desktop{display:none}}@media(max-width:600px){#hud{flex-wrap:wrap}nav{gap:5px}nav button{padding:10px}}

#lightingSteps{width:100%;margin:12px 0 5px}#lightingStepsValue{font-variant-numeric:tabular-nums}.range-labels{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.now-button{width:100%;margin-top:10px;font-size:11px;padding:9px}



#traceButton.busy{color:var(--accent)}#traceButton.done{background:var(--accent);color:#243025;font-weight:600}#traceButton.done:hover{background:#e5f0ca}@media(max-width:700px){nav button#traceButton span{display:inline}}

/* One docked side panel: the 3D view gives up the space instead of sitting under it. */
:root{--side-w:390px;--side-h:56vh}
@supports(height:1dvh){:root{--side-h:56dvh}}
#sidebar{position:absolute;right:0;top:0;bottom:0;width:var(--side-w);display:flex;flex-direction:column;background:#17211d;border-left:1px solid #ffffff19;z-index:2;transform:translateX(100%);visibility:hidden;transition:transform .3s cubic-bezier(.2,.7,.2,1),visibility 0s .3s}body.side-open #sidebar{transform:none;visibility:visible;transition-delay:0s}
#sideResize{position:absolute;left:-4px;top:0;bottom:0;width:9px;cursor:col-resize;touch-action:none;z-index:3}#sideResize:hover,#sideResize:focus-visible,#sideResize.dragging{background:#dae7b855;outline:0}
.side-top{display:flex;justify-content:space-between;align-items:center;width:100%;padding:14px 20px;border:0;border-bottom:1px solid #ffffff19;border-radius:0;background:transparent;font:20px Georgia,serif;text-align:left;flex:none}.side-top:hover{background:#ffffff0d}.side-top span+span{font:18px sans-serif;color:var(--muted)}
.side-scroll{flex:1;overflow:auto}
.acc{border-bottom:1px solid #ffffff19}.acc-head{display:flex;justify-content:space-between;align-items:center;width:100%;border:0;border-radius:0;background:transparent;padding:16px 20px;font:15px Georgia,serif;letter-spacing:.02em;text-align:left}.acc-head:hover{background:#ffffff0d}.acc.open .acc-head{color:var(--accent)}.chev{transition:transform .2s;font:13px sans-serif}.acc.open .chev{transform:rotate(180deg)}
.acc-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .28s ease}.acc.open .acc-body{grid-template-rows:1fr}.acc-inner{min-height:0;overflow:hidden;padding:0 20px;visibility:hidden;transition:visibility 0s .28s}.acc.open .acc-inner{visibility:visible;transition-delay:0s}.acc-inner::after{content:'';display:block;height:24px}
#viewport,header,#hud,#touchControls{transition:right .3s cubic-bezier(.2,.7,.2,1),bottom .3s cubic-bezier(.2,.7,.2,1)}body.side-resizing *{transition:none!important}
body.side-open #viewport{right:var(--side-w)}body.side-open header,body.side-open #hud{right:var(--side-w)}body.side-open #touchControls{right:calc(var(--side-w) + 25px)}
@media(max-width:700px){#sidebar{left:0;top:auto;width:auto;height:var(--side-h);border-left:0;border-top:1px solid #ffffff19;transform:translateY(100%)}body.side-open #sidebar{transform:none}#sideResize{left:0;right:0;top:-4px;bottom:auto;width:auto;height:11px;cursor:row-resize}body.side-open #viewport{right:0;bottom:var(--side-h)}body.side-open header{right:0}body.side-open #hud{display:none}body.side-open #touchControls{display:none}}
@media(prefers-reduced-motion:reduce){#sidebar,#viewport,header,#hud,#touchControls,.acc-body,.acc-inner,.chev{transition-duration:0s!important;transition-delay:0s!important}}
#traceStart{margin:18px 0 6px}#traceStart.busy{background:#ffffff14;color:var(--accent)}#traceStart.busy:hover{background:#ffffff24}
/* Items section: lights and placed library items. */
.items-group{margin-top:18px}.items-group h3{margin:0 0 6px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600}
.item-row{display:flex;align-items:center;gap:10px;padding:7px 0;border-top:1px solid #ffffff14}.item-row input[type=checkbox]{flex:none;width:16px;height:16px;accent-color:var(--accent)}
.item-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.item-name{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.item-meta{font-size:10px;color:var(--muted)}
button.link{border:0;background:none;padding:0;text-align:left;color:var(--paper)}button.link:hover{background:none;text-decoration:underline}
.light-toggle{flex:none;font-size:11px;padding:5px 10px;min-width:46px}.light-toggle[aria-pressed=true]{background:var(--accent);color:var(--ink);border-color:var(--accent)}
.items-filters label{margin-top:10px}
.items-search{width:100%;box-sizing:border-box;margin-top:14px;padding:8px 10px;border-radius:5px;border:1px solid #ffffff30;background:#28342d;color:var(--paper);font-size:12px}
.items-bulk{display:flex;align-items:center;justify-content:flex-start;gap:10px;margin-top:16px;padding:8px 0 0 4px;border-top:1px solid #ffffff1f}.items-bulk .item-name{flex:1}.items-bulk input[type=checkbox]{flex:none;width:16px;height:16px;accent-color:var(--accent)}
.small-button{font-size:11px;padding:5px 10px}
.items-group-title{display:flex;align-items:center;gap:10px;border-top:1px solid #ffffff1f;padding-top:8px}
.items-group-title input[type=checkbox]{flex:none;width:16px;height:16px;accent-color:var(--accent)}
.items-group-head{flex:1;display:flex;align-items:center;gap:8px;border:0;background:none;padding:2px 0;text-align:left;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600}
.items-group-head:hover{background:none;color:var(--paper)}.items-group-head .item-meta{margin-left:auto;letter-spacing:0}
.item-row.is-hidden .item-name{color:var(--muted);text-decoration:line-through}
.item-row{padding-left:4px}
/* Aim reticle: a quiet centre dot that opens into a ring when something can be operated. */
#reticle{position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#ffffffaa;box-shadow:0 0 2px #0008;pointer-events:none;opacity:0;transition:all .15s;z-index:3}
body.exploring #reticle{opacity:.8}
#reticle.idle:not(.on){opacity:0;transition-duration:.4s}
#reticle.on{width:22px;height:22px;margin:-11px 0 0 -11px;background:transparent;border:2px solid var(--accent);opacity:1}