:root{color-scheme:dark;--bg:#0c0d0f;--panel:#1b1d1e;--soft:#242320;--line:#454038;--gold:#d8b980;--goldsoft:#a98b5d;--text:#f1e7d9;--muted:#a79c8d;--danger:#e6a18d;--good:#a5d3ac;--font:"Trebuchet MS","Segoe UI",sans-serif}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:14px/1.55 var(--font)}
button,input,select{font:inherit}
button{cursor:pointer}
a{color:var(--gold)}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
[hidden]{display:none!important}
p,h1,h2,h3{margin:0}
h1,h2,h3{line-height:1.25;font-weight:600}
h1{font-size:30px;letter-spacing:-.045em}
h2{font-size:22px;letter-spacing:-.03em}
h3{font-size:16px}
small{font-size:11px}
.logo{font-family:Georgia,serif;font-weight:400;color:var(--gold);font-size:48px;letter-spacing:.22em;line-height:1.15}
.boot{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;color:var(--muted)}
.shell{display:grid;grid-template-columns:228px minmax(0,1fr);min-height:100vh}
.side{border-right:1px solid #4c3e2b;background:linear-gradient(145deg,#191816,#101214 70%);padding:26px 15px;display:flex;flex-direction:column;gap:24px}
.brand{text-align:center;border-bottom:1px solid #55462f;padding:11px 0 28px}
.brand small{display:block;margin-top:10px;letter-spacing:.28em;color:#b9a079;font-size:9px}
.label{font-size:10px;letter-spacing:.2em;color:var(--gold);font-weight:700}
nav{display:flex;flex-direction:column;gap:6px}
.nav{display:flex;align-items:center;gap:12px;width:100%;border:1px solid transparent;border-radius:9px;padding:12px 13px;background:transparent;color:#c0b7a7;text-align:left;font-weight:600}
.nav b{width:20px;font:400 22px Georgia,serif;color:var(--gold);text-align:center}
.nav:hover{background:#302b23}
.nav.active{color:#f4dcae;background:#332b1d;border-color:#79613a}
.sidefoot{margin-top:auto;border-top:1px solid #50412d;padding:20px 3px 0;color:#a89b88;font-size:11px}
.statusdot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#ad7654;margin-right:8px}
.statusdot.ok{background:#9acaa1}
.main{min-width:0;padding:29px clamp(16px,3vw,44px);background:radial-gradient(ellipse 60% 32% at 90% -5%,#4a301b33,transparent),var(--bg)}
.header{display:flex;align-items:end;justify-content:space-between;flex-wrap:wrap;gap:15px;padding-bottom:23px;border-bottom:1px solid #38322c;margin-bottom:25px}
.header h1{margin-top:7px}
.subtitle{color:var(--muted);font-size:12px;margin-top:6px}
.header-right{display:flex;align-items:center;gap:9px}
.userbadge{display:flex;flex-direction:column;text-align:right;margin-right:7px;font-size:11px;color:var(--gold)}
.userbadge small{color:var(--muted);font-size:10px;max-width:180px;overflow:hidden;text-overflow:ellipsis}
.btn,.control{border:1px solid #665236;border-radius:9px;background:#2e271d;color:#e9d7b9;padding:10px 15px;text-decoration:none;font-weight:700;font-size:12px}
.btn:hover,.control:hover{border-color:var(--gold)}
.btn.primary,.control.selected{color:#281d0c;background:linear-gradient(105deg,#eddaa9,#c29657);border-color:#deb87d}
.btn.subtle{background:#1d1e1f;border-color:#484238}
.btn.danger{color:#f8c6b7;background:#3a211d;border-color:#925c4a}
button:disabled{opacity:.45;cursor:not-allowed}
.panel{border:1px solid #4b4133;border-radius:13px;background:linear-gradient(160deg,#222223,#17191a);padding:19px}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:23px}
.metric{display:flex;flex-direction:column;min-height:132px}
.metric strong{font:400 40px/1.1 Georgia,serif;color:#e9cf9b}
.metric b{margin-top:11px;font-size:12px}
.metric small{color:var(--muted);margin-top:6px}
.sectiontitle{display:flex;justify-content:space-between;align-items:end;gap:13px;margin-bottom:15px}
.sectiontitle h2{margin-top:6px}
.sectiontitle small{color:var(--muted)}
.filters{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-bottom:18px}
.filters .btn.active{background:linear-gradient(110deg,#e9d0a0,#bc8e50);color:#1f1609}
.input{display:block;width:100%;padding:11px 13px;border:1px solid #67523b;border-radius:9px;background:#101112;color:var(--text);outline-color:var(--gold)}
.filters input{max-width:170px;margin-left:auto}
.floor{display:grid;grid-template-columns:115px minmax(0,1fr);gap:10px;margin-bottom:11px}
.floorname{background:#1d1f20;border:1px solid #484035;border-radius:9px;padding:13px}
.floorname em{display:block;font:400 29px/1.2 Georgia,serif;color:var(--gold)}
.floorname b{display:block;font-size:11px;margin-top:5px}
.floorname small{color:var(--muted)}
.roomgrid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
.room{background:linear-gradient(135deg,#252729,#1a1b1d);border:1px solid #484034;border-radius:9px;min-width:0;min-height:145px;display:flex;flex-direction:column;text-align:left;gap:6px;color:var(--text);padding:12px 10px}
.room:hover{border-color:#d5b478}
.room.live{border-color:#9d7d4b;background:linear-gradient(125deg,#332a1e,#1c1d1f 70%)}
.room b{font:400 24px Georgia,serif}
.room small{font-size:10px;line-height:1.4;color:#b5a999}
.room .roomstatus{font-size:10px;color:var(--gold);font-weight:700;margin-top:auto;line-height:1.3}
.room .liveflag{font-size:8px;border:1px solid #59826b;border-radius:4px;color:#b6dfbb;padding:1px 4px;float:right;margin-top:7px}
.split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-top:18px}
.datarow{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid #3e3932;font-size:12px}
.datarow:last-child{border:0}
.datarow span{color:#bcb1a1}
.datarow strong{color:#ebd9b9;text-align:right}
.datarow .warn{color:var(--danger)}
.datarow .ok{color:var(--good)}
.lead{font-size:13px;color:#bcb0a0;margin:0 0 20px}
.notice{border:1px solid #8a6137;background:#332718;border-radius:9px;padding:14px 17px;color:#e4cda8;font-size:12px;margin:0 0 20px}
.notice.positive{border-color:#5b775a;background:#18271e;color:#c8e5cf}
.empty{border:1px dashed #736047;padding:26px;text-align:center;border-radius:10px;color:var(--muted);background:#17191b}
.operations{display:grid;grid-template-columns:repeat(auto-fill,minmax(188px,1fr));gap:10px}
.opsitem{border:1px solid #4c4235;border-radius:10px;background:#1b1d1e;padding:13px}
.opsitem h3{font:400 24px Georgia,serif;color:var(--gold)}
.opsitem small{color:var(--muted)}
.opsitem select{margin-top:9px}
.hero{display:flex;flex-direction:column;gap:6px;border:1px solid #816342;border-radius:12px;background:linear-gradient(120deg,#332819,#1a1c1d);padding:20px;margin-bottom:18px}
.hero strong{font:400 52px/1.1 Georgia,serif;color:#f4d8a5}
.hero small{color:var(--muted)}
.columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.devicebox{margin-bottom:14px}
.devicebox h3{color:#e5cb97;margin-bottom:12px}
.controlrow{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:10px 0;border-bottom:1px solid #36332f}
.controlrow:last-child{border-bottom:0}
.controlrow span{flex:1;min-width:115px}
.controlrow small{display:block;color:var(--muted);font-size:11px}
.controlrow .controls{display:flex;gap:5px;align-items:center}
.control{padding:8px 10px;min-width:37px}
.controlrow .current{font-size:13px;font-weight:700;color:var(--gold);min-width:49px;text-align:center}
.roominfo{margin-top:18px}
.signin{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 50% -5%,#543922,#101112 62%)}
.signin main{width:min(460px,100%);padding:30px;border:1px solid #8a6a44;border-radius:18px;background:#1a1b1d;box-shadow:0 30px 80px #0009}
.signin .brand{text-align:center;padding-bottom:22px}
.signin h1{text-align:center;font-size:24px;margin-bottom:10px}
.signin p{text-align:center;color:var(--muted);font-size:13px;margin-bottom:26px}
.field{margin-top:17px}
.field label{display:block;font-size:12px;color:#d3b78e;margin-bottom:7px}
.signin button{width:100%;margin-top:24px}
.formgrid{display:grid;grid-template-columns:2fr 1fr 1fr auto;align-items:end;gap:9px}
.formgrid label{display:block;color:var(--gold);font-size:12px}
.formgrid .input{margin-top:6px}
.topnote{font-size:11px;color:var(--muted);margin:9px 0 18px}
.people{margin-top:22px}
.twohead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
footer{border-top:1px solid #383128;padding-top:17px;margin-top:30px;color:#80796f;font-size:11px;display:flex;justify-content:space-between;gap:10px}
#toast-stack{position:fixed;bottom:18px;right:18px;display:grid;gap:8px;z-index:100;pointer-events:none}
.toast{max-width:420px;border-radius:10px;border:1px solid #6e9b79;background:#1b3323;color:#dbf2df;padding:13px 17px;box-shadow:0 10px 45px #000a;font-size:13px}
.toast.bad{border-color:#b57866;background:#3f241e;color:#ffe2d7}
@media(max-width:1500px){.roomgrid{grid-template-columns:repeat(4,1fr)}.columns{grid-template-columns:repeat(2,1fr)}}
@media(max-width:930px){.shell{grid-template-columns:1fr}.side{position:sticky;top:0;z-index:20;padding:8px 12px;display:block}.side .brand,.side .sidefoot{display:none}nav{display:flex;overflow-x:auto;gap:5px}.nav{white-space:nowrap;width:auto;min-width:120px;padding:9px 12px}.main{padding:20px 15px}.columns{grid-template-columns:1fr}.kpis{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.header h1{font-size:24px}.header-right{width:100%;justify-content:space-between}.floor{grid-template-columns:1fr}.floorname{display:flex;align-items:center;gap:10px;padding:9px 13px}.floorname em{font-size:24px}.floorname b{margin:0}.roomgrid{grid-template-columns:repeat(2,1fr)}.room{min-height:135px}.filters input{max-width:none;margin:0}.split{grid-template-columns:1fr}.kpis{gap:8px}.metric{padding:13px;min-height:113px}.metric strong{font-size:30px}.formgrid{grid-template-columns:1fr}.signin main{padding:22px}footer{flex-direction:column}}