*{box-sizing:border-box}
body{margin:0;min-height:100vh;font-family:system-ui,sans-serif;background:#46178f;color:#fff;text-align:center}
section{padding:24px;max-width:1200px;margin:auto}
[hidden]{display:none!important}
h1{font-size:3rem;margin:.3em 0}
.pin{font-size:6rem;font-weight:800;background:#fff;color:#46178f;display:inline-block;padding:.1em .5em;border-radius:12px;letter-spacing:.1em}
.chip{display:inline-block;background:rgba(255,255,255,.2);padding:.4em .9em;margin:.3em;border-radius:8px;font-size:1.4rem}
input,button{font:inherit;font-size:1.4rem;padding:.7em;border-radius:8px;border:0;margin:.4em;width:min(90%,400px)}
button.big{background:#fff;color:#333;font-weight:700;cursor:pointer;box-shadow:0 4px 0 rgba(0,0,0,.3)}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.opt{padding:1em;border-radius:8px;font-size:1.8rem;font-weight:700;min-height:100px;display:flex;align-items:center;justify-content:center;gap:.5em;border:0;color:#fff;width:auto;margin:0}
.c0{background:#e21b3c}.c1{background:#1368ce}.c2{background:#d89e00}.c3{background:#26890c}
.opt.dim{opacity:.35}
.bar{display:inline-block;width:20%;margin:0 1%;vertical-align:bottom}
.bar i{display:block;border-radius:6px 6px 0 0;min-height:4px}
.bars{height:260px;display:flex;align-items:flex-end;justify-content:center}
.row{background:rgba(255,255,255,.15);margin:.4em auto;max-width:600px;padding:.6em 1em;border-radius:8px;display:flex;justify-content:space-between;font-size:1.6rem}
.timer{font-size:3rem;font-weight:800}
.err{color:#ffd0d0}
.podium{display:flex;align-items:flex-end;justify-content:center;gap:10px;height:320px}
.podium div{background:#fff;color:#46178f;width:200px;padding:1em;border-radius:8px 8px 0 0;font-weight:700;font-size:1.5rem}
@media(max-width:600px){h1{font-size:2rem}.pin{font-size:3rem}.opt{font-size:1.3rem;min-height:140px}}