*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;height:100dvh;overflow:hidden;background:#000;color:#e8e4dc;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;touch-action:none;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}#stage,#stage canvas{position:fixed;inset:0;width:100%;height:100%;display:block}#gate{position:fixed;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;background:#0000006b;pointer-events:auto}body.is-live #gate{display:none}#listen{appearance:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;width:min(220px,56vw);height:min(220px,56vw);border:1px solid rgba(255,255,255,.22);border-radius:999px;background:#0a0a0e9e;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#fff;cursor:pointer}#listen svg{width:64px;height:64px;margin-left:8px}#listen b{font:560 15px/1 ui-sans-serif,system-ui,sans-serif;letter-spacing:.28em;text-transform:uppercase}#listen:hover{background:#ffffff1a;border-color:#fff6}#chrome{position:fixed;top:max(14px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));z-index:7;display:flex;align-items:center;gap:18px;pointer-events:none}#fps{font:11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;color:#ffffff73}#chrome a,#chrome button{pointer-events:auto;appearance:none;background:none;border:0;color:#ffffff8c;font:11px/1 ui-sans-serif,system-ui,sans-serif;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;cursor:pointer}#chrome a:hover,#chrome button:hover{color:#fff}#chrome .sp{flex:1}#floats{position:fixed;inset:0;z-index:3;pointer-events:none}.flo{position:absolute;left:0;top:0;transform:translate(-50%,-120%);will-change:transform}.flo b{display:block;font:600 22px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.06em;color:#ffffffeb;text-shadow:0 0 18px rgba(0,0,0,.7);opacity:0;transform:translateY(10px)}.flo.is-on b{animation:notePop 1.55s ease-out}.flo[data-fly=A] b{color:#eadcc4}.flo[data-fly=B] b{color:#9ec288}.flo[data-fly=C] b{color:#ef8a78}@keyframes notePop{0%{opacity:0;transform:translateY(12px) scale(.92)}12%{opacity:.95;transform:translateY(0) scale(1)}70%{opacity:.55;transform:translateY(-18px) scale(1)}to{opacity:0;transform:translateY(-42px) scale(.98)}}#pit{font:11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;color:#ffffff47}body[data-pit=on] #pit{color:#7dff9a}body[data-pit=off] #pit{color:#e07a68}#hud{position:fixed;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));z-index:4;opacity:1;pointer-events:auto}#clock{font:11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;color:#ffffff61;margin-bottom:8px}#panels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.pan{background:#07080cc7;border:1px solid rgba(255,255,255,.08);padding:10px 12px 8px;min-width:0}.pan header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.mute{appearance:none;margin-left:auto;width:26px;height:26px;padding:3px;border:1px solid transparent;border-radius:5px;background:none;color:#ffffff8c;cursor:pointer;pointer-events:auto}.mute svg{width:18px;height:18px;display:block}.mute .slash{display:none}.pan.is-mute .mute{color:#ff7a6e;background:#ff5a5029;border-color:#ff7a6e73}.pan.is-mute .mute .wave{display:none}.pan.is-mute .mute .slash{display:block;stroke-width:2.2}.pan.is-mute{opacity:.55}.pan header b{font:600 12px/1 ui-sans-serif,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase}.pan header span{font:11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:#fff6;letter-spacing:.08em}.tone{font:600 15px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em;color:#fff}.pan .dot{width:6px;height:6px;border-radius:50%;background:#ffffff2e}.pan.is-fire .dot{background:#7dff9a;box-shadow:0 0 8px #7dff9a}.pan[data-fly=A] header b{color:#d4c4a8}.pan[data-fly=B] header b{color:#8fb07a}.pan[data-fly=C] header b{color:#e07a68}.pan.is-dim{opacity:.34}.pan.is-on{border-color:#ffffff47}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;margin-bottom:8px}.metrics small{display:block;font:9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:#ffffff57}.metrics strong{display:block;margin:3px 0 4px;font:600 16px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:#f2f2f2}.eBar,.dBar{width:100%;height:5px;display:block}.wave,.ras{width:100%;display:block;background:#07080c;margin-top:6px}.wave{height:36px}.ras{height:44px}.pan footer{margin-top:6px;font:10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;color:#ffffff6b}#mask{position:fixed;inset:0;z-index:8;display:none;align-items:center;justify-content:center;background:#000000b8;padding:24px}body.ask #mask{display:flex}#box{width:min(720px,94vw);max-height:min(78vh,820px);display:flex;flex-direction:column;background:#0b0c10;border:1px solid rgba(255,255,255,.1)}#hd{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.08);letter-spacing:.14em;text-transform:uppercase;font-size:12px}#hd b{font-weight:560}#mod{color:#ffffff61}#hd button{margin-left:auto;appearance:none;border:0;background:none;color:#fff;cursor:pointer;width:28px;height:28px}#row{position:relative;overflow:auto}#txt{padding:18px 20px 56px;font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;color:#ffffffb8;white-space:pre-wrap}#copy{position:sticky;bottom:12px;left:16px;appearance:none;border:1px solid rgba(255,255,255,.2);background:#0b0c10;color:#fff;padding:8px 12px;letter-spacing:.12em;text-transform:uppercase;font:11px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer}#copy.ok span{display:inline}#copy span{display:none}#copy svg{width:12px;height:12px;vertical-align:-1px;margin-right:6px}@media(max-width:860px){#panels{grid-template-columns:1fr;max-height:42vh;overflow:auto}}