/* Compact navigation, a central home and a single-room inspector. */
:root{--left-rail:156px;--right-rail:300px;--gap:24px}
body{background:#101217}
#scene-aura{background:radial-gradient(ellipse at 48% 46%,#30343a45,transparent 72%)}
#scene-aura::before,#scene-aura::after{opacity:.55}
#home-bar{left:26px;top:24px;gap:11px;right:auto}
#home-bar h1{font-size:23px;letter-spacing:0}
#home-bar p{font-size:10px;color:#a0a6ad}
.home-symbol{width:40px;height:44px;border-radius:13px;background:#ffffff09;border-color:#ffffff22;box-shadow:inset 0 1px 0 #ffffff12}
#panel,#display-panel{top:112px;bottom:auto;max-height:calc(100dvh - 142px);padding:18px 14px;background:linear-gradient(145deg,#ffffff07,transparent 45%),#191c246b;border:1px solid #ffffff16;border-top-color:#ffffff2c;border-radius:22px;box-shadow:0 16px 50px #0002,inset 0 1px 0 #ffffff06;backdrop-filter:blur(22px) saturate(110%)}
#panel{left:24px;width:156px;padding:18px 10px}
#display-panel{right:24px;width:300px;padding:18px}
#panel header{margin:0 12px 16px}
#panel header h2{font-size:11px;letter-spacing:2px;color:#8e939e}
.space-details{margin:0!important;padding:0!important}
.space-details>summary{display:none}
#views{display:flex;flex-direction:column;gap:5px}
#views button{display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid transparent;border-radius:12px;font-size:12px;text-align:left;background:transparent;color:#aeb3bd;min-height:42px;white-space:nowrap;box-shadow:none}
#views svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.8}
#views button:hover{background:#ffffff07;color:#fff}
#views button.active{background:#ffffff0d;border-color:#ffffff16;color:#fff}
#views button[data-view=top]{margin-bottom:10px}
#views button[data-view=wall-finish]{margin-top:10px}
.walk-details{margin:18px 6px 0!important;padding-top:15px;font-size:11px}
.walk-details .setting{flex-direction:column;align-items:flex-start}
.walk-details select{width:100%}
.walk-details .note,.walk-details small,#panel footer{display:none}
#panel-toggle,body.panel-hidden #panel-toggle{left:290px;top:33px;padding:8px 13px;border-radius:11px;font-size:11px;background:#ffffff06;border-color:#ffffff14}
#display-toggle{right:26px;top:33px;padding:8px 13px;border-radius:11px;font-size:11px;background:#ffffff06;border-color:#ffffff14}
#picture-settings{border:0;border-bottom:1px solid #ffffff0d;padding:0 0 13px;margin:0 0 20px}
#picture-settings>summary{font-size:10px;color:#9399a5}
#display-panel .room-context{margin:0 0 20px}
#display-panel .room-context h2{font-size:10px;letter-spacing:1px;color:#9399a5;margin:0 0 7px}
#control-room{font-size:24px;font-weight:700;width:100%;padding:0 20px 0 0;border:0;border-radius:0;background:transparent;color:#f1f2f5;line-height:1.5}
#control-room option{font-size:14px;background:#20232b}
#room-context-status{font-size:11px;color:#8d95a2;margin:7px 0 0}
#display-panel .tabs{position:static;top:auto;padding:3px;margin:0 0 20px;border:1px solid #ffffff0a;background:#0000001c;border-radius:12px;gap:3px}
#display-panel .tabs button{font-size:11px;padding:7px 5px;border:0;border-radius:9px;background:transparent;color:#8f98a7;box-shadow:none}
#display-panel .tabs [aria-selected=true]{color:#f2f4f8;background:#ffffff0c;box-shadow:0 2px 6px #0002}
.environment-modes{position:static;padding:0 0 12px;margin-bottom:14px;background:transparent;border-bottom:1px solid #ffffff0c;border-radius:0;backdrop-filter:none;gap:7px}
.environment-modes button{border:0;border-radius:9px;padding:8px 6px;font-size:12px;color:#9097a3;background:transparent}
.environment-modes [aria-pressed=true]{background:rgba(var(--theme),.12);color:rgb(var(--theme));box-shadow:none}
#environment-lights,#environment-curtains,#environment-climate{margin:0}
#environment-lights>h2,#lighting-status{display:none}
.room-control{margin:0;border:0;background:none;border-radius:0;overflow:visible}
.room-heading{padding:0 0 12px;background:transparent!important;font-size:12px}
.room-heading>span{font-size:0}
.room-heading>span::before{content:'灯光';font-size:12px;color:#b5bbc5}
.room-heading small{font-size:10px;margin-left:8px;color:#858c98}
.room-scenes{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:2px 0 19px}
.room-scenes button{padding:13px 8px;font-size:12px;border-radius:13px;border:1px solid #ffffff14;background:linear-gradient(145deg,#ffffff07,#ffffff02);box-shadow:inset 0 1px 0 #ffffff05}
.room-scenes button[aria-pressed=true]{background:rgba(var(--theme),.16);border-color:rgba(var(--theme),.40);box-shadow:inset 0 1px 0 #ffffff0f;color:rgb(var(--theme))}
.room-control details{border-top:1px solid #ffffff0d;padding-top:4px}
.room-control summary{padding:12px 0;color:#9299a6;font-size:11px}
.lamp-list{padding:0}
.lamp-list .lamp-card{border:0;border-bottom:1px solid #ffffff0a;border-radius:0;background:transparent;padding:10px 0;box-shadow:none}
.lamp-card.lamp-on{background:none;border-color:#ffffff0a;box-shadow:none}
.lamp-icon{width:26px;height:26px;border-radius:9px}
.lamp-on .lamp-icon{box-shadow:none;background:rgba(var(--theme),.17);color:rgb(var(--theme))}
#whole-home-control{padding-top:14px;margin:18px 0 0;border-color:#ffffff0d}
#whole-home-control>summary{font-size:11px;color:#9299a6}
#whole-home-control .master{margin:10px 0}
#whole-home-control .views button{font-size:10px;padding:8px}
.device-control{padding:0;margin:0;border:0;border-radius:0;background:transparent}
.device-control h3{font-size:12px;color:#b8bec8;margin:4px 0 18px}
.device-control .views button{padding:12px;border-radius:12px}
.device-control .setting{margin-top:20px}
.device-control input[type=range]{margin:12px 0 18px}
.climate-modes{grid-template-columns:1fr 1fr;gap:8px}
.climate-modes button{padding:16px 8px;font-size:12px;border-radius:13px}
#environment-climate>.switch{margin-top:24px;border-top:1px solid #ffffff0d;padding-top:14px}
.environment-empty{color:#838c99;text-align:center;padding:24px 0;font-size:12px}
#time-dock,body.panel-hidden #time-dock{bottom:28px;padding:6px;gap:5px;border-radius:20px;background:#1b1e296b;border-color:#ffffff20;box-shadow:0 10px 30px #0002;backdrop-filter:blur(22px)}
#time-dock button{width:86px;min-height:59px;padding:8px 10px;gap:5px;border-radius:14px;background:transparent;border-color:transparent;box-shadow:none}
#time-dock .time-icon{font-size:22px;line-height:24px}
#time-dock strong{font-size:10px}
#room-cards path{stroke:rgba(var(--theme),.28);stroke-width:.8}
#room-cards circle{fill:rgba(var(--theme),.55);stroke:#ffffff55;stroke-width:.7}
.room-float-card{background:#20232c50;border-color:#ffffff20;border-top-color:#ffffff38;box-shadow:0 4px 12px #0001}
.room-float-card.is-open{background:#20232c99;border-color:#ffffff45}
.room-float-heading strong{font-size:11px}
#selection{display:none!important}
@media(min-width:901px){#time-dock,body.panel-hidden #time-dock{left:calc(50% - 72px)}body.panel-hidden #time-dock{left:calc(50% - 162px)}body.display-hidden #time-dock{left:calc(50% + 90px)}body.panel-hidden.display-hidden #time-dock{left:50%}}
@media(max-width:1100px) and (min-width:901px){:root{--left-rail:140px;--right-rail:278px}#panel{width:140px;left:16px}#display-panel{width:278px;right:16px}#views button{gap:8px;padding:10px 8px}}
@media(max-width:900px){#panel,#display-panel{top:108px;max-height:calc(100dvh - 222px);bottom:auto}#panel{width:170px;left:16px}#display-panel{width:min(320px,calc(100vw - 32px));right:16px}#time-dock,body.panel-hidden #time-dock{left:50%;bottom:20px}#time-dock button{width:67px;min-height:57px}#home-bar{left:16px;top:17px}#home-bar h1{font-size:20px}#panel-toggle,body.panel-hidden #panel-toggle{left:16px;top:73px;padding:6px 12px}#display-toggle{right:16px;top:73px;padding:6px 12px}.home-symbol{width:36px;height:40px}#home-bar p{font-size:9px}.room-context{margin-bottom:15px!important}}
