:root{--bg: var(--tg-theme-bg-color, #0f0f14);--secondary-bg: var(--tg-theme-secondary-bg-color, #1c1c26);--text: var(--tg-theme-text-color, #ffffff);--hint: var(--tg-theme-hint-color, #b9b9c8);--accent: #f7b801}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{margin:0;height:100%}body{background:#0b0b10;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;user-select:none;-webkit-user-select:none;overscroll-behavior:none;touch-action:manipulation}.app{position:relative;display:flex;flex-direction:column;height:100%;max-width:480px;margin:0 auto;padding:env(safe-area-inset-top) 14px env(safe-area-inset-bottom);background-size:cover;background-position:center;overflow:hidden}.app-scrim{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#08080e8c,#08080e40 40%,#08080eb3);pointer-events:none}.app>*:not(.app-scrim){position:relative;z-index:1}.hud{padding:10px 6px 6px}.hud-top{display:flex;align-items:center;justify-content:space-between}.doughnut-count{display:flex;align-items:center;gap:8px;font-size:30px;font-weight:800;text-shadow:0 2px 8px rgba(0,0,0,.6)}.d-icon{width:34px;height:34px;border-radius:50%;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}.combo{text-align:right;font-weight:800;font-size:18px;color:var(--hint);text-shadow:0 2px 8px rgba(0,0,0,.6);display:flex;flex-direction:column;line-height:1.1}.combo.hot{color:#ffd24a}.combo-max{font-size:11px;font-weight:600;opacity:.7}.rarity-row{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}.rarity-pill{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;padding:2px 8px 2px 6px;border:1px solid;border-radius:999px;background:#00000059}.rarity-pill i{width:9px;height:9px;border-radius:50%;display:inline-block}.annoy{margin-top:10px}.annoy-label{font-size:11px;color:var(--hint);margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px}.annoy-track{height:8px;border-radius:5px;background:#00000073;overflow:hidden}.annoy-fill{height:100%;border-radius:5px;transition:width .15s linear,background .2s}.af-readout{margin-top:8px;font-size:11px;color:var(--hint);font-variant-numeric:tabular-nums;opacity:.75}.track{position:absolute;left:6px;top:6px;bottom:6px;width:48px;border-radius:12px;background:#0006;border:1px solid rgba(255,255,255,.08);overflow:hidden;z-index:3;transition:opacity .2s;pointer-events:none}.track.locked{opacity:.4}.track.missed{border-color:#ff4646e6;background:#3c000080;box-shadow:0 0 18px 3px #ff3232bf,inset 0 0 16px #ff282880}.track.missed .track-hitline{background:#ff5a5a;box-shadow:0 0 12px #ff3c3cf2}.track-hitline{position:absolute;left:0;right:0;height:3px;transform:translateY(-50%);background:#fff;box-shadow:0 0 10px #ffffffd9;z-index:2}.track-note{position:absolute;left:7px;right:7px;border-radius:7px;background:linear-gradient(90deg,#9cc0ff,#5c86ff);box-shadow:0 0 6px #7896ff80;transition:background .05s linear}.track-note.active{background:linear-gradient(90deg,#8dffab,#41ff7a);box-shadow:0 0 16px #41ff7ae6}.track-label{position:absolute;bottom:4px;left:0;right:0;text-align:center;font-size:8px;line-height:1.2;color:var(--hint);opacity:.5;z-index:2}.play-area{position:relative;flex:1;display:flex;align-items:center;justify-content:center;min-height:0}.stage{position:relative;height:min(58vh,420px);cursor:pointer;transition:transform .06s ease,filter .2s ease}.stage.open{transform:scale(1.02)}.stage:active{transform:scale(.99)}.stage.locked{filter:saturate(.5) brightness(.8) hue-rotate(-12deg)}.cat{height:100%;width:auto;display:block;pointer-events:none;filter:drop-shadow(0 14px 22px rgba(0,0,0,.45))}.rim-anchor{position:absolute;aspect-ratio:1 / 1;transform:translate(-50%,-50%)}.anus{position:absolute;left:50%;top:50%;width:106%;height:auto;transform-origin:center;pointer-events:none;transition:filter .08s linear}.approach-ring{position:absolute;left:50%;top:50%;width:100%;height:100%;border-radius:50%;border:5px solid #ffffff;box-shadow:0 0 16px #ffffffb3,inset 0 0 10px #ffffff80}.open-ring{position:absolute;left:50%;top:50%;width:116%;height:116%;transform:translate(-50%,-50%);border-radius:50%;border:5px solid #41ff7a;box-shadow:0 0 22px 4px #41ff7acc;animation:open-pop .45s ease-out infinite alternate}@keyframes open-pop{0%{transform:translate(-50%,-50%) scale(1);opacity:.85}to{transform:translate(-50%,-50%) scale(1.12);opacity:1}}.rim-glow{position:absolute;left:50%;top:50%;width:280%;height:280%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#ffe27ad9,#f7b80159 38%,#f7b80100 70%);pointer-events:none}.floater{position:absolute;transform:translate(-50%,-50%);font-size:22px;font-weight:900;white-space:nowrap;text-shadow:0 2px 6px rgba(0,0,0,.6);pointer-events:none;animation:float-up .75s ease-out forwards}.fb-drop{font-size:30px}@keyframes float-up{0%{opacity:0;transform:translate(-50%,-40%) scale(.7)}20%{opacity:1;transform:translate(-50%,-90%) scale(1.15)}to{opacity:0;transform:translate(-50%,-200%) scale(1)}}.lock-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.lock-emoji{font-size:64px;animation:shake .4s ease-in-out infinite}.lock-text{font-weight:800;background:#0009;padding:6px 12px;border-radius:10px}@keyframes shake{0%,to{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}.switcher{display:flex;gap:8px;padding:8px 2px 4px;overflow-x:auto}.switch-btn{flex:1 0 auto;min-width:120px;text-align:left;border:1px solid rgba(255,255,255,.12);background:#14141eb3;color:var(--text);border-radius:12px;padding:8px 10px;cursor:pointer;display:flex;flex-direction:column;gap:2px;transition:border-color .15s,background .15s}.switch-btn.active{border-color:var(--accent);background:#f7b80124}.switch-name{font-weight:800;font-size:14px}.switch-blurb{font-size:11px;color:var(--hint);line-height:1.2}