:root{--bg:#101318;--panel:#171c24;--panel-2:#202733;--text:#ecf2f8;--muted:#9ca9b8;--line:#303a49;--accent:#22c55e;--accent-2:#38bdf8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}.app{min-height:100vh;display:grid;grid-template-columns:minmax(420px,1fr)430px}.stage{padding:18px;display:grid;grid-template-rows:auto minmax(0,1fr)auto;gap:14px}.topbar{display:flex;justify-content:space-between;gap:16px;align-items:center}h1{margin:0 0 4px;font-size:22px}h2{margin:0 0 10px;font-size:15px}p{margin:0;color:var(--muted);font-size:13px}.transport,.actions,.segmented{display:flex;gap:8px;flex-wrap:wrap}.fieldFrame{width:min(100%,calc(100vh - 116px));margin:auto;display:grid;grid-template-columns:56px minmax(0,1fr);grid-template-rows:auto 34px}.canvasShell{position:relative;width:100%;aspect-ratio:1;border:1px solid var(--line);background:#05070a;touch-action:none}canvas{display:block}#fieldCanvas,#overlayCanvas{position:absolute;inset:0;width:100%;height:100%}#overlayCanvas{cursor:crosshair}#yAxisCanvas{width:56px;height:100%}#xAxisCanvas{width:100%;height:34px}.axisCorner{width:56px;height:34px}.legend{display:grid;grid-template-columns:70px 1fr 70px;gap:10px;align-items:center;max-width:min(100%,calc(100vh - 116px));width:100%;margin:0 auto;font-size:12px;color:var(--muted)}.legend span:last-child{text-align:right}.legendBar{height:12px;border-radius:8px;border:1px solid rgba(255,255,255,.18);background:linear-gradient(90deg,#080d1e,#265ba8,#f7b733,#fff5cc)}.panel{max-height:100vh;overflow:auto;padding:14px;border-left:1px solid var(--line);background:var(--panel)}.section{padding:12px 0;border-bottom:1px solid var(--line)}.compact{display:grid;gap:10px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}label{display:grid;gap:5px;color:var(--muted);font-size:12px}label b{color:var(--text);font-size:12px;font-weight:600}input,select,button{min-height:34px;border:1px solid var(--line);background:var(--panel-2);color:var(--text);border-radius:7px;padding:6px 9px;font:inherit}input[type=range]{padding:0}button{cursor:pointer;font-weight:650}button:hover,input:focus,select:focus{border-color:var(--accent-2);outline:none}button.active,.segmented button.active{background:#123622;border-color:var(--accent);color:#ddffe9}.check{grid-template-columns:18px 1fr;align-items:center}.check input{min-height:18px;width:18px}.beamControls{margin-top:10px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.hidden{display:none}.muted{color:var(--muted);font-size:13px;margin-bottom:10px}.sourceList{display:grid;gap:6px;max-height:190px;overflow:auto}.sourceRow{display:grid;grid-template-columns:26px 1fr auto auto;gap:8px;align-items:center;padding:7px;border:1px solid var(--line);border-radius:7px;background:rgba(255,255,255,.03);font-size:12px}.sourceRow.selected{border-color:var(--accent);background:rgba(34,197,94,.12)}.dot{width:14px;height:14px;border-radius:999px;display:inline-block;border:2px solid rgba(255,255,255,.75)}#scopeCanvas,#spectrumCanvas{width:100%;height:auto;border:1px solid var(--line);border-radius:7px;background:#090d13;margin-bottom:8px}.tableWrap{max-height:260px;overflow:auto;font-size:12px}table{width:100%;border-collapse:collapse}th,td{padding:5px;border-bottom:1px solid var(--line);text-align:right}th:first-child,td:first-child{text-align:left}.probeButtons{display:flex;gap:6px;justify-content:flex-start}.probeButtons button{min-height:28px;padding:4px 7px;font-size:12px}.probeButtons button.audioActive{background:#14532d;border-color:#22c55e;color:#dcfce7;box-shadow:0 0 0 1px rgba(34,197,94,.35) inset}@media(max-width:980px){.app{grid-template-columns:1fr}.panel{max-height:none;border-left:0;border-top:1px solid var(--line)}.fieldFrame{width:min(100%,720px)}}@media(max-width:560px){.stage,.panel{padding:10px}.topbar,.grid2,.beamControls{grid-template-columns:1fr;display:grid}.legend{grid-template-columns:54px 1fr 54px}}