@font-face{font-family:'Naspor Oswald';src:url('/fonts/Oswald-Variable.ttf') format('truetype');font-style:normal;font-weight:200 700;font-display:swap}
:root {
  --bg:#0b0b0b; --panel:linear-gradient(115deg,#232323f7,#111111fa);
  --line:#3c3c39; --text:#f3f2ee; --muted:#b0b0ab; --red:#f31327; --green:#39d88d;
  --radius:4px; --gap:12px; --app-width:430px; --nav-height:64px;
  --safe-b:env(safe-area-inset-bottom,0px); --safe-t:env(safe-area-inset-top,0px);
  --display:'Naspor Oswald','Arial Narrow',Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font:14px/1.4 Arial,Helvetica,sans-serif}
body{overscroll-behavior-y:none}
button,input{font:inherit;color:inherit}
button{cursor:pointer;touch-action:manipulation}
button:disabled{cursor:default;color:#9f9f9b}
a.primary{text-decoration:none}
button:active{transform:scale(.985)}
button:focus-visible,input:focus-visible{outline:2px solid var(--text);outline-offset:3px}
h1,h2,h3,p{margin:0}h2{font-size:18px}small{font-size:11px}
.app-shell{position:relative;isolation:isolate;width:100%;max-width:var(--app-width);min-height:100dvh;margin:auto;border-inline:1px solid #282826}
/* The only artwork layer: proportional cover, no repeated or duplicated image. */
.app-shell:before{content:"";position:fixed;inset:0 auto 0 50%;transform:translateX(-50%);width:min(428px,calc(100% - 2px));z-index:-1;pointer-events:none;background:linear-gradient(#0007,#0009),url('./grunge-bg.png') center bottom / cover no-repeat}
.phone-page{padding:calc(12px + var(--safe-t)) 18px calc(24px + var(--safe-b));min-height:100dvh}
.phone-page.with-nav{padding-bottom:calc(var(--nav-height) + 24px + var(--safe-b))}
.ui-icon{display:block;width:24px;height:24px;flex-shrink:0}
.icon-btn{display:grid;place-items:center;width:40px;height:40px;border:0;background:none;flex-shrink:0}
.topbar{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:5px;align-items:center;min-height:44px;margin-bottom:16px}
.topbar h1{font:700 18px/1.5 var(--display);text-align:center;overflow-wrap:anywhere}
.topbar>span:empty{width:40px}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:inset 0 1px #ffffff08}
.primary,.secondary{display:flex;justify-content:center;align-items:center;gap:9px;width:100%;min-height:50px;padding:11px 10px;border-radius:var(--radius);font:700 19px/1.5 var(--display);border:1px solid transparent;margin-top:12px;text-align:center}
.primary{background:var(--red);color:#090909;box-shadow:inset 0 1px #ff667044}
.secondary{background:#151515f5;border-color:#666;color:var(--text)}
.primary .ui-icon{width:23px;height:23px}
.amount{font-family:Arial,Helvetica,sans-serif;font-weight:800;letter-spacing:0;font-variant-numeric:tabular-nums;white-space:nowrap}
.muted,.person-copy small,.player small{color:var(--muted)}
.eyebrow{display:block;font-size:12px;font-weight:400;color:#c8c8c3}
.person{display:flex;gap:10px;align-items:center;min-width:0}
.person-copy{flex:1;min-width:0;overflow-wrap:anywhere}
.person-copy strong,.person-copy small,.person-copy>.muted{display:block}
.person-copy strong{font-size:13px;line-height:18px}
.person-copy small{line-height:16px}
.avatar{position:relative;display:grid;place-items:center;width:50px;height:50px;flex-shrink:0;border:1px solid #686862;border-radius:50%;overflow:hidden;background:linear-gradient(135deg,#353535,#131313);font-size:21px;font-weight:700}
.avatar.small{width:36px;height:36px;font-size:15px}
.avatar-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;background:#171717}
.user-level{display:table;border:1px solid #555;border-radius:3px;padding:0 4px;margin-top:3px;font-size:9px;color:#cececa;line-height:15px}
.home-profile{min-height:58px;margin:5px 0 12px}
.home-profile h2{line-height:24px}
.balance-row{display:flex;align-items:center;justify-content:space-between;min-height:70px;padding:9px 12px;border-color:#65655e}
.balance-row .amount{display:block;font-size:29px;line-height:33px}
.square{display:grid;place-items:center;width:42px;height:42px;border:1px solid #777;background:linear-gradient(#343434,#171717);border-radius:var(--radius)}
.home-create{min-height:60px;font-size:24px}
.home-create .ui-icon{width:29px;height:29px}
.game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:12px}
.game-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-width:0;min-height:82px;padding:10px 4px;font-size:11px;font-weight:600}
.game-card .ui-icon{width:34px;height:34px}
.selected{border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red),0 0 8px #f313271a}
.section-title{display:flex;align-items:center;justify-content:space-between;min-height:28px;margin:12px 0 5px}
.section-title h3{font-size:12px;font-weight:400;color:#cecec9}
.badge{background:var(--red);padding:0 7px;border-radius:3px;font-size:12px;font-weight:800;color:#080808}
.text-btn{display:flex;align-items:center;gap:3px;background:none;border:0;font-size:12px;min-height:30px;color:#ccc}
.text-btn .ui-icon{width:14px;height:14px}
.list{display:flex;flex-direction:column;gap:5px}
.list-row{display:flex;align-items:center;justify-content:space-between;padding:8px;min-height:66px;text-align:left;gap:5px}
.list-row .person-copy>span{display:block;font-size:11px}
.duel-age{font-size:10px;color:#b4bfc0;white-space:nowrap}
.wait{color:#bfc1bc}.turn,.loss{color:var(--red)}.win{color:var(--green)}
.history-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:8px;min-height:58px}
.history-row>.amount{font-size:12px}.score-small{font-size:12px;white-space:nowrap}
.demo-note{margin-top:17px;text-align:center;color:#b3b3af;font-size:10px;line-height:16px}
.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(var(--app-width),100%);height:calc(var(--nav-height) + var(--safe-b));padding:7px 8px calc(7px + var(--safe-b));display:grid;grid-template-columns:repeat(4,1fr);z-index:10;background:#0c0c0c;border-top:1px solid #353532}
.bottom-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:none;border:0;color:#aaa;font-size:10px}
.bottom-nav .active{color:var(--red)}.bottom-nav .ui-icon{width:22px;height:22px}
.form-section{margin-bottom:16px}
.form-section .game-grid{margin-top:7px}
.scribble{margin:8px 0 0;text-align:center;color:#aaa;font:italic 12px/1.5 'Segoe Print',Arial,sans-serif}
.stake-display{display:grid;place-items:center;min-height:54px;margin:7px 0;font-size:27px}
.stake-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.stake-picker button{min-height:38px;font-size:13px}
.search{display:flex;align-items:center;gap:7px;padding:0 10px;margin:7px 0 9px;min-height:42px}
.search .ui-icon{width:18px;height:18px;color:var(--muted)}
.search input{width:100%;min-width:0;border:0;background:none;padding:10px 0;outline-offset:0;font-size:13px}
.search input::placeholder{color:#aaa}
.friend-row{display:flex;justify-content:space-between;align-items:center;gap:7px;padding:6px 8px;min-height:52px}
.choice-btn{border:1px solid #555;border-radius:3px;background:#212121;padding:6px 9px;min-width:73px;min-height:34px;font-size:11px}
.selected .choice-btn{border-color:var(--red);color:var(--red)}
.empty-state{padding:14px;font-size:12px;color:var(--muted)}
.selection-summary{display:flex;justify-content:space-between;flex-wrap:wrap;gap:5px;border-block:1px solid #454541;padding:8px 0;font-size:12px;color:#ccc;overflow-wrap:anywhere}
.status-tag{border:1px solid var(--red);border-radius:3px;padding:3px 5px;font-size:9px;font-weight:700;color:var(--red);white-space:nowrap}
.status-tag.green{color:var(--green);border-color:var(--green)}
.invite-poster{padding:22px 0 18px;text-align:center}
.duel-portraits{display:grid;grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr);align-items:center;gap:7px;margin-top:22px}
.portrait-card{display:flex;align-items:center;flex-direction:column;gap:12px;padding:16px 6px 6px;background:linear-gradient(135deg,#32322f,#121212);border:4px solid #bcbcb4;color:#111;transform:rotate(-4deg);box-shadow:0 4px 10px #0008}
.portrait-card:last-child{transform:rotate(4deg)}
.portrait-card .avatar{width:76px;height:76px;font-size:34px;color:#eee;border:3px solid #555}
.portrait-card strong{font-size:12px;max-width:100%;width:100%;padding:4px;background:#cecec6;overflow-wrap:anywhere}
.vs{font:700 32px/1.5 var(--display);color:var(--red);text-align:center}
.duel-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px;margin-top:16px}
.duel-meta>span:first-child{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700}
.duel-meta small,.duel-meta b{display:block}.duel-meta b{font-size:20px}
.challenge-note{padding:12px;margin-top:10px;font-size:13px}
.street-note{font:italic 20px/1.3 'Segoe Print',Arial,sans-serif;color:#bcbcb6;transform:rotate(-4deg);margin:28px 8px 16px;overflow-wrap:anywhere}
.street-note.right{text-align:right}
.players-strip,.result-players{display:grid;grid-template-columns:minmax(0,1fr) 35px minmax(0,1fr);gap:8px;align-items:center}
.players-strip{margin:23px 0 30px}
.player{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0;text-align:center;overflow-wrap:anywhere}
.player b{font-size:14px;max-width:100%}
.move-zone{text-align:center}.move-zone h2{font:700 23px/1.5 var(--display)}
.move-zone>p{font-size:12px;line-height:1.6;margin-top:8px}
.moves{margin-top:22px}.moves .game-card{min-height:115px;gap:14px}
.moves .ui-icon{width:43px;height:43px}
.timer{display:flex;align-items:center;gap:13px;margin:24px 0 8px}
.timer i{height:5px;border:1px solid #444;flex:1;border-radius:3px;background:#171717}
.timer i:first-child{background:linear-gradient(to right,var(--red) 48%,#171717 48%)}
.timer strong{font-size:12px;font-weight:400}
.result-head{text-align:center;margin-top:22px}
.victory{font:700 42px/1.5 var(--display);transform:rotate(-3deg);text-shadow:3px 3px #a41425;max-width:100%}
.victory.defeat{font-size:38px;color:#e0dfdb}
.score{font-size:36px;margin:15px 0}
.result-players .avatar{width:62px;height:62px;font-size:26px}
.move-label{display:flex;align-items:center;justify-content:center;gap:4px;font-size:9px;color:#ccc}
.move-label .ui-icon{width:18px;height:18px}
.money-card{padding:8px 12px;margin-top:22px}
.money-card>div{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid #333}
.money-card>div:last-child{border:0}.money-card span{font-size:12px;color:#bbb}.money-card b{font-size:15px}
.seg{display:flex;background:#171717;border:1px solid var(--line);padding:3px;gap:3px;border-radius:var(--radius);margin-bottom:12px}
.seg button{flex:1;min-width:0;min-height:35px;border:0;border-radius:3px;background:none;color:#bbb;font-size:12px;padding:5px}
.seg button.active{background:#e1e1da;color:#111}
.profile-head{margin:20px 0}.profile-head .avatar{width:66px;height:66px;font-size:27px}
.level-progress{height:4px;width:110px;max-width:100%;background:linear-gradient(to right,var(--red) 60%,#333 60%);margin-top:7px}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.stats>div{text-align:center;padding:13px 4px;border-right:1px solid var(--line)}.stats>div:last-child{border:0}
.stats b,.stats span{display:block}.stats b{font-size:24px}.stats span{font-size:11px;color:#bbb}
.profit{padding:13px;margin-top:10px}.profit strong{font-size:27px}.profit span{display:block;font-size:12px}
.menu-list{margin-top:14px;overflow:hidden}
.menu-list button{display:flex;align-items:center;gap:10px;min-height:47px;width:100%;padding:10px;border:0;border-bottom:1px solid var(--line);background:none;text-align:left;font-size:12px}
.menu-list button:last-child{border:0}.menu-list button>span{flex:1}.menu-list small{color:#aaa;font-size:10px}.menu-list .ui-icon{width:18px;height:18px}
.rank{display:grid;grid-template-columns:18px 32px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:48px;padding:7px 8px;font-size:12px}
.rank .avatar{width:32px;height:32px;font-size:13px}.rank>span{overflow-wrap:anywhere}.rank .amount{font-size:12px}.rank>b{color:#bbb}
.rank.me{border-color:var(--red);box-shadow:inset 0 0 0 1px #f3132744}
.rules-card{padding:16px;margin:16px 0}
.rules-card h2{font-size:18px;margin-bottom:12px}
.rules-card p{font-size:13px;color:var(--muted);margin:10px 0;line-height:1.65}
.closed-state{padding:32px 4px;text-align:center}
.closed-state h2{font:700 27px/1.5 var(--display);margin:16px 0}
.closed-state p{font-size:13px;line-height:1.7}
.closed-state>.ui-icon{width:44px;height:44px;margin:auto;color:var(--red)}
.login-brand{font:700 52px/1.5 var(--display);margin:55px 0 25px;text-align:center}
.login-brand span{display:block;font:10px/2 Arial,sans-serif;letter-spacing:3px}
.notice{padding:12px 18px;border-bottom:1px solid var(--red);background:#251517;color:#f5dfe0;font-size:12px;overflow-wrap:anywhere}
.notice .text-btn{color:#fff}
.section-intro{margin:0 0 14px;font-size:12px}
.invite-link{display:block;margin-top:12px;font-size:12px}
.invite-link input{display:block;width:100%;min-width:0;padding:10px;margin-top:5px;background:#171717;border:1px solid var(--line);border-radius:var(--radius);font-size:12px;color:#ddd}
.game-card.selected:disabled{color:var(--text)}
@media(max-width:360px){
  .phone-page{padding-inline:12px}.topbar{gap:2px}.topbar h1{font-size:16px}.status-tag{font-size:8px;padding:3px}
  .history-row{gap:5px}.history-row .person{gap:6px}.history-row .avatar{width:30px;height:30px}
  .history-row .amount{font-size:11px}.history-row small{font-size:10px}.rank{gap:5px;padding-inline:6px}
  .primary,.secondary{font-size:17px}.home-create{font-size:23px}.victory{font-size:36px}.victory.defeat{font-size:33px}
  .portrait-card .avatar{width:64px;height:64px}.moves .game-card{min-height:105px}.game-card{font-size:10px}
}

/* === GAME FEEL PASS v1 === */
.move-icon{display:block;width:46px;height:46px;flex:0 0 auto;color:#f0efe9;filter:drop-shadow(0 2px 0 #0008)}
.move-icon .move-fill{fill:currentColor;stroke:currentColor}
.move-icon .move-cut{fill:none;stroke:#111;stroke-width:3.2}
.move-icon.compact{width:35px;height:35px}
.move-icon.tiny{width:20px;height:20px;filter:none}
.move-icon.clash-icon{width:86px;height:86px;filter:drop-shadow(0 8px 12px #000b)}
.move-rock{stroke-width:2.4}.move-scissors{stroke-width:3.5}.move-paper{stroke-width:3}
.move-card{position:relative;overflow:hidden;min-height:128px!important;gap:8px!important;background:linear-gradient(155deg,#242424f7,#101010fa)}
.move-card:before{content:"";position:absolute;inset:auto -12px 8px auto;width:48px;height:2px;background:#ffffff16;transform:rotate(-11deg)}
.move-card .move-icon{width:58px;height:58px}
.move-card small{font:700 8px/1.2 var(--display);letter-spacing:1.1px;color:#74746f}
.move-card.selected{background:linear-gradient(155deg,#321619,#111);box-shadow:inset 0 0 0 1px var(--red),0 0 24px #f3132726}
.move-card.selected .move-icon{color:#fff;animation:lockedPulse 1.25s ease-in-out infinite}
.locked-stamp{display:inline-block;margin:9px auto 0;padding:4px 10px;border:2px solid var(--red);color:var(--red);font:700 13px/1.15 var(--display);letter-spacing:1px;transform:rotate(-4deg);animation:stampIn .28s cubic-bezier(.16,.85,.3,1.35) both}
.play-page .players-strip{position:relative}
.play-page .players-strip:after{content:"";position:absolute;left:50%;top:50%;width:44px;height:2px;background:var(--red);transform:translate(-50%,-50%) rotate(-12deg);opacity:.55}

.result-page{animation:pagePunch .34s ease-out both}
.result-kicker{display:inline-block;margin-bottom:5px;color:#8f8f89;font:700 10px/1 var(--display);letter-spacing:2px}
.victory.win{color:#f5f2ec;text-shadow:4px 4px #b40f20,-2px 1px #000}
.victory.defeat{color:#d8d6d0;text-shadow:3px 3px #6f1119,-1px 1px #000}
.victory.draw{color:#eceae4;text-shadow:3px 3px #555,-1px 1px #000}
.fair-result{display:flex;align-items:center;gap:11px;margin-top:18px;padding:10px 12px;border:1px solid #42423e;background:#141414dd;border-radius:var(--radius);text-align:left}
.fair-result>span{display:grid;place-items:center;width:30px;height:30px;border:1px solid #5b5b55;border-radius:50%;color:var(--green);font-weight:900}
.fair-result b,.fair-result small{display:block}.fair-result b{font:700 11px/1.25 var(--display);letter-spacing:.8px}.fair-result small{margin-top:2px;color:#999;font-size:10px}
.rematch-stamp{position:relative;overflow:visible;animation:rematchStamp .5s .15s cubic-bezier(.15,.8,.2,1.25) both}
.rematch-stamp:after{content:"REVANSH //";position:absolute;right:11px;bottom:-8px;padding:1px 5px;background:#0e0e0e;border:1px solid #dfdfd6;color:#dfdfd6;font:700 7px/1.4 var(--display);letter-spacing:1px;transform:rotate(-5deg)}

.reveal-page{position:relative;overflow:hidden;min-height:100dvh;padding:calc(12px + var(--safe-t)) 14px calc(16px + var(--safe-b));background:radial-gradient(circle at 50% 46%,#2b1015 0,#111 34%,#090909 70%);isolation:isolate}
.reveal-page:before,.reveal-page:after{content:"";position:absolute;pointer-events:none;z-index:-1}
.reveal-page:before{inset:-15%;background:repeating-linear-gradient(112deg,transparent 0 28px,#ffffff06 29px 30px,transparent 31px 58px);transform:rotate(-3deg);opacity:.7}
.reveal-page:after{left:-12%;right:-12%;top:52%;height:12px;background:var(--red);transform:rotate(-7deg) scaleX(0);transform-origin:center;animation:redSlash .28s 1.98s cubic-bezier(.2,.9,.2,1) forwards;box-shadow:0 0 24px #f3132748}
.reveal-kicker{display:flex;align-items:center;justify-content:space-between;color:#8f8f89;font:700 9px/1.2 var(--display);letter-spacing:1.4px;min-height:32px}
.reveal-kicker b{color:#e8e6df;font-size:12px}
.reveal-stage{position:relative;min-height:calc(100dvh - 90px - var(--safe-t) - var(--safe-b));display:grid;grid-template-rows:auto 1fr auto;align-items:center;animation:thirdBeatShake .34s 1.96s linear both}
.reveal-fighters{display:grid;grid-template-columns:1fr 42px 1fr;gap:8px;align-items:center;margin-top:18px}
.reveal-fighter{display:flex;align-items:center;gap:8px;min-width:0;opacity:0;animation:fighterIn .55s cubic-bezier(.18,.82,.25,1) forwards}
.reveal-fighter.right{flex-direction:row-reverse;text-align:right;animation-name:fighterInRight}
.reveal-fighter .avatar{width:44px;height:44px;font-size:17px}
.reveal-fighter b{font:700 13px/1.1 var(--display);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reveal-vs{color:var(--red);font:700 30px/1 var(--display);text-align:center;opacity:0;transform:scale(2) rotate(-8deg);animation:vsHit .34s .28s cubic-bezier(.12,.84,.25,1.3) forwards}
.countdown-stack{position:absolute;inset:18% 0 auto;display:grid;place-items:center;pointer-events:none;z-index:7}
.countdown-stack span{grid-area:1/1;color:#f4f0e8;font:700 clamp(42px,14vw,64px)/1 var(--display);letter-spacing:2px;opacity:0;text-shadow:5px 5px 0 #000,-3px 2px 0 #a10e1c;transform:scale(.4) rotate(-8deg)}
.countdown-stack span:nth-child(1){animation:countBeat .48s .58s ease-out both}
.countdown-stack span:nth-child(2){animation:countBeat .48s 1.24s ease-out both}
.countdown-stack span:nth-child(3){animation:countBeat .62s 1.91s ease-out both}
.rps-showdown{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:0;min-height:310px;margin-top:30px;overflow:visible}
.rps-side{position:relative;height:276px;display:grid;place-items:center;overflow:visible}
.rps-side .move-icon{color:#f4f0e8;filter:drop-shadow(0 14px 22px #000d)}
.rps-side.left{transform-origin:100% 68%}.rps-side.right{transform-origin:0 68%}
.counting-hand,.final-hand{position:absolute;inset:0;display:grid;place-items:center;opacity:0;pointer-events:none;will-change:transform,opacity}
.counting-hand .rps-fist{width:138px;height:138px}
.rps-side.right .move-icon{transform:scaleX(-1)}
.counting-hand{z-index:3;animation:rpsCountLeft 1.48s .47s cubic-bezier(.42,0,.25,1) both}
.rps-side.right .counting-hand{animation-name:rpsCountRight}
.final-hand{z-index:4;animation:rpsHandRevealLeft .62s 1.82s cubic-bezier(.12,.78,.15,1.08) forwards}
.rps-side.right .final-hand{animation-name:rpsHandRevealRight}
.final-hand .rps-final{width:154px;height:154px}
.third-beat-flash{position:absolute;left:50%;top:54%;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,#fff 0 2%,#f31327b8 7%,#f3132730 36%,transparent 70%);transform:translate(-50%,-50%) scale(.1);opacity:0;z-index:2;animation:thirdFlash .44s 1.96s ease-out both;filter:blur(.3px)}
.impact-particles{position:absolute;left:50%;top:54%;width:8px;height:8px;pointer-events:none;z-index:5}
.impact-particles i{--a:calc(var(--i) * 30deg);position:absolute;left:0;top:0;width:4px;height:14px;background:var(--red);opacity:0;transform:rotate(var(--a)) translateY(0) scaleY(.3);transform-origin:50% 0;animation:particleBurst .48s 2.00s ease-out forwards}
.impact-particles i:nth-child(3n){background:#e8e5de;width:3px}.impact-particles i:nth-child(4n){height:21px}
.reveal-outcome{align-self:end;text-align:center;opacity:0;transform:translateY(24px);animation:outcomeIn .46s 2.70s cubic-bezier(.16,.8,.22,1) forwards;padding-bottom:26px}
.reveal-outcome small,.reveal-outcome strong,.reveal-outcome span{display:block}
.reveal-outcome small{color:#85857f;font:700 9px/1.2 var(--display);letter-spacing:2px;margin-bottom:6px}
.reveal-outcome strong{font:700 clamp(34px,10vw,50px)/1.02 var(--display);letter-spacing:.5px;text-shadow:4px 4px #8e101b;transform:rotate(-2deg)}
.reveal-outcome span{margin-top:10px;color:#a6a69f;font-size:10px;letter-spacing:.6px}.reveal-outcome i{color:var(--red);font-style:normal;font-weight:900;margin:0 5px}
.reveal-win .reveal-outcome strong{color:#f1eee7}.reveal-loss .reveal-outcome strong{color:#d5d2cb;text-shadow:4px 4px #571016}.reveal-draw .reveal-outcome strong{color:#e7e4dc;text-shadow:4px 4px #444}
.reveal-demo{position:absolute;left:0;right:0;bottom:calc(7px + var(--safe-b));margin:0;opacity:.55}
.reveal-v2 .final-hand{animation-timing-function:cubic-bezier(.08,.86,.15,1.13)}
.reveal-v3 .countdown-stack span{letter-spacing:7px}.reveal-v3:after{transform:rotate(5deg) scaleX(0);animation-name:redSlashAlt}

@keyframes lockedPulse{50%{transform:scale(.94);opacity:.8}}
@keyframes stampIn{0%{opacity:0;transform:scale(1.65) rotate(-10deg)}100%{opacity:1;transform:scale(1) rotate(-4deg)}}
@keyframes rematchStamp{0%{opacity:0;transform:scale(1.2) rotate(-2deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes pagePunch{0%{opacity:.3;transform:scale(.985)}100%{opacity:1;transform:none}}
@keyframes fighterIn{0%{opacity:0;transform:translateX(-30px)}100%{opacity:1;transform:none}}
@keyframes fighterInRight{0%{opacity:0;transform:translateX(30px)}100%{opacity:1;transform:none}}
@keyframes vsHit{100%{opacity:1;transform:scale(1) rotate(-8deg)}}
@keyframes countBeat{0%{opacity:0;transform:scale(.45) rotate(-9deg)}32%{opacity:1;transform:scale(1.08) rotate(-3deg)}72%{opacity:1;transform:scale(1) rotate(-2deg)}100%{opacity:0;transform:scale(1.65) rotate(4deg)}}
@keyframes particleBurst{0%{opacity:0;transform:rotate(var(--a)) translateY(0) scaleY(.3)}25%{opacity:1}100%{opacity:0;transform:rotate(var(--a)) translateY(-76px) scaleY(1)}}
@keyframes rpsCountLeft{0%{opacity:0;transform:translate(-10px,-26px) rotate(-10deg) scale(.94)}6%{opacity:1}18%{transform:translate(-2px,34px) rotate(5deg) scale(1.02)}34%{transform:translate(-10px,-25px) rotate(-10deg) scale(.98)}48%{transform:translate(-10px,-25px) rotate(-10deg) scale(.98)}64%{transform:translate(-1px,36px) rotate(6deg) scale(1.03)}80%{transform:translate(-10px,-24px) rotate(-10deg) scale(.99)}93%{opacity:1;transform:translate(-1px,40px) rotate(7deg) scale(1.02)}100%{opacity:0;transform:translate(4px,10px) rotate(1deg) scale(.96)}}
@keyframes rpsCountRight{0%{opacity:0;transform:translate(10px,-26px) rotate(10deg) scale(.94)}6%{opacity:1}18%{transform:translate(2px,34px) rotate(-5deg) scale(1.02)}34%{transform:translate(10px,-25px) rotate(10deg) scale(.98)}48%{transform:translate(10px,-25px) rotate(10deg) scale(.98)}64%{transform:translate(1px,36px) rotate(-6deg) scale(1.03)}80%{transform:translate(10px,-24px) rotate(10deg) scale(.99)}93%{opacity:1;transform:translate(1px,40px) rotate(-7deg) scale(1.02)}100%{opacity:0;transform:translate(-4px,10px) rotate(-1deg) scale(.96)}}
@keyframes rpsHandRevealLeft{0%{opacity:0;transform:translate(-2px,38px) rotate(7deg) scale(.82)}12%{opacity:.25;transform:translate(-1px,25px) rotate(4deg) scale(.88)}30%{opacity:1;transform:translate(3px,-6px) rotate(-3deg) scale(1.08)}62%{opacity:1;transform:translate(8px,-17px) rotate(2deg) scale(1.12)}100%{opacity:1;transform:translate(0,-8px) rotate(-2deg) scale(1)}}
@keyframes rpsHandRevealRight{0%{opacity:0;transform:translate(2px,38px) rotate(-7deg) scale(.82)}12%{opacity:.25;transform:translate(1px,25px) rotate(-4deg) scale(.88)}30%{opacity:1;transform:translate(-3px,-6px) rotate(3deg) scale(1.08)}62%{opacity:1;transform:translate(-8px,-17px) rotate(-2deg) scale(1.12)}100%{opacity:1;transform:translate(0,-8px) rotate(2deg) scale(1)}}
@keyframes thirdFlash{0%{opacity:0;transform:translate(-50%,-50%) scale(.1)}28%{opacity:1;transform:translate(-50%,-50%) scale(1.2)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.65)}}
@keyframes thirdBeatShake{0%,100%{transform:none}20%{transform:translate(-3px,2px) rotate(-.2deg)}45%{transform:translate(4px,-2px) rotate(.25deg)}70%{transform:translate(-2px,-1px)}}
@keyframes redSlash{to{transform:rotate(-7deg) scaleX(1)}}
@keyframes redSlashAlt{to{transform:rotate(5deg) scaleX(1)}}
@keyframes outcomeIn{to{opacity:1;transform:translateY(0)}}

@media(max-width:360px){
  .move-card{min-height:112px!important}.move-card .move-icon{width:49px;height:49px}.move-card small{font-size:7px}
  .reveal-outcome{padding-bottom:18px}.reveal-fighter .avatar{width:38px;height:38px}.counting-hand .rps-fist{width:118px;height:118px}.final-hand .rps-final{width:134px;height:134px}.rps-showdown{min-height:270px}.rps-side{height:240px}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-delay:0ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .reveal-page:after{transform:rotate(-7deg) scaleX(1)}.countdown-stack{display:none}.reveal-fighter,.reveal-vs,.counting-hand,.final-hand,.reveal-outcome{opacity:1;transform:none}.counting-hand{display:none}
}
