/* ── CANVAS.CSS v1.1.3 ── */
#scopeArea { flex:1; position:relative; overflow:hidden; min-height:0; height:0; width:100%; }
canvas { position:absolute; top:0; left:0; width:100%; height:100%; display:block; background:#020c0c; }
#scopeArea::after { content:''; position:absolute; inset:0; background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,0.06) 2px,rgba(0,0,0,0.06) 4px); pointer-events:none; z-index:10; }

.scope-overlay       { position:absolute; top:8px; left:10px; font-size:0.68em; color:rgba(255,255,255,0.3); letter-spacing:1px; pointer-events:none; z-index:5; font-family:var(--font-scope); }
.scope-overlay-right { position:absolute; top:8px; right:10px; font-size:0.68em; color:rgba(255,255,255,0.3); letter-spacing:1px; pointer-events:none; text-align:right; z-index:5; font-family:var(--font-scope); }

.trig-marker { position:absolute; right:4px; font-size:0.65em; color:rgba(255,255,255,0.5); font-family:var(--font-scope); pointer-events:none; z-index:6; transition:top 0.1s; }
.trig-top { top:30%; } .trig-bot { bottom:30%; }

#oscControls { flex-shrink:0; background:var(--panel); border-top:1px solid var(--border); padding:6px 12px; display:flex; flex-direction:column; gap:5px; }
.osc-ctrl-row { display:flex; align-items:center; gap:10px; }
.osc-ctrl-label { font-family:var(--font-ui); font-size:0.7em; color:var(--text-dim); letter-spacing:1.5px; min-width:52px; flex-shrink:0; }
.osc-ctrl-row input[type=range] { flex:1; -webkit-appearance:none; height:4px; background:var(--grid); border-radius:2px; outline:none; }
.osc-ctrl-row input[type=range]::-webkit-slider-thumb { -webkit-appearance:none; width:20px; height:20px; border-radius:50%; background:var(--text-main); cursor:pointer; }
.osc-ctrl-val { font-family:var(--font-display); font-size:0.75em; color:var(--text-main); min-width:42px; text-align:right; }

.osc-div-row   { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.osc-div-group { display:flex; align-items:center; gap:6px; flex:1; }
.osc-div-btn   { background:transparent; border:1px solid var(--border); color:var(--text-mid); font-family:var(--font-ui); font-size:0.85em; padding:4px 10px; border-radius:3px; cursor:pointer; min-width:34px; min-height:32px; }
.osc-div-btn:active { background:rgba(255,255,255,0.06); }
.osc-div-val   { font-family:var(--font-display); font-size:0.72em; color:var(--text-main); min-width:58px; text-align:center; }
.osc-div-label { font-size:0.62em; color:var(--text-dim); letter-spacing:1px; min-width:44px; }
