*{box-sizing:border-box}body{margin:0;background:#172120;color:#e9e9dc;font-family:Inter,"Microsoft YaHei",sans-serif}main{height:100dvh;display:grid;grid-template-columns:minmax(0,1fr) 330px;grid-template-rows:74px 1fr}header{grid-column:1/3;border-bottom:1px solid #ffffff12;display:flex;align-items:center;justify-content:space-between;padding:0 30px;background:#172120}.brand{font-size:25px;letter-spacing:4px}.brand span{font-size:10px;letter-spacing:2px;color:#97a8a1;margin-left:18px}.live{font-size:12px;color:#9fafaa;display:flex;gap:8px;align-items:center}.live i{width:6px;height:6px;background:#bddaa6;border-radius:50%}.live b{color:#e6e7d5}.live span{margin-left:25px}#viewport{position:relative;min-height:0;overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#344640,#172120 75%)}canvas{display:block;width:100%;height:100%;touch-action:none}.intro{position:absolute;top:30px;left:32px;pointer-events:none}.intro small,.panelhead small{font-size:10px;letter-spacing:2px;color:#bdb98e}h1{font-weight:400;font-size:26px;margin:12px 0}.intro p,.panelhead p{font-size:12px;color:#9aaba3}aside{background:#202b29;padding:26px 24px;overflow:auto;border-left:1px solid #ffffff10}.panelhead h2{font-size:24px;font-weight:400;margin:10px 0}.presets{display:flex;gap:8px;margin:24px 0 20px}button{font:inherit;color:#dfe6db;background:#ffffff07;border:1px solid #ffffff16;border-radius:6px;padding:9px 12px;cursor:pointer;font-size:12px}button:hover{background:#ffffff17}button:focus-visible,input:focus-visible{outline:2px solid #d8b274;outline-offset:3px}.presets button{flex:1}.presets button.selected,.presets button.selected:hover{background:#d9bc88;color:#26302b;border-color:#d9bc88}button:disabled{opacity:.35;cursor:default}button:disabled:hover{background:#ffffff07}.floors{display:flex;align-items:center;gap:8px;margin:-6px 0 20px}.floors small{font-size:10px;letter-spacing:2px;color:#7d8f86;flex:1}.floors b{min-width:32px;text-align:center;font-size:13px;color:#e6e7d5;font-weight:500;font-variant-numeric:tabular-nums}.floors button{padding:6px 10px}.light input[type=color].dot,#floortint.dot,#furnitint.dot,#glasstint.dot{width:20px;height:20px;padding:0;border:1px solid #ffffff25;border-radius:50%;background:none;cursor:pointer;flex:none}.light input[type=color].dot::-webkit-color-swatch-wrapper,#floortint.dot::-webkit-color-swatch-wrapper,#furnitint.dot::-webkit-color-swatch-wrapper,#glasstint.dot::-webkit-color-swatch-wrapper{padding:2px}.light input[type=color].dot::-webkit-color-swatch,#floortint.dot::-webkit-color-swatch,#furnitint.dot::-webkit-color-swatch,#glasstint.dot::-webkit-color-swatch{border:none;border-radius:50%}.light input[type=color].dot::-moz-color-swatch,#floortint.dot::-moz-color-swatch,#furnitint.dot::-moz-color-swatch,#glasstint.dot::-moz-color-swatch{border:none;border-radius:50%}#amb{width:110px;height:4px;accent-color:#d9bc88}nav{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}nav button.selected{color:#e4c692;background:#d9bc8817;border-color:#d9bc8860}.roomhead{display:flex;align-items:center;justify-content:space-between;margin-top:20px}h3{font-size:13px;font-weight:500}.roomhead button{padding:5px 9px;font-size:11px}.light{padding:12px 0;border-bottom:1px solid #ffffff0b}.lightline{display:flex;align-items:center;gap:9px;font-size:12px}.lightline span{flex:1}.lightline b{font-size:10px;color:#aaa98b;font-weight:400}.light input[type=range]{width:100%;height:4px;accent-color:#d9bc88;margin:14px 0 3px}.light input[type=checkbox],.compare input{accent-color:#d9bc88;width:17px;height:17px}.compare{margin-top:23px;border-top:1px solid #ffffff16;padding-top:9px}.compare label{display:flex;align-items:center;justify-content:space-between;padding:9px 0;font-size:12px}.compare small{display:block;font-size:10px;color:#8b9b94;margin-top:4px}footer{font-size:10px;line-height:1.8;color:#82958b;margin-top:25px}.viewbuttons{position:absolute;bottom:28px;left:30px;display:flex;gap:8px}.viewbuttons button{background:#1c2925cc}.legend{position:absolute;bottom:28px;right:25px;color:#d9bc88;font-size:10px;text-align:right;pointer-events:none}.legend span{margin-left:13px;color:#c9dfd8}.legend p{color:#91a99b;margin-bottom:0}#loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#172120;padding:20px;border-radius:10px;z-index:3}@media(max-width:760px){main{height:100dvh;grid-template-columns:1fr;grid-template-rows:60px 48dvh minmax(0,1fr)}header{grid-column:1;padding:0 17px}.brand{font-size:21px}.brand span{display:none}.live span{margin-left:10px}.intro{top:18px;left:19px}h1{font-size:20px}.intro p{font-size:10px}aside{padding:22px 22px 0;display:flex;flex-direction:column;overflow:hidden;min-height:0}.panelbody{flex:1;min-height:0;overflow:auto;padding-bottom:22px}.viewbuttons{bottom:15px;left:15px;gap:5px}.viewbuttons button{font-size:10px;padding:7px}.legend{right:14px;bottom:52px;font-size:8px}.panelhead p{margin-bottom:0}.presets{margin-top:15px}.compare{margin-top:20px}}
pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:9px}details{margin-top:12px}summary{cursor:pointer;color:#bdb98e}
body{background:#20252c}header{background:#20252c}aside{background:#272d35}.time-switch{display:flex;gap:6px;margin-top:20px;padding:4px;background:#0002;border-radius:9px}.time-switch button{flex:1;border:0;padding:11px}.time-switch button[aria-pressed=true]{background:#dce2e8;color:#303943}.presets{margin-top:12px}#viewport{transition:background .4s}body[data-time=day] #viewport{background:radial-gradient(ellipse at 50% 45%,#a5adb5,#697582 85%)}body[data-time=night] #viewport{background:radial-gradient(ellipse at 50% 45%,#354353,#1c2633 85%)}.intro small,.intro p{color:#e1e5e9}.legend,.legend span,.legend p{color:#d4dce5}.viewbuttons button{background:#25303dcc}body[data-time=night] .time-switch button[aria-pressed=true]{background:#718399;color:#f0f3f7}
.compare input[type=range]{width:100%;height:4px;margin:10px 0 3px}
.compare label:has(>input[type=range]){flex-direction:column;align-items:stretch}
/* Prevent native text selection and persistent tap highlights on touch devices. */
canvas,svg,button,nav,.viewbuttons,.toolbar{-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;}
button:focus:not(:focus-visible),a:focus:not(:focus-visible){outline:none;}
@media(hover:none){button:hover{border-color:#ffffff16;}button:active{filter:brightness(1.12);}}

/* Keep the scene layout stable while its controls are hidden. */
body.scene-ui-hidden header,body.scene-ui-hidden aside,body.scene-ui-hidden:not(.scene-ui-rotating) #viewport > :not(canvas):not(#loading),body.scene-ui-hidden.scene-ui-rotating #viewport > :not(canvas):not(#loading):not(.selected-object-ui){opacity:0!important;visibility:hidden!important;pointer-events:none!important;}

#panel-toggle{position:absolute;right:16px;top:16px;z-index:12;background:#202b3599;border:1px solid #ffffff50;border-radius:20px;padding:9px 14px;color:#eef3f8;}
body.panel-collapsed main{grid-template-columns:minmax(0,1fr);grid-template-rows:74px minmax(0,1fr);}
body.panel-collapsed header{grid-column:1;}
body.panel-collapsed aside{display:none;}
body.panel-collapsed #viewport{grid-column:1;grid-row:2;}
@media(max-width:760px){body.panel-collapsed main{grid-template-rows:60px minmax(0,1fr);}#panel-toggle{right:12px;top:12px;padding:8px 11px;font-size:11px;}}

#panel-toggle{width:36px;height:36px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:50%;}

.device-power-switch{position:relative;flex:none;width:68px;height:32px;padding:0;border:2px solid #ffffff65;border-radius:20px;background:#33384099;box-shadow:inset 0 1px 4px #0008;cursor:pointer;}
.device-power-switch[data-on=true]{background:#ee8c2dbb;}
.device-power-switch:hover{background:#454b54aa;}
.device-power-switch[data-on=true]:hover{background:#fa9b3dcc;}
.switch-thumb{position:absolute;left:2px;top:2px;width:24px;height:24px;border-radius:50%;background:#25262be6;border:1px solid #ffffff25;display:flex;gap:3px;align-items:center;justify-content:center;transition:transform .18s;box-shadow:0 1px 4px #0005;pointer-events:none;}
.device-power-switch[data-on=true] .switch-thumb{transform:translateX(36px);}
.switch-thumb i{width:1px;height:10px;background:#ffffff55;}

.has-power-switch{padding-right:76px!important;}
.corner-power-switch{position:absolute;right:14px;top:14px;width:44px;height:22px;border-width:1px;}
.corner-power-switch .switch-thumb{width:16px;height:16px;left:2px;top:2px;gap:2px;}
.corner-power-switch .switch-thumb i{height:7px;}
.corner-power-switch[data-on=true] .switch-thumb{transform:translateX(22px);}
.corner-power-switch[data-mode=cool][data-on=true]{background:#369bdfbb;}
.corner-power-switch[data-mode=cool][data-on=true]:hover{background:#4baeeacc;}
.corner-power-switch[data-mode=heat][data-on=true]{background:#ee8c2dbb;}

body.visitor-view aside,body.visitor-view #panel-toggle{display:none!important;}

body.visitor-view main{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr);}
body.visitor-view header{display:none;}
body.visitor-view #viewport{grid-row:1;grid-column:1;}
body.visitor-view #viewport>:not(canvas):not(#loading):not(#visitor-time-controls):not(#scene-light-icons):not(#scene-light-properties):not(#visitor-edit-entry):not(.selected-object-ui){display:none!important;}
#visitor-time-controls{position:absolute;top:16px;right:16px;z-index:15;display:flex;gap:8px;}
#visitor-time-controls button{width:36px;height:36px;padding:0;border-radius:50%;background:#29354466;color:#eef3f8;font-size:20px;border:1px solid #ffffff40;}
#visitor-time-controls button[aria-pressed=true]{background:#d9bc8880;border-color:#efd5a5;color:#fff7e8;}

#visitor-edit-entry{right:104px!important;width:36px;height:36px;padding:0!important;display:flex;align-items:center;justify-content:center;border-radius:50%!important;}

#loading{width:min(240px,60vw);height:5px;padding:0;background:#ffffff20;border-radius:5px;overflow:hidden;box-shadow:none;}#loading-fill{height:100%;width:0;background:#dcc493;border-radius:5px;transition:width .25s ease;}

/* Scene loading: actual milestones, with motion independent of the percentage. */
#loading{position:absolute;inset:0;transform:none;width:auto;height:auto;padding:24px;z-index:40;display:grid;place-items:center;border:0;border-radius:0;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,#263132,#10151e 75%);box-shadow:none;color:#f3eee2;}
.scene-loading-card{width:min(320px,100%);text-align:center;}
.scene-loading-mark{position:relative;display:grid;place-items:center;width:92px;height:92px;margin:0 auto 30px;color:#e1c38f;}
.scene-loading-mark::before{content:"";position:absolute;inset:0;border:1px solid #dfc28d24;border-top-color:#dfc28d;border-right-color:#dfc28d88;border-radius:50%;animation:loading-orbit 2.4s linear infinite;}
.scene-loading-mark::after{content:"";position:absolute;inset:13px;border-radius:50%;background:#e0c18c0c;box-shadow:0 0 42px #e0c18c12;animation:loading-breathe 2.4s ease-in-out infinite;}
.scene-loading-mark svg{position:relative;z-index:1;width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;}
.scene-loading-eyebrow{margin:0 0 10px;color:#bcae93;font-size:10px;letter-spacing:.25em;}
.scene-loading-card h2{margin:0 0 24px;font-size:23px;font-weight:400;letter-spacing:.12em;}
.scene-loading-meta{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 12px;text-align:left;}
#loading-stage{color:#afbbb9;font-size:12px;line-height:1.5;}
#loading-percent{font-size:19px;color:#e6cc9e;font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:400;}
.scene-loading-track{height:3px;overflow:hidden;background:#ffffff14;border-radius:3px;}
#loading-fill{position:relative;width:0;height:100%;background:#dfc28d;border-radius:3px;transition:width .35s ease-out;overflow:hidden;}
#loading-fill::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,#fff8,transparent);animation:loading-sheen 1.8s ease-in-out infinite;}
.scene-loading-hint{margin:17px 0 0;color:#7f918e;font-size:11px;letter-spacing:.04em;}
@keyframes loading-orbit{to{transform:rotate(360deg)}}
@keyframes loading-breathe{50%{opacity:.4;transform:scale(.86)}}
@keyframes loading-sheen{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
@media(prefers-reduced-motion:reduce){.scene-loading-mark::before,.scene-loading-mark::after,#loading-fill::after{animation:none}#loading-fill{transition:none}}
