:root,[data-theme=light]{--bg: #f2f5fb;--bg-2: #e6ecf7;--panel: rgba(255, 255, 255, .82);--panel-solid: #ffffff;--ink: #10182a;--muted: #5b6b88;--line: rgba(16, 24, 42, .1);--accent: #1a5fff;--accent-2: #2f7dff;--accent-soft: rgba(47, 125, 255, .12);--warn: #b7791f;--danger: #c23b4a;--info: #2f7dff;--input-bg: #ffffff;--shadow: 0 18px 50px rgba(16, 40, 90, .08);--grad-a: rgba(47, 125, 255, .16);--grad-b: rgba(26, 95, 255, .1);--sidebar: rgba(255, 255, 255, .6);--radius: 14px;--font: "Outfit", system-ui, sans-serif;--mono: "JetBrains Mono", ui-monospace, monospace}[data-theme=dark]{--bg: #0a0f1a;--bg-2: #111827;--panel: rgba(17, 24, 39, .86);--panel-solid: #111827;--ink: #e8eef8;--muted: #7f8eab;--line: rgba(232, 238, 248, .1);--accent: #2f7dff;--accent-2: #4a90ff;--accent-soft: rgba(47, 125, 255, .16);--warn: #e0a84a;--danger: #f07178;--info: #6ea8fe;--input-bg: #0c1322;--shadow: 0 18px 50px rgba(0, 0, 0, .4);--grad-a: rgba(47, 125, 255, .14);--grad-b: rgba(26, 95, 255, .1);--sidebar: rgba(10, 15, 26, .82)}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;color:var(--ink);font-family:var(--font);background:radial-gradient(900px 520px at 0% 0%,var(--grad-a),transparent 55%),radial-gradient(800px 480px at 100% 10%,var(--grad-b),transparent 50%),linear-gradient(180deg,var(--bg-2) 0%,var(--bg) 45%,var(--bg-2) 100%);transition:background .25s ease,color .2s ease}button,input,select,textarea{font:inherit;color:inherit}a{color:var(--accent)}.app-shell{display:grid;grid-template-columns:250px 1fr;min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;padding:22px 14px;border-right:1px solid var(--line);background:var(--sidebar);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);display:flex;flex-direction:column;gap:4px}.brand{margin:4px 10px 22px;display:flex;align-items:center;gap:12px;animation:rise .5s ease both}.brand-icon{width:40px;height:40px;border-radius:10px;object-fit:contain;flex-shrink:0}.brand strong{display:block;font-size:1.25rem;letter-spacing:.04em;font-weight:700}.brand span{display:block;margin-top:2px;color:var(--muted);font-size:.78rem}.nav-btn{display:flex;align-items:center;gap:10px;text-align:left;border:1px solid transparent;background:transparent;border-radius:10px;padding:10px 12px;color:var(--muted);cursor:pointer;transition:background .15s ease,color .15s ease,transform .15s ease}.nav-btn svg{width:18px;height:18px;flex-shrink:0;opacity:.85}.nav-btn:hover{background:var(--accent-soft);color:var(--ink)}.nav-btn.active{background:var(--accent-soft);color:var(--accent);border-color:color-mix(in srgb,var(--accent) 25%,transparent);font-weight:600}.nav-btn.active svg{opacity:1}.main{padding:28px 32px 56px;max-width:1180px;animation:rise .45s ease both}h1{margin:0 0 6px;font-size:1.7rem;letter-spacing:-.02em}.page-sub{margin:0 0 22px;color:var(--muted)}.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(420px,100%);padding:28px;border-radius:20px;background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);animation:rise .45s ease both}.login-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.login-brand{display:flex;align-items:center;gap:12px}.login-brand img{width:44px;height:44px;object-fit:contain}.login-card h1{font-size:1.8rem;margin:0}.field{margin-bottom:14px}.field label{display:block;margin-bottom:6px;font-size:.85rem;color:var(--muted)}input,select,textarea{width:100%;border:1px solid var(--line);background:var(--input-bg);border-radius:10px;padding:10px 12px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}input:focus,select:focus,textarea:focus{border-color:color-mix(in srgb,var(--accent) 50%,transparent);box-shadow:0 0 0 3px var(--accent-soft)}.btn{border:1px solid var(--line);background:var(--panel-solid);border-radius:10px;padding:10px 14px;cursor:pointer;transition:transform .12s ease,background .12s ease}.btn:hover{transform:translateY(-1px)}.btn.primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;border-color:transparent;font-weight:600}.btn.danger{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 30%,transparent)}.theme-btn{flex-shrink:0}.btn-row{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.metric-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:18px}.metric{padding:16px;border-radius:14px;background:var(--panel-solid);border:1px solid var(--line);box-shadow:var(--shadow);animation:rise .5s ease both}.metric-click{cursor:pointer}.metric-click:hover{border-color:color-mix(in srgb,var(--accent) 40%,transparent)}.metric .val{font-size:1.55rem;font-weight:700;letter-spacing:-.03em}.metric .lbl{margin-top:4px;color:var(--muted);font-size:.82rem}.table{width:100%;border-collapse:collapse;font-size:.92rem}.table th,.table td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:top}.table th{color:var(--muted);font-weight:500}.table tbody tr{cursor:pointer;transition:background .12s ease}.table tbody tr:hover{background:#4f9dff14}.table tbody tr.row-selected{background:#4f9dff2e;box-shadow:inset 3px 0 0 var(--accent)}.table tbody tr.row-selected td{color:var(--text)}.badge{display:inline-flex;align-items:center;padding:3px 8px;border-radius:999px;font-size:.75rem;background:var(--bg-2);color:var(--muted)}.badge.on{background:var(--accent-soft);color:var(--accent)}.badge.off{opacity:.85}.error{color:var(--danger);margin:8px 0}.muted{color:var(--muted)}.mono{font-family:var(--mono);font-size:.85rem}.error-list{margin:0 0 12px;padding-left:18px;color:var(--muted)}.split{display:grid;grid-template-columns:1.1fr 1fr;gap:16px}@media(max-width:960px){.app-shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center}.brand{margin:0 8px 0 0}.split{grid-template-columns:1fr}.main{padding:18px 16px 40px}}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}