/* The scene occupies the entire window; controls are overlays, never columns. */
#viewport,body.panel-hidden #viewport,body.display-hidden #viewport{position:fixed;inset:0!important;width:100%;height:100%;z-index:0}
#home-bar,#panel-toggle,#display-toggle,#time-dock{z-index:4}
#panel,#display-panel{z-index:3}
#caption{display:none!important}
#time-dock,body.panel-hidden #time-dock{left:50%}
#crosshair,body.panel-hidden #crosshair,body.display-hidden #crosshair,body.panel-hidden.display-hidden #crosshair{left:50%;top:50%}
.space-details button,.space-details button:nth-child(3n),.space-details button:nth-child(3n + 1){background:#ffffff04;border-color:#ffffff1c;color:#dce0e9;box-shadow:none}
.space-details button:hover{background:#ffffff0b;border-color:#ffffff40}
.space-details button.active{background:linear-gradient(145deg,#c6cbd32b,#a6aeb418);border-color:#c8d0dc65;color:#fff;box-shadow:inset 0 1px 1px #fff2}
#panel-toggle,#display-toggle{background:#22293699;backdrop-filter:blur(18px)}
#home-bar{filter:drop-shadow(0 1px 5px #0008)}
canvas,canvas:focus,canvas:focus-visible{outline:none!important;border:0;border-radius:0;box-shadow:none}
body{--theme:125,177,255}
body[data-time=morning]{--theme:119,214,198}
body[data-time=noon]{--theme:125,177,255}
body[data-time=dusk]{--theme:242,168,125}
body[data-time=night]{--theme:177,148,244}
#panel,#display-panel,#time-dock,body.panel-hidden #time-dock{border-color:rgba(var(--theme),.22);border-top-color:rgba(var(--theme),.34);background:linear-gradient(145deg,rgba(var(--theme),.10),#161c2b22 48%),#171c2bb8;transition:background .45s,border-color .45s,transform .22s,opacity .22s}
.tabs [aria-selected=true],.space-details button.active{color:#f4f6ff;background:linear-gradient(145deg,rgba(var(--theme),.26),rgba(var(--theme),.10));border-color:rgba(var(--theme),.45);box-shadow:inset 0 1px 1px #ffffff24}
.home-symbol,#walk-toggle{background:linear-gradient(145deg,rgba(var(--theme),.24),rgba(var(--theme),.08)),#171c2bb8;border-color:rgba(var(--theme),.4);color:#e9eef8}
#home-bar h1,#home-bar p{text-shadow:0 1px 5px #000b}
#quick-power[aria-pressed=true]{background:linear-gradient(145deg,rgba(var(--theme),.85),rgba(var(--theme),.42));border-color:rgba(var(--theme),.7);box-shadow:0 8px 26px rgba(var(--theme),.19),inset 0 1px 2px #ffffff55}
#room-filter [aria-pressed=true]{background:rgba(var(--theme),.27);border-color:rgba(var(--theme),.6);color:#eef3ff}
.room-control{border-color:rgba(var(--theme),.16);background:rgba(var(--theme),.035)}
.lamp-card.lamp-on{border-color:rgba(var(--theme),.38);background:linear-gradient(125deg,rgba(var(--theme),.12),rgba(var(--theme),.035));box-shadow:inset 0 1px 0 #ffffff12}
#selection{background:linear-gradient(145deg,rgba(var(--theme),.14),#1b202bbd);border-color:rgba(var(--theme),.3)}
#panel a,#display-panel a{color:rgb(var(--theme))}
.material-swatches small{display:none}
input[type=range],progress{accent-color:rgb(var(--theme))}
#pane-home input[type=checkbox]:checked,#pane-ceiling input[type=checkbox]:checked,#walk-collision:checked{background:rgba(var(--theme),.65);border-color:rgba(var(--theme),.8)}
button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible{outline-color:rgb(var(--theme))}
#time-dock button .time-icon,#time-dock button[aria-pressed=true] .time-icon{color:rgb(var(--accent))}
#panel-toggle,body.panel-hidden #panel-toggle{left:300px}
@media(max-width:600px){#panel-toggle,body.panel-hidden #panel-toggle{left:16px}}
@media(max-width:900px){#time-dock,body.panel-hidden #time-dock{left:50%}#panel,#display-panel{bottom:133px}}
.environment-modes{display:flex;gap:5px;margin:0 0 16px;position:sticky;top:30px;z-index:2;background:#1c2330ed;border-radius:18px;padding:3px;backdrop-filter:blur(14px)}
.environment-modes button{flex:1;border-radius:16px;padding:7px}
.environment-modes [aria-pressed=true],.device-control [aria-pressed=true]{color:#f4f6ff;background:rgba(var(--theme),.22);border-color:rgba(var(--theme),.5)}
.device-control{border:1px solid rgba(var(--theme),.18);border-radius:15px;padding:12px;margin:0 0 11px;background:#ffffff04}
.device-control h3{margin:0 0 12px;font-size:12px;font-weight:500}
.device-control .views button{padding:7px;font-size:11px}
.device-control input[type=range]{width:100%;margin:3px 0 9px}
.device-control .setting{justify-content:space-between;margin-top:8px}
.device-control output{font-variant-numeric:tabular-nums;color:rgb(var(--theme))}
.device-control small{display:block;font-size:9px;color:#969da9}
.climate-modes{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}
.climate-modes button{font-size:10px;padding:8px 2px}