/* Arena controls retain their hit areas; imagery is a static, non-interactive layer. */
.venue-scene { position:absolute; inset:0; width:100%; height:100%; z-index:-1; }
.venue-art:has(.venue-scene) { background:#0b1730; }
.venue-art:has(.venue-scene):after { z-index:0; background:linear-gradient(180deg,#02081930,#020819c9); opacity:1; pointer-events:none; }
.venue-art:has(.venue-scene)>:not(.venue-scene) { position:relative; z-index:1; }
.venue-art:has(.venue-scene) .venue-orbit { display:none; }
.game-shell[data-venue] { position:relative; isolation:isolate; background:#08142b; border-color:var(--venue-accent); }
.arena-scenery { position:absolute; inset:0; width:100%; height:100%; z-index:-2; pointer-events:none; }
.game-shell[data-venue]:before { content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(180deg,#02081a50,#02081a08 22%,#02081a35 72%,#02081abd); }
.game-shell[data-venue] .topbar { background:linear-gradient(90deg,#08152fbb,var(--venue-hud)); border:1px solid #ffffff27; border-radius:var(--venue-radius); padding:1px 8px; }
.game-shell[data-venue] .players-bar { border:1px solid var(--venue-secondary); border-radius:var(--venue-radius); background:linear-gradient(120deg,var(--venue-hud),#071023dc); box-shadow:inset 0 1px #ffffff26; }
.game-shell[data-venue] .player-block.current { background:#ffffff0b; border-color:var(--venue-accent); box-shadow:inset 0 0 13px #ffffff0b; }
.game-shell[data-venue] .player-block.current .avatar { border-color:var(--venue-accent); box-shadow:0 0 9px var(--venue-accent); }
.game-shell[data-venue] .turn-badge { background:var(--venue-accent); border-color:var(--venue-secondary); color:#071d2b; box-shadow:0 1px 4px #031225cc; }
.game-shell[data-venue] .turn-timer { background:var(--venue-hud); border-color:var(--venue-accent); color:#fff; box-shadow:0 0 0 2px #020819a0,0 0 12px var(--venue-accent); }
.game-shell[data-venue] .match-cue,.game-shell[data-venue] .potted-count { color:var(--venue-accent); }
.game-shell[data-venue] .game-objective { color:#eff7ff; text-shadow:0 1px 3px #000; background:#04122d99; border-radius:7px; }
.arena-venue-banner { flex-shrink:0; display:flex; align-items:center; gap:8px; min-height:42px; padding:4px 10px; border:1px solid var(--venue-secondary); border-radius:var(--venue-radius); background:linear-gradient(100deg,var(--venue-hud),#07112b9e); box-shadow:inset 0 1px #ffffff24; }
.arena-emblem { flex-shrink:0; font:800 23px/1 system-ui; color:var(--venue-accent); text-shadow:0 0 10px var(--venue-accent); }
.arena-venue-banner>div { min-width:0; flex:1; }
.arena-venue-banner strong { display:block; color:#fff; font:800 14px/1.4 system-ui; letter-spacing:.3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.arena-venue-banner small { display:block; font:500 8px/1.5 system-ui; color:var(--venue-secondary); }
.arena-match-fee { border-left:1px solid #ffffff35; padding-left:10px; text-align:right; flex-shrink:0; }
.arena-match-fee .coin { font:750 13px/1.6 system-ui; color:#ffe19a; }
.arena-match-fee .coin:before { width:13px; height:13px; font-size:7px; }
.game-shell[data-venue] .arena-meter { border-color:var(--venue-secondary); background:linear-gradient(180deg,var(--venue-hud),#071027df); border-radius:var(--venue-radius); box-shadow:inset 0 1px #ffffff30; }
.game-shell[data-venue] .energy-line .vertical-meter { border-color:var(--venue-accent); }
.game-shell[data-venue] .energy-line .vertical-meter i { background:linear-gradient(0deg,var(--venue-accent),var(--venue-secondary)); }
.game-shell[data-venue] .energy-line>button { color:var(--venue-accent); }
.game-shell[data-venue] .power-wrap .cue-power { border-color:var(--venue-secondary); background:#020819; }
.game-shell[data-venue] .cue-power i { background:linear-gradient(180deg,var(--venue-secondary),var(--venue-accent)); }
.game-shell[data-venue] .power-handle { background:var(--venue-secondary); border-color:var(--venue-accent); color:#15223b; }
.game-shell[data-venue] .power-wrap.pulling { border-color:var(--venue-accent); box-shadow:0 0 7px var(--venue-accent); }
.game-shell[data-venue] .cue-boost { color:var(--venue-secondary); }
.game-shell[data-venue] .potted-row,.game-shell[data-venue] .game-controls.cue-controls { border-color:var(--venue-secondary); background:linear-gradient(125deg,var(--venue-hud),#07152dec); border-radius:var(--venue-radius); }
.game-shell[data-venue] .aim-circle { border-color:var(--venue-accent); background:var(--venue-hud); }
.game-shell[data-venue] .aim-circle .icon { color:var(--venue-accent); }
.game-shell[data-venue] .spin-ball { border-color:var(--venue-secondary); box-shadow:0 0 0 2px var(--venue-hud); }
.game-shell[data-venue] .cue-hint { color:#e4efff; }
/* Shape, hierarchy and material vary along with each Arena's palette. */
.game-shell[data-timer=star] .turn-timer { clip-path:polygon(50% 0,62% 28%,94% 32%,72% 55%,82% 95%,50% 76%,18% 95%,28% 55%,6% 32%,38% 28%); border:0; outline:0; background:var(--venue-accent); color:#261f49; font-size:15px; width:46px; height:46px; }
.game-shell[data-timer=hex] .turn-timer { clip-path:polygon(24% 0,76% 0,100% 50%,76% 100%,24% 100%,0 50%); border:0; background:var(--venue-accent); color:#162334; }
.game-shell[data-timer=diamond] .turn-timer { border-radius:12px; border-width:2px; outline:1px solid var(--venue-secondary); box-shadow:0 0 11px var(--venue-accent); }
.game-shell[data-timer=sun] .turn-timer,.game-shell[data-timer=halo] .turn-timer { outline:2px dashed var(--venue-secondary); outline-offset:2px; }
.game-shell[data-theme=pop] .players-bar,.game-shell[data-theme=masters] .players-bar { border-width:2px; border-bottom-width:4px; border-radius:8px; }
.game-shell[data-theme=pop] .arena-venue-banner,.game-shell[data-theme=masters] .arena-venue-banner { border-left-width:5px; text-transform:uppercase; }
.game-shell[data-theme=pop] .aim-circle,.game-shell[data-theme=masters] .aim-circle { border-radius:11px; border-width:2px; }
.game-shell[data-theme=garden] .players-bar,.game-shell[data-theme=kawaii] .players-bar { border-radius:22px; background:linear-gradient(130deg,var(--venue-hud),#45285bbb); }
.game-shell[data-theme=kawaii] .arena-venue-banner strong { color:#ffd5f1; letter-spacing:1px; }
.game-shell[data-theme=kawaii] .aim-circle { border-radius:15px; background:linear-gradient(120deg,#d992fc55,#f87dc333); }
.game-shell[data-theme=coast] .players-bar,.game-shell[data-theme=coast] .arena-venue-banner { border-color:#ffe0c0; background:linear-gradient(100deg,#68485ad9,#253d41db); }
.game-shell[data-theme=coast] .turn-badge { border-radius:15px; color:#27373d; }
.game-shell[data-theme=coast] .arena-meter { border-radius:19px; background:linear-gradient(#694a48e6,#133432eb); }
.game-shell[data-theme=prism] .players-bar,.game-shell[data-theme=prism] .arena-venue-banner { border-color:#c7fff0; background:linear-gradient(120deg,#416570d9,#182c49eb); box-shadow:inset 0 1px 0 #eaffff6a,inset 0 -1px 0 #72c8d355; }
.game-shell[data-theme=prism] .arena-meter { background:linear-gradient(120deg,#426774dd,#112d44f0); border-color:#dcffff; }
.game-shell[data-theme=eclipse] .players-bar { background:linear-gradient(110deg,#101c30ef,#030917ee); border-bottom:3px solid #ff496e; }
.game-shell[data-theme=eclipse] .arena-venue-banner strong { font-family:Georgia,serif; letter-spacing:2px; }
.game-shell[data-theme=eclipse] .aim-circle { border-radius:9px; background:#091225; }
.game-shell[data-theme=aurora] .arena-venue-banner strong { font-family:Georgia,serif; letter-spacing:1px; color:#ffe1b9; }
.game-shell[data-theme=aurora] .players-bar { border-color:#e9bd9d; background:linear-gradient(130deg,#4b2e3be6,#191628ed); }
.game-shell[data-theme=crown] .players-bar,.game-shell[data-theme=crown] .arena-venue-banner { border-color:#c89645; background:linear-gradient(120deg,#3b2b1cee,#080d1cef); }
.game-shell[data-theme=crown] .arena-venue-banner strong { font-family:Georgia,serif; letter-spacing:2px; color:#ffe6a8; }
.game-shell[data-theme=crown] .arena-meter { border-color:#c89645; background:linear-gradient(#3b2b1ced,#080d1cee); }
.game-shell[data-theme=supernova] .players-bar,.game-shell[data-theme=supernova] .arena-venue-banner { border-color:#c3e7ff; background:linear-gradient(130deg,#4b3461dd,#253f55dd,#1c1a3fec); box-shadow:inset 0 1px #effaff88,0 0 5px #c2bbfa44; }
.game-shell[data-theme=supernova] .aim-circle { border-radius:12px; border-color:#9affee; box-shadow:inset 0 0 9px #bd8bfe77; }
.result-modal[data-venue] { position:relative; isolation:isolate; border-color:var(--venue-accent); background:var(--venue-hud); }
.result-venue-scenery { position:absolute; inset:0; width:100%; height:100%; z-index:-2; pointer-events:none; }
.result-modal[data-venue]:before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(#041029bd,#041029eb 65%); pointer-events:none; }
.result-modal[data-venue] .result-rewards { border-color:var(--venue-accent); background:var(--venue-hud); }
.result-modal[data-venue] .progress i { background:linear-gradient(90deg,var(--venue-accent),var(--venue-secondary)); }
@media(max-width:365px) {
 .arena-venue-banner { gap:6px; padding:4px 7px; min-height:39px; }
 .arena-emblem { font-size:19px; }
 .arena-venue-banner strong { font-size:12px; }
 .arena-venue-banner small { font-size:7px; }
 .arena-match-fee { padding-left:6px; }
 .arena-match-fee .coin { font-size:11px; }
}
@media(max-height:650px) {
 .arena-venue-banner { min-height:32px; padding-top:2px; padding-bottom:2px; }
 .arena-venue-banner strong { font-size:12px; }
 .arena-venue-banner small { font-size:7px; }
 .game-shell[data-timer=star] .turn-timer { width:41px; height:41px; }
}

/* Clear single-layer typography, including Khmer clusters and result screens. */
.brand,.brand span,.result-modal .victory,.result-modal .victory.khmer-title,
.result-modal h2,.result-modal h3,.result-modal .eyebrow,.result-modal button {
 text-shadow:none; -webkit-text-stroke:0; font-synthesis:none;
}
/* A focused close control uses one border, without a second outline ring. */
dialog .dialog-close { box-shadow:none; }
dialog .dialog-close:focus-visible { outline:none; border-color:#94ffe9; background:#163c51; }
.result-modal { outline:none; }

/* Reference postcard UI: intrinsic card proportions, full-sheet vertical scrolling. */
dialog.arena-selector{color-scheme:light;width:min(calc(100% - 10px),550px);height:auto;max-height:calc(100dvh - 12px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));padding:12px 10px 18px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;border:1px solid #fff;border-radius:22px;background:#fff8ec url('/assets/arena-postcard-background-v3.3.1.png') top center/100% auto no-repeat;color:#0d2c62;box-shadow:0 18px 75px #061c4066}
dialog.arena-selector[open]{display:block}
dialog.arena-selector::-webkit-scrollbar{display:none}
.arena-selector .postcard-piece{display:block;overflow:hidden;pointer-events:none;flex-shrink:0}
.arena-selector .venue-header{position:relative;height:49px;min-height:49px;padding:0;display:flex;justify-content:flex-end;align-items:center;margin:0}
.arena-selector .postcard-logo{position:absolute;left:50%;top:-1px;transform:translateX(-50%);width:34%;max-width:175px;height:auto;mix-blend-mode:multiply}
dialog.arena-selector .dialog-close{position:absolute;left:12px;right:auto;top:20px;width:36px;height:36px;min-width:36px;min-height:36px;margin:0;float:none;border:1px solid #fff;border-radius:13px;background:#fffefa;box-shadow:0 2px 7px #60512b33;color:#123468;font:800 32px/1 Georgia,serif;padding:0;z-index:3}
.arena-selector .venue-header .coin-pill{display:flex;align-items:center;gap:4px;padding:5px 5px 5px 6px;max-width:33%;min-height:36px;border:3px solid #fff;border-radius:22px;background:linear-gradient(110deg,#0c346b,#082150);box-shadow:0 3px 7px #78613c40;color:#fff6d9}
.arena-selector .postcard-coin{width:20px;height:22px;border-radius:50%}
.arena-selector .coin-pill>span{font:850 clamp(8px,2.55vw,12px)/1.3 system-ui;white-space:nowrap;color:#fff6d9}
.arena-selector .coin-pill>b{display:grid;place-items:center;flex-shrink:0;width:18px;height:18px;border-radius:50%;background:#3ce5c1;color:#0a3151;font:800 18px/1 system-ui}
.arena-selector .postcard-heading{height:auto;width:66%;margin:0 auto 6px;padding:0;line-height:0}
.arena-selector .postcard-title{width:100%;height:auto;mix-blend-mode:multiply}
.arena-selector :is(.venue-mode-tabs,.venue-kind-tabs,.venue-region-tabs){display:flex;gap:2px;padding:2px;margin:6px auto;border:1px solid #e7dfd1;border-radius:13px;background:#fffefa;box-shadow:0 2px 6px #78613c25}
.arena-selector .venue-mode-tabs{width:78%}
.arena-selector :is(.venue-kind-tabs,.venue-region-tabs){width:70%}
.arena-selector :is(.venue-mode-tabs,.venue-kind-tabs,.venue-region-tabs) button{display:flex;align-items:center;justify-content:center;gap:5px;min-width:0;flex:1;min-height:32px;padding:4px 3px;border:0;border-radius:11px;background:none;color:#102e65;box-shadow:none;font:750 clamp(10px,2.8vw,13px)/1.3 system-ui}
.arena-selector :is(.venue-mode-tabs,.venue-kind-tabs) button.active{background:linear-gradient(120deg,#168aff,#0148ee);color:#fff;box-shadow:inset 0 2px 3px #ffffff7a,0 1px 4px #0060ff33}
.arena-selector .venue-region-tabs button{min-height:28px;font-size:clamp(9px,2.65vw,12px)}
.arena-selector .venue-region-tabs button.active{color:#043746;background:linear-gradient(110deg,#a3ffdf,#57edcd);box-shadow:inset 0 1px 5px #fff,0 0 8px #30e2bb66}
.arena-selector :is(.postcard-symbol,.venue-kind-tabs .icon,.venue-region-tabs .icon){width:18px;height:18px;flex-shrink:0;display:block}
.arena-selector .venue-kind-tabs span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px}
.arena-selector .arena-scroll{display:block;flex:none;min-height:0;margin:0 -10px;padding:0;overflow:visible}
.arena-selector .postcard-stage{position:relative}
.arena-selector .venue-track{display:flex;align-items:flex-start;gap:12px;min-height:0;height:auto;flex:none;margin:0;padding:10px 0 14px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:19%;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-x pan-y;isolation:isolate;contain:paint}
.arena-selector .venue-track:before,.arena-selector .venue-track:after{content:'';flex:0 0 calc((100% - var(--arena-card-width,62%))/2 - 12px)}
.arena-selector .venue-card{position:relative;flex:0 0 var(--arena-card-width,62%);aspect-ratio:1092/1440;min-width:0;height:auto;padding:0;border:0;border-radius:12px;background:transparent;overflow:visible;box-shadow:none;transform:none;transition:none;scroll-snap-align:center;scroll-snap-stop:normal;filter:none}
.arena-selector .venue-card.selected{transform:none;filter:none}
.arena-selector .postcard-frame{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:fill;pointer-events:none;user-select:none;z-index:2}
.arena-selector .venue-art{position:absolute;top:6%;left:7%;width:86%;height:70%;min-height:0;padding:0;border-radius:4px;background:#0b1730;z-index:0;overflow:hidden;color:#fff}
.arena-selector .venue-scene{inset:0;width:100%;height:100%;z-index:0}
.arena-selector .venue-art:has(.venue-scene):after{display:none}
.arena-selector .venue-art:has(.venue-scene) .venue-art-top{position:absolute;inset:6px 7px auto auto;display:block;width:58px;z-index:3}
.arena-selector .venue-tier{display:block;max-width:100%;padding:4px 2px;text-align:center;font:800 7px/1.2 system-ui;letter-spacing:.2px;color:#164074;border:1px dashed #6e8da0;border-radius:1px;background:#fff5e5ee;transform:rotate(-9deg);box-shadow:0 2px 2px #1114;text-transform:uppercase}
.arena-selector .venue-tier small{display:block;color:#164074;font:800 6px/1.4 system-ui;margin:2px 0}
.arena-selector .venue-tier .postcard-symbol{width:25px;height:25px;margin:2px auto 0;color:#7295b3}
.arena-selector .venue-flag{display:none}
.arena-selector .venue-art:has(.venue-scene) .venue-selected{position:absolute;left:7px;top:8px;bottom:auto;display:none;padding:5px 8px;border:1px solid #a4cdff;border-radius:20px;background:linear-gradient(120deg,#148bff,#034bea);box-shadow:0 2px 4px #06266740;color:#fff;font:850 8px/1.3 system-ui;letter-spacing:.3px;z-index:3}
.arena-selector .venue-card.selected .venue-art .venue-selected{display:block}
.arena-selector .postcard-caption{position:absolute;left:8%;right:4%;top:76%;padding:0;text-align:center;z-index:3}
.arena-selector .postcard-pin{position:absolute;left:50%;top:-10px;transform:translateX(-50%);font:850 15px/1 Georgia,serif;color:#c99d4b}
.arena-selector .postcard-caption h3{width:max-content;max-width:100%;padding:0 3px;margin:0 auto;background:#fff8eac9;color:#102e62;font:800 clamp(17px,5.3vw,29px)/1.05 Georgia,serif;letter-spacing:-.6px;white-space:nowrap}
.arena-selector .postcard-caption p{width:max-content;max-width:100%;padding:0 3px;margin:2px auto 0;background:#fff8eadd;color:#173864;font:650 clamp(8px,2.5vw,12px)/1.2 system-ui}
.arena-selector .postcard-caption button{min-width:63px;min-height:29px;padding:2px 7px;margin:3px auto 0;border:1px solid #e9d9b5;border-radius:3px;background:#fff0d0;color:#173565;font:850 17px/1.2 system-ui;box-shadow:0 1px 3px #66502525;transform:rotate(-1deg)}
.arena-selector .postcard-caption .coin{font:850 clamp(13px,4.5vw,21px)/1.2 system-ui;color:#173565}
.arena-selector .venue-record{display:none}
.arena-selector .postcard-arrow{position:absolute;top:43%;width:36px;height:36px;min-width:36px;min-height:36px;padding:0;border:0;border-radius:50%;background:#fffefb;color:#15366a;box-shadow:0 2px 6px #51432930;z-index:4;font:750 32px/1 Georgia,serif}
.arena-selector .postcard-prev{left:9px}.arena-selector .postcard-next{right:9px}
.arena-selector .postcard-arrow:disabled{opacity:.35}
.arena-selector .venue-navigation{display:block;min-height:0;padding:0;margin:-2px 0 6px;text-align:center}
.arena-selector .venue-navigation>span{display:block;font:italic 700 13px/1.2 Georgia,serif;color:#234673}
.arena-selector .venue-navigation>div{display:flex;justify-content:center;align-items:center;gap:7px;margin:2px 0 0}
.arena-selector .venue-navigation i{font:800 11px/1 system-ui;letter-spacing:3px;color:#b5b7b5}
.arena-selector .venue-navigation #venue-position{min-width:46px;font:850 11px/1.4 system-ui;color:#064daf}
.arena-selector .venue-details{display:none;margin:0 18px 8px;border:1px solid #e5dcc8;border-radius:13px;padding:4px 7px;background:#fffdf6e8;color:#3e5278}
.arena-selector .venue-details[open]{display:block}
.arena-selector .venue-details summary{min-height:30px;font:700 11px/1.4 system-ui;color:#204b81;padding:3px}
.arena-selector .venue-details p{background:none;color:#415675;font-size:10px;line-height:1.8;padding:5px 3px}
.arena-selector .venue-details .match-option{margin:5px 0;color:#163d6e;background:#fff8eb;border:1px solid #dfd9cc;border-radius:10px;min-height:44px}
.arena-selector .venue-details select{color:#163d6e;background:#fffdfa;border-color:#ded9d0;min-height:44px}
.arena-selector .arena-footer{border:0;padding:0;background:none;position:relative;margin:0 0 0}
.arena-selector .venue-money{display:grid;grid-template-columns:1fr 1fr;gap:0;padding:7px 4px;margin:0 0 7px;border:1px solid #fff;border-radius:17px;background:#fffefa;box-shadow:0 3px 8px #61502a22}
.arena-selector .venue-money>div{display:flex;align-items:center;gap:7px;min-width:0;padding:0 8px;border:0;background:none;border-radius:0}
.arena-selector .venue-money>div+div{border-left:1px solid #cfd4dd}
.arena-selector :is(.postcard-stack,.postcard-cup){width:28px;height:32px;mix-blend-mode:multiply}
.arena-selector .venue-money small{color:#173762;font:750 9px/1.4 system-ui;white-space:nowrap}
.arena-selector .venue-money strong,.arena-selector .venue-money .coin{color:#102d60;font:850 clamp(15px,5vw,23px)/1.15 system-ui;white-space:nowrap}
.arena-selector .venue-money strong .coin:before{display:none}
.arena-selector[data-large-amounts=true] .venue-money :is(strong,.coin){font-size:clamp(12px,3.8vw,18px)}
.arena-selector .venue-play{display:flex;align-items:center;justify-content:center;gap:9px;position:relative;min-height:47px;padding:8px 30px;border:1px solid #9bc9ff;border-radius:18px;background:linear-gradient(120deg,#1588ff,#004ae9);box-shadow:inset 0 2px 3px #ffffff85,0 3px 7px #133ce733;color:#fff}
.arena-selector .venue-play>.icon{width:25px;height:25px}
.arena-selector .venue-play>span{flex:0 1 auto;text-align:center;font:750 19px/1.4 system-ui;white-space:normal}
.arena-selector .venue-play small{display:none}
.arena-selector .venue-play>b{position:absolute;right:13px;top:50%;transform:translateY(-50%);color:#fff;font:650 30px/1 system-ui}
.arena-selector .venue-play:disabled{background:#cad5e7;color:#60718c;border-color:#b0bfd6;opacity:1;box-shadow:none}
.arena-selector .venue-play:disabled b{color:#60718c}
.arena-selector .venue-footer-links{display:block;text-align:center;position:relative;padding:0;margin:2px 0 0}
.arena-selector .venue-footer-links>small{display:none;color:#984332;padding:4px 5px;background:#fff4e9;font-size:10px;border-radius:8px;line-height:1.5}
.arena-selector[data-affordable=false] .venue-footer-links>small{display:block}
.arena-selector .venue-footer-links>button[data-arena-custom]{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:4px 6px;border:0;background:none;color:#0052d6;font:750 12px/1.4 system-ui;text-decoration:underline;text-underline-offset:3px}
.arena-selector .venue-footer-links>button.postcard-settings{position:absolute;left:0;bottom:0;min-width:32px;min-height:32px;width:32px;padding:0;color:#447293;border:0;background:#fffdf5a8;border-radius:50%;font-size:17px;line-height:1}
.arena-selector .postcard-footer{display:block;margin-top:4px;text-align:center;font:650 8px/1.8 system-ui;color:#709bbc;letter-spacing:1.5px}
.arena-selector .venue-recharge{background:#fffaf0;color:#175096;border-color:#cad6df}
.arena-selector :is(button,select,summary):focus-visible,.arena-selector .venue-track:focus-visible{outline:2px solid #0757ed;outline-offset:1px}
@media(max-width:365px){dialog.arena-selector{padding-inline:8px}.arena-selector .arena-scroll{margin-inline:-8px}.arena-selector .venue-header{height:44px;min-height:44px}.arena-selector .postcard-logo{width:35%}.arena-selector .coin-pill>b{width:15px;height:15px;font-size:15px}.arena-selector .postcard-coin{width:17px;height:18px}.arena-selector .venue-header .coin-pill{gap:2px;padding-inline:4px}.arena-selector .venue-mode-tabs{width:82%}.arena-selector :is(.venue-kind-tabs,.venue-region-tabs){width:76%}.arena-selector :is(.postcard-symbol,.venue-kind-tabs .icon,.venue-region-tabs .icon){width:15px;height:15px}.arena-selector .venue-money>div{padding:0 4px;gap:4px}.arena-selector :is(.postcard-stack,.postcard-cup){width:23px;height:27px}.arena-selector .venue-money small{font-size:8px}.arena-selector .postcard-caption button{min-height:25px;margin-top:2px}.arena-selector .venue-footer-links>button[data-arena-custom]{font-size:11px;gap:4px}.arena-selector .venue-play>span{font-size:17px}}
@media(min-width:480px){.arena-selector .venue-header{height:64px}.arena-selector .postcard-caption{top:77%}.arena-selector .postcard-caption button{min-height:36px;margin-top:4px}.arena-selector .venue-tier{width:78px;font-size:9px}.arena-selector .venue-art:has(.venue-scene) .venue-art-top{width:78px}.arena-selector .venue-selected{font-size:10px}.arena-selector .venue-play{min-height:54px}}
@media(prefers-reduced-motion:reduce){.arena-selector .venue-card{transition:none}}

/* Keep the snap boxes at fixed geometry and avoid extra compositor surfaces. */
.arena-selector .postcard-visual:after{content:'';position:absolute;inset:8px 6px;border-radius:9px;box-shadow:0 4px 7px #55331c35;z-index:-1;pointer-events:none}

/* The old SVG hero showed y=6%..45% of the original scene. Card aspect
   makes height the limiting dimension: height=100/.39, top=-.06/.39. */
.arena-selector .venue-art>img.venue-scene{position:absolute;inset:auto;top:-15.384615%;left:50%;right:auto;bottom:auto;width:auto;height:256.410256%;max-width:none;object-fit:fill;filter:none;transform:translateX(-50%);pointer-events:none;user-select:none}
.arena-selector .venue-art .venue-art-top{position:absolute;inset:6px 7px auto auto;display:block;width:58px;z-index:3}
.arena-selector .venue-art .venue-selected{position:absolute;left:7px;top:8px;bottom:auto;display:none;padding:5px 8px;border:1px solid #a4cdff;border-radius:20px;background:linear-gradient(120deg,#148bff,#034bea);box-shadow:0 2px 4px #06266740;color:#fff;font:850 8px/1.3 system-ui;letter-spacing:.3px;z-index:3}
.arena-selector .postcard-footer>span{font:650 8px/1.8 system-ui;letter-spacing:0;margin-left:5px}
@media(min-width:480px){.arena-selector .venue-art .venue-art-top{width:78px}}

/* The timeline belongs to a fixed snap box; the transformed child cannot
   change snap positions as the selected card changes. */
.arena-selector .postcard-visual{position:absolute;inset:0;transform-origin:50% 60%;transition:none}
@supports (view-timeline-name:--arena-card) and (view-timeline-axis:inline) and (animation-timeline:--arena-card){
 .arena-selector .venue-card{view-timeline-name:var(--arena-timeline);view-timeline-axis:inline;view-timeline-inset:0}
 .arena-selector .postcard-visual{animation:arena-card-turn linear both;animation-timeline:var(--arena-timeline);animation-range:0% 100%}
}
@keyframes arena-card-turn{
 0%{transform:translate3d(0,4px,0) rotate(5deg) scale(.95)}
 50%{transform:translate3d(0,0,0) rotate(0deg) scale(1)}
 100%{transform:translate3d(0,4px,0) rotate(-5deg) scale(.95)}
}
@media(prefers-reduced-motion:reduce){.arena-selector .postcard-visual{animation:none!important;transform:none!important;will-change:auto!important}}
