*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#12080b;color:#fff;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow-x:hidden;touch-action:manipulation}body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 50% 0%,#4a1623 0,#19080d 45%,#080306 100%);z-index:-2}body:after{content:"";position:fixed;inset:0;background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px);background-size:100% 4px;mix-blend-mode:screen;opacity:.35;pointer-events:none;z-index:10}#app{width:min(980px,100%);margin:0 auto;padding:18px 14px 24px}.topbar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:12px}.topbar h1{margin:0;font-size:clamp(30px,7vw,58px);letter-spacing:-.06em;line-height:.95;text-shadow:0 5px 0 #6b1320,0 0 26px #ff315f}.topbar p{margin:8px 0 0;color:#ffc4cf;font-weight:700}.badge{border:1px solid #ff8299;background:#2a0c14;color:#ffd6df;border-radius:999px;padding:8px 12px;font-weight:900}.arena{position:relative;min-height:520px;border:2px solid #ff5b77;border-radius:28px;background:linear-gradient(180deg,rgba(255,80,110,.13),rgba(0,0,0,.22)),radial-gradient(circle at 50% 95%,#4d1e13 0,#210a10 50%,#070205 100%);box-shadow:0 20px 70px rgba(0,0,0,.45),inset 0 0 60px rgba(255,68,101,.17);overflow:hidden}.crowd{position:absolute;inset:52% 0 0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.07) 0 16px,rgba(0,0,0,.1) 16px 32px);opacity:.55}.hud{position:relative;z-index:2;display:grid;grid-template-columns:1fr auto 1fr;gap:10px;padding:14px}.fighter-card{border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.35);border-radius:18px;padding:10px;backdrop-filter:blur(8px)}.fighter-card.right{text-align:right}.name{font-weight:1000;letter-spacing:-.03em;margin-bottom:8px}.bar{height:12px;background:#25070c;border:1px solid rgba(255,255,255,.18);border-radius:999px;overflow:hidden;margin:5px 0}.bar i{display:block;height:100%;width:100%;transition:width .28s ease}.hp i{background:linear-gradient(90deg,#22e071,#d8ff5e)}.rage i{background:linear-gradient(90deg,#ffaf22,#ff2f5f)}.scorebox{min-width:132px;text-align:center;border:1px solid rgba(255,255,255,.18);border-radius:18px;background:rgba(0,0,0,.5);padding:10px;font-family:"Courier New",monospace;font-weight:900;color:#ffe7ec}.stage{position:relative;height:355px}.fighter{position:absolute;bottom:34px;width:150px;height:230px;transition:transform .12s ease;filter:drop-shadow(0 24px 20px rgba(0,0,0,.45))}.fighter.player{left:8%;transform-origin:70% 65%}.fighter.enemy{right:8%;transform-origin:30% 65%}.head{position:absolute;top:0;left:28px;width:96px;height:96px;border-radius:44% 44% 50% 50%;background:#ffd0a8;border:5px solid #2b0e0b;display:grid;place-items:center;font-size:26px;font-weight:900;z-index:3}.enemy .head{background:#d7efff}.cheek{position:absolute;width:26px;height:18px;border-radius:50%;background:rgba(255,56,88,.4);top:54px}.player .cheek{right:2px}.enemy .cheek{left:2px}.body{position:absolute;top:88px;left:38px;width:74px;height:110px;background:linear-gradient(#2a9dff,#1250a8);border:5px solid #2b0e0b;border-radius:24px 24px 16px 16px}.enemy .body{background:linear-gradient(#ffb12a,#c9491d)}.arm{position:absolute;top:92px;width:86px;height:22px;background:#ffd0a8;border:4px solid #2b0e0b;border-radius:999px;z-index:4}.player .arm{left:95px;transform-origin:4px 50%;transform:rotate(-18deg)}.enemy .arm{right:95px;background:#d7efff;transform-origin:82px 50%;transform:rotate(18deg)}.impact{position:absolute;left:50%;top:45%;width:20px;height:20px;transform:translate(-50%,-50%) scale(0);border-radius:50%;background:#fff;box-shadow:0 0 0 20px #ffdd3a,0 0 0 38px #ff325f,0 0 50px 40px #fff;z-index:7;pointer-events:none}.impact.boom{animation:boom .22s ease-out}@keyframes boom{0%{transform:translate(-50%,-50%) scale(.1);opacity:1}100%{transform:translate(-50%,-50%) scale(1.8);opacity:0}}.floaters{position:absolute;inset:0;pointer-events:none;z-index:8}.floater{position:absolute;font-weight:1000;font-size:28px;text-shadow:0 3px 0 #3c0711,0 0 16px #fff;animation:floatUp .9s ease-out forwards}@keyframes floatUp{to{transform:translateY(-90px) rotate(-8deg);opacity:0}}.commentary{position:absolute;left:18px;right:18px;bottom:16px;z-index:5;text-align:center;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:12px 14px;color:#fff1bc;font-weight:900}.controls{display:grid;grid-template-columns:1fr 160px 110px 90px;gap:12px;margin-top:14px;align-items:center}.skillcheck{position:relative;display:grid;place-items:center;min-height:220px;border:1px solid rgba(255,255,255,.16);background:rgba(0,0,0,.35);border-radius:24px;padding:12px}.ring{position:relative;width:180px;height:180px;border-radius:50%;background:conic-gradient(from var(--targetStart),transparent 0deg,var(--zoneColor) 0deg,var(--zoneColor) var(--zoneSize),transparent var(--zoneSize) 360deg),radial-gradient(circle,#1a060b 0 53%,transparent 54%),conic-gradient(#69202d,#ff315f,#69202d,#ffb02e,#69202d);box-shadow:inset 0 0 0 10px rgba(0,0,0,.42),0 0 35px rgba(255,49,95,.34)}.ring:after{content:"";position:absolute;inset:54px;border-radius:50%;background:#14060a;border:2px solid rgba(255,255,255,.14)}.pointer{position:absolute;left:50%;top:50%;width:5px;height:92px;background:#fff;border-radius:999px;transform-origin:50% 0;box-shadow:0 0 14px #fff;z-index:3}.centerText{position:absolute;text-align:center;z-index:4;font-family:"Courier New",monospace;font-weight:1000}.centerText b{display:block;font-size:34px;color:#fff}.centerText span{color:#ffcad4;font-size:13px}.checks{position:absolute;bottom:10px;display:flex;gap:8px}.checkDot{width:16px;height:16px;border-radius:50%;background:#3b141d;border:1px solid #955061}.checkDot.on{background:#ffcf36;box-shadow:0 0 18px #ffcf36}.meter-label{position:absolute;top:10px;left:16px;color:#ffc4cf;font-weight:900}.hint{position:absolute;right:16px;top:12px;color:#a98b94;font-size:12px;font-weight:800}button{border:0;border-radius:22px;padding:18px 16px;font-size:19px;font-weight:1000;color:white;background:linear-gradient(180deg,#ff4d70,#9a102c);box-shadow:0 8px 0 #5d0718,0 16px 24px rgba(0,0,0,.35);cursor:pointer}button:active{transform:translateY(5px);box-shadow:0 3px 0 #5d0718,0 8px 16px rgba(0,0,0,.35)}#guardBtn{background:linear-gradient(180deg,#3da8ff,#1453b5);box-shadow:0 8px 0 #0a2a65,0 16px 24px rgba(0,0,0,.35)}#restartBtn{background:linear-gradient(180deg,#6d7380,#292f39);box-shadow:0 8px 0 #11151d,0 16px 24px rgba(0,0,0,.35)}button:disabled{filter:grayscale(1);opacity:.55;cursor:not-allowed}.rules{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.rules div{border:1px solid rgba(255,255,255,.14);border-radius:18px;background:rgba(0,0,0,.3);padding:12px}.rules b{display:block;color:#ffcf36}.rules span{color:#ffc4cf;font-size:13px;font-weight:700}.player.slap{animation:pSlap .22s ease-out}.enemy.slap{animation:eSlap .22s ease-out}.player.hit{animation:pHit .34s ease-out}.enemy.hit{animation:eHit .34s ease-out}.guarding{filter:drop-shadow(0 0 20px #4db8ff) drop-shadow(0 24px 20px rgba(0,0,0,.45))}@keyframes pSlap{50%{transform:translateX(105px) rotate(6deg)}}@keyframes eSlap{50%{transform:translateX(-105px) rotate(-6deg)}}@keyframes pHit{35%{transform:translateX(-38px) rotate(-9deg)}}@keyframes eHit{35%{transform:translateX(38px) rotate(9deg)}}.arena.ko{animation:shake .45s linear}@keyframes shake{20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-6px)}80%{transform:translateX(6px)}}@media(max-width:720px){#app{padding:12px 10px}.arena{min-height:500px}.hud{grid-template-columns:1fr 1fr}.scorebox{grid-column:1/3;grid-row:1}.stage{height:320px}.fighter{width:120px;height:210px;bottom:24px}.fighter.player{left:0}.fighter.enemy{right:0}.head{width:78px;height:78px;left:22px;font-size:21px}.body{top:72px;left:30px}.arm{top:78px}.player .arm{left:75px}.enemy .arm{right:75px}.controls{grid-template-columns:1fr 1fr;gap:10px}.skillcheck{grid-column:1/3}.rules{grid-template-columns:1fr}.commentary{font-size:13px;border-radius:18px}.topbar{align-items:flex-start}.topbar p{font-size:13px}}