/* The castle menu and playable arena share the same blue enamel and gold trim. */
.app-shell:not(.home-mode){--display:'Lilita One','Arial Black',sans-serif;--accent:#ffd343;background:linear-gradient(180deg,#102547e8,#101a31ed),url('/assets/menu/courtyard.webp') center/cover;border-inline-color:#080f26;isolation:isolate;min-height:0}
.app-shell:not(.home-mode) .topbar{padding:12px 15px 9px;padding-top:max(12px,env(safe-area-inset-top));gap:8px;background:linear-gradient(180deg,#26497b,#122848);border-bottom:2px solid #07142d;box-shadow:0 2px 0 #6881a044;z-index:1}
.brand{gap:8px;letter-spacing:0}.battle-back,.topbar .icon-button{width:33px;height:33px;border:2px solid #06142e;border-radius:10px;background:linear-gradient(#6083b1,#2a5185 50%,#173865);box-shadow:inset 0 1px #afcff2,inset 0 -3px #10264e,0 2px #050d22;color:#e1eeff;display:grid;place-items:center;flex-shrink:0}.battle-back svg{width:19px;height:19px;stroke-width:3}.battle-wordmark{font:400 20px/.87 'Lilita One',sans-serif;color:#51d1ff;letter-spacing:.2px;text-shadow:0 2px #073b80,0 3px #030e28;-webkit-text-stroke:.5px #06132a;paint-order:stroke fill}.battle-wordmark b{display:block;font-weight:400;color:#ffd536;font-size:21px;letter-spacing:1px;margin-top:3px}.topbar-right{gap:6px}.topbar .icon-button{width:32px;height:33px}.topbar .icon-button svg{width:17px;height:17px;stroke-width:2}.coin-balance{position:relative;min-width:63px;height:30px;padding:4px 9px 4px 24px;margin:0 1px 0 0;border:2px solid #06122d;border-radius:8px;background:linear-gradient(#284676,#101e40);box-shadow:inset 0 1px #7a9bc7,0 2px #02091b;color:#fff9df;font:400 17px 'Lilita One',sans-serif;text-shadow:0 2px #060d24}.coin-balance>svg{position:absolute;left:-10px;top:-6px;width:31px;height:36px;filter:drop-shadow(0 2px 0 #733609)}
.app-shell:not(.home-mode)>main{padding:0 12px 12px}.game-heading{padding:10px 3px 9px;gap:6px}.game-heading>div{gap:6px}.heading-crown{width:22px;height:19px;filter:drop-shadow(0 2px #030d23)}.game-heading h1{font:400 14px 'Lilita One',sans-serif;letter-spacing:.3px;color:#fce7b0;text-shadow:0 2px #050e25}.mode-tag{font-size:7px;font-weight:800;color:#adcaf1;background:#0d1c36;border-color:#435d83;letter-spacing:.3px;padding:4px 5px}.game-heading .text-button{padding:0;min-width:30px;min-height:30px;justify-content:center;color:#d5e6ff}.game-heading .text-button svg{width:19px;height:19px}.play-layout{gap:12px}
.arena-panel{position:relative;min-height:190px;border:2px solid #080f25;border-radius:16px;background:linear-gradient(145deg,#31558b,#1a3766 42%,#11284e);box-shadow:inset 0 2px #8aaad0,inset 0 0 0 2px #5276a6,0 4px #050c21,0 8px 18px #0004;overflow:hidden}
.arena-topline{padding:9px 13px 0;color:#d5bd81;letter-spacing:.7px;font-size:8px;font-weight:800}.arena-name{display:flex;align-items:center;gap:5px}.arena-name>svg{height:18px;width:18px}.round-label{color:#ffe7a1;font-size:8px;font-weight:800;letter-spacing:.4px}.round-label svg{color:#ffda67;width:11px;height:11px}.battle-hud{gap:12px;padding:10px 13px 11px}.fighter-title strong{font:400 15px 'Lilita One',sans-serif;letter-spacing:.4px;color:#f4f6ff;text-shadow:0 2px #0a1735}.fighter-title>span{font-size:7px;font-weight:900;color:#9ae3ff;letter-spacing:.5px}.opponent-hud .fighter-title>span{color:#ffb3a8}.health-track{height:13px;margin-top:6px;background:#0a1429;border:2px solid #07122c;border-radius:5px;box-shadow:0 1px #547199,inset 0 2px 3px #0008}.health-fill{border-radius:2px;background:linear-gradient(#9bff5a,#52d52e 48%,#27a224 50%,#39b52a);box-shadow:inset 0 1px #d8ffb0;position:relative}.health-fill:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(25% - 1px),#0c3e1a50 calc(25% - 1px),#0c3e1a50 25%)}.health-fill.enemy{background:linear-gradient(#ffb58c,#fa6254 48%,#c52b32 50%,#e43f3b);box-shadow:inset 0 1px #ffe2b6}.hp-text{margin-top:4px;font-size:8px;font-weight:700;color:#becde3}.scoreboard{position:relative;grid-template-columns:1fr 14px 1fr;min-width:67px;font:400 28px 'Lilita One',sans-serif;color:#ffe46c;text-shadow:0 2px #6c3e1c,0 3px #08152e;line-height:1;padding:5px 6px 6px;background:linear-gradient(145deg,#42618d,#12294c);border:1px solid #c7a55a;border-radius:9px;box-shadow:inset 0 1px #839ab5,0 2px #070f29}.scoreboard i{font:400 18px 'Lilita One',sans-serif;color:#abbed8}.scoreboard small{font-family:var(--sans);font-size:5px;font-weight:800;letter-spacing:.3px;margin-top:5px;color:#e0d4b0}
.court-wrap{margin:0 8px;border:3px solid #b58a42;border-radius:10px;background:radial-gradient(ellipse at center,#494357,#23263b);box-shadow:0 0 0 2px #08162d,inset 0 0 22px #090b1c;min-height:90px}.court-corner{width:15px;height:15px;border-color:#ffe79a;border-width:3px 0 0 3px;opacity:1;top:0;left:0;filter:drop-shadow(0 1px #6b3c16)}.court-corner.bottom-right{inset:auto 0 0 auto;border-width:0 3px 3px 0}.arena-status{left:8px;bottom:7px;font-size:6px;font-weight:800;color:#fff1c9;letter-spacing:.8px;background:#172443dc;border:1px solid #8590a377;box-shadow:0 2px #070b20;padding:5px 7px;border-radius:4px;line-height:1}.arena-status>span{color:#9cf367;box-shadow:0 0 5px #a4ff86}.arena-footer{padding:9px 11px 10px;font-size:8px;font-weight:600;color:#b7cbe5}.arena-footer svg{color:#ffda66;width:12px;height:12px}.pause-button{height:34px;width:34px;right:7px;bottom:7px;border:2px solid #07142c;border-radius:9px;background:linear-gradient(#7397c2,#30578f 55%,#1c3f70);box-shadow:inset 0 1px #c8e6ff,inset 0 -3px #10274e,0 2px #060d21;color:#f0f6ff}.pause-button svg{width:14px;height:14px;stroke-width:3}
.draft-panel{padding:13px;border:2px solid #080e24;border-radius:16px;background:linear-gradient(140deg,#33598f,#1c396a 50%,#132952);box-shadow:inset 0 2px #819fc5,inset 0 0 0 2px #45699a,0 4px #04091c,0 6px 16px #0003;overflow:visible}.draft-kicker{font-size:7px;font-weight:800;letter-spacing:.8px;color:#b8cbe6}.round-badge{border:1px solid #101a34;border-radius:5px;background:linear-gradient(#ffe28d,#dfac45);box-shadow:inset 0 1px #fff3c5,0 2px #0b1734;color:#53310e;font-size:8px;font-weight:900;padding:3px 7px;letter-spacing:.2px}.draft-panel h2{font:400 26px/1.08 'Lilita One',sans-serif;letter-spacing:.2px;color:#fff3cf;text-shadow:0 2px #09172f;margin:5px 0 12px}.draft-options{gap:9px}.fighter-option{padding:3px 4px 10px;border:2px solid #0a1735;border-radius:11px;background:linear-gradient(155deg,#4376b0,#254f88 65%,#183762);box-shadow:inset 0 1px #9dc3e7,inset 0 -4px #152d58,0 3px #07122c;transition:transform .16s,filter .16s;overflow:visible}.fighter-option:before{inset:2px;background:radial-gradient(ellipse at 50% 40%,var(--fighter-color,#b7d7ff),transparent 70%);opacity:.22;border-radius:8px}.fighter-option:hover{background:linear-gradient(155deg,#548bc6,#305f9e 65%,#23477a);filter:brightness(1.08)}.fighter-option.selected{border-color:#ffe481;background:linear-gradient(145deg,#7f602a,#533d27 65%,#31283a);box-shadow:0 0 0 1px #a56920,inset 0 1px #fff3ab,inset 0 -4px #634024,0 3px #060e28,0 0 16px #ffd25125}.fighter-option.selected:before{background:radial-gradient(ellipse at 50% 40%,#ffdc73,transparent 75%);opacity:.32}.fighter-option .ball-art{height:69px;width:100px;max-width:100%;filter:drop-shadow(0 4px 3px #050c3066)}.option-name{font:400 17px/1 'Lilita One',sans-serif;letter-spacing:.2px;color:#fff5dc;text-shadow:0 2px #0e2044;margin-top:1px}.selection-radio{top:5px;right:5px;width:14px;height:14px;border:1px solid #5474a0;background:#10244a;box-shadow:0 1px #99b4d133}.selected .selection-radio{background:linear-gradient(#ffffaa,#ffd22f);border-color:#a86916;box-shadow:0 1px 2px #0005}.selected .selection-radio:after{left:4px;top:2px;width:4px;height:6px;border-color:#634113;border-width:0 2px 2px 0}.selection-ability{font-size:9px;font-weight:500;line-height:1.4;color:#d5e0ef;margin:10px 1px 0;min-height:13px}.draft-bottom{padding-top:12px}
.primary-button{justify-content:center;gap:12px;min-height:49px;padding:9px 12px;border:2px solid #fff09b;border-radius:14px;background:linear-gradient(175deg,#fff791,#ffdb26 35%,#ffb908 75%,#ffca18);box-shadow:0 0 0 1px #c17b13,inset 0 2px #fffbd1,inset 0 -4px #ec8b00,0 4px #9a4c0b,0 6px #08122d;color:#fff8cf;font:400 23px/1 'Lilita One',sans-serif;letter-spacing:.3px;text-shadow:0 2px #a34f06,0 3px #683109;-webkit-text-stroke:.5px #7e3b0a;paint-order:stroke fill}.primary-button:hover{background:linear-gradient(175deg,#fffbb5,#ffe74d 35%,#ffc325 75%,#ffd22b);filter:brightness(1.04)}.primary-button svg{height:27px;width:27px;flex-shrink:0;filter:drop-shadow(0 2px #945318);stroke-width:2}.primary-button:active{transform:translateY(3px);box-shadow:0 0 0 1px #c17b13,inset 0 2px #fffbd1,inset 0 -3px #ec8b00,0 1px #9a4c0b,0 3px #08122d}
.bottom-nav{padding:8px 14px max(10px,env(safe-area-inset-bottom));gap:8px;border-top:2px solid #4a6384;background:linear-gradient(#152d51,#0c1b35);box-shadow:0 -2px #08122b}.nav-item{min-width:0;flex:1;min-height:40px;padding:5px 8px;flex-direction:row;gap:7px;border:2px solid #07122c;border-radius:10px;background:linear-gradient(#3d6397,#1d3e70);box-shadow:inset 0 1px #7c9ec6,inset 0 -3px #142b53,0 2px #030a20;color:#dceaff;font:400 14px 'Lilita One',sans-serif;letter-spacing:.1px;text-shadow:0 2px #11223f}.nav-item svg{height:18px;width:18px;stroke-width:2}.nav-item.active{color:#fff2b4;border-color:#edc364;background:linear-gradient(#897044,#493a32);box-shadow:inset 0 1px #fff0ad,inset 0 -3px #473023,0 2px #030a20}.nav-item.active:before{display:none}.nav-item:hover,.nav-item.active:hover{color:#fff5c6;filter:brightness(1.12)}
.live-fighter{gap:10px}.live-fighter>.ball-art{height:66px;width:73px;background:radial-gradient(ellipse,#f7d88125,transparent 70%);filter:drop-shadow(0 3px 2px #06142a88)}.live-fighter h2{font-size:28px;color:#ffe28a;margin:5px 0}.live-fighter>div>p{font-size:7px;font-weight:700;color:#c0d2e8;letter-spacing:.3px}.live-fighter>.icon-button{border:2px solid #0c1c3c;background:linear-gradient(#5880b1,#284b7e);box-shadow:inset 0 1px #b7d1f3,0 2px #071127;color:#eff7ff;height:40px;width:40px}.battle-meta{padding-top:10px}.battle-meta>span{font-size:7px;color:#ead5a1;font-weight:800;letter-spacing:.6px}.round-tracker{gap:6px}.round-token{width:24px;height:24px;border:2px solid #0a1a37;color:#8da5c6;background:#183358;box-shadow:inset 0 1px #48658b;font:400 11px 'Lilita One',sans-serif}.round-token.won{border-color:#b58836;background:linear-gradient(#ffdc70,#cc941e);color:#65430d;box-shadow:inset 0 1px #fff0a3}.round-token.lost{border-color:#a3494c;background:linear-gradient(#b14e5c,#733447);color:#ffcfce}.battle-feed{margin-top:11px;border-color:#5b78a366;height:27px;padding-top:8px}.feed-item{font-size:10px;color:#d0deef}.feed-item time{color:#e4c879}.feed-item strong{color:#ffdf8b}
.result-overlay{background:radial-gradient(ellipse at 50% 35%,#385991e8,#0c1d40ed 75%);backdrop-filter:blur(4px);padding:12px}.result-overlay:before{content:'';position:absolute;inset:10px;border:1px solid #dcb46188;border-radius:8px;pointer-events:none}.result-stamp{border:0;box-shadow:none;width:61px;height:54px;margin-bottom:9px;background:none;filter:drop-shadow(0 3px #4f2a08)}.result-stamp svg{width:100%;height:100%}.result-overlay .eyebrow{font-size:7px;font-weight:800;letter-spacing:1.5px;color:#e6d39f}.result-overlay h3{font:400 clamp(29px,9vw,42px)/1 'Lilita One',sans-serif;letter-spacing:.5px;color:#fff2a0;-webkit-text-stroke:1px #814006;paint-order:stroke fill;text-shadow:0 3px #c2750c,0 5px #51280e,0 7px 10px #0005;margin:8px 0 9px}.result-score{display:flex;gap:15px;align-items:center;justify-content:center;font:400 30px/1 'Lilita One',sans-serif;color:#d7efff;text-shadow:0 2px #030c25;margin-bottom:9px}.result-score i{font-style:normal;font-size:20px;color:#b29457}.result-overlay p{font-size:9px;line-height:1.5;color:#c7d8f0;padding:0 17px;max-width:310px}.result-overlay.loss{background:radial-gradient(ellipse at 50% 35%,#70374ce6,#221a36ed 75%)}.result-overlay.loss h3{color:#ffe0d0;text-shadow:0 3px #9e3442,0 5px #381727;-webkit-text-stroke-color:#6e2536}.result-overlay.loss .eyebrow,.result-overlay.loss p{color:#f1c5cb}.countdown{background:#14224466;font:400 86px 'Lilita One',sans-serif;color:#ffe767;-webkit-text-stroke:2px #6d350b;paint-order:stroke fill;text-shadow:0 4px #bc740d,0 7px #23172b}.paused-overlay{background:#0d1d3ce6}.paused-overlay>svg{width:58px;height:44px}.paused-overlay strong{font:400 35px 'Lilita One',sans-serif;color:#ffdf7c;letter-spacing:.5px;text-shadow:0 3px #7c4316}.paused-overlay span{color:#d1dff2;font-size:11px}
.battle-end-stats{gap:6px;margin:12px 0 0}.stat-block{background:linear-gradient(#162e55,#102342);border:1px solid #5a7496;border-radius:7px;padding:10px 5px;box-shadow:inset 0 2px #050f25}.stat-block strong{font:400 23px 'Lilita One',sans-serif;color:#ffe194;letter-spacing:0}.stat-block span{color:#bfd0e6;font-size:5px;font-weight:700;margin-top:4px;letter-spacing:.1px}.draft-panel:has(.battle-end-stats) .draft-copy{color:#c4d4e9;font-size:10px;line-height:1.5;margin:8px 0}.draft-panel:has(.battle-end-stats) h2{font-size:24px}.draft-panel:has(.battle-end-stats) .primary-button{font-size:20px}
.draft-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}.draft-title h2{font-size:24px;margin:0}.draft-title .round-badge{flex-shrink:0}
/* Keep collection and dialogs in the same game world when opened from a battle. */
.collection-heading h1{font-weight:400;color:#fff0bc;letter-spacing:.3px}.collection-intro{color:#bacde4}.collection-card{border:2px solid #09152e;background:linear-gradient(#294b7d,#142b50);box-shadow:inset 0 1px #7898bb,0 3px #050d22}.collection-info h2{font-weight:400;color:#ffe39a;letter-spacing:.2px}.collection-info p,.collection-info .text-button{color:#c5d3e5}.collection-stage{background:radial-gradient(ellipse at center,var(--tile-bg),#152d51);border-bottom:1px solid #5b769a}.stat-bars .filled{background:linear-gradient(#ffe592,#dba93e)}dialog{background:linear-gradient(145deg,#31558b,#162e55);border:2px solid #d1ad64;box-shadow:inset 0 1px #a4bcda,0 5px #060e25,0 20px 100px #0008}dialog h2{font:400 29px 'Lilita One',sans-serif;letter-spacing:.2px;color:#fff0c1}dialog .eyebrow{color:#e5ca8c}dialog p{color:#c4d5eb}dialog .primary-button{font-size:20px}.toast{background:linear-gradient(#385c8b,#18335c);border-color:#d4b46b;color:#fff3ca;box-shadow:0 3px #06122a}
@media(max-height:760px){.app-shell:not(.home-mode) .topbar{padding-block:9px}.game-heading{padding-block:7px}.draft-panel{padding:11px}.draft-panel h2{font-size:23px;margin:4px 0 9px}.fighter-option .ball-art{height:53px}.option-name{font-size:15px}.fighter-option{padding-bottom:8px}.draft-bottom{padding-top:10px}.primary-button{min-height:44px;font-size:22px}.selection-ability{font-size:8px;margin-top:8px}.battle-hud{padding:8px 11px 9px}.arena-topline{padding:7px 11px 0}.arena-footer{padding-block:7px}.bottom-nav{padding-top:6px;padding-bottom:max(8px,env(safe-area-inset-bottom))}.nav-item{min-height:37px;font-size:13px}.live-fighter>.ball-art{height:50px;width:61px}.live-fighter h2{font-size:25px}.battle-meta{padding-top:7px}.battle-feed{margin-top:9px}.result-stamp{width:45px;height:37px;margin-bottom:5px}.result-score{font-size:26px;margin-bottom:6px}.result-overlay h3{font-size:31px;margin:7px 0}.battle-end-stats{margin-top:9px}.stat-block{padding:8px 4px}.stat-block strong{font-size:21px}}
@media(max-width:360px){.app-shell:not(.home-mode)>main{padding-inline:9px}.app-shell:not(.home-mode) .topbar{padding-inline:11px}.battle-wordmark{font-size:17px}.battle-wordmark b{font-size:18px}.brand{gap:6px}.topbar-right{gap:5px}.coin-balance{min-width:52px;font-size:15px;padding-right:6px}.topbar .icon-button{width:29px;height:31px}.battle-back{width:30px;height:31px}.game-heading h1{font-size:12px}.heading-crown{width:19px}.game-heading>div{gap:4px}.mode-tag{font-size:6px}.battle-hud{gap:9px;padding-inline:9px}.fighter-title strong{font-size:12px}.fighter-title>span{font-size:6px}.scoreboard{min-width:57px;font-size:25px;padding-inline:4px}.hp-text{font-size:7px}.arena-footer{font-size:7px}.draft-options{gap:7px}.option-name{font-size:14px}.nav-item{gap:5px;font-size:12px;padding-inline:5px}.nav-item svg{height:17px;width:17px}.draft-panel:has(.battle-end-stats) .primary-button{font-size:18px}}
@media(max-height:640px){.game-heading{display:none}.app-shell:not(.home-mode)>main{padding-top:9px;padding-bottom:9px}.app-shell:not(.home-mode) .topbar{padding-block:7px}.draft-panel{padding:9px 10px}.draft-kicker{display:none}.draft-panel h2{font-size:21px;margin:0 0 7px}.fighter-option .ball-art{height:41px}.fighter-option{padding-bottom:7px}.option-name{font-size:14px}.selection-ability{font-size:7px;margin-top:7px;min-height:10px}.draft-bottom{padding-top:8px}.primary-button{min-height:39px;font-size:20px;border-radius:10px}.primary-button svg{width:23px;height:23px}.arena-topline{padding-top:5px;font-size:6px}.arena-name>svg{height:13px;width:13px}.round-label{font-size:6px}.battle-hud{padding:6px 9px}.health-track{height:10px;margin-top:4px}.hp-text{margin-top:3px;font-size:6px}.scoreboard{font-size:23px;padding-block:3px}.scoreboard small{margin-top:3px}.arena-footer{padding:5px 9px}.bottom-nav{padding-block:6px}.nav-item{min-height:33px;font-size:12px}.play-layout{gap:9px}.result-stamp{display:none}.result-overlay h3{font-size:27px}.result-score{font-size:23px}.result-overlay p{font-size:8px;max-width:275px}.result-overlay .eyebrow{font-size:6px}.live-fighter>.ball-art{height:44px;width:52px}.live-fighter h2{font-size:23px}.live-fighter>div>p{font-size:6px}.round-token{width:20px;height:20px;font-size:9px}.battle-feed{height:23px;margin-top:7px;padding-top:6px}.feed-item{font-size:8px}.battle-end-stats{margin-top:8px}.stat-block{padding:6px 4px}.stat-block strong{font-size:19px}.draft-panel:has(.battle-end-stats) h2{font-size:21px}}
@media(orientation:landscape) and (max-height:560px){.app-shell:not(.home-mode){max-width:none}.app-shell:not(.home-mode) .topbar{padding:7px 16px}.battle-wordmark{font-size:17px;line-height:1}.battle-wordmark b{display:inline;font-size:17px;margin:0}.app-shell:not(.home-mode)>main{padding-top:8px}.draft-panel{width:245px;overflow-y:auto}.draft-panel h2{font-size:23px;margin-bottom:10px}.fighter-option .ball-art{height:52px}.draft-bottom{padding-top:12px}.selection-ability{margin-top:10px;font-size:8px}.result-stamp{display:grid}.battle-hud{padding-block:7px}.battle-end-stats{grid-template-columns:repeat(2,1fr)}}
/* Reserve the largest part of a portrait phone for the actual fight. */
@media(orientation:portrait){
  .app-shell:not(.home-mode) .topbar{padding-block:8px;padding-top:max(8px,env(safe-area-inset-top))}.game-heading{padding-block:4px}.bottom-nav{padding-block:6px;padding-bottom:max(6px,env(safe-area-inset-bottom))}.nav-item{min-height:36px}
  .draft-panel{padding:11px}.fighter-option .ball-art{height:51px}.fighter-option{padding-bottom:8px}.option-name{font-size:16px}.draft-title{margin-bottom:9px}.draft-title h2{font-size:24px;margin:0}.draft-bottom{padding-top:9px}.primary-button{min-height:45px}.selection-ability{font-size:8px;margin-top:8px}
  .arena-topline{padding-top:7px}.battle-hud{padding-block:8px}.arena-footer{padding-block:6px}
}
@media(orientation:portrait) and (max-height:640px){.draft-panel{padding:8px 9px}.draft-title{margin-bottom:7px}.draft-title h2{font-size:20px}.draft-title .round-badge{font-size:7px;padding:2px 5px}.fighter-option .ball-art{height:34px}.fighter-option{padding-bottom:6px}.option-name{font-size:13px}.selection-ability{font-size:7px;margin-top:6px}.draft-bottom{padding-top:7px}.primary-button{min-height:38px;font-size:19px}.nav-item{min-height:31px}.arena-topline{padding-top:5px}.battle-hud{padding-block:6px}.arena-footer{padding-block:4px}}
/* Live ability timing occupies the existing subtitle, keeping the phone arena roomy. */
.live-fighter #live-ability{color:#e8d193;font-size:7px;letter-spacing:.15px;white-space:nowrap}
.live-fighter #live-ability.is-active{color:#b9f5ff;text-shadow:0 0 8px #77ccff55}