/* RUKUS street-sports exploration: original splash and character art, bolder game UI. */
:root{--grape:#281b47;--mango:#ffcd46;--coral:#f66c71;--mint:#70d9c9;--paper:#faf2de}
button,h1,h2,.mode-card strong,.character-card strong{font-family:Impact,'Arial Black',sans-serif;font-weight:900;font-style:italic;letter-spacing:.025em}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid var(--mango);outline-offset:5px}button{transition:transform .14s,filter .14s}button:active{transform:translateY(3px) scale(.98)}
#menu::before{background:linear-gradient(90deg,transparent 42%,#281b4744 62%,#281b47e8)}.menu-nav{right:6%;width:clamp(290px,28vw,410px)}.menu-brand{max-height:190px;margin-bottom:30px}.menu-nav button{background:var(--paper);border:3px solid #160f28;box-shadow:6px 6px 0 #160f28;transform:skew(-6deg);min-height:58px;padding:13px 24px;color:var(--grape);font-size:23px}.menu-nav button:hover{background-color:var(--paper);transform:skew(-6deg) translateX(-7px)}.menu-nav #play{background:var(--mango);min-height:84px;font-size:36px;border:3px solid #160f28;box-shadow:7px 7px 0 #160f28;padding:17px 24px;clip-path:polygon(2% 0,100% 3%,96% 100%,0 94%)}.menu-nav #play:hover{background:var(--mango);filter:brightness(1.08)}.menu-nav #play img{width:25px}.menu-nav #friends{background:#281b47dc;color:#aaa0bd;border:2px dashed #a69ab7;box-shadow:none;font-size:19px;opacity:.8}.menu-nav #settings{background:transparent;border:0;box-shadow:none;color:var(--paper);font-size:17px;transform:none;justify-content:flex-start;padding-left:16px}.solo-stamp{font-size:10px;letter-spacing:1.5px;color:var(--mango);font-weight:900;margin:16px 4px 24px;transform:rotate(-2deg)}
#game-flow{background:radial-gradient(ellipse at 80% 20%,#51307788,transparent 65%),repeating-linear-gradient(125deg,transparent 0 95px,#ffffff03 95px 98px),var(--grape);color:var(--paper)}.flow-heading{border:0;position:relative;padding-bottom:24px}.flow-heading::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:4px;background:linear-gradient(100deg,var(--mint) 0 17%,var(--paper) 17% 91%,transparent 91%);transform:skew(-25deg)}.flow-heading h1{font-size:clamp(25px,3.4vw,44px);color:var(--paper);text-shadow:3px 3px 0 #150c2b;transform:rotate(-2deg)}.flow-heading>button{font-family:Arial,sans-serif;font-style:normal;color:var(--mango)}
.mode-card{border:3px solid #100a1d;box-shadow:8px 9px 0 #100a1d;background:#382755;overflow:visible;transform:rotate(-1deg);padding:30px 20px;isolation:isolate}.mode-card:nth-child(2){transform:rotate(1deg)}.mode-card::before{content:'';position:absolute;inset:8px;z-index:-1;border:1px solid #faf2de2b;pointer-events:none}.mode-card>img{width:85px;height:85px;filter:drop-shadow(4px 5px 0 #160f28)}.mode-card strong{font-size:31px;color:var(--paper);text-shadow:3px 3px 0 #160f28}.mode-card small{font-family:Arial,sans-serif;font-style:normal;color:#e4d9ed;font-size:13px}.mode-card:hover,.mode-card:focus-visible{transform:rotate(0) translateY(-7px);border-color:var(--mango);background:#473063}#mode-bank{border-color:var(--mango);background:linear-gradient(160deg,#563c83,#31204d)}.mode-label{background:var(--mango);color:var(--grape);font-family:Arial,sans-serif;font-style:normal;border:2px solid #160f28;font-weight:900}.friends-coming{color:#b4a9c6;border-color:#9c88b6;font-family:Arial,sans-serif;font-style:normal}
.character-card{background:var(--grape);border:3px solid #130c25;box-shadow:9px 10px 0 #130c25;overflow:visible;transform:rotate(-2deg);isolation:isolate}.character-card.wildcard{transform:rotate(2deg);background:linear-gradient(155deg,#70d9c9,#33777c)}.character-card.instigator{background:linear-gradient(155deg,#f66c71,#85376b)}.character-card::before{content:'';position:absolute;inset:10px;border:2px solid #ffffff32;z-index:-1}.character-card>img{transform:scale(1.15) translateY(-10px);filter:drop-shadow(5px 5px 0 #281b4755);object-position:50% 0}.character-card strong{bottom:-2px;left:-7px;right:-7px;width:calc(100% + 14px);padding:14px 8px;background:var(--paper);color:var(--grape);text-shadow:none;font-size:30px;transform:skew(-5deg);border:3px solid #130c25;line-height:1.02}.character-card[aria-pressed=true]{border-color:var(--mango);box-shadow:0 0 0 3px var(--mango),9px 10px 0 #130c25}.selection-tick{background:var(--mango);color:var(--grape);border:2px solid #130c25;transform:rotate(6deg);font-style:normal}.character-note{color:#d2c4df;margin-top:30px}.primary-button,#start-match{background:var(--mango);color:var(--grape);border:3px solid #130c25;box-shadow:6px 7px 0 #130c25;transform:skew(-6deg);font-size:27px;min-height:64px}.difficulty-row select,#settings-dialog select{background:#3b295a;border:2px solid #ab97c3;color:var(--paper)}.difficulty-row{color:#d2c4df}
/* Loading is a full, opaque screen on every fresh start, including cached rematches. */
body[data-ui-screen=loading] #game-flow{padding:0;background:var(--grape);overflow:hidden}body[data-ui-screen=loading] .flow-shell{max-width:none;height:100%}body[data-ui-screen=loading] .flow-heading{position:absolute;z-index:4;left:var(--safe);right:var(--safe);top:var(--safe);border:0}body[data-ui-screen=loading] .flow-heading::after,body[data-ui-screen=loading] .flow-heading>img,body[data-ui-screen=loading] .flow-heading h1{display:none}#loading-screen{position:absolute;inset:0;max-width:none;width:100%;height:100%;min-height:100%;margin:0;border:0;background:#281b47 url('assets/runtime/9dc65821-menu-rooftop-v1.webp') center/cover;display:flex;align-items:center;justify-content:flex-end;gap:16px;padding:8vh 20px 6vh;isolation:isolate}#loading-screen::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(#281b47ad,#281b47e8)}#loading-screen .loading-logo{position:absolute;top:6vh;left:50%;transform:translateX(-50%);width:180px;max-height:100px;object-fit:contain}#loading-versus{position:absolute;inset:12vh 8vw 22vh;display:flex;align-items:center;justify-content:center;gap:4vw;pointer-events:none}#loading-versus img{width:36%;height:100%;object-fit:contain;filter:drop-shadow(9px 12px 0 #140d2b88)}#loading-left{transform:rotate(-5deg)}#loading-right{transform:rotate(5deg)}#loading-versus b{font-family:Impact,'Arial Black',sans-serif;font-style:italic;font-size:clamp(55px,9vw,130px);color:var(--mango);text-shadow:6px 6px 0 #140d2b;transform:rotate(-12deg)}#loading-mode{font-family:Impact,'Arial Black',sans-serif;font-style:italic;letter-spacing:1px;font-size:32px;color:var(--mango);text-shadow:3px 3px 0 #140d2b}#loading-progress{width:min(560px,75vw);max-width:560px;height:15px;border:3px solid var(--paper);transform:skew(-12deg);background:#140d2b}#loading-progress::-webkit-progress-bar{background:#140d2b}#loading-progress::-webkit-progress-value{background:var(--mango)}#loading-label{font-size:10px;letter-spacing:2px}
dialog{background:var(--grape);border:3px solid var(--paper);box-shadow:10px 12px 0 #120b22}dialog h2{color:var(--paper);font-size:34px;text-shadow:3px 3px 0 #120b22;transform:rotate(-3deg)}dialog button{background:var(--paper);color:var(--grape);border:2px solid #120b22;box-shadow:4px 4px 0 #120b22;transform:skew(-5deg);font-size:18px}#pause-resume{background:var(--mango)}#pause-leave{box-shadow:none}#settings-dialog button{background:var(--mango)}input[type=range]{accent-color:var(--mint)}#settings-dialog p{color:#cec0de}
#duel-result{background:repeating-linear-gradient(125deg,transparent 0 70px,#ffffff04 70px 73px),var(--grape);border:4px solid var(--paper);box-shadow:12px 13px 0 #120b22;overflow:visible}.result-kicker{background:var(--mint);color:var(--grape);padding:6px 10px;display:inline-block;transform:rotate(3deg);font-weight:900;letter-spacing:1px}.result-crown{color:var(--mango);text-shadow:3px 3px 0 #120b22}#duel-result h2{font-size:clamp(34px,4vw,56px);color:var(--mango);transform:rotate(-7deg);text-shadow:4px 5px 0 #120b22;-webkit-text-stroke:1px #120b22}#duel-result[data-winner=bot] h2{color:var(--coral)}#duel-result #duel-rematch{background:var(--mango);font-size:24px}#duel-result #duel-menu{background:none;box-shadow:none;border:0;color:var(--paper);font-size:14px}#result-character{filter:drop-shadow(8px 6px 0 #120b2266)}#duel-result p{color:#e3d7ee}
@media(max-width:700px){#menu::before{background:linear-gradient(transparent 15%,#281b4740 35%,#281b47f5 75%)}.menu-nav{width:min(80vw,340px);bottom:3vh}.menu-brand{max-height:115px;margin-bottom:16px}.menu-nav #play{font-size:29px;min-height:65px}.menu-nav button{font-size:20px;min-height:49px;padding:10px 20px}.menu-nav #friends{font-size:16px}.menu-nav #settings{font-size:15px;min-height:30px}.solo-stamp{font-size:9px;margin:12px 5px 20px}.mode-card{padding:22px;min-height:135px}.mode-card strong{font-size:26px}.mode-card>img{width:48px;height:48px}.character-card strong{font-size:22px;padding:12px 3px}.character-card>img{transform:scale(1.1) translateY(-7px)}.flow-heading h1{font-size:22px}.character-note{margin-top:27px}#start-match{font-size:25px}#loading-versus{inset:18vh 2vw 27vh;gap:0}#loading-versus img{width:42%}#loading-versus b{font-size:45px}#loading-screen .loading-logo{top:8vh;width:145px}#loading-mode{font-size:28px}#duel-result h2{font-size:33px}#duel-result #duel-rematch{font-size:18px}#duel-result #duel-menu{font-size:11px}.result-kicker{font-size:7px;padding:5px}}
@media(max-height:600px) and (min-width:701px){.menu-nav{width:280px}.menu-brand{max-height:95px;margin-bottom:12px}.menu-nav #play{min-height:55px;font-size:26px}.menu-nav button{min-height:40px;font-size:18px;padding:9px 20px}.solo-stamp{margin:10px 4px 14px}.character-card strong{font-size:23px;padding:10px}.character-card{height:230px}#loading-versus{inset:9vh 10vw 26vh}#loading-screen .loading-logo{width:110px;top:4vh}#loading-mode{font-size:22px}#loading-screen{gap:8px}}
@media(prefers-reduced-motion:reduce){button{transition:none}}
.character-card{overflow:hidden}.character-card>img{height:112%;width:100%;object-fit:contain;transform:translateY(-10px);object-position:50% 0}.character-card strong{z-index:2}.selection-tick{z-index:3}
@media(max-width:700px){.character-card>img{height:105%;transform:translateY(-7px)}}
#loading-screen:has(#loading-versus:not([hidden])){background:linear-gradient(120deg,#f66c7114 0 39%,transparent 39% 64%,#70d9c910 64%),repeating-linear-gradient(125deg,transparent 0 95px,#ffffff04 95px 98px),var(--grape)}
@media(max-width:700px){#duel-result h2{font-size:27px;letter-spacing:0}}
#result-character,.result-crown,.loading-logo,#loading-versus,.character-card>img{pointer-events:none}#duel-result button{z-index:2}
#start-match{display:block}.character-card>img{height:auto;transform:scale(1.1) translateY(-8px)}
/* Arcade HUD: edge anchors, readable scale, and distinct notification lanes. */
.duel-score{top:max(8px,env(safe-area-inset-top));width:250px;min-width:0;padding:7px 18px 12px;background:#281b47ed;border:2px solid #faf2de9c;clip-path:polygon(3% 0,100% 0,97% 100%,0 100%);border-radius:0;display:grid;grid-template-columns:1fr auto;align-items:center;gap:0 18px}.duel-score #duel-clock{font:900 18px Arial,sans-serif;letter-spacing:1px;grid-column:2;grid-row:1;color:var(--paper)}.duel-score #duel-score{font:900 15px Arial,sans-serif;grid-column:1;grid-row:1;margin:0;color:var(--mango)}.duel-score small{grid-column:1/-1;font:700 7px Arial,sans-serif;letter-spacing:1.4px;margin:3px 0 0}.match-time-track{position:absolute;left:12px;right:12px;bottom:3px;height:4px;background:#faf2de29;overflow:hidden}.match-time-track::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 calc(10% - 2px),#281b47 0 10%)}#match-time-fill{display:block;height:100%;width:100%;transform-origin:left;background:var(--mango);transition:transform .12s linear}.match-time-track[data-urgent=true] #match-time-fill{background:var(--coral)}
.duel-health{left:max(28px,env(safe-area-inset-left));bottom:32px;width:268px;min-width:0;padding:14px 15px 12px 96px;min-height:94px;background:#281b47eb;border:3px solid #faf2de;border-radius:0;box-shadow:6px 7px 0 #150d28;transform:skew(-3deg);overflow:visible}.duel-health .portrait{display:block;left:-15px;top:-26px;width:100px;height:120px;border:3px solid var(--mango);border-radius:12px 2px 12px 2px;background:linear-gradient(145deg,#f66c71,#281b47);box-shadow:5px 5px 0 #150d28}.duel-health .portrait img{transform:scale(3.2);top:0}.duel-health b{font:900 26px Impact,'Arial Black',sans-serif;color:var(--paper);margin-right:5px}.duel-health>span:not(.portrait){font-size:8px}.duel-health i{height:8px;border-radius:0;margin-top:5px}.duel-health em{background:var(--mint)}#player-hearts{display:flex;gap:3px;color:var(--coral);font-size:25px;line-height:1;margin-top:7px;filter:drop-shadow(2px 2px 0 #150d28)}#player-hearts span.empty,#opponent-hearts span.empty{color:#86789a}.duel-health small{position:absolute;bottom:100%;left:90px;font-size:9px;background:#281b47;color:var(--mango)}.duel-health small:empty{display:none}.player-hearts{display:none}
.opponent-hearts{right:24px;top:22px;gap:9px;font-size:27px;color:var(--mint);align-items:center;text-shadow:2px 2px 0 #150d28}.opponent-hearts .portrait{width:76px;height:88px;border-radius:3px;border:3px solid var(--mint);box-shadow:4px 5px 0 #150d28;background:linear-gradient(145deg,#70d9c9,#281b47)}.opponent-hearts .portrait img{transform:scale(3.2)}#opponent-hearts{display:flex;gap:3px;background:#281b47d9;padding:8px 10px;transform:skew(-5deg);border-bottom:3px solid var(--mint)}
.loadout{bottom:max(22px,env(safe-area-inset-bottom));gap:11px;align-items:flex-end}.loadout button{width:96px;height:102px;padding:8px 6px 4px;background:#281b47df;border:3px solid #faf2de91;border-radius:3px;transform:skew(-6deg);box-shadow:5px 6px 0 #150d28;position:relative;transition:transform .15s,border-color .15s}.loadout button.selected{border-color:var(--mango);background:#533a65;transform:skew(-6deg) translateY(-9px);box-shadow:0 4px 0 var(--mango),6px 9px 0 #150d28}.loadout button.selected::before{content:'';position:absolute;top:-12px;left:32%;width:36%;height:5px;background:var(--mango)}.loadout button:hover{transform:skew(-6deg) translateY(-6px)}.loadout img{height:67px;width:100%;margin:0;filter:drop-shadow(3px 4px 0 #130d2b)}.loadout span{font-size:0;margin-top:1px}.loadout b{font:900 12px Arial,sans-serif;padding:3px 7px;background:var(--paper);color:var(--grape);border-radius:1px}.loadout button.selected b{background:var(--mango)}.ammo{right:28px;bottom:32px;width:175px;padding:12px 16px;background:#281b47e8;border:3px solid var(--paper);border-radius:0;box-shadow:5px 6px 0 #150d28;transform:skew(-4deg)}.ammo strong{font:900 34px Impact,'Arial Black',sans-serif;letter-spacing:1px;color:var(--mango)}.ammo span{font-size:10px}
#objective-lane{position:absolute;right:24px;top:170px;width:230px;display:flex;flex-direction:column;gap:12px;align-items:stretch}#bank-guidance{position:relative;inset:auto;transform:none;width:100%;max-width:none;text-align:left;align-items:flex-start;padding:15px 16px;background:#281b47ec;border:2px solid #b59add;border-left:6px solid #b59add;border-radius:0;font-size:13px;box-shadow:5px 5px 0 #150d2855}#bank-carry{font:900 italic 20px Impact,'Arial Black',sans-serif;color:#e4c8ff;letter-spacing:.5px}#bank-tutorial{font:400 11px/1.5 Arial,sans-serif;color:var(--paper)}#bank-skip{font:700 8px Arial,sans-serif;align-self:flex-end;box-shadow:none;transform:none;color:#baadce}#bank-progress{height:9px;accent-color:var(--mint)}#bank-callout{display:none;background:#281b47ec;border:2px solid var(--mint);padding:13px 16px;box-shadow:5px 5px 0 #150d28;font:900 italic 20px Impact,'Arial Black',sans-serif}#bank-callout.visible{display:block}
#bot-warning{top:83px;left:50%;max-width:45vw;width:max-content;transform:translateX(-50%);font:900 10px Arial,sans-serif;letter-spacing:.6px;border:2px solid var(--coral);background:#281b47e8;padding:8px 12px;border-radius:0}#bot-warning:empty{display:none}#duel-feed{left:24px;right:auto;top:95px;max-width:220px;font-size:9px;color:#faf2debb}#duel-message{top:31%;font-family:Impact,'Arial Black',sans-serif;z-index:2}#juice-callout{top:66%;font:900 italic 26px Impact,'Arial Black',sans-serif;letter-spacing:.5px}#utility-status{top:auto;bottom:155px;left:28px;max-width:270px;white-space:normal;transform:none;font:700 11px/1.4 Arial,sans-serif;border-left:4px solid var(--mint);padding:10px 13px;background:#281b47ed;border-radius:0}#toast{top:auto;bottom:218px;left:28px;right:auto;transform:none;max-width:270px;width:max-content;padding:10px 13px;border-left:4px solid var(--mango);background:#281b47ed;font-size:11px;border-radius:0}#hit-confirm{display:none!important}#impact-label{top:calc(50% + 34px);font:900 18px Impact,'Arial Black',sans-serif}body:has(#duel-message:not(:empty)) #juice-callout{visibility:hidden}
@media(max-width:1100px) and (min-width:701px){.loadout button{width:77px;height:90px}.loadout img{height:58px}.loadout{gap:8px}.duel-health{width:230px;padding-left:85px}.duel-health .portrait{width:90px;height:110px}.ammo{width:145px}.opponent-hearts{font-size:23px}}
@media(max-width:700px){.duel-score{top:8px;width:190px;padding:6px 13px 11px;gap:0 10px}.duel-score #duel-clock{font-size:15px}.duel-score #duel-score{font-size:12px}.duel-score small{font-size:6px}.menu-return{top:10px;left:10px}.opponent-hearts{top:68px;right:10px;gap:5px;font-size:20px}.opponent-hearts .portrait{width:48px;height:58px;border-width:2px}#opponent-hearts{padding:5px 7px;gap:1px}.duel-health{left:18px;bottom:119px;width:177px;min-height:75px;padding:10px 9px 9px 65px;border-width:2px}.duel-health .portrait{width:68px;height:83px;left:-9px;top:-10px;border-width:2px}.duel-health b{font-size:22px}#player-hearts{font-size:18px;gap:1px}.duel-health>span:not(.portrait){display:none}.duel-health small{left:65px;font-size:7px}.loadout{bottom:16px;gap:7px}.loadout button{width:69px;height:80px;border-width:2px;padding:5px}.loadout img{height:52px}.loadout b{font-size:10px;padding:2px 6px}.ammo{right:12px;bottom:119px;width:133px;padding:10px 12px;border-width:2px}.ammo strong{font-size:27px}.ammo span{font-size:8px}#objective-lane{top:154px;right:10px;width:166px;gap:8px}#bank-guidance{padding:10px 10px;border-left-width:4px;font-size:10px}#bank-carry{font-size:16px}#bank-tutorial{font-size:9px}#bank-skip{font-size:7px;padding:3px}#bank-callout{font-size:16px;padding:10px}#duel-feed{display:none}#bot-warning{top:69px;left:10px;transform:none;max-width:42vw;font-size:8px;padding:6px;letter-spacing:0}#juice-callout{top:58%;font-size:21px}#utility-status{bottom:212px;left:12px;max-width:175px;font-size:9px;padding:8px}#toast{bottom:265px;left:12px;max-width:175px;font-size:9px;padding:8px}#duel-message[data-phase=go]{font-size:24px;white-space:normal;width:80vw}#duel-message{top:31%}#impact-label{font-size:15px}}
@media(max-height:580px) and (min-width:701px){.loadout{bottom:13px}.loadout button{height:76px;width:75px}.loadout img{height:46px}.duel-health{bottom:20px;min-height:80px}.duel-health .portrait{height:98px;top:-17px}.ammo{bottom:20px}#objective-lane{top:125px;width:205px}#bank-guidance{padding:10px}#bank-carry{font-size:17px}#bank-tutorial{font-size:10px}.opponent-hearts .portrait{height:65px;width:56px}.opponent-hearts{top:15px;font-size:23px}#utility-status{bottom:125px}#toast{bottom:180px}}
@media(prefers-reduced-motion:reduce){#match-time-fill,.loadout button{transition:none}}
#player-hearts span{font-size:inherit;letter-spacing:0;display:inline-block}.duel-score{padding-top:6px;padding-bottom:10px}
/* Character-select showdown. New expressive artwork; original HUD/results stills retained. */
body[data-ui-screen=character] #game-flow{background:radial-gradient(ellipse at 22% 45%,#ae3f6a55,transparent 48%),radial-gradient(ellipse at 80% 42%,#3b948a44,transparent 47%),#1c1232}body[data-ui-screen=character] .flow-shell{max-width:1240px}#character-screen{max-width:1180px;margin-top:22px}.character-cards{position:relative;gap:6vw;isolation:isolate}.character-cards::before{content:'';position:absolute;z-index:3;left:50%;top:43%;width:130px;height:240px;background:var(--mango);transform:translate(-50%,-50%) rotate(14deg);clip-path:polygon(58% 0,15% 46%,49% 43%,33% 100%,94% 35%,58% 39%);pointer-events:none;filter:drop-shadow(5px 6px 0 #090512)}.character-cards::after{content:'VS';position:absolute;z-index:4;left:50%;top:45%;transform:translate(-50%,-50%) rotate(-12deg);font:900 italic clamp(65px,9vw,130px)/1 Impact,'Arial Black',sans-serif;color:var(--paper);-webkit-text-stroke:3px #1c1232;text-shadow:6px 7px 0 #0c0718,0 0 35px #ffcd4666;pointer-events:none}.character-card,.character-card.instigator,.character-card.wildcard{height:clamp(390px,59vh,650px);background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible;transform:none;isolation:isolate}.character-card::before{inset:10px -12px 40px;border:2px solid #faf2de20;transform:skew(-7deg);background:repeating-linear-gradient(125deg,transparent 0 80px,#faf2de05 80px 84px);z-index:-1;transition:border-color .18s,background .18s}.character-card.wildcard::before{transform:skew(7deg)}.character-card>img{height:100%;width:100%;object-fit:contain;top:-8px;left:0;transform:none;filter:none;mask-image:linear-gradient(90deg,transparent,#000 7% 93%,transparent);transition:transform .2s,filter .2s;pointer-events:none}.character-card strong{inset:auto 2% -3px;width:96%;padding:10px 12px;background:#1c1232ee;border:2px solid #faf2de88;border-left:7px solid var(--coral);color:var(--paper);font-size:clamp(25px,3.3vw,43px);line-height:.93;text-shadow:3px 4px 0 #0c0718;transform:rotate(-3deg);z-index:2;box-shadow:5px 6px 0 #0c0718}.character-card.wildcard strong{border-left-color:var(--mint);transform:rotate(3deg)}.character-card strong br{display:none}.character-card[aria-pressed=true]{border:0;box-shadow:none}.character-card[aria-pressed=true]::before{border:3px solid var(--mango);background-color:#ffcd4609}.character-card[aria-pressed=true]>img{transform:scale(1.035) translateY(-5px);filter:brightness(1.06)}.character-card:hover>img{transform:scale(1.045) translateY(-7px)}.selection-tick{top:16px;right:12px;width:auto;padding:8px 12px;border-radius:0;background:var(--mango);font:900 11px Arial,sans-serif;color:#1c1232;box-shadow:3px 4px 0 #0c0718}.selection-tick::after{content:' YOUR PICK';font-size:9px;margin-left:5px}.character-note{margin:24px 0 0;color:#dacbe4;font-size:10px}#start-match{margin-top:18px;min-height:60px;width:min(100%,440px)}.difficulty-row{margin:14px 0 0}.difficulty-row select{padding:7px 20px}body[data-ui-screen=character] .character-cards::after{animation:versus-stamp .28s cubic-bezier(.2,1.5,.4,1)}@keyframes versus-stamp{from{opacity:0;transform:translate(-50%,-50%) rotate(-20deg) scale(1.7)}to{opacity:1;transform:translate(-50%,-50%) rotate(-12deg) scale(1)}}
@media(max-width:700px){#character-screen{margin-top:20px}.character-cards{gap:30px}.character-card,.character-card.instigator,.character-card.wildcard{height:clamp(335px,49vh,460px)}.character-card>img{height:100%;object-fit:cover;object-position:50% 10%;mask-image:linear-gradient(90deg,transparent,#000 4% 96%,transparent)}.character-card::before{inset:5px -6px 25px;transform:skew(-3deg)}.character-card.wildcard::before{transform:skew(3deg)}.character-card strong{font-size:23px;padding:10px 6px;line-height:1;left:-8px;width:calc(100% + 16px);border-left-width:4px}.character-card strong br{display:block}.character-cards::before{width:65px;height:180px}.character-cards::after{font-size:62px;-webkit-text-stroke:2px #1c1232;text-shadow:4px 5px 0 #0c0718}.selection-tick{font-size:10px;right:3px;top:10px;padding:6px}.selection-tick::after{font-size:7px;margin-left:2px}.character-note{margin-top:21px;font-size:9px}#start-match{min-height:57px;margin-top:15px}.difficulty-row{font-size:8px;margin-top:13px}}
@media(max-height:600px) and (min-width:701px){body[data-ui-screen=character] #game-flow{padding-top:18px}#character-screen{margin-top:12px}.character-card,.character-card.instigator,.character-card.wildcard{height:clamp(235px,49vh,320px)}.character-card strong{font-size:25px;padding:7px 10px}.character-cards::before{height:150px;width:85px}.character-cards::after{font-size:80px}.character-note{margin-top:12px}#start-match{min-height:44px;margin-top:12px}.difficulty-row{margin-top:8px}.difficulty-row select{padding:5px 16px}}
@media(max-height:580px) and (min-width:701px){#utility-status{bottom:146px}#toast{bottom:204px}}
@media(prefers-reduced-motion:reduce){.character-card>img,.character-card::before{transition:none}body[data-ui-screen=character] .character-cards::after{animation:none}}

@media(max-width:700px){.character-card .selection-tick{top:auto;bottom:76px;right:2px}}

.menu-nav #settings{background:#281b47ed;color:var(--paper);border:2px solid var(--paper);box-shadow:4px 5px 0 #120b22;opacity:1;font-size:22px;min-height:55px;padding:12px 24px;margin-top:14px;transform:skew(-6deg)}.menu-nav #settings img{width:24px;height:24px;opacity:1}.menu-nav #settings:hover{background:#453064;transform:skew(-6deg) translateX(-5px)}
@media(max-width:700px){.menu-nav #settings{font-size:19px;min-height:47px;padding:10px 20px;margin-top:11px}}
@media(max-height:600px) and (min-width:701px){.menu-nav #settings{font-size:18px;min-height:40px;padding:8px 20px;margin-top:9px}}

#bank-radial{position:absolute;left:50%;top:calc(50% - 55px);transform:translate(-50%,-50%);width:72px;height:72px;border-radius:50%;background:conic-gradient(var(--mint) var(--bank-progress,0deg),#faf2de25 0);display:flex;align-items:center;justify-content:center;flex-direction:column;border:3px solid #281b47;box-shadow:0 0 0 1px #faf2de66,inset 0 0 0 7px #281b47cc;color:var(--paper);font:900 18px Arial,sans-serif}#bank-radial span{font:800 8px Arial,sans-serif;margin-top:3px}body:has(#bank-radial:not([hidden])) #juice-callout{visibility:hidden}

#portal-distortion{position:fixed;inset:0;z-index:4;pointer-events:none;opacity:0;background:none;mask-image:none}#portal-distortion.bubble-held{border:8px solid #a6c9ed44;border-radius:40%;box-shadow:inset 0 0 30px #9dbeed33}#bank-guidance{box-shadow:3px 4px 0 #150d2844}#bot-warning:not(:empty){max-width:220px;font-size:9px;background:#281b47b0;padding:6px 10px}

#portal-distortion.bubble-held{opacity:1!important;background:none;mask-image:none}
#swap-readout{position:fixed;top:23%;left:50%;transform:translateX(-50%);z-index:6;pointer-events:none;background:#281b47e8;color:#75e9ed;border:2px solid #b59add;padding:10px 18px;font:900 italic clamp(18px,2.5vw,30px) Impact,'Arial Black',sans-serif;text-align:center;max-width:85vw;box-shadow:4px 4px 0 #130c22}#swap-readout[hidden]{display:none}#swap-readout[data-stage=lock]{font:900 12px Arial,sans-serif;letter-spacing:1px}.quickstart-active #swap-readout{display:none}
/* Portal cues render in WebGL; the DOM layer is reserved for the existing capture border. */