*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 15% 0%,#16344355,transparent 50%),radial-gradient(ellipse at 85% 80%,#50213c33,transparent 55%),#10182c;color:#d5deea;font:13px system-ui,-apple-system,sans-serif;min-height:100vh;display:grid;place-content:center;padding:28px}main{width:min(100%,1240px);margin:auto}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}h1{font-size:26px;letter-spacing:1px;font-style:italic;font-weight:950;margin:3px 0 0;color:#f5faff}small{color:#70dcd4;font-size:10px;letter-spacing:3px}.badge{border:1px solid #ffffff15;border-radius:5px;padding:9px 15px;color:#d5f88b;background:#25466b;letter-spacing:2px;font-size:10px}canvas{width:100%;display:block;aspect-ratio:16/9;background:#172032;border:1px solid #ffffff1c;border-radius:16px;box-shadow:0 25px 90px #0009,0 0 50px #4ad1d609;touch-action:none}footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-top:18px;color:#8094aa;line-height:1.8;font-size:11px}button{background:linear-gradient(#1c2b3d,#142030);color:#dfecf8;border:1px solid #ffffff14;border-radius:9px;padding:11px 14px;font:600 11px system-ui;letter-spacing:.4px;cursor:pointer;touch-action:none;box-shadow:0 2px 4px #0003}button:hover{background:#263d50;border-color:#6edfd777}button:active{transform:translateY(1px);color:#73eadf}.touch{display:flex;justify-content:space-between;margin-top:16px;gap:14px}.touch div{display:flex;gap:6px;flex-wrap:wrap}.touch div:last-child{justify-content:flex-end}a{color:#8da9bc}.mix{display:flex;align-items:center;gap:10px;margin-top:12px;color:#7e95ae;font-size:10px;letter-spacing:1.5px}.mix input{accent-color:#73e0d4;width:110px}.mix span{margin-left:auto;color:#8094aa}@media(max-width:600px){body{padding:10px}h1{font-size:19px}.badge{display:none}button{padding:10px}footer{font-size:10px}small{letter-spacing:2px}.touch{gap:5px}canvas{border-radius:9px}.mix span{display:none}}

[hidden]{display:none!important}.arena{position:relative}.score-panel{position:absolute;inset:0;z-index:2;display:grid;place-items:center;background:#070d22ed;border-radius:16px;overflow:auto;padding:18px}.score-card{width:min(100%,580px);margin:auto;text-align:center;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.score-card small{letter-spacing:2px}.score-card h2{color:#ffe29b;font-size:clamp(18px,3vw,28px);letter-spacing:3px;margin:9px 0}.score-card p{margin:8px 0}.score-card label{display:block;font-size:11px;color:#92b1d5;letter-spacing:2px}.score-entry{display:flex;justify-content:center;gap:12px;margin:10px 0}.score-entry input{width:130px;min-width:0;color:#8ff4dc;background:#14233f;border:2px solid #67d5c5;border-radius:6px;font:900 32px ui-monospace,monospace;letter-spacing:10px;text-align:center;padding:6px 0 6px 10px;text-transform:uppercase}.score-card button{border-color:#71d9ca77;color:#99ffe0}.score-card button:disabled{opacity:.55;cursor:default}.score-card input:focus-visible,.score-card button:focus-visible{outline:3px solid #ffe29b;outline-offset:3px}#score-status{font-size:12px;min-height:18px;color:#bbd3ed}.high-scores{width:100%;border-collapse:collapse;margin:10px 0 14px;text-align:right;font-size:13px;font-variant-numeric:tabular-nums}.high-scores caption{color:#ffe29b;letter-spacing:3px;padding:8px}.high-scores th{font-size:10px;color:#809aba;padding:4px 8px}.high-scores td{padding:3px 8px;border-top:1px solid #7ca8d51a}.high-scores th:nth-child(2),.high-scores td:nth-child(2){text-align:left;letter-spacing:3px}.high-scores tbody tr:first-child{color:#ffe29b}#run-result{color:#8ef0db;font-weight:bold;letter-spacing:1px}@media(max-width:700px){.score-panel{position:relative;min-height:480px;margin-top:10px}.score-panel:not([hidden]){border:1px solid #67d5c555}.score-card small{font-size:9px;letter-spacing:1px}}

.character-card{width:min(100%,580px);text-align:center;margin:auto}.character-card h2{color:#ffe29b;letter-spacing:3px;margin:10px 0 14px;font-size:clamp(17px,2.5vw,26px)}.hero-options{display:grid;grid-template-columns:1fr 1fr;gap:18px}.hero-option{display:flex;flex-direction:column;align-items:center;padding:8px 14px 14px;border:2px solid #435d7b;background:linear-gradient(#1b2d4b,#102239)}.hero-option[aria-pressed="true"]{border-color:#86f5d5;background:linear-gradient(#234d62,#143347);box-shadow:0 0 24px #70dfc022}.hero-option canvas{width:min(100%,180px);height:auto;aspect-ratio:220/250;border:0;background:none;box-shadow:none;border-radius:0;pointer-events:none}.hero-option strong{color:#edfaff;font-size:19px;letter-spacing:3px}.hero-option span{font-size:9px;margin-top:6px;letter-spacing:1px;color:#a7c5da}.character-card p{font-size:12px;color:#aec9dd;margin:12px 0}.character-card .hero-hint{font-size:10px}.character-card button:focus-visible{outline:3px solid #ffe29b;outline-offset:3px}#hero-confirm{color:#96ffe0;border-color:#86f5d5;padding:12px 25px}@media(max-width:700px){.hero-options{gap:9px}.hero-option{padding:6px}.hero-option canvas{max-width:140px}.character-panel{min-height:440px}}