:root{--bg-0: #050516;--bg-1: #0a0a22;--bg-2: #11122c;--panel-bg: rgba(14, 16, 38, .72);--panel-bg-strong: rgba(14, 16, 38, .92);--panel-border: rgba(110, 130, 220, .18);--text: #e7eaff;--text-dim: #9aa1c8;--text-mute: #6e739a;--accent: #7ea2ff;--accent-2: #c678ff;--pos: #ff5a6a;--neg: #5aa9ff;--osc: #c87aff;--coil: #5affc8;--amber: #ffd06a;--cyan: #6affe1;--danger: #ff5566;--shadow: 0 18px 60px rgba(0, 0, 0, .55);--rad: 14px;--rad-sm: 10px;--font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body,#app{margin:0;padding:0;height:100%;width:100%;background:var(--bg-0);color:var(--text);font-family:var(--font);font-size:13px;overflow:hidden;user-select:none}body{background:radial-gradient(1200px 800px at 70% -10%,rgba(120,90,255,.18),transparent 60%),radial-gradient(900px 600px at 0% 100%,rgba(50,110,255,.18),transparent 60%),var(--bg-0)}canvas#stage{position:fixed;inset:0;display:block;outline:none}.topbar{position:fixed;top:14px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:28px;padding:10px 14px;background:var(--panel-bg-strong);border:1px solid var(--panel-border);border-radius:var(--rad);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);z-index:10;box-shadow:var(--shadow)}.brand{display:flex;align-items:center;gap:12px;padding-right:16px;border-right:1px solid var(--panel-border)}.logo-mark{width:28px;height:28px;border-radius:8px;background:conic-gradient(from 200deg,#5aa9ff,#c678ff,#ff5a6a,#ffd06a,#5affc8,#5aa9ff);position:relative;box-shadow:0 0 18px #7b68ee80,inset 0 0 12px #0006}.logo-mark:after{content:"";position:absolute;inset:5px;border-radius:6px;background:var(--bg-1);border:1px solid rgba(255,255,255,.08)}.logo-mark:before{content:"";position:absolute;inset:9px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,#7ea2ff 60%,transparent 80%);z-index:1}.brand-text h1{margin:0;font-size:15px;font-weight:600;letter-spacing:.01em}.brand-text p{margin:0;color:var(--text-mute);font-size:11px;letter-spacing:.04em;text-transform:uppercase}.topbar-actions{display:flex;gap:8px}.btn{appearance:none;border:1px solid var(--panel-border);background:#ffffff08;color:var(--text);border-radius:10px;padding:7px 14px;font-size:12.5px;font-weight:500;font-family:var(--font);cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:background .15s,border-color .15s,transform .05s}.btn:hover{background:#ffffff0f;border-color:#ffffff29}.btn:active{transform:translateY(1px)}.btn.primary{background:linear-gradient(180deg,#7ea2ff52,#7ea2ff2e);border-color:#7ea2ff8c;color:#fff;box-shadow:inset 0 1px #ffffff2e,0 4px 18px #7ea2ff33}.btn.primary:hover{background:linear-gradient(180deg,#7ea2ff73,#7ea2ff40)}.btn.primary.paused{background:linear-gradient(180deg,#ff905a52,#ff905a2e);border-color:#ff905a8c}.btn.ghost{background:transparent;padding:6px 11px;font-size:12px}.btn.small{padding:5px 9px;font-size:11.5px}.btn.danger{border-color:#ff5a6e66;color:#ffb0bb;background:#ff506414}.btn.danger:hover{background:#ff506429;color:#ffd0d4}.icon-play{width:0;height:0;display:inline-block;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid currentColor}.btn.primary:not(.paused) .icon-play{border:none;width:8px;height:9px;background:linear-gradient(currentColor,currentColor) left/3px 100% no-repeat,linear-gradient(currentColor,currentColor) right/3px 100% no-repeat}.panel{position:fixed;top:80px;bottom:16px;width:290px;display:flex;flex-direction:column;gap:12px;z-index:9;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:rgba(120,140,220,.3) transparent;padding-right:4px}.panel.left{left:16px}.panel.right{right:16px}.panel::-webkit-scrollbar{width:5px}.panel::-webkit-scrollbar-track{background:transparent}.panel::-webkit-scrollbar-thumb{background:#788cdc4d;border-radius:4px}.card{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--rad);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:var(--shadow);overflow:hidden;flex-shrink:0}.card>header{padding:12px 14px 8px;border-bottom:1px solid var(--panel-border);display:flex;align-items:center;justify-content:space-between}.card h2{margin:0;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--text-dim)}.preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px}.preset{appearance:none;background:#ffffff06;border:1px solid var(--panel-border);color:var(--text);border-radius:var(--rad-sm);padding:10px 11px;text-align:left;cursor:pointer;font-family:inherit;display:flex;flex-direction:column;gap:2px;transition:all .15s;position:relative;overflow:hidden}.preset:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(126,162,255,.08),transparent 60%);opacity:0;transition:opacity .2s}.preset:hover{background:#ffffff0d;border-color:#7ea2ff4d;transform:translateY(-1px)}.preset:hover:before{opacity:1}.preset b{font-size:12.5px;font-weight:600;position:relative}.preset span{font-size:10.5px;color:var(--text-mute);line-height:1.35;position:relative}.add-row{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:12px}.add-btn{appearance:none;background:#ffffff06;border:1px solid var(--panel-border);color:var(--text);border-radius:8px;padding:8px 10px;font-size:11.5px;font-family:inherit;cursor:pointer;display:flex;align-items:center;gap:8px;text-align:left;transition:background .12s,border-color .12s}.add-btn:hover{background:#ffffff0d;border-color:#7ea2ff4d}.dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;box-shadow:0 0 10px currentColor}.dot-red{background:var(--pos);color:var(--pos)}.dot-blue{background:var(--neg);color:var(--neg)}.dot-purple{background:var(--osc);color:var(--osc)}.dot-green{background:var(--coil);color:var(--coil)}.dot-amber{background:var(--amber);color:var(--amber)}.dot-cyan{background:var(--cyan);color:var(--cyan)}.ctrl{padding:8px 14px 10px;border-bottom:1px solid rgba(255,255,255,.04)}.ctrl:last-child{border-bottom:none}.ctrl label{display:flex;justify-content:space-between;align-items:baseline;font-size:11.5px;color:var(--text-dim);margin-bottom:6px;letter-spacing:.01em}.ctrl label span{color:var(--text);font-variant-numeric:tabular-nums;font-weight:500;font-size:11.5px}.ctrl-row{display:flex;gap:14px;padding:8px 14px 10px}.check{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--text-dim);cursor:pointer}.check input{appearance:none;width:14px;height:14px;border-radius:4px;border:1px solid var(--panel-border);background:#ffffff0a;cursor:pointer;position:relative}.check input:checked{background:linear-gradient(135deg,var(--accent),var(--accent-2));border-color:transparent}.check input:checked:after{content:"";position:absolute;inset:2px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'><polyline points='1.5,5 4,7.5 8.5,2.5' fill='none' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat center / contain}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:4px;background:#ffffff0f;outline:none;cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,#fff,#cfd8ff);border:1px solid rgba(126,162,255,.6);box-shadow:0 0 0 3px #7ea2ff2e,0 1px 4px #0006;transition:box-shadow .15s}input[type=range]::-webkit-slider-thumb:hover{box-shadow:0 0 0 5px #7ea2ff40,0 1px 4px #0006}input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,#fff,#cfd8ff);border:1px solid rgba(126,162,255,.6);cursor:pointer}.inspector-body{padding:10px 0 12px}.inspector-body p{margin:8px 14px;font-size:11.5px;line-height:1.5}.inspector-body p.muted{color:var(--text-mute)}.row.gap{display:flex;gap:8px;padding:10px 14px 0;flex-wrap:wrap}.small-label{display:block;padding:6px 14px 0;font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-mute)}.metric-grid{display:grid;grid-template-columns:1fr 1fr 1fr;padding:12px;gap:6px 10px}.metric{display:flex;flex-direction:column;background:#ffffff06;border:1px solid var(--panel-border);padding:6px 8px;border-radius:8px;min-width:0}.metric span{font-size:9.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-mute);white-space:nowrap}.metric b{font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--text)}.hint{position:fixed;bottom:24px;left:50%;transform:translate(-50%) translateY(20px);padding:10px 18px;background:var(--panel-bg-strong);border:1px solid var(--panel-border);border-radius:999px;font-size:12px;color:var(--text);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:100;box-shadow:var(--shadow)}.hint.show{opacity:1;transform:translate(-50%) translateY(0)}.modal{position:fixed;inset:0;background:#050516b3;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fadein .18s ease}.modal[hidden]{display:none}@keyframes fadein{0%{opacity:0}to{opacity:1}}.modal-card{width:540px;max-width:calc(100vw - 32px);background:var(--panel-bg-strong);border:1px solid var(--panel-border);border-radius:16px;box-shadow:0 30px 80px #000000b3;overflow:hidden}.modal-card header{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--panel-border)}.modal-card h2{margin:0;font-size:15px;font-weight:600}.modal-body{padding:14px 22px 22px;font-size:13px;line-height:1.6;color:var(--text-dim)}.modal-body p{margin:0 0 12px}.modal-body em{color:var(--accent);font-style:normal}.modal-body b{color:var(--text)}@media (max-width: 1100px){.panel{width:240px}.topbar{padding:8px 10px;gap:18px}.brand-text p{display:none}}@media (max-width: 820px){.panel.left,.panel.right{width:calc(50% - 24px);top:70px;bottom:8px}.panel.left{left:8px}.panel.right{right:8px}.topbar{left:8px;right:8px;transform:none}}