:root{color-scheme:dark;--bg:#070b10;--surface:#0d141d;--surface2:#111b26;--surface3:#081019;--line:#263545;--line2:#34495d;--text:#eef3f7;--muted:#94a4b4;--accent:#5a93c7;--accent2:#1d4f79;--warn:#b58a45;--danger:#9f5963;--good:#5f9277;--radius:12px;--shadow:0 14px 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,"Segoe UI",sans-serif}a{color:#bcd8ef;text-decoration:none}a:hover{text-decoration:underline}button,select,input{font:inherit}button,select,input,.file-btn{min-height:40px;border:1px solid var(--line2);background:#0b1621;color:var(--text);border-radius:8px;padding:8px 11px}button,.file-btn{cursor:pointer}button:hover,.file-btn:hover{border-color:#54708a;background:#10202e}button:disabled{opacity:.5;cursor:not-allowed}.primary{background:var(--accent2);border-color:#4c82b0}.danger{background:#2a151b;border-color:#72404a}.muted{color:var(--muted)}:focus-visible{outline:3px solid #75aee0;outline-offset:2px}
.appbar{position:sticky;top:0;z-index:50;min-height:62px;padding:10px max(20px,4vw);display:flex;align-items:center;justify-content:space-between;background:#070b10f4;border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}.brand{display:flex;gap:10px;align-items:center;color:var(--text)}.brand:hover{text-decoration:none}.mark{width:34px;height:34px;display:grid;place-items:center;background:#132333;border:1px solid #4c6277;font-size:11px;font-weight:800;letter-spacing:.08em}.brand strong,.brand small{display:block}.brand small{color:var(--muted);font-size:10px}.app-actions,.action-row,.session-actions,.guided-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.status-pill{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:#0b131c;border-radius:99px;padding:6px 10px;font-size:12px;color:var(--muted)}.status-pill.connected{color:#cfe8da;border-color:#3f6c58}.status-pill.attention{color:#f0d7a5;border-color:#765e36}
main{width:min(1580px,94vw);margin:0 auto;padding:18px 0 60px}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}.sessionbar{display:grid;grid-template-columns:minmax(180px,1fr) minmax(180px,1fr) minmax(160px,.7fr) auto;gap:10px;align-items:end;margin-bottom:12px}.sessionbar label,.output-grid label,.expect-row label{display:grid;gap:4px;color:var(--muted);font-size:12px}.sessionbar .support{grid-column:1/-1;margin:0;color:#b9c8d6;min-height:20px}.tabs{display:flex;gap:6px;overflow:auto;padding:4px 0 12px;position:sticky;top:62px;z-index:40;background:linear-gradient(var(--bg) 80%,transparent)}.tab{white-space:nowrap;border-color:transparent;background:transparent;color:var(--muted)}.tab.active{background:var(--surface2);border-color:var(--line2);color:var(--text)}
.view{display:none}.active-view{display:block}.hero{display:grid;grid-template-columns:1.35fr 1fr;gap:20px;align-items:center;margin-bottom:12px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.18em;color:#80a9cd;margin:0 0 8px}.hero h1{font-size:clamp(32px,5vw,62px);line-height:1;letter-spacing:-.035em;margin:0 0 13px}.hero p{color:var(--muted);max-width:780px}.guided-box{background:var(--surface3);border:1px solid var(--line);border-radius:10px;padding:14px;display:grid;gap:12px}.guided-box p{margin:3px 0 0}.stats{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;margin:12px 0}.stat{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px}.stat strong{font-size:21px;display:block}.stat span{color:var(--muted);font-size:11px}.grid{display:grid;gap:12px;margin-bottom:12px}.grid.two{grid-template-columns:1.35fr 1fr}.grid.three{grid-template-columns:repeat(3,1fr)}.controls-layout{grid-template-columns:minmax(260px,.75fr) 1.7fr}h2{font-size:17px;margin:0 0 4px}h3{font-size:13px;margin:16px 0 7px;color:#b5c4d2}.panel p{margin-top:3px}.section-head{display:flex;justify-content:space-between;gap:10px;align-items:start}.toolbar{display:grid;grid-template-columns:1.2fr repeat(4,minmax(130px,.6fr)) auto auto;gap:8px;margin:12px 0}.check{display:flex!important;align-items:center;gap:6px;color:var(--muted);font-size:12px}.check input{min-height:auto}.monitor-wrap{height:470px;overflow:auto;border:1px solid #1e2b38;background:#05090d;border-radius:9px}.event-table{width:100%;border-collapse:collapse;min-width:920px;font:11px/1.35 ui-monospace,SFMono-Regular,Consolas,monospace}.event-table thead{position:sticky;top:0;background:#0b1219;z-index:2}.event-table th,.event-table td{text-align:left;padding:7px 8px;border-bottom:1px solid #14202b;white-space:nowrap}.event-table tbody tr:hover{background:#0d1822}.event-table .muted-cell{color:#70869a}.meter-row{display:grid;grid-template-columns:125px 1fr auto;gap:8px;align-items:center;margin:7px 0;font-size:12px}.meter-track{height:7px;background:#182432;border-radius:99px;overflow:hidden}.meter-fill{height:100%;background:#527ca2}.finding{display:grid;grid-template-columns:auto 1fr;gap:10px;border-top:1px solid #1d2935;padding:10px 0}.finding:first-child{border-top:0}.finding .badge{font-size:10px;padding:3px 6px;border-radius:99px;border:1px solid var(--line2);height:max-content}.finding.attention .badge{border-color:#79613d;color:#efcf96}.finding.investigate .badge{border-color:#7b4750;color:#efb7bf}.inventory-list,.compact-table{display:grid;gap:6px}.inventory-item,.compact-row,.control-card{display:grid;grid-template-columns:minmax(100px,.5fr) 1fr auto;gap:10px;align-items:center;border-top:1px solid #1c2935;padding:8px 0}.control-card{cursor:pointer}.control-card.selected{background:#10202d;margin:0 -8px;padding:8px;border-radius:7px}.control-card small,.compact-row small{color:var(--muted)}#controlGraph{width:100%;height:220px;background:#071019;border:1px solid #1f3040;border-radius:8px;margin-top:12px}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.metric{padding:9px;background:#0a121a;border:1px solid #1f2e3d;border-radius:8px}.metric strong{display:block;font-size:17px}.metric span{font-size:10px;color:var(--muted)}.histogram{height:90px;display:flex;align-items:end;gap:3px;margin-top:10px}.histogram span{display:block;flex:1;min-width:3px;background:#4d7599;border-radius:2px 2px 0 0}.keyboard{display:flex;align-items:start;overflow:auto;gap:2px;padding:12px 0;min-height:82px}.key{min-width:32px;height:72px;background:#e7ecf0;color:#111923;border-radius:0 0 4px 4px;display:grid;place-items:end center;padding-bottom:5px;font-size:9px;border:1px solid #91a0ad}.key.black{height:48px;background:#17212a;color:#bac7d1;border-color:#2d3d4d}.key.seen{box-shadow:inset 0 0 0 3px #4e88b8}.key.held{background:#5790c1;color:#fff}.key.missing{background:#3a2228;color:#f3c7cd}.tags{display:flex;flex-wrap:wrap;gap:6px}.tags span{border:1px solid #36516a;background:#0d1c2a;padding:4px 7px;border-radius:99px;font-size:11px}.expect-row{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.expect-row input{width:90px}.output-grid{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr));gap:9px;align-items:end}.connection-log{max-height:220px;overflow:auto;background:#070d13;border:1px solid #1e2b37;padding:10px;border-radius:8px;color:#9eb0c0;font-size:11px}.learn{padding:14px;background:#08111a;border:1px solid #263a4d;border-radius:8px;font:12px ui-monospace,monospace;margin:10px 0}.mapping-add{display:grid;grid-template-columns:1fr auto;gap:8px}.mapping-add input{width:100%}table{width:100%;border-collapse:collapse}td,th{text-align:left;padding:8px;border-top:1px solid #1f2d3b}.report details{margin-top:14px}.report pre{max-height:360px;overflow:auto;background:#060b10;border:1px solid #1f2d3b;padding:12px;border-radius:8px;font-size:11px}.file-btn{display:inline-flex;align-items:center}.file-btn input{display:none}.related{margin-top:12px}.related>div{display:flex;gap:12px;flex-wrap:wrap}.related a{padding:8px 10px;background:#0a1621;border:1px solid var(--line);border-radius:8px}footer{border-top:1px solid var(--line);padding:22px 4vw 45px;color:var(--muted);font-size:12px}dialog{width:min(760px,92vw);background:var(--surface);color:var(--text);border:1px solid var(--line2);border-radius:12px;padding:18px;box-shadow:0 30px 80px #000a}dialog::backdrop{background:#000a}
@media(max-width:1180px){.stats{grid-template-columns:repeat(4,1fr)}.sessionbar{grid-template-columns:1fr 1fr}.session-actions{grid-column:1/-1}.grid.two,.grid.three,.controls-layout,.hero{grid-template-columns:1fr}.toolbar{grid-template-columns:1fr 1fr 1fr}.output-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){main{width:min(96vw,100%);padding-top:10px}.appbar{padding:8px 12px}.brand small,.status-pill{display:none}.tabs{top:55px}.sessionbar{grid-template-columns:1fr}.session-actions{grid-column:auto}.stats{grid-template-columns:1fr 1fr}.toolbar{grid-template-columns:1fr}.output-grid{grid-template-columns:1fr 1fr}.metric-grid{grid-template-columns:1fr 1fr}.section-head{flex-direction:column}.event-table{min-width:860px}.panel{padding:13px}.hero h1{font-size:34px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media print{.appbar,.sessionbar,.tabs,.related,footer,.action-row,button{display:none!important}.view{display:none!important}#reportView.active-view,#mappingView.active-view{display:block!important}.panel{box-shadow:none;border-color:#777;color:#000;background:#fff}body{background:#fff;color:#000}.report pre{color:#000;background:#fff}.muted{color:#444}}
button.control-card{width:100%;text-align:left;font:inherit;color:inherit;background:transparent;border:0;border-top:1px solid #1c2935;border-radius:0;min-height:44px}
button.control-card.selected{background:#10202d;border-radius:7px}
.pitch-meter{position:relative;height:22px;margin-top:12px;border:1px solid var(--line2);border-radius:6px;background:#0b1520;overflow:hidden}
.pitch-meter .pitch-center{position:absolute;left:50%;top:0;bottom:0;width:2px;background:#8aa4bb}
.pitch-meter .pitch-range{position:absolute;top:5px;bottom:5px;background:#2b4a66;border-radius:3px}
.pitch-meter .pitch-now{position:absolute;top:0;bottom:0;width:4px;margin-left:-2px;background:#6ba1cf}
.sysex-list{display:grid;gap:8px;max-height:360px;overflow:auto}
.sysex-item{border-top:1px solid #1c2935;padding-top:8px}
.sysex-item code{display:block;margin-top:4px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px;word-break:break-all;color:var(--muted)}
.report-table{width:100%;border-collapse:collapse;margin:6px 0 14px}
.report-table th,.report-table td{text-align:left;padding:6px 8px;border-top:1px solid #1c2935;vertical-align:top}
.report-table th[scope="row"]{width:42%;color:var(--muted);font-weight:600}
@media print{.report-table th,.report-table td{border-color:#999;color:#000}.finding .badge{color:#000!important}}

.test-card{margin-bottom:12px}.test-card h4{margin:14px 0 4px}.test-card p{margin:4px 0}.test-card details{margin-top:10px;border-top:1px solid #1d2935;padding-top:8px}
.test-rows{margin-top:8px;border-top:1px solid #1c2935;padding-top:6px;font-size:13px;color:var(--muted)}
.status-chip{font-size:11px;padding:3px 9px;border-radius:99px;border:1px solid var(--line2);white-space:nowrap;height:max-content}
.status-chip.status-ok{border-color:#3e6b53;color:#a9d6bd}.status-chip.status-attention{border-color:#79613d;color:#efcf96}.status-chip.status-investigate{border-color:#7b4750;color:#efb7bf}
.win-finding{border-top:1px solid #1d2935;padding:12px 0}.win-finding:first-child{border-top:0}.win-finding h3{margin:4px 0}.win-finding p{margin:4px 0}.win-finding .tag{font-size:11px;border:1px solid var(--line2);border-radius:99px;padding:2px 8px;margin-right:6px}
.win-finding .tag.now{border-color:#7b4750;color:#efb7bf}.win-src{color:var(--muted);font-size:12px}

textarea{width:100%;background:var(--surface3);color:var(--text);border:1px solid var(--line2);border-radius:8px;padding:8px;font:13px ui-monospace,monospace}
.term{background:none;border:1px solid var(--line2);border-radius:99px;padding:2px 9px;font-size:12px;color:var(--accent);cursor:pointer}
#chartCanvas{width:100%;height:auto;background:var(--surface3);border:1px solid var(--line);border-radius:8px}
.s-flag{color:#efb7bf;font-weight:600}dialog#glossaryDialog{max-width:760px;width:92vw}
[hidden]{display:none!important}
@media print{.appbar,.sessionbar,.tabs,.related,footer{display:none!important}}
