*{box-sizing:border-box} :root{color-scheme:dark;--bg:#080e18;--panel:#111b2a;--line:#26364b;--muted:#91a2b8;--text:#edf4ff;--cyan:#42e0c0;--amber:#ffbd59;--red:#ff6c76} body{margin:0;background:radial-gradient(ellipse at 50% -20%,#1a3044 0%,var(--bg) 55%);font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--text);min-height:100vh}.topbar{height:72px;border-bottom:1px solid #1d2b3c;display:flex;align-items:center;justify-content:space-between;padding:0 max(18px,calc((100% - 980px)/2));background:#09111ddd;position:sticky;top:0;z-index:2;backdrop-filter:blur(12px)}.brand{display:flex;gap:12px;align-items:center;letter-spacing:.08em}.brand-icon{width:38px;height:38px;border-radius:12px;background:#123d43;color:var(--cyan);display:grid;place-items:center;font-size:25px}.brand strong{display:block;font-size:13px}.brand small{display:block;color:var(--muted);font-size:9px;letter-spacing:.16em;margin-top:3px}.pill{font-size:11px;border:1px solid var(--line);padding:7px 11px;border-radius:30px}.pill.idle{color:var(--muted)}.pill.live{color:var(--cyan);border-color:#236c60}.wrap{width:min(940px,calc(100% - 28px));margin:26px auto 40px;display:grid;gap:16px}.panel{background:linear-gradient(145deg,#142033ed,#0e1725ed);border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:0 16px 45px #0002}.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.eyebrow{color:var(--cyan);font-size:10px;letter-spacing:.18em;font-weight:700;margin:0 0 6px}h1{font-size:23px;margin:0}h2{font-size:18px;margin:0}.live-dot{width:10px;height:10px;border-radius:50%;background:#536176}.live-dot.on{background:var(--cyan);box-shadow:0 0 16px var(--cyan)}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0}.metric{background:#0b1421;border:1px solid #1e3044;border-radius:14px;padding:14px;min-width:0}.metric span,.metric small{display:block;color:var(--muted);font-size:11px}.metric strong{display:block;font-size:clamp(23px,5vw,32px);margin:5px 0;color:var(--cyan);font-variant-numeric:tabular-nums}.metric em{font-size:12px;font-style:normal;color:var(--muted)}.metric small{font-size:9px;line-height:1.4}canvas{display:block;width:100%;height:150px;background:#091321;border:1px solid #1e3044;border-radius:13px}.controls{display:flex;gap:10px;margin-top:15px}button{border:0;border-radius:12px;padding:13px 18px;font-weight:700;font-size:13px;cursor:pointer}button:disabled{opacity:.4;cursor:not-allowed}.primary{background:var(--cyan);color:#06211f;flex:1}.secondary,.small{background:#1b2a3e;color:var(--text);border:1px solid #30445c}.hint{font-size:11px;color:var(--muted);line-height:1.6;margin:12px 0 0}.setting-row{display:flex;justify-content:space-between;margin:20px 0 8px;font-size:13px}.setting-row strong{color:var(--cyan);font-variant-numeric:tabular-nums}input[type=range]{width:100%;accent-color:var(--cyan)}.range-labels{display:flex;justify-content:space-between;color:var(--muted);font-size:10px}.actions{display:flex;gap:7px}.small{padding:8px 10px;font-size:10px}.small.danger{color:#ff9ca3}.empty{padding:25px;text-align:center;color:var(--muted);font-size:12px}.event-list{display:grid;gap:8px;margin-top:12px}.event{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;background:#0b1421;border:1px solid #22334a;border-radius:12px}.event strong{font-size:12px;display:block}.event small{font-size:10px;color:var(--muted)}.event .tag{color:var(--amber);font-size:10px;border:1px solid #72562b;border-radius:20px;padding:5px 8px;white-space:nowrap}.notice{border:1px solid #65502b;background:#211b12;border-radius:15px;padding:16px}.notice strong{color:var(--amber);font-size:13px}.notice p{font-size:11px;color:#c5b99f;line-height:1.7;margin:7px 0 0}footer{text-align:center;color:#718198;font-size:10px;padding:8px}@media(max-width:520px){.panel{padding:16px;border-radius:16px}.metrics{gap:6px}.metric{padding:10px}.metric small{font-size:8px}.section-head{align-items:flex-start}.actions{flex-direction:column}.small{padding:7px}.topbar{height:64px}}

.signal-meta{display:flex;align-items:center;gap:8px;margin-top:12px;color:var(--muted);font-size:11px}
.signal-meta strong{color:var(--cyan);font-size:13px;font-variant-numeric:tabular-nums}
.signal-meta .separator{color:#53677f}

.spectrum-head{display:flex;justify-content:space-between;gap:10px;margin:15px 2px 7px;color:var(--cyan);font-size:10px;letter-spacing:.14em;font-weight:700}
.spectrum-head small{color:var(--muted);font-size:9px;letter-spacing:0;font-weight:400}
#spectrogram{height:125px}
.calibration{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:20px;padding:13px;background:#0b1421;border:1px solid #22334a;border-radius:13px}
.calibration strong{font-size:12px}
.calibration .hint{margin-top:5px}
.calibration-status{font-size:10px;color:var(--muted);margin-top:8px}
.feedback-help{font-size:10px;line-height:1.6;color:var(--muted);padding:10px 12px;background:#0b1421;border-radius:10px;margin-top:12px}
.event-actions{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.event-actions button{font-size:9px;padding:6px 8px;border-radius:8px}
.event-actions .selected{border-color:var(--cyan);color:var(--cyan);background:#123238}
.event-actions .noise-selected{border-color:var(--amber);color:var(--amber);background:#332718}
.event-actions .unreviewed{color:var(--muted)}
@media(max-width:520px){.calibration{align-items:flex-start;flex-direction:column}.calibration button{width:100%}.spectrum-head{font-size:9px}}
