@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--cream:#f3e8d2;--gold:#e8ba67;--red:#b3422e;--muted:#a6a99a;--ink:#111511;font-family:'DM Sans',sans-serif}*{box-sizing:border-box}body{margin:0;background:#111511;color:var(--cream)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0}button:disabled{opacity:.5;cursor:wait}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button:hover{filter:brightness(1.14)}[hidden]{display:none!important}#app{min-height:100dvh;width:100%;padding:0 28px;display:flex;flex-direction:column;align-items:center;background:radial-gradient(ellipse at top,#24291e 0%,#111511 65%)}.mast{height:78px;flex-shrink:0;width:100%;max-width:1600px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{color:var(--cream);text-decoration:none;display:flex;align-items:center;gap:11px;font:800 23px 'Barlow Condensed',Impact,sans-serif;letter-spacing:2px}.brand small{font:500 8px 'DM Sans',sans-serif;color:var(--gold);letter-spacing:2px;display:block;margin-top:1px}.seal{font:30px serif;color:var(--gold);border:1px solid #ad854970;width:39px;height:39px;display:grid;place-items:center}.mast-caption{font-size:9px;letter-spacing:2px;color:#c0bdac}.mast-caption i{font-style:normal;color:var(--gold);margin:0 12px}nav{display:flex;align-items:center;gap:24px}nav button{background:none;font-size:8px;letter-spacing:1.4px;padding:8px 0}nav b{font-weight:500;color:var(--gold);margin-left:6px}nav #help span{border:1px solid #a9a08b50;padding:2px 5px;margin-left:5px}nav #full{font-size:23px}#stage{width:min(100%,calc((100dvh - 162px)*16/9));aspect-ratio:16/9;position:relative;overflow:hidden;background:#161b17;box-shadow:0 0 0 1px #9e8e6c33,0 18px 60px #0005;isolation:isolate}#game{display:block;position:absolute;inset:0;width:100%;height:100%;outline:none;touch-action:none}.film-grain{position:absolute;inset:0;opacity:.04;pointer-events:none;z-index:10;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E")}.shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(#0d140ee0,transparent 26%,transparent 76%,#171a1380);z-index:1}#hud{position:absolute;z-index:4;top:5.8%;left:4%;right:4%;display:flex;justify-content:space-between;pointer-events:none}.fighter-hud{width:40%}.fighter-label{display:flex;align-items:center;gap:10px;margin-bottom:8px}.fighter-label strong{font:800 clamp(12px,2.2vw,29px) 'Barlow Condensed',Impact,sans-serif;font-style:italic;letter-spacing:1px;text-shadow:0 2px 4px #000}.fighter-label small{font-size:clamp(5px,.65vw,9px);letter-spacing:1.4px;color:#e0cfb0;margin-left:auto}.opponent .fighter-label small{margin-left:0;margin-right:auto}.player-tag{font:700 clamp(7px,.7vw,10px) 'Barlow Condensed',sans-serif;color:#171b15;background:var(--gold);padding:2px 5px;transform:skewX(-10deg)}.opponent .player-tag{background:#d1785f}.health-shell{position:relative;width:100%;height:clamp(8px,1.15vw,15px);background:#151713bb;outline:1px solid #e5c4817a;border:3px solid #151b16;transform:skewX(-12deg);box-shadow:0 3px 8px #0007}.health,.health-damage{height:100%;width:100%;position:absolute;left:0;top:0}.health{background:linear-gradient(#fce2a0,#d9a346);transition:width .12s}.health-damage{background:#9b4334;transition:width .65s .15s}.opponent .health,.opponent .health-damage{left:auto;right:0}.opponent .health{background:linear-gradient(#f2c3a0,#c16b4e)}.under-bar{display:flex;justify-content:space-between;margin-top:10px;align-items:center;font-size:6px;letter-spacing:1.8px;color:#ddd0b4}.round-dots{display:flex;gap:6px}.round-dots i{display:block;width:7px;height:7px;border:1px solid #d3b777;transform:rotate(45deg);background:#182017}.round-dots i.won{background:var(--gold);box-shadow:0 0 8px #e8ba6799}.round-center{position:absolute;left:50%;top:-3px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center}.round-center>span{font-size:clamp(6px,.7vw,10px);letter-spacing:2px;color:var(--gold)}.round-center strong{font:800 clamp(27px,4.7vw,66px)/1 'Barlow Condensed',Impact,sans-serif;font-style:italic;text-shadow:3px 3px 0 #593b22;font-variant-numeric:tabular-nums}.round-center small{font-size:clamp(4px,.5vw,7px);letter-spacing:1px;margin-top:6px;color:#e1ceab}.menu{position:absolute;top:24%;left:50%;transform:translateX(-50%);width:49%;max-width:650px;text-align:center;z-index:5}.eyebrow{display:flex;align-items:center;justify-content:center;gap:10px;font-size:clamp(5px,.67vw,10px);letter-spacing:2px;color:var(--gold)}.eyebrow i{height:1px;width:20px;background:var(--gold)}h1{font:900 clamp(42px,8.6vw,132px)/.81 'Barlow Condensed',Impact,sans-serif;letter-spacing:-1px;font-style:italic;margin:20px 0 0;transform:skewX(-4deg);text-shadow:3px 4px 0 #923c2b,5px 7px 0 #161b14,0 4px 28px #0009}h1 span{display:block;font:700 clamp(8px,1.35vw,21px) 'Barlow Condensed',sans-serif;letter-spacing:clamp(2px,.5vw,7px);margin-top:17px;text-shadow:1px 2px 5px #000}.menu-copy{font-size:clamp(7px,.85vw,12px);color:#f5e2c4;margin:17px 0 23px;text-shadow:0 2px 10px #000}.primary{background:var(--gold);color:#171a13;display:flex;align-items:center;justify-content:space-between;width:100%;padding:15px 22px;min-height:47px;text-align:left;font:800 13px 'Barlow Condensed',sans-serif;letter-spacing:2px;clip-path:polygon(0 0,100% 0,100% 78%,96% 100%,0 100%)}.primary b{font:22px 'DM Sans',sans-serif}.menu .primary{width:55%;margin:0 auto}.secondary{display:flex;justify-content:center;gap:20px;background:#111b14b5;color:var(--cream);border:1px solid #dfc99b70;font:600 10px 'Barlow Condensed',sans-serif;letter-spacing:1.5px;padding:11px 15px}.menu .secondary{width:55%;margin:9px auto 0}.difficulty{margin-top:22px;display:flex;justify-content:center;align-items:center;gap:10px}.difficulty>span{font-size:6px;letter-spacing:1px;color:#d1b98d}.difficulty button{padding:3px 0;background:transparent;font:600 8px 'Barlow Condensed',sans-serif;letter-spacing:.8px;color:#cfb893;border-bottom:1px solid transparent}.difficulty button[aria-pressed=true]{color:var(--cream);border-color:var(--gold)}#callout{position:absolute;z-index:6;inset:35% 0 auto;pointer-events:none;text-align:center;opacity:0;transform:scale(.9);transition:opacity .12s,transform .15s;text-shadow:3px 4px 0 #3e1f18,0 6px 25px #000a}#callout.active{opacity:1;transform:scale(1)}#callout-top{font-size:clamp(8px,1vw,15px);letter-spacing:6px;color:var(--gold);display:block}#callout-main{font:900 clamp(42px,7.5vw,110px)/1.1 'Barlow Condensed',Impact,sans-serif;display:block;font-style:italic}#callout-bottom{font-size:clamp(7px,.9vw,12px);letter-spacing:2px;color:var(--cream)}#combo{position:absolute;left:8%;top:29%;z-index:4;display:flex;align-items:center;gap:9px;transform:rotate(-4deg);text-shadow:2px 3px #401c0f}#combo strong{font:900 clamp(28px,4.7vw,65px) 'Barlow Condensed',Impact,sans-serif;color:var(--gold)}#combo span{font:800 clamp(9px,1.2vw,17px) 'Barlow Condensed',sans-serif;max-width:50px;line-height:1.1}#move-label{position:absolute;top:28%;right:6%;z-index:4;font:700 clamp(9px,1.3vw,19px) 'Barlow Condensed',sans-serif;letter-spacing:2px;color:var(--cream);text-shadow:1px 2px #47341e;opacity:0;transition:opacity .12s}#move-label.active{opacity:1}#fight-bottom{position:absolute;bottom:5%;left:4%;right:4%;z-index:4;display:flex;align-items:flex-end;justify-content:space-between}.focus{width:25%;max-width:330px}.focus>div:first-child{display:flex;justify-content:space-between;align-items:center}.focus span{font:700 clamp(7px,.8vw,12px) 'Barlow Condensed',sans-serif;letter-spacing:2px;color:#e2dbbd}.focus small{font-size:clamp(4px,.43vw,7px);letter-spacing:.7px;color:#e5c58b}.focus-shell{height:6px;background:#0b1c16c9;margin-top:6px;border:1px solid #9fbcb75c}.focus-shell i{display:block;height:100%;width:0%;background:#93cfc2;box-shadow:0 0 8px #8acdba66;transition:width .15s}#stage-location{font-size:clamp(5px,.6vw,9px);letter-spacing:2px;color:#ebd2aa}#stage-location i{font-style:normal;margin:0 10px;color:#cf9e59}#pause{background:none;font-size:18px;display:flex;align-items:center;gap:8px}#pause span{font-size:7px;letter-spacing:1px}.menu-stage-note{position:absolute;bottom:5%;left:4%;right:4%;display:flex;justify-content:space-between;z-index:4;font-size:clamp(4px,.55vw,8px);letter-spacing:2px;color:#f0d5ad}.control-strip{height:55px;flex-shrink:0;display:flex;align-items:center;gap:23px;width:min(100%,calc((100dvh - 162px)*16/9));color:#9fa68f}.control-item{font-size:7px;letter-spacing:.9px;display:flex;align-items:center;gap:6px;white-space:nowrap}kbd{font:8px 'DM Sans',sans-serif;display:inline-block;padding:3px 5px;border:1px solid #84907045;border-bottom-width:2px;border-radius:2px;color:#dddac2;margin-right:2px}.keyboard-note{margin-left:auto;font-size:6px;letter-spacing:1.2px;white-space:nowrap;color:#6f7a65}.page-foot{width:min(100%,calc((100dvh - 162px)*16/9));display:flex;justify-content:space-between;padding-bottom:15px;font-size:6px;letter-spacing:1.5px;color:#7b826f}.page-foot i{font-style:normal;margin:0 8px}.overlay{position:absolute;inset:0;z-index:20;display:flex;justify-content:center;align-items:center;background:#0b140ee8;backdrop-filter:blur(5px)}.panel{width:350px;max-width:75%;text-align:center}.panel h2,dialog h2{font:800 clamp(26px,4vw,58px)/.95 'Barlow Condensed',Impact,sans-serif;font-style:italic;margin:17px 0;color:var(--cream)}.panel p{font-size:11px;line-height:1.7;color:var(--muted);margin:16px 0 24px}.panel .primary{margin-top:17px}.panel .secondary{width:100%;margin-top:9px}.text-button{background:transparent;font:600 9px 'Barlow Condensed',sans-serif;letter-spacing:1px;padding:15px}.match-stats{border-top:1px solid #e8ba6733;display:flex;justify-content:space-between;padding-top:17px;margin-top:20px}.match-stats strong{font:700 30px 'Barlow Condensed',sans-serif;display:block;color:var(--gold)}.match-stats span{font-size:6px;letter-spacing:1px;color:var(--muted)}dialog{width:690px;max-width:calc(100% - 32px);max-height:90vh;overflow:auto;padding:35px;background:#182119;color:var(--cream);border:1px solid #caa66b60}dialog::backdrop{background:#09100ee6;backdrop-filter:blur(6px)}dialog .eyebrow{justify-content:flex-start}dialog h2{font-size:52px}#close-guide{position:absolute;right:18px;top:10px;background:none;font-size:28px;color:var(--muted)}.guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px 30px}.guide-grid kbd{display:table;margin-bottom:8px}.guide-grid strong{font-size:12px;display:block}.guide-grid p,.guide-foot{font-size:10px;line-height:1.7;color:#b5baa7;margin:5px 0}.guide-foot{margin:24px 0}dialog .primary{margin-top:22px}.touch-controls{display:none}#load-error{position:absolute;z-index:40;background:#1e2419;inset:40% 20% auto;padding:25px;border:1px solid var(--gold);font-size:13px}.in-fight .menu-stage-note{display:none}
@media(min-width:1600px){.menu .primary{font-size:16px;padding:18px 24px}.menu .secondary{font-size:12px;padding:13px}.difficulty{gap:15px}.difficulty button{font-size:10px}.difficulty>span{font-size:8px}}
@media(max-width:1100px){#app{padding:0 16px}.mast-caption{display:none}.control-strip{gap:12px}.control-item{font-size:6px;gap:4px}kbd{font-size:7px;padding:2px 4px}.keyboard-note{display:none}.menu .primary{min-height:36px;padding:9px 15px;font-size:11px}.menu .secondary{padding:8px 12px;font-size:9px}.menu-copy{margin:14px 0 16px}.difficulty{margin-top:15px}h1{margin-top:14px}h1 span{margin-top:12px}.fighter-label{margin-bottom:5px}.health-shell{border-width:2px}.under-bar{margin-top:6px}}
@media(max-width:700px){#app{padding:0 10px;justify-content:center}.mast{height:66px;gap:10px}.brand{font-size:18px;gap:7px}.brand small{font-size:6px}.seal{width:30px;height:32px;font-size:23px}nav{gap:12px}nav button{font-size:6px}nav #help{font-size:0}nav #help span{font-size:10px}#stage{width:100%;min-width:0}.fighter-label strong{font-size:13px}.fighter-label small{display:none}.round-center strong{font-size:28px}.round-center>span{font-size:6px;letter-spacing:1px}.round-center small{font-size:4px;letter-spacing:0}.under-bar>span{font-size:4px;letter-spacing:.7px}.round-dots{gap:4px}.round-dots i{width:5px;height:5px}.health-shell{height:8px}.menu{top:24%;width:58%}.menu h1{font-size:clamp(35px,9vw,63px);margin:8px 0 0}.menu h1 span{font-size:7px;letter-spacing:1.5px;margin-top:8px}.menu .eyebrow{font-size:4px;letter-spacing:.5px;gap:5px}.menu .eyebrow i{width:10px}.menu-copy{font-size:5px;margin:8px 0}.menu .primary{font-size:8px;min-height:24px;padding:5px 9px;width:60%;letter-spacing:1px}.menu .primary b{font-size:13px}.menu .secondary{font-size:6px;padding:5px;width:60%;margin-top:5px}.difficulty{margin-top:7px;gap:7px}.difficulty>span{display:none}.difficulty button{font-size:6px;letter-spacing:.4px}.menu-stage-note{font-size:4px;letter-spacing:.7px}.control-strip{display:none}.touch-controls{display:flex;width:100%;align-items:center;justify-content:space-between;gap:15px;margin:20px 0}.touch-move{display:grid;grid-template-columns:repeat(3,40px);grid-template-rows:repeat(2,37px);gap:5px}.touch-move button:first-child{grid-column:2}.touch-move button:nth-child(2){grid-column:1;grid-row:2}.touch-move button:nth-child(3){grid-column:2;grid-row:2}.touch-move button:nth-child(4){grid-column:3;grid-row:2}.touch-controls button{background:#263021;border:1px solid #5d6446;color:var(--cream);touch-action:none;user-select:none;border-radius:3px}.touch-controls button:active{background:var(--gold);color:var(--ink)}.touch-actions{display:grid;grid-template-columns:repeat(3,48px);gap:5px}.touch-actions button{height:37px;font-size:7px}.page-foot{width:100%;padding-top:5px;font-size:5px;letter-spacing:.7px}.page-foot span:last-child{display:none}.panel{max-width:65%}.panel h2{font-size:27px;margin:7px 0}.panel p{font-size:7px;margin:8px 0}.panel .primary{min-height:24px;padding:5px 12px;font-size:8px;margin-top:8px}.panel .primary b{font-size:12px}.panel .secondary{padding:5px;font-size:7px;margin-top:5px}.panel .text-button{font-size:6px;padding:7px}.panel .eyebrow{font-size:5px;letter-spacing:1px}.match-stats{padding-top:6px;margin-top:8px}.match-stats strong{font-size:20px}.match-stats span{font-size:4px}.focus{width:30%}.focus-shell{height:4px;margin-top:4px}#stage-location{display:none}#pause{font-size:13px}#pause span{font-size:5px}.guide-grid{gap:17px}.guide-grid p{font-size:9px}dialog{padding:25px}dialog h2{font-size:42px}}
@media(max-height:600px) and (min-width:701px){.mast{height:52px}#stage{width:min(100%,calc((100dvh - 115px)*16/9))}.control-strip{height:40px;width:auto}.page-foot{padding-bottom:9px;font-size:5px}.menu-copy{margin:10px 0}.menu .primary{padding:6px 12px;min-height:30px}.menu .secondary{padding:6px}.difficulty{margin-top:9px}}
@media(prefers-reduced-motion:reduce){.film-grain{display:none}*{transition-duration:0s!important}}