:root{--bg:#f4f7f6;--surface:#fff;--surface2:#f8faf9;--text:#10211c;--muted:#65746f;--line:#dfe7e4;--accent:#12b76a;--blue:#3478f6;--purple:#8b5cf6;--orange:#f59e0b;--danger:#ef4444;--shadow:0 3px 16px #173a2d0b}
html[data-theme=dark]{--bg:#07110f;--surface:#0c1916;--surface2:#10211d;--text:#eafff7;--muted:#8ca59d;--line:#203a33;--accent:#6dff8a;--blue:#64a0ff;--purple:#b899ff;--orange:#ffc35b;--shadow:0 12px 40px #0004}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.topbar{height:70px;display:flex;align-items:center;gap:35px;padding:0 max(24px,calc((100vw - 1500px)/2));background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-size:17px;font-weight:850;letter-spacing:1.5px;white-space:nowrap}.brand b{color:var(--accent)}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:var(--text);color:var(--surface);font-weight:900}
.topbar nav{display:flex;align-self:stretch}.topbar nav a{display:grid;place-items:center;padding:0 20px;border-bottom:2px solid transparent;color:var(--muted);font-weight:600;text-decoration:none}.topbar nav a:hover,.topbar nav a.active{color:var(--text);border-color:var(--accent)}.top-actions{display:flex;align-items:center;gap:10px;margin-left:auto}.network-select{min-width:175px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;display:grid;grid-template-columns:auto 1fr;gap:0 7px;background:var(--surface2);font-size:11px}.network-select i{width:8px;height:8px;border-radius:50%;background:var(--orange);grid-row:1/3;align-self:center}.network-select i.online{background:var(--accent);box-shadow:0 0 10px var(--accent)}.network-select i.offline{background:var(--danger)}.network-select span{color:var(--muted)}.network-select b{font-size:12px}.icon-button{width:38px;height:38px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--text);font-size:18px;cursor:pointer}.menu-button{display:none}
.search-wrap{max-width:1500px;margin:0 auto;padding:18px 24px 0}.search{height:50px;border:1px solid var(--line);border-radius:11px;background:var(--surface);display:flex;align-items:center;padding:0 15px;box-shadow:var(--shadow)}.search span{font-size:25px;color:var(--muted);margin-right:10px}.search input{flex:1;border:0;outline:0;background:none;color:var(--text);font-size:14px}.search kbd{border:1px solid var(--line);background:var(--surface2);border-radius:5px;padding:2px 7px;color:var(--muted)}.search-error{color:var(--danger);height:18px;margin:5px 2px 0}
main{max-width:1500px;margin:auto;padding:25px 24px 70px}.page-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:25px}.page-head h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(34px,4vw,52px);line-height:1.05;margin:2px 0 5px;letter-spacing:-1.5px}.page-head>div>p:last-child{margin:0;color:var(--muted)}.eyebrow{font:800 10px/1.4 Inter,sans-serif;letter-spacing:1.8px;color:var(--accent);margin:0 0 5px}.live-badge{display:flex;align-items:center;gap:7px;padding:7px 11px;border:1px solid var(--line);border-radius:99px;color:var(--muted);background:var(--surface);font-size:12px}.live-badge i,.node-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent)}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:18px}.metric{min-height:126px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:22px 20px;box-shadow:var(--shadow)}.metric.accent{border-top:3px solid var(--accent)}.metric span,.metric small{display:block;color:var(--muted)}.metric span{text-transform:uppercase;letter-spacing:.7px;font-size:11px}.metric strong{display:block;font-family:Georgia,"Times New Roman",serif;font-size:25px;font-weight:500;margin:15px 0 3px}.metric small{font-size:11px}
.dashboard-grid,.chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);overflow:hidden}.panel.full{margin-top:18px}.panel>header{display:flex;align-items:center;justify-content:space-between;padding:20px;border-bottom:1px solid var(--line)}.panel h2{font-size:18px;margin:0}.table-scroll{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap;text-align:left}th{padding:12px 16px;background:var(--surface2);color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.8px}td{padding:15px 16px;border-top:1px solid var(--line);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}tbody tr[data-route]{cursor:pointer;transition:.15s}tbody tr[data-route]:hover{background:color-mix(in srgb,var(--accent) 6%,transparent)}td small{display:block;color:var(--muted);font:10px/1.4 Inter,sans-serif;margin-top:4px}.data-link{color:var(--blue);text-decoration:none}.status{display:inline-flex;padding:3px 8px;border-radius:99px;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);font:700 10px Inter,sans-serif;text-transform:capitalize}.status.pending{color:var(--orange);background:color-mix(in srgb,var(--orange) 12%,transparent)}.positive{color:var(--accent)}.empty{text-align:center;color:var(--muted);padding:45px!important}
.chart-grid{margin-top:18px}.chart-grid .panel>header{border:0;padding-bottom:0}.chart{display:block;width:100%;height:210px;padding:10px 15px}.chart .grid line{stroke:var(--line);stroke-width:1}.chart-scale{display:flex;justify-content:space-between;padding:0 22px 18px;color:var(--muted);font-size:10px}.chart-scale b{color:var(--text)}.insight-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:18px}.insight-grid .metric{min-height:110px}
.detail-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:8px 25px;box-shadow:var(--shadow)}.detail-card>div{display:grid;grid-template-columns:220px minmax(0,1fr);gap:25px;padding:17px 0;border-bottom:1px solid var(--line)}.detail-card>div:last-child{border:0}.detail-card span{color:var(--muted)}.detail-card code{overflow-wrap:anywhere;color:var(--text)}.error-card{border:1px solid color-mix(in srgb,var(--danger) 40%,var(--line));background:var(--surface);padding:25px;border-radius:14px}.error-card b{color:var(--danger)}
footer{max-width:1500px;margin:auto;border-top:1px solid var(--line);padding:25px 24px;display:flex;align-items:center;gap:28px;color:var(--muted);font-size:12px}.brand.mini{font-size:12px}.brand.mini .brand-mark{width:26px;height:26px}.brand.mini+span{margin-right:auto}footer>a:last-child{color:var(--muted);text-decoration:none}
@media(max-width:1150px){.topbar{gap:15px}.topbar nav a{padding:0 10px}.network-select{min-width:auto}.network-select span{display:none}.metrics,.insight-grid{grid-template-columns:1fr 1fr}}
@media(max-width:800px){.topbar{height:62px}.menu-button{display:block}.topbar nav{display:none;position:absolute;top:61px;left:0;right:0;background:var(--surface);border-bottom:1px solid var(--line);height:auto;padding:8px;box-shadow:var(--shadow)}.topbar nav.open{display:grid;grid-template-columns:1fr 1fr}.topbar nav a{padding:13px;border:0;border-radius:8px}.topbar nav a.active{background:var(--surface2);color:var(--accent)}.network-select{display:none}.dashboard-grid,.chart-grid{grid-template-columns:1fr}.detail-card>div{grid-template-columns:1fr;gap:4px}.page-head{align-items:flex-start;gap:15px}.live-badge{margin-top:10px}.page-head h1{font-size:36px}}
@media(max-width:540px){.metrics,.insight-grid{grid-template-columns:1fr;gap:10px}.metric{min-height:105px}.search-wrap,main{padding-left:14px;padding-right:14px}.topbar{padding:0 14px}.page-head{display:block}.live-badge{display:inline-flex}.top-actions{gap:5px}.brand{font-size:14px}footer{flex-wrap:wrap}.brand.mini+span{width:100%;order:3}}
