:root{color-scheme:dark;--ash:#a49c98;--bone:#efe8df;--ember:#ff6b31;--cyan:#89c5cd}*{box-sizing:border-box}body{margin:0;background:#0b0b0d;color:var(--bone);font:16px/1.5 system-ui,-apple-system,Segoe UI,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}a{color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible,canvas:focus-visible{outline:2px solid #ffb16b;outline-offset:4px}.pit-shell{max-width:1500px;margin:auto;padding:0 32px}.pit-header{display:flex;align-items:center;justify-content:space-between;height:108px;gap:20px}.brand{text-decoration:none;font:900 19px Georgia,serif;letter-spacing:.12em}.brand>span{color:var(--ember)}.brand small{display:block;font:10px/1.8 system-ui;letter-spacing:.13em;color:#a9a09a}.pit-title{text-align:center}.pit-title>span{font-size:10px;letter-spacing:.3em;color:#af9a89}.pit-title h1{font:900 30px/.95 Georgia,serif;letter-spacing:-.02em;margin:5px 0}.lounge-link{text-decoration:none;font-size:12px;font-weight:800;letter-spacing:.09em;color:#baa99d}.match-strip{min-height:44px;display:flex;align-items:center;gap:16px;border-top:1px solid #39302c;font-size:11px;font-weight:700;letter-spacing:.08em;color:#a99d95}.match-strip>span:first-child{color:#eea776}.match-strip>span:nth-child(2){margin-right:auto}.match-strip button{font-size:11px;min-height:40px;background:none;border:0;color:#d0c2b9;padding:0 10px}.arena{height:clamp(450px,57vw,650px);position:relative;overflow:hidden;border:1px solid #604137;background:#110c0b url('/assets/avatar/coalcat-furnace-background-v1.jpg') center 48%/cover;border-radius:4px;isolation:isolate}.arena canvas{display:block;width:100%;height:100%;touch-action:none}.arena-vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 100px 25px #08080baa}.fight-hud{position:absolute;top:24px;left:26px;right:26px;display:grid;grid-template-columns:1fr 110px 1fr;gap:22px;pointer-events:none}.fighter-name{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px;font-size:14px;font-weight:900;letter-spacing:.06em}.fighter-name>span{font-size:12px;color:#9f9187}.opponent .fighter-name>b{color:#b5d4d8}.health{height:13px;background:#241b1b;border:1px solid #6c453b;overflow:hidden}.health i{height:100%;width:100%;display:block;background:linear-gradient(90deg,#bc3f22,#ffaf62);transform-origin:left;transition:transform .12s}.opponent .health{border-color:#385e64}.opponent .health i{background:linear-gradient(90deg,#91c9d0,#417781);transform-origin:right;float:right}.stamina{height:4px;margin-top:5px;background:#342f28;overflow:hidden}.stamina i{display:block;height:100%;width:100%;background:#d9bc72;transform-origin:left}.opponent .stamina i{transform-origin:right}.fighter-meta{display:flex;justify-content:space-between;margin-top:5px;font-size:11px;color:#c2aba0}.fighter-meta span:nth-child(2){letter-spacing:.2em}.opponent .fighter-meta span:first-child{letter-spacing:.2em}.clock{text-align:center;margin-top:-4px;line-height:1.2;text-shadow:0 2px 12px #000}.clock>span{font-size:10px;letter-spacing:.16em;color:#c3a48c}.clock strong{font:900 48px/1.05 Georgia,serif;display:block;color:#fce8c7}.clock small{display:block;font-size:9px;letter-spacing:.08em;color:#a69281}.clock.urgent strong{color:#ff6943}.center-call{position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);text-align:center;font:900 clamp(38px,7vw,84px)/1 Georgia,serif;text-transform:uppercase;color:#ffe6c8;text-shadow:0 4px 28px #000,0 0 38px #ee5b2a88;pointer-events:none;white-space:nowrap}.center-call small{display:block;font:700 12px/2 system-ui;letter-spacing:.2em;margin-top:8px}.impact-call{position:absolute;bottom:13%;left:0;right:0;text-align:center;font-size:13px;font-weight:900;letter-spacing:.18em;color:#ffd8a6;text-shadow:0 2px 4px #000;pointer-events:none}.arena-caption{position:absolute;bottom:16px;left:22px;right:22px;display:flex;justify-content:space-between;gap:16px;font-size:10px;letter-spacing:.13em;color:#c4a991;pointer-events:none}.pit-overlay{position:absolute;inset:0;background:#05070b7a;backdrop-filter:blur(3px);display:grid;place-items:center;padding:20px}.menu-card{width:min(440px,100%);text-align:center;background:linear-gradient(145deg,#181211f2,#09090cf5);border:1px solid #896049;padding:30px 32px;box-shadow:0 20px 100px #0009}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.16em;color:#cb9369}.menu-card h2{font:900 clamp(38px,6vw,64px)/1 Georgia,serif;letter-spacing:-.045em;margin:14px 0;color:#f7e4c9}.menu-card>p{font-size:15px;color:#bbaba0;margin:0 0 21px}.mode-choice{display:grid;grid-template-columns:1fr 1fr;margin:22px 0 14px;gap:8px}.mode-choice button{min-height:68px;color:#c1b2a9;border:1px solid #4a3a32;background:#0c0c0e;font-size:12px;font-weight:800}.mode-choice button[aria-pressed=true]{border-color:#d67c45;background:#342017;color:#ffe0bf}.mode-choice span{display:block;font-size:11px;font-weight:400;margin-top:5px;letter-spacing:0}.enter-button{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:54px;padding:14px 20px;border:1px solid #ff9c58;background:linear-gradient(115deg,#c44625,#f07936);color:#fff6e9;font-size:14px;font-weight:900;letter-spacing:.09em}.enter-button>span{font-size:22px;line-height:1}.menu-card .mode-help{font-size:12px;line-height:1.55;margin:15px 0 0;color:#bba796}.menu-card .load-note{font-size:11px;color:#d5ae8b;margin:10px 0 0}.menu-card.compact{max-width:390px}.plain-button{min-height:44px;background:none;border:0;border-bottom:1px solid #534139;color:#bdb1a7;font-size:12px;font-weight:700;margin-top:16px}.result-stats{display:flex;justify-content:space-around;gap:14px;border-block:1px solid #4d392c;padding:18px 0;margin:20px 0}.result-stats strong{display:block;font:700 28px Georgia;color:#ffb367}.result-stats span{font-size:10px;color:#b99a85;letter-spacing:.1em}.control-deck{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:23px 30px 26px;border:1px solid #3b302b;border-top:0;background:#111012}.move-zone{display:flex;align-items:center;gap:20px;flex:none}.joystick{position:relative;width:122px;height:122px;flex:none;border:1px solid #746052;background:radial-gradient(circle,#242020 0,#121114 67%);border-radius:50%;touch-action:none;user-select:none}.joystick:after{content:'';position:absolute;inset:21px;border-radius:50%;border:1px dashed #5a473c;pointer-events:none}.joystick i{position:absolute;left:40px;top:40px;width:40px;height:40px;border-radius:50%;background:radial-gradient(circle at 40% 30%,#765444,#2d231f);border:1px solid #b68660;box-shadow:0 5px 12px #0008;pointer-events:none}.joy-mark{position:absolute;font-size:14px;color:#9a8171;pointer-events:none}.north{top:4px;left:54px}.south{bottom:4px;left:54px}.west{left:8px;top:48px}.east{right:8px;top:48px}.control-caption{font-size:11px;letter-spacing:.1em;font-weight:700;color:#bdaa9a}.control-caption kbd{display:block;margin-top:6px;font-size:11px;color:#75675e}kbd{font-family:inherit}.combat-note{max-width:250px}.combat-note b{font-size:12px;letter-spacing:.09em;color:#dbc4ad}.combat-note p{font-size:14px;color:#a99a90;margin:7px 0}.combat-note>span{font-size:11px;color:#826f62}.action-zone{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:360px;flex:none}.action{min-height:63px;background:#191513;border:1px solid #6c4d39;color:#eed6be;padding:9px 12px;touch-action:none;user-select:none}.action>span{display:block;font-size:14px;font-weight:900;letter-spacing:.08em}.action small{display:block;color:#a8907b;font-size:9px;margin-top:4px;white-space:nowrap}.action kbd{color:#e5c39c;margin-right:6px}.action.claw{background:#492217;border-color:#b4643d}.action.heavy{border-color:#986c45}.action.guard{border-color:#41646a;background:#132125;color:#c1dde0}.action.dodge{border-color:#65666e;background:#1d1c24}.action.is-held,.action:active{filter:brightness(1.6);box-shadow:inset 0 0 20px #ffb87d30}.field-manual{margin-top:18px;border-block:1px solid #382f29;color:#a9998d}.field-manual summary{min-height:54px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;list-style:none;font-size:12px;font-weight:800;letter-spacing:.09em}.field-manual summary::-webkit-details-marker{display:none}.manual-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:0 0 22px}.manual-grid p{font-size:14px;line-height:1.65;margin:0}.manual-grid b{display:block;color:#dcc3aa;font-size:14px;margin-bottom:8px}footer{display:flex;justify-content:space-between;padding:24px 0;color:#7b6b5e;font-size:10px;letter-spacing:.09em}.noscript{padding:24px;text-align:center}body.in-match .control-deck{border-color:#645043}
@media(min-width:1500px){.arena{height:670px}}
@media(max-width:1000px){.pit-shell{padding:0 18px}.combat-note{display:none}.control-deck{padding:20px}.match-strip>span:nth-child(2){font-size:9px}.manual-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.pit-shell{padding:0 10px}.pit-header{height:75px;gap:8px}.brand{font-size:14px}.brand small{font-size:8px;letter-spacing:.04em}.pit-title h1{font-size:24px}.pit-title>span{font-size:8px;letter-spacing:.17em}.lounge-link{font-size:9px;max-width:66px;text-align:right}.match-strip{gap:4px;min-height:40px;font-size:9px}.match-strip>span:first-child{margin-right:auto;font-size:9px;letter-spacing:.03em}.match-strip>span:nth-child(2){display:none}.match-strip button{font-size:10px;padding:0 7px}.arena{height:clamp(390px,55svh,530px)}.fight-hud{left:12px;right:12px;top:15px;grid-template-columns:1fr 55px 1fr;gap:9px}.fighter-name{font-size:10px;letter-spacing:.02em;min-height:27px;align-items:flex-end}.fighter-name>span{display:none}.clock{margin-top:0}.clock strong{font-size:34px}.clock>span{font-size:8px;letter-spacing:.06em}.clock small{display:none}.fighter-meta{font-size:9px}.health{height:9px}.stamina{height:3px}.arena-caption{font-size:7px;bottom:12px;left:12px;right:12px;letter-spacing:.07em}.pit-overlay{padding:12px}.menu-card{padding:24px 16px;max-width:325px}.menu-card h2{font-size:45px;margin:12px 0}.menu-card>p{font-size:14px;margin-bottom:14px}.menu-card .eyebrow{font-size:9px}.mode-choice{margin:16px 0 12px}.mode-choice button{min-height:57px;font-size:11px}.mode-choice span{font-size:10px}.enter-button{min-height:50px;font-size:13px}.menu-card .mode-help{font-size:11px;margin-top:12px}.menu-card .load-note{font-size:10px}.control-deck{padding:17px 10px;gap:12px;align-items:center}.move-zone{flex-direction:column;gap:5px}.joystick{width:106px;height:106px}.joystick i{left:32px;top:32px}.joystick .north,.joystick .south{left:46px}.joystick .west,.joystick .east{top:40px}.control-caption{font-size:9px}.control-caption kbd{display:none}.action-zone{width:auto;flex:1;gap:7px;max-width:235px}.action{min-height:60px;padding:8px 3px}.action>span{font-size:12px}.action small{font-size:7px;margin-top:5px;letter-spacing:-.02em}.action kbd{display:none}.manual-grid{grid-template-columns:1fr;gap:20px}.field-manual summary{font-size:11px}footer{font-size:8px;gap:18px;line-height:1.6}.center-call{font-size:42px}.center-call small{font-size:10px}.impact-call{font-size:10px}.result-stats{margin:15px 0;padding:12px 0}}
@media(max-height:600px) and (orientation:landscape){.pit-header{height:60px}.arena{height:390px}.control-deck{padding:12px 20px}.joystick{width:106px;height:106px}.joystick i{left:32px;top:32px}.menu-card{padding:16px 25px}.menu-card h2{font-size:42px}.mode-choice{margin-top:12px}}
@media(prefers-reduced-motion:reduce){.health i{transition:none}}
/* Keep the fight's essential labels readable on narrow screens. */
.brand small,.pit-title>span,.lounge-link,.match-strip,.match-strip button,.fighter-meta,.clock>span,.clock small,.arena-caption,.eyebrow,.mode-choice button,.mode-choice span,.menu-card .mode-help,.menu-card .load-note,.plain-button,.result-stats span,.control-caption,.control-caption kbd,.combat-note b,.combat-note>span,.action small,.field-manual summary,footer{font-size:12px}
.fighter-name{font-size:14px}.action>span{font-size:14px}.action small{white-space:normal;line-height:1.35}.mode-choice span{line-height:1.4}.brand small{letter-spacing:.02em}.arena-caption{letter-spacing:.03em}.match-strip{letter-spacing:.03em}.control-caption{font-size:12px}
@media(max-width:600px){.brand small{display:none}.pit-title>span{font-size:12px;letter-spacing:.06em}.lounge-link{font-size:12px;max-width:76px}.pit-title h1{font-size:23px}.brand{font-size:14px}.match-strip>span:first-child{font-size:12px;max-width:165px}.match-strip button{font-size:12px;padding:0 5px}.clock>span{font-size:12px;letter-spacing:0}.fighter-name{font-size:12px;min-height:30px}.fighter-meta{font-size:12px}.arena-caption{font-size:12px;flex-wrap:wrap;gap:0;bottom:8px}.arena-caption>span:last-child{font-size:12px}.menu-card .eyebrow,.menu-card .mode-help,.menu-card .load-note,.mode-choice button,.mode-choice span,.action small,.field-manual summary,footer{font-size:12px}.action{min-height:69px}.action>span{font-size:14px}.action small{font-size:12px}.menu-card{padding:18px 14px}.menu-card h2{font-size:40px}.mode-choice{margin:12px 0}.mode-choice button{padding:6px 3px}.menu-card>p{margin-bottom:12px}.menu-card .mode-help{line-height:1.45;margin-top:10px}.pit-overlay{padding:10px}.arena{height:clamp(455px,58svh,545px)}.joystick{width:96px;height:96px}.joystick i{left:27px;top:27px}.joystick .north,.joystick .south{left:41px}.joystick .west,.joystick .east{top:35px}.action-zone{gap:6px}.control-deck{gap:10px;padding:14px 8px}.combat-note{display:none}.center-call small,.impact-call{font-size:12px}.result-stats strong{font-size:24px}}

/* Online matchmaking keeps both original play modes. */
.mode-choice #onlineMode{grid-column:1/-1;border-color:#54838f;background:#172a31;color:#d1edf3}.mode-choice #onlineMode[aria-pressed="true"]{background:#24434c;border-color:#a4d1df}.online-status{padding:12px 18px;color:#d1edf3;background:#101e23;border:1px solid #35515a;font-size:14px}.pit-overlay{overflow-y:auto}#queueElapsed{color:#f5bd88}#onlineMenuNote{font-size:13px}.mode-choice{gap:6px}
@media(max-width:600px){#menu .menu-card{padding:20px 12px}#menu h2{font-size:32px;margin:12px 0}#menu .mode-choice{margin:16px 0 10px}#menu .mode-choice button{padding:9px 5px}#menu .mode-help{margin:10px 0}#menu .load-note{margin:8px 0 0}.online-status{padding:10px 14px}#onlineQueue h2{font-size:30px}}
