@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=Barlow:wght@400;500;600;700;800&display=swap');
:root{--lime:#dcfa37;--bg:#101111;--muted:#929790;--line:#30332b;--display:'Barlow Condensed','Arial Narrow',Impact,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#f8f9ed;font-family:Barlow,Arial,sans-serif}button,select,a{-webkit-tap-highlight-color:transparent}button{font:700 14px Barlow,Arial,sans-serif;cursor:pointer;border:0;color:inherit}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid var(--lime);outline-offset:4px}button:hover{filter:brightness(1.12)}button:disabled{opacity:.4;cursor:wait}button,select{border-radius:0}button{transition:background .15s,transform .15s}button:active{transform:translateY(2px)}.top{height:88px;margin:0 4.5%;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:24px;align-items:center;text-decoration:none;color:inherit}.brand b{font-size:38px;letter-spacing:-3px;font-weight:900;transform:rotate(-5deg)}.brand b span{color:var(--lime);font-size:26px;letter-spacing:-2px}.brand i{font-size:13px;font-style:normal;letter-spacing:2px;border-left:1px solid var(--line);padding:12px 0 12px 24px}.top-right{display:flex;gap:22px;align-items:center}.top-right button{background:transparent;font-size:12px;letter-spacing:1px;color:#aaa}.fan{border:1px solid #535742;padding:5px 9px;color:var(--lime);font-size:12px;font-weight:700}main{max-width:1530px;margin:auto;padding:38px 4.5% 24px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:1.7px;color:var(--muted)}.intro{position:relative}.intro>.eyebrow{display:flex;justify-content:space-between}.intro h1{font-family:var(--display);font-size:clamp(55px,6.7vw,104px);font-weight:900;line-height:.89;letter-spacing:-1px;margin:24px 0 30px}.intro h1 em{font-style:normal;color:var(--lime)}.intro-bottom{position:absolute;right:0;bottom:0;text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:24px}.intro-bottom p{font-size:16px;line-height:1.6;color:#b5b7ac;margin:0}.mode-tabs{display:flex;border:1px solid var(--line);padding:5px;gap:4px}.mode-tabs button{background:transparent;color:#aaa;padding:13px 20px;font-size:12px;letter-spacing:.7px}.mode-tabs button.active{background:var(--lime);color:#181a0d}.roster{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:34px 0 0}.fighter-card{position:relative;background:#242725;text-align:left;overflow:hidden;padding:0;min-width:0;border:1px solid var(--line)}.fighter-card .photo{height:clamp(180px,22vw,300px);overflow:hidden;position:relative}.fighter-card img{width:100%;height:100%;object-fit:cover;object-position:center 25%;filter:grayscale(1);transition:filter .25s,transform .3s}.fighter-card:hover img,.fighter-card.selected img{filter:grayscale(0)}.fighter-card:hover img{transform:scale(1.04)}.fighter-card .photo:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#111b 0%,transparent 60%)}.fighter-number{position:absolute;top:14px;left:16px;font:700 18px var(--display);z-index:2}.select-marker{position:absolute;top:12px;right:12px;background:var(--lime);color:#14160b;font-size:12px;font-weight:800;padding:7px 10px;display:none;z-index:2}.fighter-card.selected{border:2px solid var(--lime)}.fighter-card.selected .select-marker{display:block}.card-bottom{padding:17px 20px 20px;display:flex;justify-content:space-between;align-items:flex-end}.card-bottom strong{font:800 clamp(25px,2.7vw,39px) var(--display);line-height:1}.card-bottom small{display:block;color:#a0a69b;font-size:12px;margin-top:7px;font-weight:500}.fighter-card.selected .card-bottom{background:var(--lime);color:#181b10}.fighter-card.selected small{color:#50583a}.card-symbol{font:600 30px var(--display);opacity:.7}.match-setup{display:grid;grid-template-columns:1.4fr 1fr 1fr;align-items:center;gap:40px;padding:28px 0;border-bottom:1px solid var(--line)}.selected-info h2{font:800 38px var(--display);margin:6px 0}.selected-info p{font-size:14px;color:#aaa;margin:0 0 14px}.stats{display:flex;gap:22px}.stat{font-size:12px;color:#9da18e}.stat b{display:block;color:var(--lime);letter-spacing:2px;margin-top:5px;font-size:14px}.match-options{display:grid;grid-template-columns:1fr 2fr;gap:12px;align-items:center}.match-options label{font-size:12px;color:#9ba092;font-weight:700;letter-spacing:1px}select{font:600 14px Barlow,Arial,sans-serif;border:1px solid var(--line);color:#f6f8ed;background:#1b1d18;padding:12px 30px 12px 12px;max-width:100%}.start-button{background:var(--lime);color:#172008;padding:23px 27px;display:flex;justify-content:space-between;align-items:center;gap:20px;font:800 25px var(--display);white-space:nowrap}.start-button span{font:700 12px Barlow,Arial,sans-serif;color:#485825}.control-preview{display:flex;flex-wrap:wrap;align-items:center;gap:24px;padding:24px 0;font-size:12px;color:#93998b}.control-preview b{font-size:12px;letter-spacing:1px;color:#d5d9ca}.control-preview>span{display:flex;align-items:center;gap:5px}kbd{font:600 12px Barlow,Arial,sans-serif;background:#252820;border:1px solid #424639;color:#c7ceba;min-width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center}.control-preview button,.fight-bottom button{margin-left:auto;background:transparent;font-size:12px;text-decoration:underline;color:#cdd2bf}footer{display:flex;justify-content:space-between;gap:16px;margin:0 4.5%;border-top:1px solid var(--line);padding:24px 0;font-size:11px;letter-spacing:.8px;color:#6f7567}footer span:first-child{color:#aab098}.arena-topline{display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:700;letter-spacing:1px;margin-bottom:14px;color:#bbc1ae}.arena-topline button{background:none;color:#bbc1ae;font-size:12px}.canvas-shell{position:relative;border:1px solid #515638;background:#171b12}canvas{display:block;width:100%;aspect-ratio:16/9;outline:0}.fight-bottom{display:flex;justify-content:space-between;align-items:center;padding:20px 0;color:#9fa790;font-size:12px;gap:20px}.fight-bottom b{color:var(--lime);margin-right:10px}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#070b08c9;backdrop-filter:blur(5px)}[hidden]{display:none!important}.overlay-card{text-align:center;border:1px solid #7b8652;background:#161b12;padding:32px;min-width:340px;max-width:90%}.overlay-card h2{font:900 64px var(--display);margin:14px 0;color:var(--lime)}.overlay-card p{color:#b9c3a7;line-height:1.6}.overlay-card .start-button{width:100%;justify-content:center;margin-top:24px}.secondary-button{background:transparent;border:1px solid #50573d;width:100%;padding:14px;margin-top:12px;color:#c4ceb0}.touch-controls{display:none;justify-content:space-between;gap:14px;padding:10px 0}.touch-controls>div{display:flex;gap:6px}.touch-controls button{min-width:44px;min-height:50px;padding:10px;background:#2a3022;border:1px solid #565e43;font-size:12px;touch-action:none;user-select:none}.touch-actions button{background:#cce32f;color:#202711}.touch-actions .special-touch{background:#faf2cd}.touch-controls button.pressed{background:#fff;color:#111}dialog{background:#181d14;color:#eff3e7;border:1px solid #616b45;max-width:560px;width:90%;padding:35px}dialog::backdrop{background:#000b}dialog h2{font:800 42px var(--display);margin:15px 0}dialog p{line-height:1.6;color:#bdc5af;font-size:15px}dialog table{width:100%;border-collapse:collapse;text-align:left;font-size:14px}td,th{border-bottom:1px solid #36402a;padding:13px 8px}th{color:var(--lime);font-size:12px}.close{position:absolute;top:12px;right:12px;background:none;font-size:20px}.tip{font-size:13px!important;color:#8c987b!important}@media(pointer:coarse){.touch-controls{display:flex}.control-preview>span{display:none}}@media(max-width:850px){.top{height:74px}.brand{gap:12px}.brand i{font-size:11px;padding-left:12px}.top-right{gap:12px}.top-right #full{display:none}.intro h1{font-size:75px}.intro-bottom{position:static;text-align:left;align-items:flex-start;gap:15px}.intro-bottom p{display:none}.intro>.eyebrow span:last-child{display:none}.roster{gap:8px;margin-top:24px}.card-bottom{padding:12px}.card-symbol{display:none}.card-bottom strong{font-size:28px}.card-bottom small{font-size:11px}.fighter-card .photo{height:220px}.match-setup{grid-template-columns:1fr 1fr;gap:24px}.start-button{grid-column:1/-1;justify-content:center}.match-options{grid-template-columns:1fr}.match-options label{display:none}.control-preview{gap:14px}footer span:last-child{display:none}.overlay-card h2{font-size:44px}.overlay-card{padding:22px;min-width:270px}}@media(max-width:520px){main{padding-top:24px}.brand i{display:none}.top-right .fan{font-size:10px}.intro h1{font-size:64px;margin:20px 0 22px}.mode-tabs{width:100%}.mode-tabs button{flex:1;padding:11px 8px;font-size:11px}.roster{grid-template-columns:repeat(2,1fr);gap:10px}.fighter-card .photo{height:170px}.card-bottom strong{font-size:30px}.card-bottom{padding:12px 14px}.match-setup{gap:16px}.selected-info h2{font-size:30px}.selected-info p{font-size:12px;line-height:1.5}.stats{gap:10px}.stat{font-size:10px}.stat b{font-size:12px}.control-preview>span{display:none}footer{flex-direction:column;font-size:10px;gap:8px}.arena-topline{font-size:10px}.arena-topline span:nth-child(2){display:none}.fight-bottom{font-size:10px;gap:8px}.fight-bottom>span:first-child{display:none}.touch-controls{display:flex;flex-direction:column}.touch-controls>div{justify-content:center}.touch-controls button{flex:1}.canvas-shell{margin:0 -3%}.overlay-card{padding:12px;min-width:230px}.overlay-card h2{font-size:32px;margin:6px 0}.overlay-card p{font-size:12px;margin:6px 0}.overlay-card .start-button{margin-top:10px;padding:12px;font-size:20px}.secondary-button{padding:10px;font-size:11px}.overlay-card .eyebrow{font-size:10px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.match-options label,.mode-tabs button,.control-preview button,.fight-bottom button,.arena-topline button{font-size:14px}.control-preview>span{font-size:14px}.touch-controls button{font-size:14px}@media(max-width:520px){.mode-tabs button{font-size:12px}.touch-controls button{font-size:13px}.arena-topline button{font-size:12px}}

.home-screen{display:grid;grid-template-columns:.95fr 1.05fr;min-height:650px;align-items:center;gap:34px;padding:35px 0 55px}.home-copy h1{font:900 clamp(72px,8vw,124px)/.87 var(--display);letter-spacing:-1px;margin:32px 0}.home-copy h1 em{color:var(--lime);font-style:normal}.home-copy p{color:#b8c1a8;line-height:1.7;font-size:18px;margin-bottom:30px}.home-actions{max-width:340px}.home-actions .start-button{width:100%}.home-actions .secondary-button{padding:19px}.home-caption{display:block;font-size:12px;letter-spacing:1.7px;color:#778369;margin-top:27px}.home-art{height:530px;position:relative;border:1px solid #465638;background:radial-gradient(ellipse at 50% 65%,#74963870,#233320 65%,#141c13);overflow:hidden}.home-art-title,.home-art-bottom{position:absolute;left:0;right:0;text-align:center;font-size:12px;letter-spacing:1.6px;color:#c4d39a;z-index:6}.home-art-title{top:24px}.home-art-bottom{bottom:23px}.home-fighter{position:absolute;object-fit:contain;object-position:bottom;height:75%;bottom:55px;filter:drop-shadow(0 12px 8px #0008);width:45%}.home-caze{left:-2%;z-index:5;height:70%}.home-luisinho{left:18%;z-index:4;height:72%}.home-donan{left:40%;z-index:3;height:74%}.home-igor{left:63%;z-index:2;height:76%}.text-back{background:transparent;color:#9ba88a;font-size:14px;padding:0;margin:0 0 26px;text-decoration:underline}.fighter-card .photo{background:radial-gradient(ellipse at 50% 70%,#5a71514f,transparent 70%),#1b251b}.fighter-card img{object-fit:contain;object-position:center bottom;padding:14px 0 0;filter:grayscale(.65);height:150%;width:100%;transform-origin:50% 45%}.fighter-card:hover img{transform:scale(1.04)}.fighter-card.selected img{filter:grayscale(0);filter:drop-shadow(0 0 12px #dafa3720)}.special-list{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}.special-list>span{font-size:12px;color:#c2cda8;display:flex;gap:7px;align-items:center}.special-list small{color:#82916e;font-size:12px}.touch-actions{flex-wrap:wrap}.touch-actions button{min-width:56px}.match-setup{grid-template-columns:1.5fr 1fr 1fr}@media(max-width:1000px){.home-screen{min-height:550px}.home-art{height:460px}.home-copy h1{font-size:85px}.match-setup{grid-template-columns:1fr 1fr}.match-setup>.start-button{grid-column:1/-1}}@media(max-width:650px){.home-screen{display:flex;flex-direction:column-reverse;gap:30px;padding:0 0 35px}.home-art{height:300px;width:100%}.home-art-title{top:15px;font-size:10px}.home-art-bottom{bottom:15px;font-size:10px}.home-fighter{bottom:37px}.home-copy{width:100%;text-align:center}.home-copy h1{font-size:74px;margin:23px 0}.home-copy p{font-size:16px;margin:0 0 25px}.home-actions{margin:auto}.home-copy>.eyebrow{font-size:11px}.home-caption{margin-top:20px}.fighter-card img{height:145%}.match-setup{grid-template-columns:1fr}.match-options{grid-template-columns:1fr 1fr}.match-setup>.start-button{grid-column:auto}.special-list{gap:10px}.stats{gap:22px}.touch-actions button{flex:1}.overlay-card .secondary-button{margin-top:7px;padding:8px}.control-preview{font-size:12px}}
/* Comic fight poster and the Rio tour */
.poster-menu.home-screen{display:block;position:relative;min-height:700px;padding:70px 55px 45px;margin:0 -1.5%;overflow:hidden;border:2px solid #647c55;background:#111e29 url('assets/menu-poster.jpg') center/cover no-repeat;isolation:isolate}.poster-menu:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#081121ee,#091a27b5 28%,#0c182838 54%,transparent 80%);z-index:-1}.poster-menu .home-copy{max-width:570px}.poster-menu .home-copy h1{font-size:clamp(80px,8vw,122px);line-height:.9;transform:rotate(-3deg);text-shadow:5px 5px 0 #11253b;margin:38px 0 25px;letter-spacing:-1px}.poster-menu .home-copy h1 em{-webkit-text-stroke:1px #142a30;text-shadow:5px 6px 0 #103141}.poster-menu .home-copy p{font-size:18px;color:#e5edf0;margin-bottom:27px;max-width:330px}.menu-stamp{display:inline-block;background:#ff795c;color:#1d1e16;font-size:12px;font-weight:800;letter-spacing:1px;padding:10px 12px;transform:rotate(-3deg)}.poster-menu .home-actions{max-width:350px}.poster-menu .home-actions button{box-shadow:4px 4px 0 #040b16;margin-top:12px;border:2px solid #102136}.poster-menu .home-actions .start-button{font-size:27px;display:block;text-align:left;transform:rotate(-1deg);padding:16px 23px}.poster-menu .home-actions .start-button span{display:block;font:700 12px Barlow,Arial,sans-serif;margin-top:5px}.poster-menu .home-actions .secondary-button{background:#e8f0ef;color:#192c3f;display:block;text-align:left;padding:15px 23px;font:800 22px var(--display)}.poster-menu .home-actions .secondary-button span{display:block;font:700 12px Barlow,Arial,sans-serif;color:#5a6b70;margin-top:3px}.menu-help{background:#132633cc;padding:12px 20px;color:#d8e7eb;font-size:14px;text-decoration:underline}.poster-menu .home-caption{color:#cbdaed;font-size:11px}.poster-badge{position:absolute;right:35px;bottom:33px;transform:rotate(5deg);background:#ffdc61;color:#182c40;border:3px solid #182c40;box-shadow:6px 6px 0 #112940;padding:16px 22px}.poster-badge span{display:block;font-size:12px;letter-spacing:3px;font-weight:800}.poster-badge strong{font:900 37px var(--display);display:block}.poster-badge small{font-size:11px}.stage-picker{padding:24px 0;border-bottom:1px solid var(--line)}.stage-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:15px}.stage-heading strong{font:700 20px var(--display);color:var(--lime)}.stage-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.stage-card{padding:0;text-align:left;background:#20261e;border:1px solid #434f33;position:relative;overflow:hidden}.stage-card img{width:100%;height:110px;object-fit:cover;filter:saturate(.65);display:block}.stage-card span{display:block;font:700 20px var(--display);padding:12px 14px}.stage-card.selected{border:2px solid var(--lime)}.stage-card.selected span{background:var(--lime);color:#1c260d}.stage-card.selected img{filter:saturate(1)}#career-select-note{color:#c6d2b5;font-size:16px;line-height:1.7;grid-column:1/-1;padding:10px 0}.career-header{display:flex;justify-content:space-between;align-items:center;gap:40px}.career-header h1{font:900 clamp(55px,6vw,85px)/.9 var(--display);margin:25px 0}.career-header h1 em{font-style:normal;color:var(--lime)}.career-header p{font-size:16px;line-height:1.6;color:#bbc7ac;max-width:500px}.career-fighter{display:flex;align-items:center;gap:22px;min-width:340px;background:radial-gradient(ellipse,#3c553335,transparent);padding:20px}.career-fighter img{width:135px;height:210px;object-fit:contain}.career-fighter strong{display:block;font:800 33px var(--display);margin:10px 0}.career-fighter #career-record{display:block;font-size:14px;color:#c0cdaa}.career-route{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin:25px 0}.career-stop{border:1px solid #435233;background:#192118;overflow:hidden}.career-stop img{width:100%;height:160px;object-fit:cover;display:block}.career-stop.locked img{filter:grayscale(.8) brightness(.55)}.career-stop.current{border:2px solid var(--lime)}.career-stop.done{border-color:#83b75f}.career-stop .stop-copy{padding:17px}.stop-copy>span{display:block;font-size:12px;color:#a4bb8e;letter-spacing:1px}.stop-copy h3{font:800 28px var(--display);margin:9px 0 13px}.stop-copy p{font-size:14px;line-height:1.5;color:#b6c5a5;margin:0}.stop-status{display:inline-block!important;font-weight:800;font-size:12px;margin-top:17px;background:#2b3a23;padding:6px 9px}.current .stop-status{background:var(--lime);color:#263111}.career-next{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:28px 0;gap:28px}.career-next h2{font:800 36px var(--display);margin:8px 0}.career-next p{color:#acbda0;font-size:16px;margin:0;line-height:1.5}.career-next .start-button{min-width:270px;justify-content:center}.save-status{font-size:14px;color:#9db687;padding:10px 0 18px}.save-status.error{color:#ffba89}.career-screen{padding:5px 0 25px}.career-complete{color:#ffe182!important}.mode-tabs button{padding:13px 14px}.mode-tabs button.active[data-mode="career"]{background:#ffdc61}@media(max-width:1000px){.poster-menu.home-screen{padding:50px 35px;min-height:660px}.poster-menu .home-copy h1{font-size:100px}.poster-badge{right:20px;bottom:30px}.poster-badge strong{font-size:29px}.career-fighter{min-width:260px;gap:10px}.career-fighter img{width:100px}.career-fighter strong{font-size:26px}.career-route{gap:10px}.stop-copy h3{font-size:24px}.career-stop .stop-copy{padding:13px}.career-stop img{height:120px}}@media(max-width:650px){.poster-menu.home-screen{display:block;padding:275px 25px 35px;min-height:780px;background-position:90% top;background-size:auto 490px;background-color:#0c192b;margin:0 -3%}.poster-menu:before{background:linear-gradient(0deg,#0c192b 33%,#0c192bee 48%,#0c192b00 76%)}.poster-menu .home-copy{text-align:left;max-width:none}.poster-menu .home-copy h1{font-size:75px;margin:23px 0}.poster-menu .home-copy p{font-size:16px}.poster-menu .home-actions{margin:0;max-width:none}.poster-menu .home-copy .menu-stamp{font-size:10px}.poster-menu .home-caption{font-size:10px}.poster-badge{top:18px;right:18px;bottom:auto;padding:10px 14px}.poster-badge strong{font-size:25px}.poster-badge small{display:none}.stage-heading{display:block}.stage-heading strong{display:block;margin-top:9px}.stage-cards{grid-template-columns:repeat(2,1fr);gap:10px}.stage-card img{height:95px}.stage-card span{font-size:20px}.career-header{display:block}.career-header h1{font-size:67px}.career-fighter{padding:0;min-width:0;justify-content:flex-start}.career-fighter img{height:150px;width:90px}.career-fighter strong{font-size:30px}.career-route{grid-template-columns:repeat(2,1fr)}.career-next{display:block}.career-next .start-button{width:100%;margin-top:24px}.career-next h2{font-size:29px}.career-stop img{height:110px}.stop-copy h3{font-size:25px}.mode-tabs{flex-wrap:wrap}.mode-tabs button{font-size:12px;padding:10px;flex:1;white-space:nowrap}}@media(max-width:380px){.poster-menu .home-copy h1{font-size:64px}.career-header h1{font-size:58px}}

.home-save-notice{color:#ffcb90;font-size:14px;line-height:1.6;max-width:340px;margin-top:18px}.home-save-notice button{display:block;margin-top:8px;background:#274153;padding:10px 12px;font-size:13px}

.audio-check{display:flex;align-items:center;gap:12px;font-size:16px;line-height:1.5;padding:12px 0;border-bottom:1px solid #35472c}.audio-check input{width:20px;height:20px;accent-color:var(--lime)}.audio-label{display:flex;justify-content:space-between;margin:24px 0 12px;font-size:14px;color:#c2d5ab;font-weight:700}#audio-volume{width:100%;accent-color:var(--lime);height:24px}#audio-voice{width:100%;font-size:14px}#audio-test{margin-top:24px;width:100%;justify-content:center;font-size:24px}#audio-dialog{max-height:90vh;overflow:auto}@media(max-width:520px){.top-right{gap:10px}.top-right .fan{display:none}#audio-dialog{padding:27px 20px}.audio-check{font-size:14px}#audio-dialog h2{font-size:36px}}

.controller-status{padding:.65rem 1rem;text-align:center;color:#c6da96;font-size:.875rem;background:#161c16;border-bottom:1px solid #303b24}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #dcfa37;outline-offset:4px}
/* Fight takes the viewport; browser chrome stays outside the arena. */
body.match-view{overflow:hidden;height:100dvh}
body.match-view>.top,body.match-view>footer,body.match-view .controller-status{display:none}
body.match-view main{height:100dvh;max-width:none;padding:10px 16px;--fight-chrome:108px}
body.match-view #fight{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
body.match-view .arena-topline{width:100%;max-width:1400px;margin:0;min-height:28px;gap:10px}
body.match-view .canvas-shell{width:min(100%,calc((100dvh - var(--fight-chrome))*16/9));margin:0;flex-shrink:0;aspect-ratio:16/9;border:2px solid #384546;border-radius:5px}
body.match-view canvas{width:100%;height:100%;aspect-ratio:16/9}
body.match-view .fight-bottom{width:100%;max-width:1400px;padding:6px 0;min-height:32px}
body.match-view .touch-controls{width:100%;max-width:950px;padding:0}
/* Results are a comic victory panel, with a fighter instead of a generic modal. */
.overlay{background:#061120ad;backdrop-filter:blur(3px);overflow:hidden;padding:14px}
.overlay-card{position:relative;display:grid;grid-template-columns:.85fr 1.15fr;min-width:0;width:min(740px,94%);max-width:none;max-height:100%;padding:0;text-align:left;border:4px solid #071727;background:#edf6f4;box-shadow:9px 9px 0 #071727;transform:rotate(-1deg);animation:result-pop .38s cubic-bezier(.2,1.4,.4,1) both;isolation:isolate}
.result-art{position:relative;overflow:hidden;min-height:360px;background:radial-gradient(circle,#ffffff32 2px,transparent 3px) 0 0/14px 14px,#228eac;border-right:4px solid #071727}
.result-art img{position:absolute;width:120%;height:120%;left:-10%;bottom:-23%;object-fit:contain;object-position:center bottom;filter:drop-shadow(8px 8px 0 #08274170);animation:winner-rise .5s .08s both}
.result-stamp{position:absolute;top:16px;left:12px;z-index:2;background:#ff765e;color:#152330;border:3px solid #152330;box-shadow:3px 3px 0 #152330;padding:6px 10px;font:900 20px var(--display);transform:rotate(-9deg)}
.result-name{position:absolute;left:12px;right:12px;bottom:15px;z-index:2;font:900 clamp(22px,3vw,34px)/1 var(--display);color:white;text-shadow:3px 3px 0 #102239}
.result-quote{position:absolute;top:65px;left:14px;right:14px;background:white;color:#142d43;border:3px solid #142d43;box-shadow:3px 4px 0 #142d43;padding:10px 12px;font:800 19px/1.1 var(--display);transform:rotate(3deg);z-index:2}
.result-copy{position:relative;padding:23px 26px 20px;color:#142d43;z-index:1}
.result-copy .eyebrow{color:#586c77;font-size:12px;letter-spacing:1px}
.result-score{font:900 46px/.9 var(--display);color:#14384d;letter-spacing:4px;margin:0 0 12px}
.overlay-card h2{font:900 clamp(30px,4vw,53px)/.95 var(--display);color:#133647;margin:12px 0;letter-spacing:-.5px;text-shadow:2px 2px 0 #ffd95b;transform:rotate(-2deg)}
.overlay-card p{font-size:15px;line-height:1.45;color:#46606e;margin:12px 0}
.overlay-card .start-button{margin-top:17px;padding:14px 12px;font-size:23px;background:#ffda59;color:#172c3e;border:3px solid #172c3e;box-shadow:4px 4px 0 #172c3e;transform:rotate(-1deg);white-space:normal;text-align:center}
.overlay-card .secondary-button{font-size:13px;padding:10px;color:#244b62;border:2px solid #90acb8;background:#dbe9ec;margin-top:10px;font-weight:800}
.overlay-card button:hover{transform:translate(-2px,-2px);filter:none;background:#fff29b;box-shadow:4px 4px 0 #172c3e}
.result-confetti{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:3}
.result-confetti i{position:absolute;top:-25px;left:var(--x);width:9px;height:17px;background:var(--color);animation:confetti-drop 1.9s var(--delay) ease-in both;transform:rotate(var(--tilt))}
.overlay[data-result='pause'] .result-art{background-color:#68789c}.overlay[data-result='pause'] .result-stamp{background:#b2dce8}
.overlay[data-result='draw'] .result-art{background-color:#8a6aaa}
@keyframes result-pop{from{opacity:0;transform:translateY(28px) rotate(-4deg) scale(.88)}to{opacity:1;transform:rotate(-1deg) scale(1)}}
@keyframes winner-rise{from{opacity:0;transform:translateY(65px) rotate(8deg)}to{opacity:1;transform:translateY(0) rotate(0)}}
@keyframes confetti-drop{0%{transform:translateY(0) rotate(var(--tilt));opacity:1}85%{opacity:1}100%{transform:translateY(550px) rotate(calc(var(--tilt) + 300deg));opacity:0}}
/* Selection screen: colorful fighter placards and short arcade headings. */
.select-screen .intro h1{font-size:clamp(46px,5.8vw,78px);margin:16px 0 24px;transform:rotate(-2deg);text-shadow:4px 4px 0 #163a49}
.select-screen .intro h1 em{color:#ffda59}.select-screen .intro-bottom{gap:15px}
.fighter-card{--fighter-color:#32dccb;border:3px solid #172b37;background:#122d3a;box-shadow:4px 4px 0 #050b12;transform:rotate(-1.2deg);transition:transform .18s,box-shadow .18s}
.fighter-card:nth-child(2){--fighter-color:#588bff;transform:rotate(1deg)}.fighter-card:nth-child(3){--fighter-color:#ff6764;transform:rotate(-.6deg)}.fighter-card:nth-child(4){--fighter-color:#ffd052;transform:rotate(1.5deg)}
.fighter-card .photo{background:radial-gradient(circle,#ffffff16 2px,transparent 3px) 0 0/12px 12px,linear-gradient(140deg,#183147,var(--fighter-color));height:clamp(170px,19vw,240px)}
.fighter-card img{filter:none;transition:transform .2s}.fighter-card.selected{border:3px solid #fff2a0;box-shadow:6px 6px 0 var(--fighter-color);transform:translateY(-8px) rotate(-1deg)}
.fighter-card.selected img{animation:fighter-ready 2.3s ease-in-out infinite}.fighter-card:hover{transform:translateY(-6px) rotate(0)}
.card-bottom,.fighter-card.selected .card-bottom{background:#e8f1ef;color:#142e43;border-top:3px solid #172b37}.card-bottom small,.fighter-card.selected small{color:#54717e}
.fighter-card.selected .select-marker{background:#fff096;color:#162c40;transform:rotate(4deg);border:2px solid #162c40;box-shadow:2px 2px 0 #162c40}
.mode-tabs{border:0;gap:8px;padding:0}.mode-tabs button{border:2px solid #425f6e;background:#1e3340;color:#c6dce7}.mode-tabs button.active{background:#ffda59;color:#183044;box-shadow:3px 3px 0 #ff8b6e;transform:rotate(-2deg)}
.stage-card{border:3px solid #182e40;box-shadow:3px 3px 0 #050d16;transition:transform .18s}.stage-card:hover{transform:translateY(-5px) rotate(-1deg)}.stage-card.selected{border:3px solid #ffda59}.stage-card.selected span{background:#ffda59;color:#193042}
.career-stop{border:3px solid #244259;box-shadow:4px 4px 0 #08131d;animation:ticket-enter .4s both}.career-stop:nth-child(2){animation-delay:.06s}.career-stop:nth-child(3){animation-delay:.12s}.career-stop:nth-child(4){animation-delay:.18s}.career-stop.current{border:3px solid #ffda59;transform:rotate(-1deg)}.career-stop.done .stop-status{transform:rotate(-7deg);background:#58cfac;color:#102f30;border:2px solid #123d41}
.poster-menu .home-actions button{transition:transform .18s,box-shadow .18s}.poster-menu .home-actions button:hover{transform:translateX(7px) rotate(-2deg);box-shadow:7px 7px 0 #040b16}.poster-badge{animation:badge-wiggle 4s ease-in-out infinite}.home-actions{animation:ticket-enter .45s both}
@keyframes ticket-enter{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@keyframes fighter-ready{0%,100%{transform:translateY(0) rotate(-.4deg)}50%{transform:translateY(-5px) rotate(.4deg)}}
@keyframes badge-wiggle{0%,85%,100%{transform:rotate(5deg)}90%{transform:rotate(1deg)}95%{transform:rotate(8deg)}}
@media(max-width:650px){.result-art{min-height:275px}.result-copy{padding:16px}.result-quote{font-size:16px;top:60px;padding:8px}.result-stamp{font-size:16px}.result-score{font-size:32px;margin-bottom:8px}.overlay-card h2{font-size:33px}.overlay-card p{font-size:14px}.overlay-card .start-button{font-size:19px;padding:11px}.overlay-card .secondary-button{font-size:12px;padding:8px}.result-name{font-size:23px}.select-screen .intro h1{font-size:54px}.select-screen .intro-bottom{position:static;align-items:stretch}.fighter-card .photo{height:180px}}
@media(max-width:440px){.overlay{padding:8px}.overlay-card{grid-template-columns:.65fr 1.35fr;width:97%;border-width:3px;box-shadow:4px 4px 0 #071727}.result-copy{padding:12px}.result-art{min-height:280px;border-right-width:3px}.result-quote{display:none}.result-stamp{left:5px;top:10px;font-size:13px;padding:5px}.result-name{font-size:18px;left:6px;right:6px}.result-art img{width:190%;left:-45%;height:115%;bottom:-12%}.overlay-card h2{font-size:28px}.overlay-card .secondary-button{font-size:12px}.result-copy .eyebrow{font-size:11px}.overlay-card p{font-size:13px}.overlay-card .start-button{font-size:18px;margin-top:12px}.select-screen .intro h1{font-size:46px}}
@media(pointer:coarse){body.match-view main{--fight-chrome:250px}.touch-controls button{min-height:43px}.touch-controls>div{flex-wrap:wrap}}
@media(pointer:coarse) and (orientation:landscape){body.match-view main{--fight-chrome:60px;padding:6px 12px}body.match-view #fight{display:grid;grid-template-columns:minmax(0,1fr) 230px;grid-template-rows:28px minmax(0,1fr);gap:5px 12px}body.match-view .arena-topline{grid-column:1/-1}body.match-view .canvas-shell{justify-self:center;align-self:center}body.match-view .fight-bottom{display:none}body.match-view .touch-controls{grid-column:2;grid-row:2;display:flex;flex-direction:column;align-self:center}.touch-controls button{min-width:40px;padding:8px 4px;flex:1}.touch-controls>div{justify-content:center;flex-wrap:wrap}}
@media(max-height:560px){body.match-view .overlay{padding:8px}.result-art{min-height:0}.overlay-card{max-height:100%;grid-template-columns:.7fr 1.3fr;width:min(610px,96%)}.result-copy{padding:12px 18px}.result-copy .eyebrow{font-size:11px}.result-score{font-size:29px;display:inline-block;margin:0 10px 0 0}.overlay-card h2{font-size:30px;margin:9px 0}.overlay-card p{font-size:13px;margin:7px 0}.overlay-card .start-button{margin-top:10px;padding:9px;font-size:19px}.overlay-card .secondary-button{padding:7px;font-size:12px;margin-top:7px}.result-quote{font-size:15px}.result-art img{height:120%;bottom:-25%}}
@media(max-height:350px){.result-quote,.overlay-card p,.result-copy .eyebrow{display:none}.result-copy{padding:8px 12px}.overlay-card h2{font-size:25px;margin:5px 0}.overlay-card .start-button{margin-top:6px;padding:6px}.overlay-card .secondary-button{padding:5px;margin-top:5px}.result-score{font-size:22px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.result-confetti{display:none}}
body.match-view .overlay{position:fixed;inset:0;z-index:30}
body.match-view dialog{max-height:90dvh;overflow:auto}
/* Title screen has no website header or footer. All controls belong to the game. */
body{background:#08192b}
body.home-view main{max-width:none;padding:0}
body.home-view .poster-menu.home-screen{min-height:100dvh;width:100%;margin:0;border:0;padding:clamp(35px,6vh,65px) 7% 125px;background:#08192b;display:flex;align-items:center;isolation:isolate}
body.home-view .poster-menu:after{content:'';position:absolute;inset:0;z-index:-2;background:url('assets/menu-poster.jpg') 72% center/cover no-repeat;animation:poster-breathe 15s ease-in-out infinite alternate;pointer-events:none}
body.home-view .poster-menu:before{background:linear-gradient(90deg,#071729ef 0%,#071729d4 25%,#07172939 48%,transparent 72%),linear-gradient(0deg,#061526e8,transparent 22%);z-index:-1}
body.home-view .poster-menu .home-copy{width:430px;max-width:42%;text-align:left}
.home-kicker{display:inline-block;font:800 14px var(--display);letter-spacing:2px;color:#b6e5ef;margin-bottom:8px}
body.home-view .poster-menu .home-copy h1{font:900 clamp(68px,6.6vw,104px)/.84 var(--display);margin:18px 0 35px;transform:rotate(-5deg);color:white;letter-spacing:-1.5px;text-shadow:5px 5px 0 #071728,8px 8px 0 #ef6b56}
body.home-view .poster-menu .home-copy h1>span{display:block;font-size:.64em;line-height:1.2;letter-spacing:1px}
body.home-view .poster-menu .home-copy h1 em{display:block;color:#ffdd57;text-shadow:5px 5px 0 #071728,8px 8px 0 #ef6b56;-webkit-text-stroke:1px #173447}
body.home-view .poster-menu .home-actions{max-width:380px;margin:0;animation:menu-slide .5s ease-out both}
body.home-view .poster-menu .home-actions .start-button,body.home-view .poster-menu .home-actions .secondary-button{display:flex;align-items:center;justify-content:flex-start;gap:18px;min-height:78px;padding:12px 19px;width:100%;background:#ffdf59;color:#132d42;border:3px solid #091f34;box-shadow:6px 6px 0 #091f34;font:900 27px/1 var(--display);transform:rotate(-2deg);margin-top:15px;white-space:normal}
body.home-view .poster-menu .home-actions #new-game{background:#57cce4;transform:rotate(1deg)}
body.home-view .poster-menu .home-actions #resume-career{background:#edfaf7;font-size:23px}
body.home-view .poster-menu .home-actions .menu-slot{font:900 35px var(--display);border-right:2px solid #102e3e55;padding-right:15px;min-width:56px;color:#244252}
body.home-view .poster-menu .home-actions .menu-label{font:900 27px/1 var(--display);color:#132d42;margin:0}
body.home-view .poster-menu .home-actions .menu-label small{display:block;font:800 12px Barlow,Arial,sans-serif;color:#2e5261;margin-top:7px;letter-spacing:.5px}
body.home-view .poster-menu .home-actions button:hover,body.home-view .poster-menu .home-actions button:focus-visible{transform:translateX(10px) rotate(-1deg);box-shadow:8px 8px 0 #091f34}
body.home-view .poster-menu .home-actions .menu-help{width:auto;display:inline-block;border:2px solid #93cfdb;padding:11px 18px;margin:23px 0 0;color:#d3f1f7;background:#112b41;text-decoration:none;box-shadow:3px 3px 0 #051321;transform:rotate(-2deg);font:800 16px var(--display);letter-spacing:1px}
.press-start{display:flex;align-items:center;gap:10px;margin-top:28px;color:#edf7ef;font:800 14px var(--display);letter-spacing:1.5px}
.press-start span{animation:press-pulse 2s ease-in-out infinite}.press-start kbd{background:#edf7ef;color:#1d3a4f;border:2px solid #1d3a4f;font-size:12px;width:auto;padding:5px 9px;height:auto;box-shadow:2px 2px 0 #091725}
.home-banter{position:absolute;border:3px solid #112c40;box-shadow:5px 5px 0 #112c40;background:white;color:#18364a;padding:12px 18px;font:900 clamp(17px,2vw,28px)/1 var(--display);z-index:1;pointer-events:none}
.banter-one{top:14%;right:27%;transform:rotate(-8deg);animation:banter-bob 4s ease-in-out infinite}
.banter-two{bottom:23%;right:4%;background:#ffdd59;transform:rotate(6deg);font-size:clamp(17px,1.6vw,23px);animation:banter-bob 4.5s .5s ease-in-out infinite reverse}
.home-utility{position:absolute;bottom:23px;left:7%;right:7%;display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.arcade-options{display:flex;gap:8px;flex-wrap:wrap}
.arcade-options button{padding:10px 13px;border:2px solid #567c90;color:#d0e9ef;background:#0c2438;font:800 14px var(--display);letter-spacing:.7px;box-shadow:3px 3px 0 #06131e}
.arcade-options button:hover{background:#a7e2ee;color:#102e42;transform:translateY(-3px)}
.home-utility .controller-status{background:#092238b8;color:#c3e4ed;border:0;padding:8px 12px;max-width:370px;text-align:right;font-size:13px;line-height:1.4}
.result-audio{display:block;width:100%;padding:9px 4px 0;background:transparent;color:#375d70;font:800 12px Barlow,Arial,sans-serif;text-decoration:underline}
@keyframes poster-breathe{from{transform:scale(1)}to{transform:scale(1.035) translateX(-.6%)}}
@keyframes menu-slide{from{opacity:0;transform:translateX(-25px)}to{opacity:1;transform:translateX(0)}}
@keyframes press-pulse{0%,100%{opacity:1}50%{opacity:.45}}
@keyframes banter-bob{0%,100%{translate:0 0}50%{translate:0 -7px}}
@media(max-width:1000px){body.home-view .poster-menu .home-copy{max-width:49%}.banter-one{right:15%;top:10%}.banter-two{bottom:28%;font-size:18px}.home-utility{gap:10px}.home-utility .controller-status{max-width:260px}}
@media(max-width:650px){body.home-view .poster-menu.home-screen{display:block;padding:255px 24px 145px;min-height:100dvh}body.home-view .poster-menu:after{height:470px;background-size:auto 470px;background-position:88% top;animation:none}body.home-view .poster-menu:before{background:linear-gradient(0deg,#08192b 45%,#08192be6 56%,transparent 82%)}body.home-view .poster-menu .home-copy{width:100%;max-width:none;position:relative;z-index:2}body.home-view .poster-menu .home-copy h1{font-size:76px;margin:14px 0 27px}body.home-view .poster-menu .home-actions{max-width:none}.home-kicker{font-size:12px}.banter-one{top:23px;right:22px;font-size:20px}.banter-two{top:172px;right:17px;bottom:auto;font-size:16px;padding:8px 10px}.home-utility{left:24px;right:24px;bottom:22px;display:block}.home-utility .controller-status{text-align:left;max-width:none;padding:9px 0 0;font-size:12px}.arcade-options button{padding:9px 11px;font-size:13px}.press-start{margin-top:21px}.result-audio{font-size:12px}}
@media(max-width:380px){body.home-view .poster-menu .home-copy h1{font-size:65px}body.home-view .poster-menu .home-actions .menu-label{font-size:24px}.arcade-options{gap:5px}.arcade-options button{font-size:12px;padding:9px}.home-utility{left:20px;right:20px}}
@media(min-width:651px) and (max-height:650px){body.home-view .poster-menu.home-screen{padding-top:25px;min-height:650px}body.home-view .poster-menu .home-copy h1{font-size:74px}.banter-one{top:8%}.banter-two{bottom:25%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.home-banter{translate:none}}
/* O mesmo gibi, da escalação à mesa de som. */
.roster{grid-template-columns:repeat(5,minmax(0,1fr));gap:13px}.fighter-card .photo{height:240px}.fighter-card img{object-fit:contain}.fighter-card .card-name{font-size:26px}.stage-cards{grid-template-columns:repeat(4,minmax(0,1fr))}.stage-card{border:3px solid #172e47;box-shadow:4px 4px 0 #071421;background:#fff1cc;color:#172e47;transition:transform .18s}.stage-card:hover{transform:translateY(-4px) rotate(-1deg)}.stage-card.selected{border:3px solid #ffd658}.stage-card.selected span{background:#ffd658;color:#172e47}.stage-heading strong{color:#ffd658}.mode-tabs{border:3px solid #172e47;background:#fff1cc;box-shadow:4px 4px 0 #08131d}.mode-tabs button{color:#172e47}.mode-tabs button.active{background:#ffd658;color:#172e47}.match-options select{background:#fff1cc;color:#172e47;border:3px solid #172e47}.special-list{color:#fff1cc}.career-header h1 em{color:#ffd658}.career-fighter{background:radial-gradient(ellipse,#4271ae55,transparent)}.career-header p,.career-fighter #career-record,#career-select-note{color:#e4e9f1}.career-stop{background:#fff1cc;color:#172e47}.career-stop .stop-copy>span,.career-stop .stop-copy p{color:#34516e}.career-stop.current{border-color:#ffd658}.career-stop .stop-status{background:#172e47;color:#fff1cc}.career-stop.current .stop-status{background:#ffd658;color:#172e47}.career-stop.locked{opacity:.8}.career-next p{color:#dae5f2}.save-status{color:#8de3cd}.career-stop:nth-child(5){animation-delay:.24s}.career-stop:nth-child(6){animation-delay:.3s}.career-stop:nth-child(7){animation-delay:.36s}
dialog{background:#fff1cc;color:#172e47;border:4px solid #172e47;box-shadow:10px 10px 0 #ffd658;max-width:780px;width:calc(100% - 40px);padding:38px;max-height:88dvh;overflow:auto;animation:ticket-enter .22s both}dialog::backdrop{background:#071421c9;backdrop-filter:blur(5px)}dialog .eyebrow{color:#496482}dialog h2{font:900 clamp(32px,5vw,50px)/1 var(--display);color:#172e47;margin:16px 0 22px;transform:rotate(-1deg)}dialog p,dialog .tip{color:#34516e;line-height:1.6}dialog h3{color:#172e47;background:#ffd658;display:inline-block;padding:8px 13px;transform:rotate(-2deg)}dialog .close{background:#172e47;color:#fff1cc;border:2px solid #172e47;box-shadow:3px 3px 0 #ffd658}dialog table{width:100%;border-collapse:collapse;font-size:14px}dialog th{background:#172e47;color:#fff1cc}dialog td,dialog th{border-bottom:2px solid #172e4725;padding:11px 8px;text-align:left}dialog select{background:#fffaf0;color:#172e47;border:2px solid #172e47;padding:13px}.audio-check{border-bottom:2px dashed #172e4733}.audio-check input,#audio-volume{accent-color:#2269c6}.audio-label{color:#172e47}dialog .start-button{background:#ffd658;color:#172e47;border:3px solid #172e47;box-shadow:4px 4px 0 #2269c6}dialog a{color:#155caa;font-weight:700}.text-back{color:#ffd658}button:focus-visible,select:focus-visible{outline:3px solid #4ca5ff;outline-offset:4px}
@media(max-width:1000px){.roster{grid-template-columns:repeat(3,minmax(0,1fr))}.fighter-card .photo{height:240px}}
@media(max-width:650px){.roster{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.fighter-card .photo{height:200px}.stage-cards{grid-template-columns:repeat(2,minmax(0,1fr))}dialog{padding:26px 18px}dialog td,dialog th{padding:9px 5px;font-size:12px}}
@media(prefers-reduced-motion:reduce){dialog,.career-stop{animation:none}.stage-card:hover{transform:none}}
.card-bottom strong{font-size:clamp(22px,2vw,30px);line-height:1.05;overflow-wrap:anywhere}.card-bottom{gap:6px;padding:14px 10px}.card-bottom small{font-size:10px;line-height:1.4}.card-symbol{font-size:20px;flex-shrink:0}.control-preview{border:3px solid #294762;background:#102740;box-shadow:4px 4px 0 #071421;padding:18px;color:#e8eef6}.control-preview b{color:#ffd658}.control-preview button{background:#ffd658;color:#172e47;border:2px solid #172e47;box-shadow:3px 3px 0 #071421}.match-setup .start-button,.career-next .start-button{background:#ffd658;color:#172e47;border:3px solid #172e47;box-shadow:5px 5px 0 #2166ac}.special-list kbd{background:#ffd658;color:#172e47}.special-list small{color:#c1d8eb}.stats .stat>b{color:#ffd658}

/* Guard cells include sprite padding; frame them as bust portraits in the roster.
   Independent translate preserves the existing hover/ready animation. */
.fighter-card img.padded-portrait{position:absolute;left:50%;top:12px;width:auto;height:240%;max-width:none;padding:0;translate:-50% -32%;object-fit:contain;object-position:center;transform-origin:50% 45%}
/* Two-thumb mobile layout; safe areas keep controls clear of the home indicator. */
.rotate-hint{display:none}.move-pad{position:relative;width:128px;height:128px;flex-shrink:0;border:3px solid #91b9d8;border-radius:50%;background:radial-gradient(circle,#274560cc,#0b1c30cc);touch-action:none;user-select:none;-webkit-user-select:none;box-shadow:0 3px 0 #071421}.move-pad>span{position:absolute;color:#dbe9f4;font-size:18px;pointer-events:none}.pad-up{top:7px;left:50%;translate:-50% 0}.pad-down{bottom:7px;left:50%;translate:-50% 0}.pad-left{left:7px;top:50%;translate:0 -50%}.pad-right{right:7px;top:50%;translate:0 -50%}.move-pad .pad-stick{width:48px;height:48px;left:50%;top:50%;translate:calc(-50% + var(--stick-x,0px)) calc(-50% + var(--stick-y,0px));border-radius:50%;border:3px solid #abc8df;background:#274c73;box-shadow:0 3px 0 #071421}.move-pad.pressed .pad-stick{background:#ffd658;border-color:#fff0b5}.touch-controls,.touch-controls button{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.touch-controls button{background:#193b60e8;border:2px solid #9cbfe0;border-radius:12px;color:#fff1cc;box-shadow:0 3px 0 #071421;min-height:48px;font-size:13px;font-weight:900}.touch-controls button.pressed{background:#ffd658;color:#142b42;transform:translateY(2px)}.touch-actions .special-touch{background:#ffd658e8;color:#172e47;border-color:#fff0b5}
@media(pointer:coarse){body.match-view main{padding:6px max(10px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));--fight-chrome:236px}body.match-view .touch-controls{display:flex;flex-direction:row;gap:12px;justify-content:space-between;align-items:center;max-width:720px}.touch-move{display:grid!important;grid-template-columns:repeat(2,1fr);width:136px;gap:6px!important}.touch-move .move-pad{grid-column:1/-1;justify-self:center}.touch-move button{min-width:0;padding:6px}.touch-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important;width:180px}.touch-actions button{min-width:0;padding:8px 4px;min-height:48px}.touch-actions button[data-key="e"]{grid-column:1/-1}.rotate-hint{display:block;color:#c6dcec;text-align:center;font-size:12px;margin:0}.fight-bottom{display:none!important}}
@media(pointer:coarse) and (orientation:landscape){body.match-view main{--fight-chrome:38px;padding-top:2px;padding-bottom:2px}body.match-view #fight{position:relative;display:flex;gap:2px;justify-content:flex-start;grid-template-columns:none;grid-template-rows:none}body.match-view .arena-topline{min-height:26px;padding:0 8px;font-size:11px}body.match-view .canvas-shell{width:min(100%,calc((100dvh - 34px)*16/9));align-self:center;justify-self:auto;max-height:calc(100dvh - 34px)}body.match-view .touch-controls{position:absolute;bottom:max(8px,env(safe-area-inset-bottom));left:0;right:0;width:100%;max-width:none;display:flex;flex-direction:row;align-items:flex-end;pointer-events:none;padding:0 5px;grid-column:auto;grid-row:auto}.touch-controls>div{pointer-events:auto}.touch-move{width:124px;gap:5px!important}.move-pad{width:104px;height:104px}.move-pad .pad-stick{width:42px;height:42px}.touch-actions{width:172px;gap:6px!important}.touch-actions button{min-height:40px;font-size:11px}.touch-move button{min-height:36px;font-size:11px}.rotate-hint{display:none}}
@media(pointer:coarse) and (max-width:360px) and (orientation:portrait){.touch-actions{width:154px;gap:6px!important}.touch-move{width:124px}.move-pad{width:116px;height:116px}}