*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:system-ui,-apple-system,sans-serif;background:#082d29;color:#fff9e8}body{background:radial-gradient(ellipse at top,#235b4d,#082d29 70%)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:0}button:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:4px}.shell{width:min(100%,500px);margin:auto;padding:0 10px}.top{height:48px;display:flex;align-items:center;justify-content:space-between;font-size:12px}.top a{color:#d0e8cf;text-decoration:none}.arena{position:relative;width:100%;height:min(760px,calc(100svh - 82px));min-height:550px;overflow:hidden;border:1px solid #487466;border-radius:26px;background:#174c42;box-shadow:0 22px 80px #001b1b66}#game{width:100%;height:100%;display:block;touch-action:none;user-select:none}.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;text-align:center;padding:28px 22px;background:linear-gradient(180deg,#103f38f5,#174b40ee 70%,#0a322ade);z-index:3;overflow:auto}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:#b8dca9}h1{font-size:40px;line-height:1.03;letter-spacing:-2px;margin:18px 0 10px}h1 em{font-style:normal;color:#ffd56d}p{line-height:1.5}.intro{margin:0 0 24px;font-size:13px;color:#d9e7d2}.pick-label{font-size:12px;color:#d6dfca;margin-bottom:10px}.choices{display:flex;gap:12px;width:100%}.hero{width:50%;color:#fff7df;background:#ffffff08;border:1px solid #ffffff25;border-radius:20px;padding:0 6px 12px;transition:transform .2s,background .2s}.hero.selected{border:2px solid #ffd56d;background:#ffdb6a12;box-shadow:0 5px 0 #001e1c55;transform:translateY(-3px)}.hero[data-hero=dia].selected{border-color:#ffa6c9;background:#ff90b91c}.hero canvas{max-width:100%;height:135px;object-fit:contain;display:block;margin:auto}.hero b{display:block;font-size:18px}.hero span{font-size:10px;color:#c7d9c7}.rules{display:flex;flex-direction:column;gap:5px;font-size:12px;margin:18px 0;text-align:left;color:#e7ecd7}.go,.secondary{width:100%;max-width:320px;min-height:50px;border-radius:16px;font-weight:800}.go{background:#ffd56d;color:#3b2c17;box-shadow:0 5px 0 #b9913e}.go:active{transform:translateY(3px);box-shadow:0 2px 0 #b9913e}.go:disabled{opacity:.6}.small{font-size:10px;color:#b7cebb;margin:12px 0 0}.record{font-size:12px;color:#ffd56d;margin:8px}.hud{position:absolute;top:18px;left:20px;right:14px;display:flex;justify-content:space-between;align-items:center;pointer-events:none}.hud span{display:block;letter-spacing:1.5px;font-size:8px;color:#b9d8c4}.hud strong{font-size:25px;font-variant-numeric:tabular-nums}.hud>div:nth-child(3) strong{font-size:15px;color:#ffd56d}.hud button{pointer-events:auto;background:#ffffff12;border:1px solid #ffffff33;color:#fff;border-radius:12px;width:44px;height:44px;font-size:20px}.compact{justify-content:center;gap:8px;backdrop-filter:blur(8px)}h2{font-size:34px;line-height:1.1;margin:10px 0}.compact p{color:#d4e6d3;font-size:14px}.final-score{font-size:88px;font-weight:900;color:#ffd56d;line-height:1.1}.secondary{background:transparent;border:1px solid #ffffff40;color:#e8f1dc;margin-top:12px}.hero-name{position:absolute;left:20px;bottom:17px;font-size:12px;font-weight:800;color:#ffdf82}.sound{position:absolute;right:14px;bottom:14px;z-index:5;background:#123b32dd;color:#d1dfc9;border:1px solid #ffffff22;border-radius:20px;padding:7px 12px;font-size:10px}footer{text-align:center;font-size:10px;color:#9abeac;padding:10px 0}[hidden]{display:none!important}@media(max-height:730px){.overlay{padding:20px 18px}h1{font-size:34px;margin:12px 0 8px}.intro{margin-bottom:15px}.hero canvas{height:105px}.rules{margin:13px 0}.arena{border-radius:20px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.pause-bars{display:block;width:13px;height:17px;border-left:4px solid currentColor;border-right:4px solid currentColor;margin:auto}