:root{font-family:Inter,system-ui,sans-serif;color:#f7fbff;color-scheme:dark}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#06101f}button{font:inherit}#game-container,canvas{display:block;width:100vw;height:100vh}.game-ui{position:fixed;z-index:5;top:18px;left:18px;pointer-events:none}.brand{display:inline-flex;align-items:center;gap:9px;padding:8px 13px;border:1px solid #ffffff24;border-radius:12px 12px 0 0;background:#07162de8;font-size:.75rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.brand span{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:#1ee497;color:#062218}.status{display:flex;gap:0;background:#07162de8;border:1px solid #ffffff24;border-radius:0 14px 14px;padding:10px 4px;box-shadow:0 15px 50px #0008;backdrop-filter:blur(10px)}.status div{min-width:76px;padding:2px 13px;border-right:1px solid #ffffff17}.status div:last-child{border:0}.status small{display:block;color:#83a0bc;font-size:.58rem;font-weight:800;letter-spacing:.14em}.status strong{display:block;margin-top:3px;font-size:1.05rem}.status #lives{color:#ff5e68;font-size:.83rem;letter-spacing:2px}.message{max-width:325px;margin:8px 0 0;padding:9px 13px;border-radius:10px;background:#07162dcc;color:#c8d7e6;font-size:.75rem}.round-button,#restart{position:fixed;z-index:6;top:18px;border:1px solid #ffffff25;background:#07162de8;color:white;cursor:pointer;box-shadow:0 8px 30px #0007}.round-button{right:18px;width:45px;height:45px;border-radius:50%;font-weight:900}#restart{right:72px;padding:13px 17px;border-radius:99px;font-size:.75rem;font-weight:800;text-transform:uppercase}.controls{display:none;position:fixed;z-index:7;right:18px;bottom:18px;grid-template:repeat(2,52px)/repeat(3,52px);gap:5px}.controls button{border:1px solid #fff3;border-radius:14px;background:#0a203ed9;color:white;font-size:1.1rem;touch-action:none}.controls [data-dir=up]{grid-area:1/2}.controls [data-dir=left]{grid-area:2/1}.controls [data-dir=down]{grid-area:2/2}.controls [data-dir=right]{grid-area:2/3}.overlay{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 50% 35%,#153d6677,#020711ed);opacity:0;visibility:hidden;transition:.25s}.overlay.visible{opacity:1;visibility:visible}.card{width:min(430px,100%);padding:32px;text-align:center;border:1px solid #ffffff2b;border-radius:28px;background:linear-gradient(145deg,#0c2039f4,#07101ff7);box-shadow:0 30px 100px #000b}.ball{font-size:2.7rem}.eyebrow{margin:10px 0;color:#2ee99d;font-size:.65rem;font-weight:900;letter-spacing:.2em}.card h1{margin:0;font-size:clamp(2rem,8vw,3.5rem);line-height:.9;text-transform:uppercase}.card h1 em{color:#28e89e;font-style:normal}.card>p:not(.eyebrow){color:#aebfd0;font-size:.9rem;line-height:1.55}.legend{display:flex;justify-content:center;gap:10px;margin:20px 0}.legend span{padding:8px 10px;border-radius:8px;background:#ffffff0b;font-size:.72rem}.card button{width:100%;padding:14px;border:0;border-radius:12px;background:linear-gradient(135deg,#20e99a,#20bde9);color:#03221b;font-weight:900;text-transform:uppercase;cursor:pointer}.card small{display:block;margin-top:13px;color:#71869b;font-size:.65rem}@media(max-width:700px){.game-ui{top:10px;left:10px}.brand{display:none}.status div{min-width:58px;padding:2px 8px}.message{max-width:265px}.controls{display:grid}#restart{display:none}.round-button{top:auto;bottom:18px;left:18px;right:auto}.card{padding:26px 20px}}