:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none;color-scheme:light dark;--page:#f2f3ed;--panel:#fafbf6;--sunken:#f0f2eb;--hover:#edf1e7;--trough:#e8ebe2;--line:#dfe3d9;--border:#d7dfd1;--ink:#253329;--ink-strong:#34492f;--muted:#778074;--faint:#929b88;--green:#284a32;--green-hover:#3a6245;--on-green:#fff;--soft:#c4eda0;--soft-hover:#d3f6b7;--on-soft:#1b3022;--control:#5d7c45;--focus:#8bb968;--tint:#f1f5e9;--tint-line:#dce4d3;--tint-ink:#4e673c;--notice:#f7f4df;--notice-ink:#877637;--notice-line:#dedbbc;--error:#fcf0e9;--error-ink:#984f2a;--error-line:#ecd7c8;--bad:#f9dfd2;--bad-ink:#9b4c31;--chart:#101917;--ch1:#e9c96b;--ch2:#79cdd8;--ch3:#c0a1ef;color:var(--ink);background:var(--page)}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--focus);outline-offset:3px}[hidden]{display:none!important}a{color:inherit}h1,h2,p{margin:0}.topbar{height:82px;padding:0 34px;display:flex;align-items:center;gap:32px;border-bottom:1px solid var(--line);background:var(--panel)}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;font-size:26px;font-weight:650;letter-spacing:-1px}.brand img{width:38px;height:38px}.edition{display:inline-block;vertical-align:middle;font-size:9px;font-weight:700;letter-spacing:1.1px;color:var(--muted);border:1px solid var(--border);padding:4px 5px;border-radius:4px;margin-left:10px}.connection{display:flex;gap:9px;align-items:center;font-size:12px;color:var(--muted);margin-left:auto}.dot{width:7px;height:7px;border-radius:50%;background:#7b8980;display:inline-block;flex:none}.dot.connected{background:#77ad4c;box-shadow:0 0 0 3px #87b46915}.dot.live{background:#b8ef83;box-shadow:0 0 10px #adeb6660}.connect-actions{display:flex;gap:10px}.button{border:1px solid var(--border);border-radius:7px;padding:10px 16px;background:var(--panel);color:var(--ink-strong);font-size:12px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:16px;white-space:nowrap;transition:background .15s}.button:hover{background:var(--hover)}.button.primary{background:var(--green);border-color:var(--green);color:var(--on-green)}.button.primary:hover{background:var(--green-hover)}.button.quiet{background:transparent}.button.luminous{background:var(--soft);color:var(--on-soft);border:0;padding:13px 22px}.button.luminous:hover{background:var(--soft-hover)}main{display:grid;grid-template-columns:minmax(0,1fr) 310px;max-width:1920px;margin:0 auto}.workspace{padding:32px;min-width:0}.workspace-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}.eyebrow{font-size:9px;font-weight:650;letter-spacing:1.7px;color:var(--muted);margin-bottom:9px}h1{font-size:30px;letter-spacing:-1px;font-weight:550}.modes{display:flex;gap:3px;background:var(--trough);border-radius:8px;padding:4px}.modes button{border:0;background:none;color:var(--muted);padding:9px 13px;border-radius:5px;font-size:11px;font-weight:600}.modes button.selected{background:var(--panel);color:var(--ink-strong);box-shadow:0 1px 5px #1f32140c}.display{background:var(--chart);border-radius:12px;overflow:hidden;border:1px solid #25332c;box-shadow:0 10px 30px #2635290c}.display-top{height:54px;border-bottom:1px solid #ffffff09;padding:0 22px;display:flex;justify-content:space-between;align-items:center;gap:12px}.legend{display:flex;gap:17px;flex-wrap:wrap;font:10px ui-monospace,SFMono-Regular,Menlo,monospace}.trace-label::before{content:"";display:inline-block;width:6px;height:6px;border-radius:2px;background:currentColor;margin-right:7px}.ch1{color:var(--ch1)}.ch2{color:var(--ch2)}.ch3{color:var(--ch3)}.display-state{display:flex;align-items:center;gap:8px;color:#9faea1;font-size:10px;white-space:nowrap}.canvas-wrap{position:relative;height:clamp(380px,51vh,650px)}canvas{display:block;width:100%;height:100%}.display-bottom{height:39px;display:flex;justify-content:space-between;align-items:center;gap:15px;padding:0 22px;color:#8c9e90;font:10px ui-monospace,SFMono-Regular,Menlo,monospace;border-top:1px solid #ffffff09}.empty-state{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none}.empty-state button{pointer-events:auto}.wave-icon{font-size:80px;line-height:1;color:#a8d388;margin-bottom:18px}.empty-state h2{font-size:23px;letter-spacing:-.5px;font-weight:450;color:#d4e0d3}.empty-state p{font-size:12px;line-height:1.8;color:#7f9586;margin:13px 0 25px}.measurements{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-top:17px}.measurement{padding:16px 18px;background:var(--panel);border:1px solid var(--line);border-radius:9px}.measurement h2{font-size:10px;letter-spacing:1px;color:var(--muted);margin-bottom:13px;display:flex;align-items:center;gap:8px}.measurement h2 i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--channel-color)}.measurement table{width:100%;border-collapse:collapse;font-size:11px}.measurement td{padding:4px 0;color:var(--faint)}.measurement td.value{text-align:right;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink-strong)}.measurement-placeholder{grid-column:1/-1;padding:28px;color:var(--faint);font-size:12px;text-align:center;border:1px dashed var(--border);border-radius:9px}.workspace-foot{display:flex;justify-content:space-between;gap:12px;font-size:10px;color:var(--faint);margin-top:25px;line-height:1.7}.workspace-foot>div{display:flex;gap:20px}.workspace-foot a{text-decoration:none}.workspace-foot a:hover{text-decoration:underline;color:var(--green)}.privacy-dot{width:5px;height:5px;background:var(--control);display:inline-block;border-radius:50%;margin-right:7px}.controls{background:var(--panel);border-left:1px solid var(--line);padding:0 23px}.control-section{padding:23px 0;border-bottom:1px solid var(--line)}.control-section h2{font-size:11px;font-weight:650;letter-spacing:.1px;margin-bottom:17px}.section-title{display:flex;align-items:baseline;justify-content:space-between}.tag{font-size:8px;letter-spacing:1px;color:var(--faint)}.transport{display:grid;grid-template-columns:1.2fr 1fr .85fr;gap:7px}.transport .button{padding:10px 8px}.export-button{width:100%;background:none;border:0;padding:16px 0 0;text-align:left;font-size:11px;color:var(--muted);display:flex;justify-content:space-between}.export-button span{font-size:9px;border:1px solid var(--border);border-radius:3px;padding:1px 4px}.field{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:12px 0;font-size:11px;color:var(--muted)}select,input[type=number]{background:var(--sunken);border:1px solid var(--border);border-radius:5px;color:var(--ink-strong);padding:7px 8px;font-size:11px;min-width:0;outline-offset:1px;max-width:150px}.field select{width:130px}.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}.field-pair label{display:flex;flex-direction:column;gap:7px;font-size:10px;color:var(--faint);position:relative}.field-pair select,.field-pair input{width:100%}.unit{position:absolute;right:0;color:var(--faint)}.slider-label{display:grid;grid-template-columns:1fr 1fr;gap:10px;font-size:10px;color:var(--faint);margin:17px 0}.slider-label output{text-align:right;font-variant-numeric:tabular-nums}.slider-label input{grid-column:1/-1;width:100%;margin:0;accent-color:var(--control);height:5px}.rate-card{border:1px solid var(--tint-line);background:var(--tint);border-radius:6px;padding:11px 13px;margin:16px 0;display:flex;flex-direction:column;gap:5px}.rate-card>span{font-size:9px;color:var(--faint)}.rate-card strong{font-size:14px;font-weight:500;color:var(--tint-ink)}.rate-card small{font-size:9px;font-weight:400;color:var(--faint)}.check-row{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--muted);margin:12px 0;line-height:1.6}input[type=checkbox]{accent-color:var(--control);width:13px;height:13px;margin:0}.hint{font-size:9px;line-height:1.8;color:var(--faint);margin-top:11px}.channel-card{padding:13px 0;border-bottom:1px solid var(--line)}.channel-card:last-child{border:0;padding-bottom:0}.channel-heading{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:600}.channel-heading label{display:flex;gap:9px;align-items:center}.channel-heading .marker{width:6px;height:6px;border-radius:50%;background:var(--channel-color)}.channel-heading .channel-note{font-size:9px;font-weight:400;color:var(--faint)}.channel-card .field{font-size:10px;margin:9px 0}.channel-card .field select{width:130px}.channel-actions{display:flex;justify-content:space-between;align-items:center}.zero-button{font-size:9px;background:none;border:0;color:var(--faint);text-decoration:underline;text-underline-offset:3px;padding:2px}.logic-lines{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:15px 0}.logic-lines label{display:flex;align-items:center;gap:5px;font:10px ui-monospace,monospace;color:var(--muted)}.controls-foot{display:flex;justify-content:space-between;color:var(--faint);font-size:9px;padding:23px 0 32px}.notice{padding:12px 15px;border:1px solid var(--notice-line);background:var(--notice);color:var(--notice-ink);font-size:12px;line-height:1.7;border-radius:7px;margin-bottom:17px}.notice.error{background:var(--error);color:var(--error-ink);border-color:var(--error-line)}.meter-values{position:absolute;top:22px;left:22px;right:22px;display:flex;gap:20px}.meter-value{flex:1;font:28px ui-monospace,monospace}.meter-value small{display:block;font-size:10px;margin-bottom:10px;color:#93a389}.decode-panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:18px;margin-top:16px}.decode-heading{display:flex;align-items:center;gap:16px}.decode-heading h2{font-size:12px}.decode-heading span{font-size:10px;color:var(--faint)}#decoded{display:flex;flex-wrap:wrap;gap:6px;margin-top:13px;max-height:150px;overflow:auto}.byte{padding:5px 7px;background:var(--sunken);border-radius:4px;font:10px ui-monospace,monospace}.byte.bad{background:var(--bad);color:var(--bad-ink)}.clip{font-size:8px;color:#e69b7f;margin-left:5px}.meter-mode .canvas-wrap{height:clamp(400px,58vh,700px)}
@media(min-width:1550px){main{grid-template-columns:minmax(0,1fr) 330px}.workspace{padding:40px 44px}.controls{padding:0 28px}.canvas-wrap{height:58vh}}
@media(max-width:1050px){.topbar{padding:0 20px;gap:15px}.connection{max-width:190px;font-size:10px}.workspace{padding:24px 18px}.workspace-head{align-items:flex-start;flex-direction:column;gap:16px}main{grid-template-columns:minmax(0,1fr) 280px}.controls{padding:0 18px}.measurements{gap:8px}.measurement{padding:12px 10px}.display-top,.display-bottom{padding-left:14px;padding-right:14px}.legend{gap:9px;font-size:9px}.workspace-foot{flex-direction:column}.meter-value{font-size:20px}}
@media(max-width:740.98px){.topbar{height:auto;min-height:76px;padding:15px 18px;flex-wrap:wrap;gap:14px}.brand{font-size:24px}.connection{order:3;max-width:none;width:100%;margin:0}.connect-actions{margin-left:auto}.connect-actions .button{padding:9px 11px}.edition{display:none}main{display:block}.workspace{padding:23px 14px}.workspace-head{flex-direction:row;align-items:center;flex-wrap:wrap}.workspace-head h1{font-size:26px}.eyebrow{font-size:8px}.modes{width:100%;justify-content:space-between}.modes button{flex:1}.canvas-wrap{height:370px}.controls{border-left:0;border-top:1px solid var(--line);padding:0 23px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 25px}.control-section{min-width:0}.acquisition,#channel-controls{grid-column:1/-1}.measurements{grid-template-columns:1fr}.measurement table{font-size:12px}.measurement-placeholder{font-size:11px}.measurement h2{margin-bottom:6px}.meter-values{left:14px;right:14px;gap:10px}.meter-value{font-size:17px}.controls-foot{grid-column:1/-1}.display-bottom{font-size:8px}.empty-state h2{font-size:20px}.empty-state p{font-size:11px}#channel-controls #channels{display:grid;grid-template-columns:1fr;gap:12px}.workspace-foot>div{justify-content:space-between}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Desktop instrument: keep the display on screen and scroll only the controls. */
@media(min-width:741px){
  html,body{height:100%;overflow:hidden}
  body{height:100dvh;display:grid;grid-template-rows:82px minmax(0,1fr)}
  main{width:100%;height:100%;min-height:0;overflow:hidden}
  /* The workspace scrolls only once the display has reached its floor. */
  .workspace{min-height:0;display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior-y:contain}
  .workspace-head,.measurements,.decode-panel,.workspace-foot,.notice{flex-shrink:0}
  /* The floor belongs on the card, not on the canvas inside it: the card
     clips its own overflow, so a minimum in there would be hidden rather than
     pushing the workspace into scrolling. 54 + 260 + 39 is the two strips
     around a display still worth reading a trace off. */
  .display{flex:1;min-height:353px;display:flex;flex-direction:column}
  .display-top,.display-bottom{flex-shrink:0}
  .canvas-wrap,.meter-mode .canvas-wrap{height:auto;min-height:0;flex:1}
  .controls{min-height:0;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-gutter:stable}
  .workspace-foot{margin-top:12px}
}
@media(min-width:741px) and (max-height:800px){
  .display{min-height:313px}
  .workspace{padding-top:18px;padding-bottom:16px}
  .workspace-head{margin-bottom:14px;gap:10px}
  .measurement{padding:10px 12px}
  .measurement h2{margin-bottom:6px}
  .measurement td{padding:2px 0}
  .decode-panel{padding:10px;margin-top:10px}
  #decoded{max-height:70px}
}

/* Dark: only the paper around the instrument changes. The screen, the trace
   colours and the trigger marker are the same under either appearance. */
@media(prefers-color-scheme:dark){:root{--page:#171c1a;--panel:#1e2522;--sunken:#242c28;--hover:#29322d;--trough:#232b27;--line:#2f3833;--border:#39433d;--ink:#e2e8df;--ink-strong:#eef3ea;--muted:#8d9789;--faint:#7e887b;--green:#a9d18c;--green-hover:#bcdfa2;--on-green:#12180f;--soft:#35513a;--soft-hover:#40603f;--on-soft:#dff0cf;--control:#8fbc6f;--focus:#a3cd87;--tint:#1d251f;--tint-line:#303a32;--tint-ink:#a9d18c;--notice:#2a2716;--notice-ink:#d8c98a;--notice-line:#403b22;--error:#2e211a;--error-ink:#e8a184;--error-line:#46312a;--bad:#3a2620;--bad-ink:#e69b7f}.display{box-shadow:none}.modes button.selected{box-shadow:none}}
