:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#fff8d9;background:#ff9f5f;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;overflow:hidden}button,a{font:inherit}.app-shell{position:relative;width:100%;height:100%}.app-shell canvas{display:block}.menu-actions{position:absolute;left:50%;bottom:clamp(28px,7vh,72px);display:flex;gap:14px;transform:translate(-50%);z-index:2}.menu-actions button,.menu-actions a{display:grid;min-width:130px;min-height:48px;place-items:center;padding:0 24px;border:1px solid rgba(255,248,217,.7);border-radius:8px;color:#2f1d0e;background:linear-gradient(180deg,#fff2a3,#f5b345);box-shadow:0 14px 30px #411d044d;cursor:pointer;font-weight:800;letter-spacing:0;text-decoration:none;text-transform:uppercase}.menu-actions button:hover,.menu-actions a:hover{transform:translateY(-1px);filter:brightness(1.04)}.menu-actions button:active,.menu-actions a:active{transform:translateY(1px)}.difficulty-panel{position:absolute;left:50%;bottom:calc(clamp(28px,7vh,72px) + 66px);display:flex;gap:10px;transform:translate(-50%);z-index:2}.difficulty-panel button,.round-summary button{min-width:104px;min-height:40px;padding:0 18px;border:1px solid rgba(255,248,217,.56);border-radius:8px;color:#fff8d9;background:#2f1d0e6b;box-shadow:0 12px 28px #2f1d0e3d;cursor:pointer;font-weight:900;letter-spacing:0;text-transform:uppercase}.difficulty-panel button.is-selected{color:#2f1d0e;background:linear-gradient(180deg,#fff2a3,#f5b345);border-color:#fff8d9e0}.round-summary{position:absolute;left:50%;top:50%;display:grid;min-width:min(360px,86vw);gap:14px;justify-items:center;transform:translate(-50%,-50%);z-index:3;padding:28px;border:1px solid rgba(255,248,217,.62);border-radius:8px;color:#fff8d9;background:#2f1d0e8a;box-shadow:0 24px 60px #2f1d0e5c;text-align:center}.round-summary h2{margin:0;font-size:28px;line-height:1;text-transform:uppercase}.round-summary span{color:#fff8d9d1;font-size:15px;font-weight:900;text-transform:uppercase}.round-summary p{margin:0;color:#ffe274;font-size:56px;font-weight:900;line-height:1;text-shadow:0 4px 16px rgba(47,29,14,.4)}.menu-actions--playing{left:auto;right:24px;bottom:24px;transform:none}.menu-actions--playing button,.menu-actions--playing a{min-width:112px;min-height:40px;padding:0 18px;font-size:13px}.desktop-only{display:none}.loading-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;display:grid;place-items:center;padding:24px;color:#fff8d9;background:#ff9f5fe0}.loading-panel{display:grid;width:min(420px,86vw);gap:18px;padding:24px;border:1px solid rgba(255,248,217,.58);border-radius:8px;background:#2f1d0e75;box-shadow:0 24px 60px #2f1d0e47}.loading-panel p,.loading-panel span{margin:0;font-weight:900;letter-spacing:0;text-transform:uppercase}.loading-panel p{min-height:22px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.loading-panel span{color:#fff8d9c7;font-size:13px;text-align:right}.loading-track{width:100%;height:12px;margin-top:2px;overflow:hidden;border:1px solid rgba(255,248,217,.48);border-radius:999px;background:#2f1d0e6b}.loading-fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#ffe274,#4ee172);transition:width .16s ease-out}.rhythm-game{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}.scoreboard{position:absolute;top:22px;left:22px;display:flex;gap:12px;color:#fff8d9;font-size:18px;font-weight:900;text-shadow:0 2px 10px rgba(47,29,14,.55);text-transform:uppercase}.note-highway{position:absolute;left:50%;bottom:96px;width:min(660px,86vw);height:min(560px,72vh);transform:translate(-50%);overflow:hidden}.note-highway:before{position:absolute;top:0;right:0;bottom:0;left:0;content:"";background:linear-gradient(180deg,#37160800,#3716082e 66%,#37160852);clip-path:polygon(18% 0,82% 0,100% 100%,0 100%)}.note-lane{position:relative;float:left;width:calc(100% / 7);height:100%;border-left:1px solid rgba(255,248,217,.18)}.note-lane:last-of-type{border-right:1px solid rgba(255,248,217,.18)}.hit-circle{position:absolute;left:50%;bottom:8%;display:grid;width:58px;height:58px;place-items:center;transform:translate(-50%);border:3px solid rgba(255,248,217,.92);border-radius:50%;color:#2f1d0e;background:radial-gradient(circle at 35% 25%,#fff7c2,#f6b341 64%,#be6b24);box-shadow:0 0 22px #ffe57394,0 12px 24px #2f1d0e47;cursor:pointer;font-size:20px;font-weight:900;pointer-events:auto;touch-action:manipulation}.hit-circle.is-hit{animation:hit-pulse .24s ease-out}.hit-circle.is-miss{animation:miss-pulse .26s ease-out}.falling-note{position:absolute;display:grid;width:44px;height:44px;place-items:center;border:2px solid rgba(255,248,217,.9);border-radius:50%;color:#2f1d0e;background:linear-gradient(180deg,#fff2a3,#f5b345);box-shadow:0 10px 22px #2f1d0e47;font-size:19px;font-weight:900;transform:translate(-50%);text-transform:uppercase}@keyframes hit-pulse{0%{background:radial-gradient(circle at 35% 25%,#efffd1,#4ee172 64%,#10813a);box-shadow:0 0 34px #5cff7ee6,0 12px 24px #2f1d0e47;transform:translate(-50%) scale(1.18)}to{background:radial-gradient(circle at 35% 25%,#fff7c2,#f6b341 64%,#be6b24);transform:translate(-50%) scale(1)}}@keyframes miss-pulse{0%{background:radial-gradient(circle at 35% 25%,#ffe3df,#ff6262 64%,#9f1d23);box-shadow:0 0 34px #ff4b4be6,0 12px 24px #2f1d0e47;transform:translate(-50%) scale(1.12)}to{background:radial-gradient(circle at 35% 25%,#fff7c2,#f6b341 64%,#be6b24);transform:translate(-50%) scale(1)}}.loading{color:#fff8d9;font-weight:800;letter-spacing:0}@media (max-width: 560px){.menu-actions{bottom:22px;width:min(88vw,320px)}.menu-actions button,.menu-actions a{width:100%;min-width:0;min-height:44px;padding:0 14px;font-size:13px}.difficulty-panel{bottom:80px;width:min(88vw,320px)}.difficulty-panel button{min-width:0;width:100%;padding:0 10px;font-size:13px}.menu-actions--playing{display:none}.scoreboard{top:12px;left:12px;gap:8px;font-size:13px}.note-highway{width:100vw;height:min(520px,68vh);bottom:22px}.hit-circle{width:42px;height:42px;border-width:2px;color:transparent;font-size:0}.falling-note{width:34px;height:34px;color:transparent;font-size:0}.round-summary{min-width:min(320px,88vw);padding:22px}.round-summary h2{font-size:22px}.round-summary p{font-size:46px}}