/* The ID arm preserves the previous selector specificity without a descendant search. */
/* Shared solo and private-online match presentation. */
#background-watch-controls button{display:flex;align-items:center;gap:10px;padding:12px 18px;background:linear-gradient(#fde3a0,#ebc96c);border:2px solid #fdecc0;border-bottom:5px solid #8c7945;border-radius:14px;color:#35281b;font:900 14px 'Trebuchet MS',sans-serif;box-shadow:0 4px 0 #10172d88;cursor:pointer}#background-watch-controls button>span{font-size:23px;line-height:1}#background-watch-controls button kbd{padding:3px 5px;background:#73563033;border-radius:5px;font:700 10px 'Trebuchet MS',sans-serif}#background-watch-controls button:hover{filter:brightness(1.08)}#background-watch-controls button:active{transform:translateY(2px)}
.community-dock{position:fixed;left:24px;bottom:18px;z-index:4;display:flex;align-items:center;gap:12px;max-width:calc(100vw - 48px)}
#lobby .community-dock .discord-link{position:static!important;display:flex;align-items:center;gap:12px;padding:12px 18px;border:2px solid #b4b9ff;border-bottom:5px solid #36378d;border-radius:16px;background:linear-gradient(120deg,#6965ed,#454ac1);color:white;text-decoration:none;box-shadow:0 5px 20px #4d52cc55;transform:none;flex-shrink:0}
.community-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#ffffff20;font-size:27px;color:#f1e5ff}
#lobby .community-dock .discord-link strong{display:block;font:900 14px 'Trebuchet MS',sans-serif}#lobby .community-dock .discord-link small{display:block;font-size:11px;color:#e0e4ff;margin-top:4px}
.community-dock #watch-background{position:static;flex-shrink:0;padding:10px 14px;margin:0;font-size:11px}
@media(max-width:900px){.community-dock{left:12px;right:12px;bottom:12px;max-width:none;gap:8px}#lobby .community-dock .discord-link{padding:9px 12px;flex:1;min-width:0}#lobby .community-dock .discord-link strong{font-size:12px}#lobby .community-dock .discord-link small{font-size:10px}.community-dock #watch-background{max-width:135px;white-space:normal}.community-mark{display:none}body.in-menu #lobby{padding-bottom:110px!important}}
#match #overlay[data-result]:not([data-result=""]){z-index:50;inset:0;transform:none;isolation:isolate}
#match .heading h1{font-family:'Trebuchet MS','Segoe UI',sans-serif;font-weight:900;letter-spacing:-.3px;line-height:1.2}
.heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px}
.settings{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.hud{position:absolute;top:22px;left:28px;right:28px;display:grid;grid-template-columns:1fr 110px 1fr;gap:28px;pointer-events:none}
.fighter{max-width:290px}
.fighter.enemy{justify-self:end;width:100%;text-align:right}
.name{display:flex;justify-content:space-between;font-size:11px;letter-spacing:1.5px;color:#dce6e4}
.health{height:7px;background:#ffffff12;margin-top:10px;border-radius:3px;overflow:hidden}
.health i{display:block;height:100%;background:#a8e3cc;transition:width .15s}
.enemy .health i{background:#e7a183}
.timer{text-align:center;font:28px Georgia,serif}
.timer small{display:block;font:9px 'Segoe UI',sans-serif;letter-spacing:2px;color:#98aaa9;margin-top:5px}
.bottom{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:17px}
.spell{position:relative;background:#121c25;border:1px solid #2a383f;border-radius:7px;padding:16px;display:flex;gap:13px;align-items:center;overflow:hidden;color:#e7eceb;text-align:left;min-height:82px}
.spell:disabled{cursor:default}
.spell .icon{width:40px;height:40px;border:1px solid #405854;border-radius:8px;display:grid;place-items:center;font-size:22px;color:#ace4d6;background:#1a3033}
.spell:nth-child(2) .icon{color:#efb18d;background:#342925;border-color:#5a4436}
.spell:nth-child(3) .icon{color:#cfbdf5;background:#29253c;border-color:#4d4366}
.spell:nth-child(4) .icon{color:#e5d6ae;background:#312c27;border-color:#5f4e3e}
.spell strong{display:block;font-size:13px;font-weight:600}
.spell small{display:block;color:#8e9fa6;font-size:11px;margin-top:5px}
.spell kbd{position:absolute;right:10px;top:10px;font:10px 'Segoe UI',sans-serif;color:#9eadb2;background:#ffffff08;padding:3px 5px;border-radius:3px}
.cool{position:absolute;bottom:0;left:0;height:3px;background:#dacda9;transition:width .05s}
#match{font-family:"Trebuchet MS","Segoe UI",sans-serif}#match .timer{font-family:inherit;font-weight:900}#match .spell strong{font-weight:800}#match .spell .icon img{width:100%;height:100%;object-fit:contain}
body:is(.hex-match-visible,#match[hidden])>header{display:none}#match{max-width:none;width:100%;padding:8px 12px!important;height:100svh;position:relative;display:flex;flex-direction:column;gap:7px}#match[hidden]{display:none}#match .heading{margin:0;min-height:36px;flex:none;align-items:center}#match .heading h1{font-size:17px;margin:0}#match .heading .eyebrow,#match .sub,#match .footer,#match>.mobile{display:none}#match .settings button{font-size:12px;padding:7px 12px}#match .arena{flex:1;min-height:0;align-self:center;aspect-ratio:1100/610;width:auto;max-width:100%;border-radius:16px;box-shadow:none}#match canvas{height:100%;width:100%;object-fit:contain;aspect-ratio:1100/610}#match .hud{top:12px;left:18px;right:18px;gap:12px;grid-template-columns:1fr 130px 1fr}#match .fighter{background:#172442d9;padding:10px 12px;border:1px solid #98d5ff66;border-radius:12px;max-width:360px}#match .fighter.enemy{border-color:#ff91b566}#match .timer{background:#182140e8;border:2px solid #8582c4;border-bottom:5px solid #10152a;border-radius:13px;font-size:27px;padding:4px}#match .timer small{font-size:8px;letter-spacing:.3px}#match .health{height:9px;margin-top:6px}#match .bottom{flex:none;display:flex;justify-content:center;gap:8px;margin:0}#match .spell{flex:0 1 180px;min-height:60px;padding:8px;border:2px solid #7f82b5;border-bottom:5px solid #222840;background:linear-gradient(#4c507e,#303453);border-radius:14px}#match .spell .icon{width:39px;height:39px;flex:none}#match .spell strong{font-size:12px}#match .spell small{font-size:9px;max-width:130px}#match .spell kbd{background:#162039;color:#fff;font-size:10px;top:2px;right:4px}#match .notice{bottom:14px;text-shadow:0 2px 3px #000;font-weight:800}#match .team-roster{position:absolute;top:132px;left:22px;right:22px;z-index:3;pointer-events:none;gap:50%;margin:0}#match .team-roster[hidden]{display:none}#match .team-roster>section{padding:6px;background:#15223bad;border:0}#match .roster-member{font-size:10px;padding:3px 0}#match .roster-member small{font-size:9px}#match .roster-member b{white-space:nowrap}#match .team-roster section>strong{display:none}
#overlay[data-result]:not([data-result=""]){position:fixed;z-index:10;background:repeating-conic-gradient(from 12deg at 50% 35%,#ffffff05 0deg 15deg,transparent 15deg 30deg),radial-gradient(ellipse at top,#3c73bc,#1a2245 70%);overflow:auto}#overlay[data-result=defeat]{background:radial-gradient(ellipse at top,#80466e,#242340 70%)}#overlay[data-result]:not([data-result=""]) .modal{width:min(620px,94vw);max-width:620px;padding:22px}#overlay[data-result] .sigil{display:none}#overlay[data-result]:not([data-result=""]) .eyebrow{display:inline-block;font-size:20px;font-weight:1000;color:#26364b;background:#ffdf80;transform:rotate(-3deg);padding:9px 35px;border-radius:10px;border-bottom:5px solid #bd873b}#overlay[data-result]:not([data-result=""]) h2{font-size:clamp(32px,5vw,54px);text-shadow:0 4px #172447;margin:18px 0}#overlay[data-result] #description{margin:10px 0 18px}.result-stats{display:flex;justify-content:center;gap:10px}.result-stats>span{display:grid;flex:1;background:#101e3e88;border-radius:12px;padding:9px;font-size:11px;color:#c8dcff}.result-stats b{font-size:25px;color:white}.result-earnings{font-size:14px;color:#fde9b3;margin:12px 0}.result-chest{display:flex;align-items:center;text-align:left;gap:15px;border:2px solid #cab1ff;border-bottom:6px solid #34254f;border-radius:20px;background:linear-gradient(120deg,#77609b,#423f75);padding:10px 18px}.result-chest img{width:100px;height:85px}.result-chest>div{display:grid;flex:1;gap:3px}.result-chest strong{font-size:24px;color:#fff}.result-chest small{margin:0;color:#ffdf83;font-size:14px}.result-chest progress{width:100%;height:17px;accent-color:#fbd777;animation:reward-fill .7s ease-out}.result-chest span{font-size:11px;color:#e3dcff}#result-open-chest{width:100%;background:#ffdf75;color:#43341c;border-bottom-color:#af7b30;margin-top:12px}#overlay[data-result] #start{min-width:65%;font-size:20px}#overlay[data-result] #overlay-menu{width:auto;display:inline-block;margin-left:10px}#overlay[data-result] #hint{margin-top:10px}.result-practice{color:#b9cbed;font-size:13px}@keyframes reward-fill{from{opacity:.3;transform:scaleX(.85)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.result-chest progress{animation:none}}
@media(max-width:700px){#match{padding:5px!important}#match .heading{flex-direction:row;gap:5px}#match .heading h1{font-size:12px}#match .settings{gap:3px}#match .settings button{padding:6px;font-size:10px}#match .hud{left:6px;right:6px;top:6px;grid-template-columns:1fr 70px 1fr;gap:5px}#match .fighter{padding:5px}#match .timer{font-size:20px}#match .spell{padding:5px;min-height:55px;gap:5px}#match .spell .icon{width:30px;height:30px}#match .spell small{display:none}#match .spell strong{font-size:10px}#match .team-roster{top:117px;left:10px;right:10px;gap:30%}.result-chest strong{font-size:20px}}
#match .arena{flex:none;width:min(100%,calc((100svh - 125px)*1.80328));height:auto;aspect-ratio:1100/610;margin:auto}#match canvas{width:100%;height:auto;object-fit:fill}#match .team-roster{top:90px;left:12px;right:12px;gap:35%}.first-duel-hint{top:auto;bottom:95px;font-size:12px;padding:9px 16px}.first-duel-hint strong{font-size:19px}
#match .arena{flex:1;width:100%;height:auto;min-height:0;aspect-ratio:auto;margin:0}#match canvas{width:100%;height:100%;aspect-ratio:auto}
/* Edge-to-edge battlefield; HUD controls float over the world. */
body:is(.hex-match-visible,#match[hidden]){overflow:hidden}#match{position:fixed;inset:0;width:100vw;height:100svh;padding:0!important;display:block}#match[hidden]{display:none}#match .arena{position:absolute;inset:0;width:100%;height:100%;max-width:none;border:0;border-radius:0;background:#261f3b}#match .heading{position:absolute;z-index:5;top:12px;left:18px;right:18px;pointer-events:none}#match .heading>div:first-child{background:#18203dcc;padding:7px 12px;border-radius:9px}#match .settings{pointer-events:auto}#match .settings button{background:#253459e8;border:2px solid #7684b1;border-bottom:4px solid #121c35;border-radius:10px;font-weight:800}#match .hud{top:58px;left:18px;right:18px}#match .bottom{position:absolute;z-index:5;right:18px;bottom:20px;display:grid;grid-template-columns:repeat(2,minmax(90px,125px));gap:7px;padding:0;pointer-events:none}#match .bottom .spell{pointer-events:auto;min-height:62px;background:linear-gradient(#4a548dee,#293358ee);box-shadow:0 4px 12px #080e2477}#match .bottom .spell[data-spell=ultimate]{grid-column:1/-1}#match .spell .icon{width:36px;height:36px}#match .spell small{display:none}#match .spell strong{font-size:11px}#match .notice{left:15px;right:290px;bottom:24px;text-align:left;font-size:11px}#match .team-roster{top:142px;left:18px;right:18px}.first-duel-hint{bottom:26px;left:20px;transform:none;width:auto;max-width:calc(100vw - 315px);text-align:left}.first-duel-hint span{font-size:11px}#match .timer{box-shadow:0 4px 12px #121a3888}
@media(max-width:700px){#match{padding:0!important}#match .heading{left:8px;right:8px;top:8px}#match .hud{top:48px;left:8px;right:8px}#match .bottom{right:10px;bottom:14px;grid-template-columns:repeat(2,100px)}#match .bottom .spell{min-height:54px}#match .notice{right:220px;bottom:16px;font-size:10px}#match .team-roster{top:125px;left:8px;right:8px}.first-duel-hint{left:10px;bottom:16px;max-width:calc(100vw - 235px);padding:9px}.first-duel-hint strong{font-size:16px}.first-duel-hint span{font-size:10px}}
#match .bottom .spell>span:nth-child(2){padding-top:10px}#match .bottom .spell kbd{top:3px;right:5px;padding:1px 3px}
/* Fixed competitive field of view. Resize only the display, never the camera. */
#match canvas{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(100vw,180svh);height:min(100svh,55.5555556vw);aspect-ratio:9/5;object-fit:fill}#match .arena{background:#151126}
/* Centered fixed 16:9 camera; backing pixels are sized separately for crisp rendering. */
#match canvas{width:min(100vw,177.7777778svh);height:min(100svh,56.25vw);aspect-ratio:16/9}
/* Arcade-style fighter ribbons and a central match clock. */
#match .hud{align-items:start;grid-template-columns:1fr 108px 1fr;gap:18px}#match .fighter{position:relative;max-width:335px;padding:10px 14px 12px;background:linear-gradient(125deg,#244e72ed,#182d50ed);border:2px solid #7ddcfd;border-bottom:5px solid #112440;border-radius:8px 22px 15px 15px;box-shadow:0 4px 0 #090f2588,0 0 18px #5bbdff18;transform:rotate(-1deg)}#match .fighter.enemy{background:linear-gradient(235deg,#743f65ed,#382646ed);border-color:#f6a0bd;border-bottom-color:#36203d;border-radius:22px 8px 15px 15px;transform:rotate(1deg)}#match .name{align-items:center;font-size:13px;font-weight:900;letter-spacing:0;gap:10px;text-shadow:0 2px #13243b}#match #player-side,#match #botname{display:flex;align-items:center;gap:7px;min-width:0}#match .hud-rank img{width:28px;height:28px;vertical-align:middle;filter:drop-shadow(0 2px #152137)}#match #php,#match #bhp{font-size:16px;color:white;padding:3px 7px;background:#10213d80;border-radius:8px;white-space:nowrap}#match #php:before,#match #bhp:before{content:"";display:inline-block;width:1.1em;height:1.1em;vertical-align:-.15em;background:url("art/ui-heart-glyph.svg") center/contain no-repeat;font-size:12px;color:#9cffdc}#match #bhp:before{color:#ffc1da}#match .health{position:relative;height:15px;margin-top:7px;border:2px solid #10203c;background:#10192a;border-radius:6px;box-shadow:0 1px #ffffff30;overflow:hidden}#match .health i{background:linear-gradient(#beffe8 0%,#56e5b4 52%,#2bb991 53%);box-shadow:inset 0 2px #ffffff99}#match .enemy .health i{background:linear-gradient(#ffd5e6,#fb82b5 52%,#cf528c 53%)}#match .health:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0%,transparent calc(10% - 1px),#11254250 calc(10% - 1px),#11254250 10%);pointer-events:none}#match #bot-rating{display:block;font-size:9px;color:#ffd3e8;letter-spacing:0;margin-top:3px;line-height:1.3}#match .timer{position:relative;background:linear-gradient(#ffe9a3,#ffcd66);border:3px solid #fff3c8;border-bottom:6px solid #b77a32;color:#413022;border-radius:12px 12px 25px 25px;box-shadow:0 5px #15152c80;transform:translateY(-4px);padding:7px 5px 9px;font-size:30px;text-shadow:0 1px #fff6}#match .timer:before{content:'MATCH TIME';display:block;font-size:8px;letter-spacing:1px;font-weight:900;margin-bottom:2px}#match .timer small{color:#624728;font-size:8px;font-weight:800;margin-top:3px}#match .timer.urgent{background:linear-gradient(#ffbd9d,#ff697a);border-color:#ffd7c2;border-bottom-color:#a33b54;color:#502332}#match .timer.urgent #time{animation:clock-pulse 1s ease-in-out infinite}#match .bottom .spell[data-spell=ultimate]{grid-column:1/-1;border-color:#ffe9a5;border-bottom-color:#926238;background:linear-gradient(115deg,#8860a4ee,#43366eee);min-height:57px;justify-content:center;box-shadow:0 0 15px #e7bd5922}#match .spell[data-spell=ultimate] strong{color:#ffe9a5;font-size:13px}#match .spell[data-spell=ultimate] strong:before{content:'ULTIMATE · ';font-size:10px}#match .spell[data-spell=ultimate][hidden]{display:none}#match .team-roster{top:166px}
@keyframes clock-pulse{50%{opacity:.65}}@media(prefers-reduced-motion:reduce){#match .timer.urgent #time{animation:none}}@media(max-width:700px){#match .hud{grid-template-columns:1fr 80px 1fr;gap:8px}#match .fighter{padding:6px 8px 8px}#match .name{font-size:10px;gap:4px}#match #php,#match #bhp{font-size:12px;padding:2px 4px}#match .hud-rank img{width:20px;height:20px}#match .timer{font-size:25px}#match .health{height:12px}#match .team-roster{top:148px}}
#match .team-roster{display:grid;grid-template-columns:minmax(0,210px) minmax(0,210px);justify-content:space-between;gap:12px;top:158px;left:18px;right:18px;width:auto;max-width:none;pointer-events:none}#match .team-roster[hidden]{display:none}#match .team-roster>section{min-width:0;padding:0;background:none;border:0;overflow:hidden}.battle-member{padding:8px 9px;margin-bottom:7px;background:#162945db;border:1px solid #72cef56b;border-radius:12px}.team-roster>section+section .battle-member{background:#38233fdb;border-color:#ed91b26b}.battle-name{display:flex;align-items:center;gap:5px;font-size:10px}.battle-name img{width:21px;height:21px;flex:none}.battle-name b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1}.battle-name>span{white-space:nowrap;font-weight:bold;color:#d9ffeb}.battle-member progress{display:block;width:100%;height:7px;margin:4px 0;accent-color:#65e5c1}.team-roster>section+section progress{accent-color:#f48ab5}.battle-spells{display:flex;align-items:center;gap:4px}.battle-spells img,.unknown-spell{width:21px;height:21px;border-radius:4px}.unknown-spell{display:grid;place-items:center;background:#ffffff15;font-size:12px;color:#cbc4e2}.battle-spells small{margin-left:auto;font-size:8px;color:#c5c8e3}.battle-member.out{opacity:.45}
@media(max-width:800px){#match .team-roster{grid-template-columns:minmax(0,150px) minmax(0,150px);left:8px;right:8px;top:140px}.battle-member{padding:5px}.battle-name{font-size:9px}.battle-name img{width:16px;height:16px}.battle-spells img,.unknown-spell{width:17px;height:17px}.battle-spells small{font-size:7px}}
/* The arena is a viewport layer, independent of all former page/grid sizing. */
body:is(.hex-match-visible,#match[hidden]) #match:not([hidden]),body:is(.hex-match-visible,#match[hidden]) #match:not([hidden]) .arena{position:fixed!important;inset:0!important;width:100vw!important;height:100svh!important;min-width:0!important;max-width:none!important;max-height:none!important;margin:0!important;padding:0!important;transform:none!important;border:0!important;border-radius:0!important;box-sizing:border-box}
body:is(.hex-match-visible,#match[hidden]) #match canvas{position:absolute;left:50%;top:50%;right:auto;bottom:auto;max-width:none;max-height:none;margin:0;padding:0;border:0;transform:translate(-50%,-50%);aspect-ratio:16/9}

.menu-background-off #lobby .scene-stars,.menu-background-off #lobby .scene-moon,.menu-background-off #lobby .scene-floor{animation:none!important}.menu-background-off [data-menu-background-scene]{display:none!important}

[data-menu-background-scene]{position:fixed;inset:0;width:100vw;height:100vh;border:0;pointer-events:none;z-index:0;opacity:.32}body.in-menu #lobby{position:relative;z-index:1;background:linear-gradient(90deg,#17132999,#17132944)}

#watch-background{position:fixed;z-index:3;bottom:48px;left:24px;padding:9px 14px;border-radius:12px;background:#263451e8;color:#d7eaff;border:1px solid #859dc4;font:800 12px 'Trebuchet MS',sans-serif}.watching-background #lobby{visibility:hidden}.watching-background [data-menu-background-scene]{opacity:1}.watching-background #watch-background{display:none}#background-watch-controls{position:fixed;z-index:20;top:16px;left:16px;right:16px;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-radius:14px;background:#17213de8;color:white}#background-watch-controls[hidden]{display:none}@media(max-width:700px){#watch-background{bottom:10px;left:auto;right:12px;font-size:10px}#background-watch-controls{font-size:11px}}

#overlay[data-result= victory]:not([hidden]) .modal{animation:victory-arrive .48s cubic-bezier(.2,.8,.25,1) both}#overlay[data-result=victory]:not([hidden]) .eyebrow{animation:victory-bob 3s ease-in-out .5s infinite}#overlay[data-result=victory]:not([hidden]) .result-chest{animation:reward-arrive .5s ease-out .18s both}#overlay[data-result=victory]:not([hidden]) .result-stats{animation:reward-arrive .4s ease-out .08s both}@keyframes victory-arrive{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes reward-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes victory-bob{0%,100%{transform:rotate(-3deg) translateY(0)}50%{transform:rotate(-2deg) translateY(-3px)}}@media(prefers-reduced-motion:reduce){#overlay[data-result=victory] .modal,#overlay[data-result=victory] .eyebrow,#overlay[data-result=victory] .result-chest,#overlay[data-result=victory] .result-stats{animation:none!important}}

/* Rotate only the victory rays; no moving hit targets or oversized scroll layers. */
@property --victory-ray-angle {
  syntax: '<angle>';
  inherits: false;
  initial-value: 12deg;
}
#match #overlay[data-result="victory"]:not([hidden]) {
  background: repeating-conic-gradient(from var(--victory-ray-angle) at 50% 35%, #ffffff0b 0deg 15deg, transparent 15deg 30deg), radial-gradient(ellipse at top, #3c73bc, #1a2245 70%);
  animation: victory-rays-turn 80s linear infinite;
}
@keyframes victory-rays-turn {
  from { --victory-ray-angle: 12deg; }
  to { --victory-ray-angle: 372deg; }
}
@media (prefers-reduced-motion: reduce) {
  #match #overlay[data-result="victory"]:not([hidden]) { animation: none; }
}

body.watching-background{overflow:hidden;height:100svh}


#game{cursor:none}

/* Browser-owned cursor stays responsive independently of arena redraws. */
#match.hex-native-aim,#match.hex-native-aim .arena,#match.hex-native-aim #game{cursor:var(--hex-aim-cursor,crosshair)}
#match.hex-native-aim button,#match.hex-native-aim a,#match.hex-native-aim [role="button"]{cursor:pointer}
#match.hex-native-aim input,#match.hex-native-aim textarea{cursor:text}