:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-0:#05060a;--bg-1:#0c0f18;--ink:#f2f4fa;--ink-dim:#f2f4fa9e;--glass-border:#ffffff38;--accent-note:#82b4ffe6;--accent-chord:#cd96ffe6;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box}html,body{height:100%}body{padding:calc(1rem + var(--safe-top)) 1rem calc(1.5rem + var(--safe-bottom));background:radial-gradient(80vw 60vh at 20% -10%, #7882ff29, transparent 60%), radial-gradient(70vw 50vh at 110% 10%, #ff82dc1a, transparent 60%), linear-gradient(180deg, var(--bg-0), var(--bg-1));min-height:100dvh;color:var(--ink);flex-direction:column;align-items:center;margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.5;display:flex;overflow-x:hidden}a{color:var(--accent-note)}header{width:100%;max-width:72rem}main{flex-direction:column;flex:1;align-items:center;gap:1rem;width:100%;max-width:72rem;padding-top:4.5rem;display:flex}.invitation{letter-spacing:.14em;text-align:center;color:#0000;transform-origin:top;background:linear-gradient(120deg,#fff,#b9c6ff 60%,#e8c1ff);-webkit-background-clip:text;background-clip:text;margin:.5rem 0 0;font-size:clamp(1.5rem,5vw,2.75rem);font-weight:700;transition:transform .6s cubic-bezier(.22,1,.36,1)}body.camera-active .invitation{transform:translateY(-4.4rem)scale(.38)}.hud{top:calc(1rem + var(--safe-top));left:calc(1rem + env(safe-area-inset-left,0px));z-index:20;flex-direction:column;align-items:flex-start;gap:.4rem;max-width:min(90vw,26rem);display:flex;position:fixed}.toolbar{flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:.6rem;display:flex}.instrument-select{background:#ffffff0a;border:1px solid #ffffff1a;border-radius:999px;gap:.4rem;padding:.2rem;display:flex}.pill{appearance:none;border:1px solid var(--glass-border);color:var(--ink);letter-spacing:.1em;cursor:pointer;-webkit-backdrop-filter:blur(14px)saturate(160%);backdrop-filter:blur(14px)saturate(160%);background:#ffffff0d;border-radius:999px;min-height:44px;padding:.6rem 1.3rem;font:700 .72rem/1 system-ui,sans-serif;transition:transform .15s,background .2s,box-shadow .2s,opacity .2s}.pill:hover{background:#ffffff1c}.pill:active{transform:scale(.96)}.pill:focus-visible{outline-offset:2px;outline:2px solid #8ec8ff}.instrument-select .pill[aria-pressed=true]{background:linear-gradient(135deg,#82b4ff59,#cd96ff40);border-color:#a0c8ffb3;box-shadow:0 0 22px #82b4ff59}.camera-button[aria-pressed=true]{background:linear-gradient(135deg,#82ffbe4d,#82b4ff40);border-color:#96ffd299}.camera-button:disabled{opacity:.4;cursor:not-allowed}.camera-status{letter-spacing:.04em;min-height:1.1rem;color:var(--ink-dim);text-align:left;margin:0;font-size:.72rem}.stage{justify-content:center;width:100%;margin-top:.5rem;display:flex;position:relative}.camera-layer{opacity:0;pointer-events:none;z-index:0;transition:opacity .4s;position:fixed;inset:0}.camera-layer-active{opacity:1}.camera-feed{object-fit:cover;opacity:.5;background:#000;width:100%;height:100%;position:fixed;inset:0;transform:scaleX(-1)}.wheels{z-index:1;flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(1.5rem,6vw,4.5rem);padding:1rem 0 2rem;transition:opacity .3s;display:flex;position:relative}.wheel{aspect-ratio:1;touch-action:none;-webkit-user-select:none;user-select:none;width:min(48vw,280px);position:relative}.wheel-floating{opacity:0;pointer-events:none;will-change:transform;width:min(38vw,210px);transition:opacity .35s,transform 80ms linear,width .25s;position:absolute;top:0;left:0}.wheel-floating.wheel-visible{opacity:1}.wheel-floating.wheel-locked{width:min(56vw,320px);transition:opacity .35s,transform 80ms linear,width .25s .15s}.wheels.wheels-hidden{opacity:0;pointer-events:none}.wheel-glass{-webkit-backdrop-filter:blur(22px)saturate(180%);backdrop-filter:blur(22px)saturate(180%);border:1px solid var(--glass-border);background:radial-gradient(circle at 30% 25%,#ffffff59,#ffffff05 45%),conic-gradient(from 180deg,#82b4ff47,#cd96ff38,#8cffdc33,#82b4ff47);border-radius:50%;transition:box-shadow .3s;position:absolute;inset:0;box-shadow:0 10px 40px #00000080,inset 0 1px 1px #ffffff73,inset 0 -16px 34px #0006}.wheel-chord .wheel-glass{box-shadow:0 10px 40px #00000080,inset 0 1px 1px #ffffff73,inset 0 -16px 34px #0006,0 0 40px #cd96ff40}.wheel-sectors{position:absolute;inset:0}.sector{cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:none;width:100%;height:100%;margin:0;padding:0;transition:background .12s;position:absolute;inset:0}.sector:hover{background:#ffffff0f}.sector:focus-visible{outline-offset:-3px;z-index:2;outline:2px solid #8ec8ff}.sector-active{background:#8cbeff42}.wheel-chord .sector-active{background:#cd96ff42}.sector-live{background:#8cbeff6b!important}.sector-pulse{animation:.3s ease-out sector-pulse}@keyframes sector-pulse{0%{filter:brightness(1.6)}to{filter:brightness()}}.sector-label{pointer-events:none;color:#ffffffe0;text-shadow:0 1px 3px #0009;flex-direction:column;align-items:center;gap:.15rem;display:flex;position:absolute;transform:translate(-50%,-50%)}.sector-note{letter-spacing:.02em;font-size:clamp(.85rem,2.4vw,1.05rem);font-weight:700}.sector-key{color:#ffffffbf;background:#0006;border:1px solid #ffffff47;border-radius:.3rem;padding:.15rem .32rem;font:700 .6rem/1 ui-monospace,SFMono-Regular,Menlo,monospace}.wheel-center{aspect-ratio:1;border:1px solid var(--glass-border);width:42%;color:var(--ink);z-index:3;font:inherit;background:#080a1299;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;gap:.15rem;transition:transform .15s,box-shadow .2s,opacity .2s;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}button.wheel-center{cursor:pointer}button.wheel-center:hover{box-shadow:0 0 26px #8cbeff59}button.wheel-center:active{transform:translate(-50%,-50%)scale(.94)}button.wheel-center:focus-visible{outline-offset:3px;outline:2px solid #8ec8ff}button.wheel-center:disabled{cursor:not-allowed;opacity:.5}.wheel-mode{letter-spacing:.14em;font-size:.85rem;font-weight:700}.wheel-chord .wheel-mode{color:#e3c1ff}.wheel-caption{letter-spacing:.09em;opacity:.62;font-size:.58rem}.wheel-mode-locked .wheel-center{opacity:.55}.intro-modal{max-width:min(92vw,30rem);max-height:85dvh;color:var(--ink);background:0 0;border:none;border-radius:1.25rem;padding:0}.intro-modal::backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#04060ab3}.intro-modal-card{border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(24px)saturate(180%);backdrop-filter:blur(24px)saturate(180%);background:#0e101ac7;border-radius:1.25rem;flex-direction:column;gap:.9rem;margin:0;padding:1.75rem;display:flex;box-shadow:0 20px 60px #0000008c}.intro-modal-card h2{letter-spacing:.02em;margin:0;font-size:1.3rem}.intro-modal-card p,.intro-modal-card li{color:var(--ink-dim);font-size:.85rem;line-height:1.5}.intro-modal-card ul{flex-direction:column;gap:.5rem;margin:0;padding-left:1.1rem;display:flex}.intro-modal-close{align-self:flex-start;margin-top:.4rem}@media (width<=640px){.wheels{gap:2.5rem}.wheel{width:min(72vw,320px)}.hud{max-width:min(94vw,22rem)}.intro-modal-card{padding:1.25rem}}@media (prefers-reduced-motion:reduce){*{transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}:focus-visible{outline-offset:2px;outline:2px solid #8ec8ff}