:root{--bg: #0a0610;--pink: #ff6b9d;--pink-hot: #ff3d7f;--cream: #ffe8f0;--gold: #ffd76a;--line: rgba(255, 107, 157, .4);--font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;min-height:100dvh;overflow:hidden;background:#050308;color:var(--cream);font-family:var(--font);-webkit-user-select:none;user-select:none;touch-action:manipulation}#app{position:relative;width:100%;height:100%;min-height:100dvh;max-width:1100px;margin:0 auto;display:flex;align-items:stretch;justify-content:center;background:#0a0610}#game{display:block;width:100%;height:100%;min-height:100dvh;object-fit:contain;background:#0a0610}.hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5;padding:max(.45rem,env(safe-area-inset-top)) .8rem 0}.bars{display:grid;grid-template-columns:1fr auto 1fr;gap:.6rem;align-items:start}.side .name{display:block;font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;text-shadow:0 2px 8px #000;margin-bottom:.2rem}.side.p2{text-align:right}.hp,.meter{height:16px;border-radius:4px;overflow:hidden;background:#0000008c;border:1px solid rgba(255,255,255,.18);box-shadow:0 2px 10px #00000073}.meter{height:7px;margin-top:.25rem}.hp i,.meter i{display:block;height:100%;width:100%}.p1 .hp i{background:linear-gradient(90deg,#c02060,var(--pink),#ffb3cc)}.p2 .hp i{background:linear-gradient(90deg,#4a20c0,#8b6bff,#c8b8ff);margin-left:auto;transform-origin:right}.p1 .meter i{background:linear-gradient(90deg,#a07020,var(--gold))}.p2 .meter i{background:linear-gradient(90deg,#4030a0,#a090ff);margin-left:auto;transform-origin:right}.center{text-align:center;padding-top:.1rem}.timer{font-size:1.7rem;font-weight:900;text-shadow:0 2px 10px #000}.round{font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);text-shadow:0 1px 6px #000}.hint{position:absolute;left:0;right:0;bottom:max(7.5rem,calc(env(safe-area-inset-bottom) + 6.5rem));margin:0;text-align:center;font-size:.68rem;color:#ffe8f08c;text-shadow:0 1px 4px #000}.hud{padding-bottom:7rem}.banner{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);z-index:12;font-size:clamp(1.6rem,5.5vw,2.8rem);font-weight:900;letter-spacing:.1em;color:#fff;text-shadow:0 0 24px rgba(255,107,157,.8),0 4px 16px #000;pointer-events:none;animation:pop .9s ease-out both}.banner[hidden]{display:none!important}@keyframes pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.55)}30%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}to{opacity:0;transform:translate(-50%,-62%) scale(1.12)}}.menu{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:1rem;background:#08040cb8;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.menu[hidden]{display:none!important}.card{width:min(100%,420px);background:#1c0a16f2;border:1px solid var(--line);border-radius:18px;padding:1.25rem;text-align:center;box-shadow:0 20px 50px #00000080}.card h1{margin:0;font-size:1.9rem;color:var(--pink)}.sub{margin:.25rem 0 0;font-weight:700;color:var(--gold);font-size:.9rem}.blurb{margin:.85rem 0 1rem;color:#ffe8f0bf;font-size:.9rem;line-height:1.4}.pick{display:block;text-align:left;font-size:.78rem;font-weight:700;margin-bottom:.9rem}.pick select{display:block;width:100%;margin-top:.35rem;padding:.55rem .65rem;border-radius:10px;border:1px solid var(--line);background:#00000059;color:var(--cream);font:inherit}.btn{width:100%;border:none;border-radius:999px;padding:.8rem 1.2rem;font:inherit;font-weight:800;cursor:pointer;color:#1a0a14;background:linear-gradient(180deg,#ff8fb3,var(--pink-hot));box-shadow:0 4px #8a1848}.btn:active{transform:translateY(2px);box-shadow:0 2px #8a1848}.note{margin:.75rem 0 0;font-size:.65rem;color:#ffe8f066;line-height:1.35}.touch-pad{position:absolute;left:0;right:0;bottom:0;z-index:25;display:flex;justify-content:space-between;align-items:flex-end;gap:.4rem;padding:.5rem .55rem max(.65rem,env(safe-area-inset-bottom));pointer-events:auto;background:linear-gradient(180deg,transparent,rgba(0,0,0,.55) 40%)}.touch-pad[hidden]{display:none!important}.pad-left,.pad-mid,.pad-right{display:flex;gap:.4rem;align-items:flex-end}.pad-left{flex:0 0 auto}.pad-mid{flex:1 1 auto;justify-content:center;flex-direction:column;align-items:center}.pad-right{flex:0 0 auto;flex-direction:column}.pad-btn{min-width:64px;min-height:58px;padding:.45rem .65rem;border:2px solid rgba(255,107,157,.55);border-radius:16px;background:#280c1ce0;color:#ffe8f0;font:inherit;font-weight:800;font-size:.78rem;letter-spacing:.04em;touch-action:none;user-select:none;-webkit-user-select:none;box-shadow:0 4px #00000073}.pad-btn:active,.pad-btn.is-down{transform:translateY(2px);background:#ff3d7f8c;box-shadow:0 2px #0006}.pad-btn.tall{min-width:88px;min-height:52px}.pad-btn.atk{border-color:#ffb45099;background:#32180ae6;min-width:72px}.pad-btn.special{border-color:#78c8ffa6;background:#0c1e32eb;color:#b8f0ff;min-height:48px;font-size:.72rem}.pad-left .pad-btn{min-width:70px;min-height:70px;font-size:1.25rem}@media(min-width:900px){.pad-btn{min-width:56px;min-height:50px}}