:root{font-family:system-ui,'Malgun Gothic',sans-serif;background:#191822;color:#f6f4ff;font-synthesis:none}*{box-sizing:border-box}body{margin:0}main{max-width:560px;margin:auto;padding:24px 20px}button{font:inherit;cursor:pointer;touch-action:manipulation}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #484552;padding-bottom:16px;font-size:12px;letter-spacing:2px}header button{border:0;background:none;color:#bab6ca;font-size:13px;letter-spacing:0}h1{font-size:clamp(32px,8vw,46px);letter-spacing:-2px;margin:24px 0 16px}.rules{display:flex;gap:10px;flex-wrap:wrap;font-size:14px;font-weight:800;margin-bottom:20px}.same{color:#c0fa70}.opposite{color:#ff7c91}.rules span{padding:8px 12px;border:1px solid currentColor;border-radius:4px}.play{background:#24222f;padding:22px;border:1px solid #484552;border-radius:8px}.stats{display:flex;justify-content:space-between;margin-bottom:18px}.stats small{display:block;font-size:12px;color:#a5a0b7;margin-bottom:4px}.stats b{font-size:26px;font-variant-numeric:tabular-nums}#lives{color:#ff7c91;font-size:22px}.track{height:5px;background:#484552;overflow:hidden}#bar{height:100%;background:#f6f4ff;transform-origin:left}.prompt{text-align:center;min-height:240px;display:flex;flex-direction:column;justify-content:center;align-items:center}.prompt strong{font-size:130px;line-height:1.1}.prompt span{font-size:18px;font-weight:800}.prompt #hint{font-size:12px;font-weight:400;color:#a5a0b7;margin-top:10px}.prompt.same{color:#c0fa70}.prompt.opposite{color:#ff7c91}#feedback{height:40px;text-align:center;font-size:14px;color:#ddd6f4}.controls{display:flex;flex-direction:column;align-items:center;gap:8px}.controls>div{display:flex;gap:8px}.controls button{background:#373341;border:1px solid #625b76;color:#f6f4ff;border-radius:5px;font-size:30px;width:72px;height:58px}.controls button:active{background:#625b76;transform:translateY(2px)}button:focus-visible{outline:3px solid white;outline-offset:3px}.start{display:block;width:100%;background:#c0fa70;color:#191822;padding:16px;border:0;border-radius:4px;font-weight:900;font-size:18px;margin-top:20px}.best{font-size:14px;color:#ddd6f4}.best span,footer{font-size:12px;color:#a5a0b7}footer{margin-top:22px}[hidden]{display:none!important}#result{text-align:center}#result h2{font-size:32px;margin:15px 0;color:#c0fa70}#summary{font-size:14px;line-height:1.8}@media(max-width:380px){main{padding:16px 12px}.play{padding:16px}.prompt{min-height:210px}.prompt strong{font-size:110px}}