*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{background:#000;width:100%;height:100%;overflow:hidden}:root{--accent-h:140}#app{width:100%;height:100%;position:relative}#canvas{width:100%;height:100%;display:block;position:absolute;top:0;bottom:0;left:0;right:0}#hud{top:1.25rem;left:1.25rem;top:calc(1.25rem + env(safe-area-inset-top));left:calc(1.25rem + env(safe-area-inset-left));pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-direction:column;gap:.55rem;display:flex;position:absolute}#bpm-block{align-items:baseline;gap:.35rem;display:flex}#bpm-value{color:hsl(var(--accent-h), 100%, 55%);text-shadow:0 0 28px hsla(var(--accent-h), 100%, 55%, .55);letter-spacing:-.02em;min-width:3ch;font-family:ui-monospace,Cascadia Code,Source Code Pro,Menlo,monospace;font-size:max(2.2rem,min(7vw,4.5rem));font-weight:700;line-height:1;transition:color .4s,text-shadow .4s;display:inline-block}#bpm-label{color:hsla(var(--accent-h), 100%, 55%, .5);letter-spacing:.25em;text-transform:uppercase;font-family:ui-monospace,monospace;font-size:max(.55rem,min(1.8vw,.85rem));transition:color .4s}#meter-block{align-items:center;gap:.5rem;display:flex}#meter-bar{background:rgba(255,255,255,.1);border-radius:3px;width:max(90px,min(22vw,180px));height:5px;position:relative;overflow:visible}#meter-fill{background:hsl(var(--accent-h), 100%, 55%);border-radius:3px;width:0%;height:100%;transition:width 80ms linear,background .4s}#peak-marker{pointer-events:none;background:rgba(255,255,255,.7);border-radius:1px;width:2px;transition:left .3s;position:absolute;top:-2px;bottom:-2px;left:0%}#meter-label{color:rgba(255,255,255,.3);letter-spacing:.25em;text-transform:uppercase;font-family:ui-monospace,monospace;font-size:max(.5rem,min(1.5vw,.7rem))}#sparkline{border-radius:2px;width:max(90px,min(22vw,180px));height:20px;display:block}#layers{align-items:center;gap:.4rem;margin-top:.1rem;display:flex}.layer-dot{flex-direction:column;align-items:center;gap:.2rem;display:flex}.layer-dot:before{content:"";background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:50%;width:7px;height:7px;transition:background .2s,border-color .2s,box-shadow .2s;display:block}.layer-dot.active:before{background:hsl(var(--accent-h), 100%, 55%);border-color:hsl(var(--accent-h), 100%, 65%);box-shadow:0 0 8px hsla(var(--accent-h), 100%, 55%, .8)}.layer-dot span{letter-spacing:.1em;color:rgba(255,255,255,.25);text-transform:uppercase;font-family:ui-monospace,monospace;font-size:.45rem;transition:color .2s}.layer-dot.active span{color:hsla(var(--accent-h), 100%, 70%, .8)}#controls{bottom:1.25rem;right:1.25rem;bottom:calc(1.25rem + env(safe-area-inset-bottom));right:calc(1.25rem + env(safe-area-inset-right));pointer-events:all;gap:.5rem;display:flex;position:absolute}#controls button{letter-spacing:.2em;color:rgba(255,255,255,.35);cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:2px;padding:.35rem .6rem;font-family:ui-monospace,monospace;font-size:max(.5rem,min(1.5vw,.65rem));font-weight:600;transition:color .15s,background .15s,border-color .15s}#controls button:hover,#controls button.active{color:hsl(var(--accent-h), 100%, 55%);border-color:hsla(var(--accent-h), 100%, 55%, .5);background:hsla(var(--accent-h), 100%, 55%, .08)}#mute-btn.active{color:#f46;background:rgba(255,68,102,.08);border-color:rgba(255,68,102,.5)}#start-screen{padding:1.5rem;padding:calc(1.5rem + env(safe-area-inset-top)) calc(1.5rem + env(safe-area-inset-right)) calc(1.5rem + env(safe-area-inset-bottom)) calc(1.5rem + env(safe-area-inset-left));-webkit-backdrop-filter:blur(10px);background:rgba(0,0,0,.88);flex-direction:column;justify-content:center;align-items:center;gap:.75rem;display:flex;position:absolute;top:0;bottom:0;left:0;right:0;overflow-x:hidden;overflow-y:auto}#start-bars{z-index:0;opacity:.22;justify-content:space-between;align-items:flex-end;padding:0 4%;display:flex;position:absolute;top:0;bottom:0;left:0;right:0;-webkit-mask-image:linear-gradient(transparent,#000 45%,#000 82%,transparent);mask-image:linear-gradient(transparent,#000 45%,#000 82%,transparent)}.start-bar{background:linear-gradient(to top, hsl(var(--accent-h), 100%, 55%), transparent);transform-origin:bottom;will-change:transform;border-radius:3px 3px 0 0;width:1.4%;min-width:3px;height:42%;animation:ease-in-out infinite bar-pulse}@keyframes bar-pulse{0%,to{transform:scaleY(var(--h-min,.25))}50%{transform:scaleY(var(--h-max,1))}}@media (prefers-reduced-motion:reduce){.start-bar{transform:scaleY(var(--h-min,.25));animation:none}}#start-screen>h1,#start-screen>p,#start-screen>button{z-index:1;position:relative}#start-screen h1{color:#fff;letter-spacing:.04em;text-transform:uppercase;text-shadow:0 0 40px hsla(var(--accent-h), 100%, 55%, .35);text-align:center;font-family:Audiowide,ui-monospace,monospace;font-size:max(2rem,min(8.5vw,5.5rem));font-weight:400;line-height:1}#start-desc{color:rgba(255,255,255,.6);text-align:center;max-width:34rem;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:max(.85rem,min(2.2vw,1.05rem));line-height:1.5}#start-hint{color:rgba(255,255,255,.4);text-align:left;align-items:center;gap:.45rem;max-width:26rem;margin-top:.25rem;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:max(.7rem,min(1.8vw,.8rem));line-height:1.4;display:flex}#start-hint svg{width:1.1em;height:1.1em;fill:hsla(var(--accent-h), 100%, 55%, .7);flex:none}#ios-mute-hint{color:rgba(255,255,255,.4);text-align:left;align-items:center;gap:.45rem;max-width:26rem;margin-top:.25rem;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:max(.7rem,min(1.8vw,.8rem));line-height:1.4;display:flex}#ios-mute-hint svg{width:1.1em;height:1.1em;color:hsla(var(--accent-h), 100%, 55%, .7);fill:currentColor;flex:none}#inapp-browser-hint{color:rgba(255,255,255,.4);text-align:left;align-items:center;gap:.45rem;max-width:26rem;margin-top:.25rem;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:max(.7rem,min(1.8vw,.8rem));line-height:1.4;display:flex}#inapp-browser-hint svg{width:1.1em;height:1.1em;color:hsla(var(--accent-h), 100%, 55%, .7);fill:currentColor;flex:none}#start-sub{color:rgba(255,255,255,.5);letter-spacing:.04em;text-align:center;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:max(.8rem,min(2.2vw,.95rem));transition:color .15s}#start-sub:empty{display:none}#start-sub.error{color:#f46}#start-btn{letter-spacing:.35em;color:#0f8;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;background:0 0;border:2px solid #0f8;border-radius:2px;margin-top:.75rem;padding:.7rem 2.75rem;font-family:ui-monospace,monospace;font-size:max(.9rem,min(2.5vw,1.15rem));font-weight:700;transition:background .15s,color .15s,box-shadow .15s}#start-btn:hover{color:#000;background:#0f8;box-shadow:0 0 24px rgba(0,255,136,.4)}#start-btn:active{color:#000;background:#00cc6a;border-color:#00cc6a}#start-btn:disabled{opacity:.5;cursor:default}#start-btn:focus-visible{outline-offset:4px;outline:2px solid #0f8}#start-credit{z-index:1;letter-spacing:.05em;color:rgba(255,255,255,.55);text-underline-offset:3px;margin-top:.5rem;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:.85rem;-webkit-text-decoration:underline rgba(255,255,255,.25);text-decoration:underline rgba(255,255,255,.25);transition:color .15s;position:relative}#start-credit:hover{color:#fff}#onboarding{pointer-events:none;flex-direction:column;justify-content:center;align-items:center;gap:1rem;transition:opacity .6s;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}#onboarding.fade-out{opacity:0}#onboarding-ring{width:max(90px,min(22vmin,150px));height:max(90px,min(22vmin,150px));filter:drop-shadow(0 0 10px hsla(var(--accent-h), 100%, 55%, .5));transition:filter .4s;overflow:visible;transform:rotate(-90deg)}.ring-track{fill:none;stroke:rgba(255,255,255,.08);stroke-width:5px}.ring-progress{fill:none;stroke:hsl(var(--accent-h), 100%, 55%);stroke-width:5px;stroke-linecap:round;stroke-dasharray:263.9;stroke-dashoffset:263.9px;transition:stroke-dashoffset .1s linear,stroke .4s}#onboarding-text{letter-spacing:.25em;color:#fff;text-shadow:0 0 20px hsla(var(--accent-h), 100%, 55%, .6);font-family:ui-monospace,Cascadia Code,monospace;font-size:max(1.1rem,min(4vw,2rem));font-weight:700;transition:text-shadow .4s}#onboarding-sub{letter-spacing:.1em;color:rgba(255,255,255,.4);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:max(.75rem,min(2vw,1rem))}#onboarding.loading #onboarding-ring{animation:1.4s linear infinite ring-spin}@keyframes ring-spin{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}.hidden{display:none!important}@font-face{font-family:Audiowide;font-style:normal;font-display:swap;font-weight:400;src:url(./audiowide-latin-ext-400-normal-DBgo3hnO.woff2)format("woff2"),url(./audiowide-latin-ext-400-normal-BAMgNcg_.woff)format("woff");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Audiowide;font-style:normal;font-display:swap;font-weight:400;src:url(./audiowide-latin-400-normal-6GFCX7ni.woff2)format("woff2"),url(./audiowide-latin-400-normal-D6mHIfnv.woff)format("woff");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}