:root{--bg: #0a0e14;--panel: #0e141c;--panel-2: #101822;--line: #1a2530;--line-bright: #26343f;--text: #cdd8dd;--dim: #62727c;--accent: #7fd4c9;--accent-dim: #4c8b83;--accent-2: #9a8fd0;--warn: #e8926b;--radius: 3px;--mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{margin:0;padding:0;background:radial-gradient(1200px 600px at 80% -10%,rgba(127,212,201,.06),transparent 60%),radial-gradient(900px 500px at 10% 110%,rgba(154,143,208,.05),transparent 60%),var(--bg);color:var(--text);font-family:var(--mono);font-size:13px;-webkit-font-smoothing:antialiased}body{min-height:100vh;display:flex;flex-direction:column}button,select,input{font-family:inherit;font-size:inherit;color:inherit;background:transparent;border:1px solid var(--line-bright);border-radius:var(--radius);padding:6px 10px;cursor:pointer;transition:border-color .15s,color .15s,background .15s}button:hover,select:hover,input:hover{border-color:var(--accent-dim)}button:focus-visible,select:focus-visible,input:focus-visible,.knob:focus-visible{outline:1px solid var(--accent);outline-offset:2px}button:disabled{opacity:.4;cursor:not-allowed}select{appearance:none;padding-right:22px;background-image:linear-gradient(45deg,transparent 50%,var(--dim) 50%),linear-gradient(135deg,var(--dim) 50%,transparent 50%);background-position:calc(100% - 12px) 52%,calc(100% - 8px) 52%;background-size:4px 4px,4px 4px;background-repeat:no-repeat}option{background:var(--panel);color:var(--text)}header{position:sticky;top:0;z-index:20;background:#0a0e14eb;backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}.bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 16px}.brand{display:flex;align-items:baseline;gap:8px;margin-right:6px}.brand h1{margin:0;font-size:14px;letter-spacing:.24em;font-weight:500;text-transform:uppercase;color:var(--accent)}.brand .ver{color:var(--dim);font-size:10px;letter-spacing:.1em}.spacer{flex:1 1 auto}.btn-primary{border-color:var(--accent-dim);color:var(--accent)}.btn-primary:hover{background:#7fd4c914;border-color:var(--accent)}.btn-play[data-playing=true]{background:var(--accent);color:#06100e;border-color:var(--accent)}.field{display:flex;align-items:center;gap:6px;color:var(--dim);font-size:11px;letter-spacing:.08em;text-transform:uppercase}.field input[type=number],.field input[type=text]{width:88px;cursor:text;color:var(--text);letter-spacing:0;text-transform:none}.blurb{padding:0 16px 8px;color:var(--dim);font-size:11px;letter-spacing:.03em}.blurb .hp{color:var(--accent-2)}.timeline{position:relative;height:24px;border-top:1px solid var(--line);background:#080c11;overflow:hidden;cursor:default}.timeline .seg{position:absolute;top:0;bottom:0;border-right:1px solid var(--line);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);display:flex;align-items:center;padding-left:6px;white-space:nowrap;overflow:hidden}.timeline .seg[data-kind=bloom]{background:#7fd4c917;color:var(--accent-dim)}.timeline .seg[data-kind=drift]{background:#7fd4c90a}.timeline .seg[data-kind=rest]{background:#9a8fd00d}.timeline .playhead{position:absolute;top:0;bottom:0;width:1px;background:var(--accent);box-shadow:0 0 8px var(--accent);transform:translate(-.5px);pointer-events:none}main{flex:1 1 auto;padding:16px;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;align-content:start}.panel{border:1px solid var(--line);background:linear-gradient(180deg,var(--panel-2),var(--panel));border-radius:var(--radius);padding:10px 12px 12px}.panel.feel{border-color:var(--accent-dim);box-shadow:inset 0 0 0 1px #7fd4c90f}.panel h2{margin:0 0 10px;font-size:10px;letter-spacing:.28em;font-weight:600;color:var(--dim);text-transform:uppercase;border-bottom:1px solid var(--line);padding-bottom:7px}.panel.feel h2{color:var(--accent)}.knobs{display:grid;grid-template-columns:repeat(auto-fill,minmax(66px,1fr));gap:10px 6px}.knob{display:flex;flex-direction:column;align-items:center;gap:3px;cursor:ns-resize;user-select:none;touch-action:none;border:0;padding:0;background:none;border-radius:var(--radius)}.knob svg{display:block;overflow:visible}.knob .track{stroke:var(--line-bright);stroke-width:3;fill:none;stroke-linecap:round}.knob .value-arc{stroke:var(--accent);stroke-width:3;fill:none;stroke-linecap:round}.knob .pointer{stroke:var(--text);stroke-width:1.5;stroke-linecap:round}.knob .cap{fill:#131c26;stroke:var(--line-bright);stroke-width:1}.knob .label{font-size:9px;letter-spacing:.05em;color:var(--dim);text-transform:uppercase;text-align:center;line-height:1.15}.knob .val{font-size:9px;color:var(--text);text-align:center;line-height:1.1;min-height:11px}.knob:hover .label,.knob.active .label{color:var(--text)}.knob.active .value-arc{filter:drop-shadow(0 0 5px var(--accent))}.feel .knob .value-arc{stroke:var(--accent-2)}.enumctl{grid-column:span 2;display:flex;flex-direction:column;gap:3px}.enumctl label{font-size:9px;letter-spacing:.05em;color:var(--dim);text-transform:uppercase}.enumctl select{padding:4px 20px 4px 6px;font-size:11px;width:100%}footer{border-top:1px solid var(--line);padding:8px 16px 14px;color:var(--dim);font-size:11px;display:flex;flex-wrap:wrap;gap:14px;align-items:center}#status[data-busy=true]{color:var(--accent)}#status[data-error=true]{color:var(--warn)}.overlay{position:fixed;inset:0;background:#06090de0;display:flex;align-items:center;justify-content:center;z-index:50}.overlay[hidden]{display:none}.overlay .box{border:1px solid var(--line-bright);background:var(--panel);padding:22px 28px;text-align:center;min-width:260px;border-radius:var(--radius)}.overlay .box p{margin:0 0 12px;letter-spacing:.1em;text-transform:uppercase;font-size:11px;color:var(--dim)}.progress{height:3px;background:var(--line);overflow:hidden}.progress>div{height:100%;width:0;background:var(--accent);transition:width .2s linear}@media(max-width:640px){.bar{padding:8px 10px;gap:8px}main{padding:10px;grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
