: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-grid-rings{grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:14px}.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}.metric-ring{display:flex;flex-direction:column;align-items:center;gap:8px;margin:0;padding:18px 14px 14px;border-radius:16px;background:var(--panel-solid);border:1px solid var(--line);box-shadow:var(--shadow);color:inherit;font:inherit;text-align:center;animation:rise .55s ease both}.metric-ring.is-click{cursor:pointer;transition:border-color .15s ease,transform .15s ease}.metric-ring.is-click:hover{border-color:color-mix(in srgb,var(--accent) 42%,transparent);transform:translateY(-1px)}.metric-ring-gauge{position:relative;width:108px;height:108px}.metric-ring-svg{width:108px;height:108px;transform:rotate(-90deg);display:block}.metric-ring-track,.metric-ring-progress{fill:none;stroke-width:8;stroke-linecap:round}.metric-ring-track{stroke:color-mix(in srgb,var(--line) 85%,var(--muted));opacity:.9}.metric-ring-progress{stroke:var(--accent);transition:stroke-dashoffset .9s cubic-bezier(.22,1,.36,1)}.metric-ring-accent .metric-ring-progress{stroke:var(--accent)}.metric-ring-ok .metric-ring-progress{stroke:#2fbf71}.metric-ring-warn .metric-ring-progress{stroke:var(--warn)}.metric-ring-danger .metric-ring-progress{stroke:var(--danger)}.metric-ring-muted .metric-ring-progress{stroke:var(--muted)}.metric-ring-center{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;pointer-events:none}.metric-ring-center .val{font-size:1.15rem;font-weight:700;letter-spacing:-.03em;line-height:1.1;max-width:72px;word-break:break-word}.metric-ring-slash{font-size:.78em;font-weight:600;color:var(--muted)}.metric-ring .lbl{margin:0;color:var(--muted);font-size:.8rem;line-height:1.25;max-width:11.5rem}.metric-ring-pct{font-size:.72rem;color:var(--muted);opacity:.85}.surface-section{margin:0 0 18px}.surface-section-title{margin:0 0 10px;font-size:1rem;font-weight:650;letter-spacing:-.02em}.surface-panel{overflow:hidden;border-radius:16px;border:1px solid var(--line);background:var(--panel-solid);box-shadow:var(--shadow)}.surface-grid{display:grid;grid-template-columns:1fr}@media(min-width:640px){.surface-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.surface-grid{grid-template-columns:repeat(4,1fr)}}.surface-card{padding:18px 16px 14px;border-bottom:1px solid var(--line);background:transparent}@media(min-width:640px){.surface-card:nth-child(odd){border-right:1px solid var(--line)}.surface-card:nth-last-child(-n+2){border-bottom:none}}@media(min-width:1024px){.surface-card{border-bottom:none;border-right:1px solid var(--line)}.surface-card:nth-child(odd){border-right:1px solid var(--line)}.surface-card:last-child{border-right:none}}.surface-card-warn{background:color-mix(in srgb,var(--warn) 12%,transparent)}.surface-card-danger{background:color-mix(in srgb,var(--danger) 12%,transparent)}.surface-card-label{margin:0;font-size:.72rem;color:var(--muted)}.surface-card-warn .surface-card-label,.surface-card-danger .surface-card-label{color:inherit;opacity:.85}.surface-card-row{margin-top:8px;display:flex;align-items:flex-end;justify-content:space-between;gap:8px}.surface-card-value{font-size:1.45rem;font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums;line-height:1}.surface-card-badge{font-size:.72rem;font-weight:600;color:#2fbf71;white-space:nowrap}.surface-card-badge-warn{color:var(--warn)}.surface-card-badge-danger{color:var(--danger)}.surface-spark{margin-top:14px;display:block;width:100%;height:28px;color:color-mix(in srgb,var(--muted) 70%,transparent)}.surface-card-warn .surface-spark{color:var(--warn)}.surface-card-danger .surface-spark{color:var(--danger)}.surface-card-hint{margin:8px 0 0;font-size:.68rem;color:var(--muted);line-height:1.35}.surface-card-warn .surface-card-hint{color:color-mix(in srgb,var(--warn) 80%,var(--ink))}.surface-card-danger .surface-card-hint{color:color-mix(in srgb,var(--danger) 80%,var(--ink))}.surface-alert{display:flex;flex-direction:column;gap:12px;padding:14px 16px;border-top:1px solid color-mix(in srgb,var(--warn) 35%,var(--line));background:color-mix(in srgb,var(--warn) 14%,transparent)}@media(min-width:640px){.surface-alert{flex-direction:row;align-items:center}}.surface-alert-danger{border-top-color:color-mix(in srgb,var(--danger) 40%,var(--line));background:color-mix(in srgb,var(--danger) 14%,transparent)}.surface-alert-dot{width:8px;height:8px;border-radius:50%;background:var(--warn);flex-shrink:0}.surface-alert-danger .surface-alert-dot{background:var(--danger)}.surface-alert-msg{margin:0;flex:1;font-size:.88rem;line-height:1.4;color:color-mix(in srgb,var(--warn) 55%,var(--ink))}.surface-alert-danger .surface-alert-msg{color:color-mix(in srgb,var(--danger) 45%,var(--ink))}.surface-alert-btn{align-self:flex-start;border:none;border-radius:10px;padding:8px 12px;font:inherit;font-size:.75rem;font-weight:650;cursor:pointer;color:#fff;background:color-mix(in srgb,var(--warn) 70%,#111)}.surface-alert-danger .surface-alert-btn{background:color-mix(in srgb,var(--danger) 75%,#111)}.surface-alert-btn:hover{filter:brightness(1.06)}.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)}.log-console{display:grid;gap:12px}.log-console-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.log-console-title{display:flex;align-items:center;gap:10px}.log-live{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:999px;background:#22c55e1f;color:#4ade80;font-size:.72rem;font-weight:700;letter-spacing:.06em}.log-live i{width:7px;height:7px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 3px #4ade8033}.log-live.is-paused{opacity:.45;background:#94a3b81f;color:#94a3b8}.log-live.is-paused i{background:#94a3b8;box-shadow:none}.log-console-actions{display:flex;gap:8px}.log-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.log-levels{display:flex;flex-wrap:wrap;gap:6px}.log-lvl{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(255,255,255,.12);background:transparent;color:#94a3b8;border-radius:999px;padding:4px 10px;font:inherit;font-size:.78rem;font-weight:700;cursor:pointer}.log-lvl.is-on{color:#fff;background:#0f172a;border-color:#0f172a}.log-search{flex:1 1 180px;min-width:160px;max-width:320px;padding:8px 10px;border-radius:8px;border:1px solid rgba(255,255,255,.12);background:#00000040;color:inherit;font:inherit;font-size:.86rem}.log-panel{height:min(360px,48vh);overflow:auto;padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:#070b14;font-size:.8rem;line-height:1.45}.log-line{display:flex;gap:12px;padding:2px 0}.log-line.is-error{margin:0 -8px;padding:2px 8px;border-left:2px solid #ef4444;background:#ef44441a}.log-time{flex:0 0 auto;color:#64748b}.log-level{flex:0 0 52px;font-weight:700}.log-level-debug{color:#64748b}.log-level-info{color:#60a5fa}.log-level-warn{color:#fbbf24}.log-level-error{color:#f87171}.log-source{flex:0 0 72px;color:#94a3b8}.log-msg{color:#cbd5e1;min-width:0;word-break:break-word}.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)}}