/* Moonlit sanctuary. Downloaded CC0 sky and slate, procedural architecture. */
.arena{background:#080e20}
.arena>.stars,.arena>.mountains,.arena>.floor{display:none}
.arena-scenery{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none;background:#080f23}
.arena-sky{position:absolute;inset:0 0 30%;background:linear-gradient(180deg,#07102544,#0a173b25 50%,#101f38e8),url('../environment/skybox-night.png') 72% 36%/auto 155% no-repeat}
.arena-scenery:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 51% 38%,transparent 18%,#03071570 100%),linear-gradient(0deg,#040a1880,transparent 35%);pointer-events:none}
.arena-ruins{position:absolute;inset:9% -3% auto;width:106%;height:48%;opacity:.9}
.arena-ground{position:absolute;top:49%;left:-45%;width:190%;height:150%;transform:perspective(700px) rotateX(53deg);transform-origin:50% 0;background:linear-gradient(180deg,#1c2e4ce8,#0c2545c4 42%,#10253cbd),url('../environment/slate-floor.jpg') 50% 0/350px 350px;box-shadow:inset 0 1px 0 #8eacda3a}
.arena-ground:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 349px,#87d7ff12 350px 351px),repeating-linear-gradient(0deg,transparent 0 349px,#87d7ff12 350px 351px)}
.arena-haze{position:absolute;inset:37% -10% 0;background:radial-gradient(ellipse at 38% 55%,#26b4e81a,transparent 42%),radial-gradient(ellipse at 75% 18%,#bc8dff19,transparent 40%),linear-gradient(180deg,#36577d36,transparent 28%);filter:blur(15px)}
.arena-ray{position:absolute;top:-20%;left:54%;width:14%;height:100%;transform:rotate(29deg);background:linear-gradient(90deg,transparent,#9bdcff06,transparent);filter:blur(12px)}
.arena-ember{position:absolute;width:2px;height:2px;border-radius:50%;background:#b6e7ff;box-shadow:0 0 8px #6acaff;left:var(--x);top:var(--y);opacity:0;animation:sanctuary-dust var(--duration) linear infinite;animation-delay:var(--delay)}
@keyframes sanctuary-dust{0%,100%{opacity:0;translate:0 15px}25%,65%{opacity:.5}90%{opacity:0;translate:18px -55px}}
.arena .ring{--sigil:#6bdeff;z-index:1;border:1px solid color-mix(in srgb,var(--sigil) 48%,transparent);background:radial-gradient(ellipse at 50% 50%,#15375140 20%,#0f1d35ad 65%,#88d4ff18 90%),url('../environment/sigil.svg') center/100% 100% no-repeat;box-shadow:0 10px 0 #050c1c9c,0 16px 28px #0006,0 0 35px color-mix(in srgb,var(--sigil) 13%,transparent),inset 0 0 35px color-mix(in srgb,var(--sigil) 12%,transparent);outline:1px solid #93d6ff14;outline-offset:6px}
.arena .ring:before,.arena .ring:after{content:'';position:absolute;border-radius:50%;pointer-events:none}
.arena .ring:before{inset:7%;border:1px solid color-mix(in srgb,var(--sigil) 28%,transparent);box-shadow:0 0 9px color-mix(in srgb,var(--sigil) 14%,transparent)}
.arena .ring:after{inset:15%;border:1px dashed color-mix(in srgb,var(--sigil) 18%,transparent)}
.arena .ring.enemy{--sigil:#e2b574}
.arena .live-card:after{border-color:color-mix(in srgb,var(--aura) 60%,transparent);height:24px;background:radial-gradient(ellipse,color-mix(in srgb,var(--aura) 17%,transparent),transparent 70%);box-shadow:0 0 22px color-mix(in srgb,var(--aura) 25%,transparent);outline-offset:4px;width:135%}
.arena .live-card>span .card{box-shadow:0 0 0 1px color-mix(in srgb,var(--aura) 70%,white),0 0 18px color-mix(in srgb,var(--aura) 20%,transparent),0 20px 30px #0206158c;outline-offset:4px}
.arena .live-card small{text-transform:uppercase;font-size:10px;letter-spacing:3px;color:#c5d8ed;text-shadow:0 2px 5px #000}
.arena .holo-card .holo-foil{opacity:.025}.arena .holo-card .holo-light{opacity:.055}
.arena .holo-card.holo-active .holo-foil{opacity:.12}.arena .holo-card.holo-active .holo-light{opacity:.2}
.battlebar{background:linear-gradient(#060c1fe8,#060c1f66 60%,transparent);padding-top:18px}
.battlebrand{color:#eef7ff;text-shadow:0 0 24px #69bcff20}.battlebrand small{color:#86a8cb}
.battletools button,#reduceDuelMotion{background:#0b172dbd;border-color:#86b7ef33;color:#bdcfe5;border-radius:5px}
.battletools button:hover{background:#152945;border-color:#86b7ef88}
.arena .hud,.arena .hud.enemyhud{border-radius:4px 14px 4px 14px;border:1px solid #79cfff60;background:linear-gradient(120deg,#112640ee,#0a1329ed);box-shadow:inset 0 1px 0 #c9edff17,0 12px 26px #0004;backdrop-filter:blur(10px);padding:15px 18px 13px;overflow:visible}
.arena .hud:before{content:'VOTRE COMBATTANT';position:absolute;top:-14px;left:14px;padding:0 7px;font:8px var(--font-mono);letter-spacing:2px;color:#9bc8ef;background:#0c1930}
.arena .hud.enemyhud{border-color:#cba26769;background:linear-gradient(120deg,#27273de8,#12182beF)}
.arena .hud.enemyhud:before{content:'ADVERSAIRE';color:#dfbf91}
.arena .hud:after{content:'';position:absolute;left:-1px;top:20%;width:2px;height:50%;background:#8edcff;box-shadow:0 0 9px #66cfffaa}
.arena .hud.enemyhud:after{left:auto;right:-1px;background:#efca91;box-shadow:0 0 9px #d4a56699}
.arena .hud b{color:#edf6ff;font-size:18px}.arena .numbers{color:#9eb3cc;font-size:11px}
.arena .hp{height:7px;background:#03091b;border-radius:2px;border:1px solid #c0dbff16;margin:11px 0 7px;overflow:hidden}
.arena .hp i{background:linear-gradient(90deg,#39b4b7,#8ff5db);box-shadow:0 0 10px #63ecdd55;position:relative}
.arena .hp i:after{content:'';position:absolute;right:0;top:0;bottom:0;width:2px;background:#e0fff3}
.arena .enemyhud .hp i{background:linear-gradient(90deg,#e07b70,#f6b5a1)}
.arena .status{border:1px solid #78c7ff66;border-radius:3px 14px;background:linear-gradient(105deg,#102c49ec,#0b182fe8);box-shadow:0 0 24px #3299f31a,inset 0 1px #c3eaff14;color:#cce3f8;top:92px;font-size:13px}
.arena #turnLabel{color:#8bdaff;letter-spacing:1px;font-weight:800}
.clock{top:145px;width:85px;height:54px;border-bottom:1px solid #70bce146;border-radius:0;background:radial-gradient(ellipse at 50% 100%,#3393e119,transparent 70%)}
.clock strong{color:#e9f7ff;font-size:30px;text-shadow:0 0 18px #5dbfff44}.clock.urgent strong{color:#ff9a91}
#battleCommands{width:min(690px,52vw);bottom:22px}
.commandhead{font-size:12px;letter-spacing:.3px;color:#c9d9ef;margin-bottom:10px}
.commandhead button{background:linear-gradient(#173247,#0c2237);border-color:#8bddf36b;color:#d2f4ff;padding:9px 18px;border-radius:5px 15px;box-shadow:inset 0 1px #e0fbff17}
#moveMenu{gap:10px}
#moveMenu .movebutton{--tech:#86ceff;position:relative;min-height:85px;padding:12px 13px 12px 65px;border:1px solid color-mix(in srgb,var(--tech) 38%,transparent);border-radius:5px 15px 5px 15px;background:linear-gradient(115deg,#142d46f2,#0b192ef2);box-shadow:inset 0 1px #ddf4ff0c,0 8px 18px #0003;overflow:hidden}
#moveMenu .movebutton:before{content:'';position:absolute;left:0;top:13%;bottom:13%;width:2px;background:var(--tech);box-shadow:0 0 12px var(--tech);opacity:.7}
#moveMenu .movebutton:after{content:'';position:absolute;width:65%;height:1px;right:-20%;bottom:12px;transform:rotate(-40deg);background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--tech) 35%,transparent),transparent);pointer-events:none}
#moveMenu .movebutton[data-kind=heal]{--tech:#6fe6c1}#moveMenu .movebutton[data-kind=guard]{--tech:#8aabff}#moveMenu .movebutton.ultimate{--tech:#efc488;background:linear-gradient(115deg,#332c35ef,#171a30ef)}
#moveMenu .movebutton b{font-size:15px;font-weight:700;color:#edf4ff;line-height:1.2}
#moveMenu .movebutton span{font-size:12px;color:#b7cde0;margin:5px 0 4px}#moveMenu .movebutton small{font-size:10px;color:#8fa8c7}
.technique-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:40px;height:43px;display:grid;place-items:center;color:var(--tech);background:linear-gradient(140deg,color-mix(in srgb,var(--tech) 18%,transparent),transparent);border:1px solid color-mix(in srgb,var(--tech) 28%,transparent);border-radius:4px 10px;font-style:normal}
.technique-icon svg{width:23px;height:23px;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--tech) 50%,transparent))}
#moveMenu .movebutton:not(:disabled):hover{background:linear-gradient(115deg,#1d3d59,#10263e);border-color:var(--tech);box-shadow:0 0 20px color-mix(in srgb,var(--tech) 12%,transparent),inset 0 0 22px color-mix(in srgb,var(--tech) 7%,transparent);translate:0 -2px}
#moveMenu .movebutton:disabled{opacity:.4;filter:saturate(.55)}
.battlecredit{color:#7284a1;font-size:8px}
.v4-event-label{position:absolute;z-index:27;font:18px var(--font-display);letter-spacing:5px;color:#e1eaff;text-shadow:0 0 15px var(--fx),0 2px 5px #000;white-space:nowrap;pointer-events:none}
.v4-collapse-ring{position:absolute;border:1px solid var(--fx);border-radius:50%;box-shadow:0 0 18px var(--fx),inset 0 0 18px color-mix(in srgb,var(--fx) 25%,transparent);z-index:6;pointer-events:none}
.v4-fragment{position:absolute;z-index:22;pointer-events:none;display:block;isolation:isolate;will-change:transform,opacity}
.v4-fragment .card{position:absolute!important;inset:0!important;transform:none!important;animation:none!important;margin:0!important;pointer-events:none!important;box-shadow:none!important;outline:none!important;filter:none!important}
.v4-fragment .card:after,.v4-fragment .card:before,.v4-fragment .holo-foil,.v4-fragment .holo-light,.v4-fragment .v3-border{display:none!important}
.v4-fragment .win img{transform:scale(1.065)!important}
.v4-shattered>span{opacity:0!important}.v4-shattered .v3-motes,.v4-shattered:after{opacity:0!important}
.v4-fracture{position:absolute;inset:0;z-index:40;pointer-events:none;width:100%;height:100%;filter:drop-shadow(0 0 4px var(--aura));opacity:0}
.v3-dying .v4-fracture{opacity:1}.v3-dying>span{animation-play-state:paused!important}
.v4-impact-ring{position:absolute;width:60px;height:60px;border:2px solid var(--fx);border-radius:50%;z-index:20;pointer-events:none;box-shadow:0 0 15px color-mix(in srgb,var(--fx) 50%,transparent)}
@media(max-width:700px){
 .arena-sky{background-size:auto 125%;background-position:70% 15%}.arena-ruins{inset:20% -50% auto;width:200%;height:32%}.arena-ground{top:51%;background-size:auto,220px 220px}.arena-ember:nth-child(even){display:none}
 .battlebar{padding:10px 9px}.battletools{gap:4px}.battletools button,#reduceDuelMotion{padding:6px 5px;font-size:9px;min-height:34px}.battlebrand{font-size:16px;letter-spacing:1px}.battlebrand small{display:none}
 .arena .hud,.arena .hud.enemyhud{padding:9px 10px;width:calc(50vw - 35px);max-width:160px}.arena .hud:not(.enemyhud){top:112px;left:3%;bottom:auto}.arena .hud.enemyhud{top:112px;left:auto;right:3%}.arena .hud b{font-size:14px}.arena .numbers{font-size:9px}.arena .hud:before{font-size:7px;letter-spacing:1px;top:-11px;left:8px}.arena .hp{margin:8px 0 5px;height:6px}
 .arena .status{top:56px;padding:7px 11px;font-size:10px;gap:8px;white-space:nowrap}.clock{top:116px;left:50%;height:38px;width:48px}.clock strong{font-size:21px}
 #battleCommands{left:50%;width:94vw;bottom:18px}.commandhead{font-size:10px}.commandhead button{min-height:36px;font-size:10px;padding:7px 11px}
 #moveMenu{gap:7px}#moveMenu .movebutton{padding:10px 8px 10px 43px;min-height:88px;border-radius:4px 12px}#moveMenu .movebutton b{font-size:12px}#moveMenu .movebutton span{font-size:10px}#moveMenu .movebutton small{font-size:9px}.technique-icon{left:7px;width:28px;height:34px}.technique-icon svg{width:18px;height:18px}.arena .live-card small{font-size:8px;letter-spacing:1.5px}.arena .live-card:after{height:19px}.v4-event-label{font-size:15px;letter-spacing:3px}
}
@media(min-width:701px) and (max-height:750px){#battleCommands{bottom:14px;width:min(650px,55vw)}#moveMenu .movebutton{min-height:70px;padding-top:8px;padding-bottom:8px}.arena .status{top:66px}.clock{top:107px}.arena .hud{padding:11px 14px}.arena .hud b{font-size:16px}}
@media(prefers-reduced-motion:reduce){.arena-ember{animation:none}.movebutton{translate:none!important}}
body.v3-reduced .arena-ember{animation:none;opacity:.2}
.v3-dying .v3-cracks{opacity:.15}
.v4-slash{position:absolute;z-index:26;width:clamp(110px,17vw,250px);height:5px;pointer-events:none;background:linear-gradient(90deg,transparent,var(--fx) 25%,#f5fcff 50%,var(--fx) 75%,transparent);box-shadow:0 0 12px var(--fx);clip-path:polygon(0 50%,72% 0,100% 50%,28% 100%)}