.game{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);color:#2c4a6e;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:#d4e4f4;font-family:system-ui,sans-serif;position:fixed;inset:0}.game__canvas{touch-action:none;width:100%;height:100%;display:block}.game__hud{top:calc(env(safe-area-inset-top) + 2.5rem);pointer-events:none;flex-direction:column;align-items:center;gap:.25rem;display:flex;position:absolute;left:0;right:0}.game__score{font-variant-numeric:tabular-nums;color:#2c4a6ebf;text-shadow:0 1px #fff9;font-size:3rem;font-weight:700;line-height:1}.game__combo{font-variant-numeric:tabular-nums;background:#ffffff8c;border-radius:999px;padding:.2rem .75rem;font-size:.95rem;font-weight:600}.game__bonus{color:#3d6ea8}.game__perfect{color:#fff;text-shadow:0 1px 4px #2c4a6e80;font-size:1.1rem;font-weight:800;animation:.6s ease-out forwards game-pop}@keyframes game-pop{0%{opacity:0;transform:translateY(6px)scale(.9)}25%{opacity:1;transform:translateY(0)scale(1.05)}to{opacity:0;transform:translateY(-10px)scale(1)}}.game__wind{color:#fff;text-shadow:0 1px 3px #2c4a6e80;margin-top:.25rem;font-size:.95rem;font-weight:600}@media (prefers-reduced-motion:reduce){.game__perfect{animation-duration:10ms}}.game__overlay{text-align:center;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#e2eefab8;flex-direction:column;justify-content:center;align-items:center;gap:.75rem;padding:1rem;display:flex;position:absolute;inset:0}.game__title{color:#3d6ea8;font-variant-numeric:tabular-nums;margin:0;font-size:3.5rem;font-weight:800}.game__subtitle{max-width:18rem;margin:0;font-size:1.1rem;line-height:1.4}.game__button{color:#fff;min-width:10rem;font:inherit;cursor:pointer;background:#7fa8d8;border:none;border-radius:999px;margin-top:1rem;padding:.9rem 2rem;font-size:1.2rem;font-weight:700;box-shadow:0 4px 14px #3d6ea84d}.game__button:disabled{opacity:.4;cursor:default}.game__button:focus-visible{outline-offset:3px;outline:3px solid #3d6ea8}.game__sound{top:calc(env(safe-area-inset-top) + 1rem);right:calc(env(safe-area-inset-right) + 1rem);color:inherit;font:inherit;cursor:pointer;background:#fff9;border:1px solid #3d6ea859;border-radius:999px;padding:.4rem .9rem;font-size:.9rem;position:absolute}.game__unlock{color:#3d6ea8;background:#fff;border-radius:999px;margin:0;padding:.3rem .9rem;font-weight:700}.game__skins{border:none;flex-wrap:wrap;justify-content:center;gap:.5rem;margin:.5rem 0 0;padding:0;display:flex}.game__skins-title{text-align:center;opacity:.7;width:100%;margin-bottom:.4rem;font-size:.85rem}.game__skin{color:inherit;font:inherit;cursor:pointer;background:#fff9;border:2px solid #0000;border-radius:999px;align-items:center;gap:.4rem;padding:.35rem .75rem .35rem .4rem;font-size:.9rem;display:flex}.game__skin[aria-pressed=true]{background:#fff;border-color:#3d6ea8}.game__skin:disabled{opacity:.5;cursor:default}.game__swatch{border:3px solid;border-radius:50%;width:1.1rem;height:1.1rem}.game__secondary{color:#3d6ea8;font:inherit;cursor:pointer;background:#ffffff8c;border:2px solid #3d6ea873;border-radius:999px;padding:.5rem 1.4rem;font-weight:700}.nickname{flex-direction:column;align-items:center;gap:.4rem;width:100%;max-width:20rem;display:flex}.nickname__label{font-size:.95rem}.nickname__row{gap:.4rem;width:100%;display:flex}.nickname__input{min-width:0;color:inherit;font:inherit;background:#fff;border:2px solid #3d6ea859;border-radius:999px;flex:1;padding:.55rem .8rem;font-size:1rem}.nickname__input:focus-visible{border-color:#3d6ea8;outline:none}.nickname__input[aria-invalid=true]{border-color:#c0616b}.nickname__submit{color:#fff;font:inherit;cursor:pointer;background:#3d6ea8;border:none;border-radius:999px;padding:.55rem 1rem;font-weight:700}.nickname__submit:disabled{opacity:.5}.nickname__error{color:#a0444e;margin:0;font-size:.85rem}.board{text-align:left;background:#ffffffd9;border-radius:1.25rem;flex-direction:column;gap:.75rem;width:100%;max-width:24rem;max-height:100%;padding:1rem;display:flex;box-shadow:0 8px 30px #2c4a6e2e}.board__header{justify-content:space-between;align-items:center;display:flex}.board__title{color:#3d6ea8;margin:0;font-size:1.5rem}.board__close,.board__link{color:#3d6ea8;font:inherit;cursor:pointer;background:0 0;border:none;font-weight:600}.board__link{padding:0;text-decoration:underline}.board__tabs{background:#e2eefa;border-radius:999px;gap:.25rem;padding:.25rem;display:flex}.board__tab{color:inherit;font:inherit;cursor:pointer;background:0 0;border:none;border-radius:999px;flex:1;padding:.4rem .5rem;font-size:.9rem}.board__tab[aria-selected=true]{color:#3d6ea8;background:#fff;font-weight:700;box-shadow:0 1px 4px #2c4a6e26}.board__body{flex:1;min-height:8rem;overflow-y:auto}.board__list{margin:0;padding:0;list-style:none}.board__row{font-variant-numeric:tabular-nums;border-radius:.6rem;grid-template-columns:2.5rem 1fr auto;align-items:center;padding:.45rem .6rem;display:grid}.board__row:nth-child(odd){background:#d4e4f480}.board__row[data-me=true]{color:#fff;background:#7fa8d8;font-weight:700}.board__rank{opacity:.7}.board__name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.board__score{font-weight:700}.board__note{text-align:center;opacity:.8;margin:0;font-size:.9rem}.board__footer{flex-direction:column;align-items:center;gap:.5rem;display:flex}.game__coin{vertical-align:-.1em;background:radial-gradient(circle at 35% 30%,#fff1bf,#f0c95a 55%,#c9982c);border-radius:50%;width:.85em;height:.85em;margin-right:.3em;display:inline-block;box-shadow:inset 0 0 0 1.5px #96691473}.game__coins{font-variant-numeric:tabular-nums;color:#7a5a14;text-shadow:0 1px #ffffffb3;font-size:1.05rem;font-weight:700}.game__wallet{margin:0;font-weight:600}.game__effects{flex-wrap:wrap;justify-content:center;gap:.35rem;margin-top:.3rem;padding:0 1rem;display:flex}.game__effect{background:#ffffffbf;border-radius:999px;padding:.25rem .7rem .35rem;font-size:.85rem;font-weight:700;position:relative;overflow:hidden}.game__effect[data-kind=wide]{color:#3f7fbf}.game__effect[data-kind=slow]{color:#6c63b5}.game__effect[data-kind=double]{color:#2f8a7e}.game__effect[data-kind=shield]{color:#3d6ea8}.game__effect[data-negative=true]{color:#b84e5a;background:#ffeeeed9}.game__effect-timer{transform-origin:0;background:currentColor;width:100%;height:3px;animation:linear forwards game-countdown;position:absolute;bottom:0;left:0}@keyframes game-countdown{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}
