:root{--bg:#030706;--surface:#07100e;--surface2:#0a1713;--line:#14372c;--line2:#205341;--text:#e2f5ec;--muted:#78968a;--green:#31f08b;--green2:#00b862;--cyan:#29d9d0;--amber:#ffbd4a;--red:#ff5864;--purple:#9d7bff;--shadow:0 18px 60px rgba(0,0,0,.42)}
*{box-sizing:border-box}html{min-height:100%;background:var(--bg)}body{margin:0;min-height:100vh;color:var(--text);font-family:Tahoma,"Segoe UI",Arial,sans-serif;background:radial-gradient(circle at 80% -10%,rgba(49,240,139,.12),transparent 28%),radial-gradient(circle at 5% 90%,rgba(41,217,208,.07),transparent 24%),var(--bg);font-size:14px}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.18;background-image:linear-gradient(rgba(49,240,139,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(49,240,139,.045) 1px,transparent 1px);background-size:38px 38px}.scanlines{position:fixed;inset:0;z-index:99;pointer-events:none;opacity:.035;background:repeating-linear-gradient(0deg,#fff 0,#fff 1px,transparent 1px,transparent 4px)}
a{color:inherit}.app-shell{display:flex;direction:rtl}.sidebar{position:fixed;right:0;top:0;bottom:0;width:270px;padding:28px 20px;border-left:1px solid var(--line);background:rgba(4,12,9,.94);backdrop-filter:blur(18px);display:flex;flex-direction:column;z-index:20}.brand-block{display:flex;align-items:center;gap:13px;direction:ltr}.brand-block strong{font-size:22px;letter-spacing:3px;color:var(--green);display:block}.brand-block small{color:var(--muted);letter-spacing:2.2px;font-size:9px}.brand-mark{width:42px;height:42px;border:1px solid var(--green2);border-radius:10px;display:grid;place-content:center;gap:3px;box-shadow:inset 0 0 18px rgba(49,240,139,.08),0 0 24px rgba(49,240,139,.07)}.brand-mark span{display:block;width:19px;height:2px;background:var(--green);box-shadow:0 0 8px var(--green)}.brand-mark span:nth-child(2){width:13px}.brand-mark span:nth-child(3){width:7px}
.system-state{display:flex;align-items:center;gap:9px;margin:30px 3px 18px;padding:10px 12px;border:1px solid rgba(49,240,139,.15);background:rgba(49,240,139,.04);border-radius:9px;color:#a7c9ba;font-size:12px}.system-state i,.operator-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green);animation:pulse 2s infinite}@keyframes pulse{50%{opacity:.35;box-shadow:0 0 3px var(--green)}}
.side-nav{display:flex;flex-direction:column;gap:8px}.side-nav a{display:flex;align-items:center;gap:12px;padding:13px 14px;color:#8ba99d;text-decoration:none;border:1px solid transparent;border-radius:10px;transition:.18s}.side-nav a:hover{color:var(--text);background:#0a1713}.side-nav a.active{color:var(--green);border-color:var(--line2);background:linear-gradient(90deg,rgba(49,240,139,.1),rgba(49,240,139,.025));box-shadow:inset -3px 0 0 var(--green)}.nav-icon{direction:ltr;width:25px;height:25px;display:grid;place-content:center;border:1px solid currentColor;border-radius:6px;font-weight:700}
.sidebar-foot{margin-top:auto}.server-chip{direction:ltr;padding:13px;border:1px solid var(--line);border-radius:9px;background:#050c0a;margin-bottom:12px}.server-chip small{display:block;color:var(--muted);font-size:9px;letter-spacing:2px}.server-chip b{display:block;color:var(--cyan);margin-top:5px;font-family:Consolas,monospace}.logout-button{width:100%;margin:0;background:transparent;color:#8ba99d;border:1px solid var(--line);padding:11px;border-radius:9px;cursor:pointer}.logout-button:hover{color:var(--red);border-color:rgba(255,88,100,.45)}
.workspace{width:calc(100% - 270px);margin-right:270px;min-height:100vh;display:flex;flex-direction:column}.topbar{min-height:92px;display:flex;align-items:center;justify-content:space-between;padding:18px 34px;border-bottom:1px solid var(--line);background:rgba(3,9,7,.68);backdrop-filter:blur(12px);position:sticky;top:0;z-index:10}.topbar h1{font-size:23px;margin:4px 0 0}.eyebrow{font-family:Consolas,monospace;font-size:9px;letter-spacing:2.4px;color:var(--green)}.operator{display:flex;align-items:center;gap:11px;direction:ltr;text-align:left;padding:8px 12px;border:1px solid var(--line);border-radius:9px;background:rgba(9,20,17,.7)}.operator small{display:block;color:var(--muted);font-size:9px}.operator b{font-size:11px;font-family:Consolas,monospace}.menu-button{display:none;background:none;color:var(--green);border:1px solid var(--line2);border-radius:8px;padding:8px 11px;margin:0}
.content{width:100%;max-width:1500px;margin:0 auto;padding:30px 34px;flex:1}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:16px 34px;color:#516b61;font-family:Consolas,monospace;font-size:10px;letter-spacing:1px}
.page-intro{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px}.page-intro h2{font-size:26px;margin:0 0 7px}.page-intro p{margin:0;color:var(--muted)}.live-clock{direction:ltr;color:var(--green);font:18px Consolas,monospace;border:1px solid var(--line);border-radius:9px;padding:10px 14px;background:#050d0a}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}.metric{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:14px;padding:20px;background:linear-gradient(145deg,rgba(11,25,20,.92),rgba(5,13,10,.92));box-shadow:var(--shadow)}.metric:after{content:"";position:absolute;left:-20px;bottom:-35px;width:90px;height:90px;border:1px solid var(--accent,var(--green));border-radius:50%;opacity:.12}.metric-top{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:12px}.metric-icon{width:34px;height:34px;display:grid;place-content:center;border:1px solid color-mix(in srgb,var(--accent,var(--green)) 45%,transparent);border-radius:9px;color:var(--accent,var(--green));font-weight:700}.metric strong{display:block;font:700 34px Consolas,monospace;margin:15px 0 3px;color:var(--accent,var(--green));text-shadow:0 0 20px color-mix(in srgb,var(--accent,var(--green)) 25%,transparent)}.metric small{color:#607b70}.metric.cyan{--accent:var(--cyan)}.metric.amber{--accent:var(--amber)}.metric.purple{--accent:var(--purple)}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,.8fr);gap:18px}.panel{border:1px solid var(--line);border-radius:14px;background:linear-gradient(160deg,rgba(9,21,17,.95),rgba(4,11,9,.95));box-shadow:var(--shadow);margin-bottom:18px;overflow:hidden}.panel-head{padding:17px 20px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.panel-head h2{font-size:15px;margin:0}.panel-head small{color:var(--muted);font:10px Consolas,monospace}.panel-body{padding:20px}.panel-link{font-size:11px;color:var(--green);text-decoration:none;border:1px solid var(--line2);padding:7px 10px;border-radius:7px}
.terminal{direction:ltr;text-align:left;background:#020605;padding:17px 18px;font:12px/1.8 Consolas,monospace;color:#82ad9a;min-height:220px}.terminal-line:before{content:">";color:var(--green);margin-right:9px}.terminal-line.dim{color:#4b6e60}.terminal-line .ok{color:var(--green)}.terminal-line .time{color:var(--cyan)}
table{width:100%;border-collapse:collapse}th{padding:12px 15px;text-align:right;font-size:10px;letter-spacing:.4px;color:#68887b;border-bottom:1px solid var(--line);font-weight:400}td{padding:14px 15px;border-bottom:1px solid rgba(20,55,44,.7);vertical-align:middle}tr:last-child td{border-bottom:0}tbody tr{transition:.15s}tbody tr:hover{background:rgba(49,240,139,.025)}.device-name{color:var(--text);text-decoration:none;font-weight:700}.device-name:hover{color:var(--green)}.subtext{display:block;color:var(--muted);font-size:10px;margin-top:4px;direction:ltr;text-align:right}.status{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 9px;font-size:10px;border:1px solid}.status:before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}.status.online,.status.active,.status.completed{color:var(--green);border-color:rgba(49,240,139,.24);background:rgba(49,240,139,.06)}.status.offline,.status.disabled,.status.failed{color:var(--red);border-color:rgba(255,88,100,.24);background:rgba(255,88,100,.06)}.status.pending{color:var(--amber);border-color:rgba(255,189,74,.24);background:rgba(255,189,74,.06)}
.action-card{padding:20px}.action-card h3{margin:0 0 7px;font-size:15px}.action-card p{margin:0 0 16px;color:var(--muted);font-size:12px;line-height:1.8}.btn,button{font:inherit}.btn,.primary-button,.danger-button,.ghost-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:9px;padding:11px 15px;text-decoration:none;cursor:pointer;border:1px solid var(--green2);background:linear-gradient(135deg,var(--green2),#087542);color:#001c0e;font-weight:700;box-shadow:0 0 25px rgba(49,240,139,.1)}.ghost-button{background:transparent;color:var(--green);border-color:var(--line2);box-shadow:none}.danger-button{background:rgba(255,88,100,.08);color:var(--red);border-color:rgba(255,88,100,.38);box-shadow:none}.primary-button:hover,.btn:hover{filter:brightness(1.12)}
input,textarea,select{width:100%;color:var(--text);background:#030907;border:1px solid var(--line2);border-radius:9px;padding:11px 12px;font:inherit;outline:none;transition:.18s}input:focus,textarea:focus,select:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(49,240,139,.07)}textarea,pre,.mono{direction:ltr;text-align:left;font-family:Consolas,monospace}label{display:block;color:#98b5a9;margin-bottom:7px;font-size:11px}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.form-row{margin-bottom:14px}.inline-form{display:flex;gap:10px;align-items:flex-end}.inline-form .field{flex:1}.inline-form button{flex:none}
.enrollment-code{display:flex;align-items:center;justify-content:space-between;border:1px dashed var(--green);background:rgba(49,240,139,.045);border-radius:11px;padding:14px 16px;margin-bottom:16px}.enrollment-code strong{direction:ltr;font:700 24px Consolas,monospace;color:var(--green);letter-spacing:3px}.enrollment-code small{display:block;color:var(--muted);margin-top:4px}
.detail-grid{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(0,1.5fr);gap:18px}.data-list{display:grid;grid-template-columns:125px 1fr;gap:0;margin:0}.data-list dt,.data-list dd{padding:10px 0;border-bottom:1px solid rgba(20,55,44,.7)}.data-list dt{color:var(--muted)}.data-list dd{margin:0;word-break:break-word}.policy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.policy-item{position:relative}.policy-item input{position:absolute;opacity:0}.policy-item label{display:flex;align-items:center;justify-content:space-between;min-height:58px;margin:0;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:#050d0a;cursor:pointer;color:#9cb7ac}.policy-item label:after{content:"OFF";direction:ltr;font:9px Consolas,monospace;color:#5b746a}.policy-item input:checked+label{border-color:rgba(49,240,139,.5);background:rgba(49,240,139,.065);color:var(--green)}.policy-item input:checked+label:after{content:"ON";color:var(--green)}
.json-box{max-height:420px;overflow:auto;background:#020605;color:#82ad9a;padding:15px;border:1px solid var(--line);border-radius:9px;white-space:pre-wrap;font:11px/1.7 Consolas,monospace;direction:ltr;text-align:left}.command-actions{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:16px}.command-actions button{margin:0}
.alert{display:flex;gap:12px;align-items:center;padding:13px 15px;border-radius:10px;margin-bottom:18px}.alert.error{color:#ffadb4;border:1px solid rgba(255,88,100,.35);background:rgba(255,88,100,.08)}.alert.success{color:#9df4c3;border:1px solid rgba(49,240,139,.35);background:rgba(49,240,139,.07)}
.auth-shell{display:grid;place-items:center;overflow:hidden}.auth-content{width:100%;min-height:100vh;display:grid;place-items:center;padding:24px;position:relative}.auth-content:before{content:"SECURE ACCESS";position:absolute;direction:ltr;top:7%;left:50%;transform:translateX(-50%);font:10px Consolas,monospace;letter-spacing:8px;color:#244a3b}.login-card{width:min(440px,100%);border:1px solid var(--line2);border-radius:18px;background:rgba(5,15,11,.94);padding:34px;box-shadow:0 35px 90px #000,0 0 80px rgba(49,240,139,.07);position:relative;overflow:hidden}.login-card:before{content:"";position:absolute;right:-65px;top:-65px;width:150px;height:150px;border:1px solid var(--green);border-radius:50%;opacity:.12}.login-logo{direction:ltr;text-align:center;margin-bottom:26px}.login-logo strong{display:block;color:var(--green);font:700 25px Consolas,monospace;letter-spacing:4px}.login-logo span{display:block;color:var(--muted);font:9px Consolas,monospace;letter-spacing:3px;margin-top:6px}.login-card h1{font-size:22px;margin:0 0 7px}.login-card>p{color:var(--muted);margin:0 0 24px}.login-card .field{margin-bottom:15px}.check{display:flex;align-items:center;gap:8px;margin:10px 0 16px}.check input{width:auto;accent-color:var(--green)}.login-card .primary-button{width:100%}
.empty{padding:36px;text-align:center;color:var(--muted)}
@media(max-width:1100px){.metrics{grid-template-columns:repeat(2,1fr)}.dashboard-grid,.detail-grid{grid-template-columns:1fr}.policy-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.sidebar{transform:translateX(105%);transition:.25s;width:min(290px,86vw);box-shadow:-20px 0 60px #000}.menu-open .sidebar{transform:none}.workspace{width:100%;margin-right:0}.topbar{padding:14px 18px;min-height:78px}.topbar .operator{display:none}.menu-button{display:block}.content{padding:22px 16px}.metrics{grid-template-columns:1fr 1fr;gap:10px}.metric{padding:15px}.metric strong{font-size:27px}.page-intro{align-items:flex-start}.live-clock{display:none}.form-grid,.policy-grid{grid-template-columns:1fr}.inline-form{display:block}.inline-form button{margin-top:10px;width:100%}.panel{overflow-x:auto}.panel-head{min-width:520px}table{min-width:650px}footer{padding:14px 18px;display:block;text-align:center}footer span{display:block;margin:4px}.login-card{padding:26px 20px}}