:root{
  color-scheme:dark;
  --bg:#05080d;--bg2:#071018;--panel:#0b121a;--panel2:#101923;
  --line:#203543;--line2:#2b4658;--gold:#e7c27d;--gold2:#9c7333;
  --cyan:#62d6f4;--green:#64d9b2;--amber:#f0c36a;--red:#ff858b;
  --text:#f4f6f8;--muted:#8ea1b0;--shadow:0 20px 55px rgba(0,0,0,.42)
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);
font:14px/1.45 Inter,Segoe UI,Arial,sans-serif}body{
background-image:radial-gradient(circle at 76% 0,rgba(29,88,106,.24),transparent 31%),
linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),
linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px);
background-size:auto,42px 42px,42px 42px}
button,input,select,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}
.shell{min-height:100vh;display:grid;grid-template-columns:245px 1fr}.side{
position:sticky;top:0;height:100vh;padding:18px 15px;border-right:1px solid var(--line);
background:linear-gradient(180deg,rgba(5,9,14,.98),rgba(6,11,17,.96));box-shadow:18px 0 45px #0005}
.brand{display:flex;align-items:center;gap:11px;padding:5px 6px 18px;border-bottom:1px solid #4c3d2055}
.mark{width:38px;height:38px;display:grid;place-items:center;border:1px solid #9d7b3a88;
border-radius:12px;color:var(--gold);font-weight:900;font-size:19px;background:#151108}
.brand-title{font-size:17px;font-weight:900;letter-spacing:2.5px}.brand-sub{font-size:9px;color:var(--gold);letter-spacing:2.1px;font-weight:800}
.nav{display:grid;gap:5px;margin-top:16px}.nav button,.nav a{display:flex;align-items:center;gap:10px;width:100%;
border:1px solid transparent;border-radius:10px;padding:10px 11px;background:transparent;color:#c2d0da;
text-decoration:none;text-align:left}.nav button:hover,.nav a:hover,.nav .active{
border-color:#6f5829;background:linear-gradient(90deg,#2a220f,#0d141c);color:white}
.nav small{margin-left:auto;color:#5f7685}.side-foot{position:absolute;left:15px;right:15px;bottom:16px}
.main{min-width:0}.topbar{height:68px;display:flex;align-items:center;justify-content:space-between;gap:16px;
padding:0 22px;border-bottom:1px solid var(--line);background:rgba(5,9,14,.82);backdrop-filter:blur(14px);
position:sticky;top:0;z-index:20}.top-title{font-weight:900;font-size:18px}.top-sub{font-size:11px;color:var(--muted)}
.actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.content{padding:18px 22px 30px}
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px}.span12{grid-column:span 12}.span8{grid-column:span 8}
.span7{grid-column:span 7}.span6{grid-column:span 6}.span5{grid-column:span 5}.span4{grid-column:span 4}
.span3{grid-column:span 3}.span2{grid-column:span 2}.card{background:linear-gradient(180deg,rgba(14,23,33,.96),rgba(8,15,23,.96));
border:1px solid var(--line);border-radius:15px;padding:14px;box-shadow:var(--shadow);min-width:0}
.card h2,.card h3{margin:0 0 9px}.card h2{font-size:17px}.card h3{font-size:13px;color:#dfe8ee}
.eyebrow{font-size:9px;letter-spacing:2px;color:var(--gold);font-weight:900;text-transform:uppercase}.muted{color:var(--muted)}
.kpi{min-height:102px}.kpi .label{font-size:10px;letter-spacing:1px;color:var(--muted);text-transform:uppercase}
.kpi .value{font-size:27px;font-weight:900;margin-top:4px}.value.good{color:var(--green)}.value.gold{color:var(--gold)}
.value.cyan{color:var(--cyan)}.value.warn{color:var(--amber)}.value.bad{color:var(--red)}
.pill{display:inline-flex;align-items:center;gap:6px;border:1px solid #2f4351;border-radius:999px;padding:5px 9px;
font-size:10px;font-weight:800;letter-spacing:.4px;background:#101923;color:#aebdca}.pill.good{border-color:#225743;color:var(--green);background:#0c241d}
.pill.warn{border-color:#604b20;color:var(--amber);background:#251d0c}.pill.bad{border-color:#6c2730;color:var(--red);background:#2a0f13}
.pill.cyan{border-color:#245466;color:var(--cyan);background:#0b2028}.dot{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 9px currentColor}
.btn{border:1px solid #2a4150;border-radius:10px;padding:9px 12px;background:#0c151e;color:#e8f0f5}.btn:hover{border-color:#476477}
.btn.primary{background:linear-gradient(135deg,#7b5d27,#e7c27d);border-color:#e7c27d;color:#07090c;font-weight:900}
.btn.danger{border-color:#6a2931;color:#ff9ca1;background:#1f0d10}.input{width:100%;border:1px solid #2a4150;border-radius:10px;
padding:10px 11px;background:#081019;color:white;outline:none}.input:focus{border-color:#65869a}.row{display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.between{display:flex;align-items:center;justify-content:space-between;gap:10px}.stack{display:grid;gap:10px}
.tablewrap{overflow:auto;max-width:100%}table{width:100%;border-collapse:collapse;min-width:720px}th,td{padding:8px 9px;border-bottom:1px solid #192a35;
text-align:left;font-size:11px}th{color:#8197a7;background:#0b121a;position:sticky;top:0}.good{color:var(--green)}.warn{color:var(--amber)}
.bad{color:var(--red)}.cyan{color:var(--cyan)}.gold{color:var(--gold)}.chart{height:210px;position:relative;overflow:hidden;border-radius:12px;
border:1px solid #1d3443;background:linear-gradient(180deg,#08131b,#071018)}
.chart:before{content:"";position:absolute;inset:0;background:linear-gradient(transparent 95%,#17303f55 95%),
linear-gradient(90deg,transparent 95%,#17303f55 95%);background-size:100% 36px,55px 100%}
.spark{position:absolute;inset:16px}.spark svg{width:100%;height:100%}.terminal{background:#04080c;border:1px solid #18303c;border-radius:12px;
padding:12px;font:12px/1.55 Consolas,monospace;color:#a8c8d7;min-height:150px;max-height:330px;overflow:auto;white-space:pre-wrap}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(470px,100%);padding:22px}
.login-card h1{font-size:28px;margin:10px 0 5px}.login-card .brand{border:0;padding:0 0 12px}.section-title{margin:4px 0 12px;
display:flex;justify-content:space-between;align-items:end;gap:10px}.section-title h1{margin:0;font-size:25px}
.hero{background:radial-gradient(circle at 82% 16%,rgba(98,214,244,.13),transparent 32%),linear-gradient(180deg,#0d1821,#081018);
border-color:#315260}.bot-tabs{display:flex;gap:8px}.bot-tab{flex:1;padding:12px;border-radius:12px;border:1px solid #223843;background:#0a1219;color:#9fb0bc}
.bot-tab.active{border-color:#9b7738;color:var(--gold);background:#17140d}.metric-list{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.metric{border:1px solid #1c303d;background:#091119;border-radius:12px;padding:10px}.metric span{display:block}.metric .m1{font-size:9px;color:var(--muted);
text-transform:uppercase;letter-spacing:1px}.metric .m2{font-size:17px;font-weight:900;margin-top:3px}.footer-note{margin-top:16px;color:#60798a;font-size:10px}
@media(max-width:1180px){.shell{grid-template-columns:86px 1fr}.brand-copy,.nav .txt,.side-foot .txt{display:none}.nav button,.nav a{justify-content:center}.span3{grid-column:span 6}.span4,.span5,.span7,.span8{grid-column:span 12}}
@media(max-width:760px){.shell{display:block}.side{position:fixed;z-index:40;top:auto;bottom:0;left:0;right:0;width:auto;height:66px;
padding:6px;border-right:0;border-top:1px solid var(--line)}.brand,.side-foot{display:none}.nav{display:flex;margin:0;overflow:auto}.nav button,.nav a{min-width:72px;padding:8px}
.main{padding-bottom:72px}.topbar{height:auto;min-height:60px;padding:10px 14px}.content{padding:14px}.span2,.span3,.span4,.span5,.span6,.span7,.span8{grid-column:span 12}.metric-list{grid-template-columns:1fr 1fr}}

