:root{color-scheme:dark;--ivory:#f3e8cb;--gold:#d8b87d;--muted:#afaead;--night:#1d1c1b;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{background:#11100f;color:var(--ivory);font:14px/1.5 var(--font-ui)}body:before{content:'';position:fixed;inset:-20px;background:linear-gradient(#121110c9,#121110e6),var(--arena-image) center/cover;filter:blur(12px);pointer-events:none}button,select,input{font:inherit;color:inherit}button{border:0;cursor:pointer;user-select:none;touch-action:manipulation;background:none}button:disabled{opacity:.43;cursor:default}button:active:not(:disabled){transform:scale(.96)}p,h1,h2,figure{margin:0}svg{fill:currentColor}a{color:var(--gold)}
.game-shell{position:relative;isolation:isolate;container-type:inline-size;width:min(100%,560px);height:100dvh;max-height:1040px;margin:auto;background:#222120 var(--arena-image) center/cover;box-shadow:0 0 120px #0009;overflow:clip}.arena-atmosphere{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 25% 13%,#d6bd731d,transparent 40%),linear-gradient(#13121128,transparent 35%,#17161555);z-index:-1}.game-shell:after{content:'';position:absolute;inset:0;z-index:4;pointer-events:none;box-shadow:inset 0 0 40px #12111077}#game-stage{position:absolute;inset:0}.game-topbar{position:absolute;left:15px;right:15px;top:calc(var(--safe-top) + 8px);height:44px;display:flex;align-items:center;justify-content:space-between;z-index:12;text-shadow:0 2px 6px #000}.top-title{font-family:var(--font-ui);font-weight:650;font-size:17px;letter-spacing:.12em}.icon-button,.brand-crown{width:44px;height:44px;display:grid;place-items:center;color:#dfc99a;font-size:24px}.brand-crown svg{width:26px;height:25px}.icon-button{background:radial-gradient(#1b1a19a8,transparent 70%);border:1px solid #c2ae7926;border-radius:50%}.draw-counter{font-family:var(--font-ui);font-size:12px;color:#c5b996;letter-spacing:.12em}.hero-home{height:100%;padding:calc(var(--safe-top) + 68px) 26px calc(var(--safe-bottom) + 20px);display:flex;flex-direction:column;align-items:center}.home-kicker{font-size:12px;letter-spacing:.18em;color:#c6ba9e;margin-bottom:12px}.hero-showcase{position:relative;flex:1;min-height:0;width:100%;display:grid;place-items:center}.hero-portrait{width:min(65cqw,calc((100dvh - 310px) / 1.5),290px)!important;transform:rotate(-3deg);filter:drop-shadow(0 22px 20px #0008)!important;animation:hero-idle 7s ease-in-out infinite}.hero-showcase:before{content:'';position:absolute;width:80%;height:75%;border-radius:50%;background:radial-gradient(#d2ae6435,transparent 67%);filter:blur(15px)}.hero-arrow{position:absolute;top:39%;font-size:36px;color:#d7bc83;padding:14px;z-index:4;text-shadow:0 2px 5px #000}.hero-arrow.left{left:-14px}.hero-arrow.right{right:-14px}.home-equipment{position:absolute;bottom:3%;left:1%;display:flex;gap:5px;transform:rotate(-8deg);filter:drop-shadow(0 8px 10px #0009)}.home-equipment .game-card{width:clamp(48px,14cqw,72px)}.hero-name{font-size:28px;font-weight:650;letter-spacing:.1em;margin-top:10px;text-shadow:0 3px 10px #000}.hero-affinity{font-size:12px;letter-spacing:.16em;color:#dbc18d;margin-top:2px}.hero-trait{font-size:13px;max-width:290px;text-align:center;line-height:1.65;color:#c5c4c3;margin-top:11px;min-height:42px;text-shadow:0 2px 3px #000}.hero-tabs{display:flex;gap:8px;margin:13px 0 15px}.hero-tab{font-size:12px;border:1px solid #d0b88132;border-radius:20px;padding:8px 18px;color:#b0afae;background:#1a191880}.hero-tab[aria-pressed=true]{color:#f1ddb0;border-color:#d3b37bb0;background:linear-gradient(#bda4722b,#1b1a1980);box-shadow:inset 0 0 12px #dabb6a10}.home-actions{display:grid;grid-template-columns:1fr 1.6fr;gap:10px;width:100%;max-width:400px}.primary-action,.secondary-action{min-height:50px;border-radius:9px;display:flex;justify-content:center;align-items:center;letter-spacing:.045em;font-weight:650}.primary-action{color:#302819;background:linear-gradient(160deg,#f0dfb2,#c6a269 80%);border:1px solid #f1dca4;box-shadow:inset 0 1px 0 #fff9d0,0 4px 0 #655032,0 6px 18px #0005;text-shadow:0 1px 0 #fff5}.secondary-action{background:linear-gradient(#302f2e,#1b1a19);color:#dfd0ac;border:1px solid #b8a17073;box-shadow:inset 0 0 0 2px #1a191840,0 3px 0 #131211}.home-deck-summary{font-size:10px;color:#859797;margin-top:15px;letter-spacing:.03em}
/* The entire board is one game surface, with no document panels. */
.arena{--arena-top:59px;--arena-bottom:145px;--card-max:65px;--rail-clearance:16px;--row-gap:2px;--card:min(15cqw,calc((min(100dvh,1040px) - var(--safe-top) - var(--safe-bottom) - var(--arena-top) - var(--arena-bottom) - 68px - 2 * var(--rail-clearance) - 5 * var(--row-gap)) / 9.81),var(--card-max));position:absolute;top:calc(var(--safe-top) + var(--arena-top));bottom:calc(var(--safe-bottom) + var(--arena-bottom));left:20px;right:20px;display:flex;flex-direction:column;justify-content:space-between;gap:var(--row-gap);z-index:5;transform-origin:center}.rail,.field-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;justify-items:center;gap:5px;flex-shrink:0}.rail-cell{width:var(--card);height:calc(var(--card)*1.5);position:relative}.rail-cell>.game-card{width:100%}.leader-cell:after{content:'';position:absolute;inset:-3px;border:1px solid #d3b97935;border-radius:10px;pointer-events:none}.rail .leader-cell{filter:drop-shadow(0 0 8px #eec6691d)}.empty-hand{width:80%;height:84%;margin:8% auto;border:1px solid #c0b08110;border-radius:7px}.field-slot{width:calc(var(--card)*.82);height:calc(var(--card)*1.23);border:1px solid #c6b78232;border-radius:7px;background:#17161527;position:relative;box-shadow:inset 0 0 15px #11100f35}.field-slot:empty:after{content:'';position:absolute;inset:8px;border:1px solid #c6b78210;border-radius:4px}.field-slot .game-card{position:absolute;width:100%;inset:0}.active-row{display:grid;grid-template-columns:1fr calc(var(--card)*1.6) 1fr;align-items:center;gap:18px;position:relative;flex-shrink:0}.active-slot{width:calc(var(--card)*1.6);height:calc(var(--card)*2.4);position:relative}.active-slot>.game-card{width:100%}.active-empty{position:absolute;inset:5% 5%;border:1px solid #b7ac743b;box-shadow:inset 0 0 18px #100f0e22;border-radius:12px;display:grid;place-items:center}.active-empty svg{width:29px;opacity:.17;color:#dfc486}.power-readout{text-align:right;line-height:1.1;text-shadow:0 3px 8px #000}.power-readout span{display:block;font-size:10px;color:#bdb595;margin-bottom:4px}.power-readout b{font-family:var(--font-stats);font-size:32px;font-weight:700;color:#f1dfb4;display:block;font-variant-numeric:tabular-nums}.active-status{text-align:left}.next-bonus{font-family:var(--font-ui);font-size:11px;white-space:nowrap;color:#a6cfcd;padding:4px 7px;border:1px solid #b0d3c52c;border-radius:10px;background:#1e1d1c70}.crown-marker{position:absolute;width:33px;height:26px;top:-14px;left:50%;transform:translateX(-50%);z-index:6;color:#efcf85;filter:drop-shadow(0 3px 3px #000) drop-shadow(0 0 6px #dcb05455)}.crown-marker svg{width:100%;height:100%;stroke:#725128;stroke-width:.6}.invisible{visibility:hidden!important}.player-sign{height:13px;line-height:13px;font-size:10px;color:#c7b994;text-align:center;letter-spacing:.12em;opacity:.75}.player-sign.mine{margin-top:3px}.pile-count{position:absolute;bottom:-4px;right:-4px;font-family:var(--font-ui);font-size:11px;font-weight:650;background:#262524;border:1px solid #c9ad744f;border-radius:50%;min-width:20px;height:20px;text-align:center;line-height:18px;color:#e2cd9e;z-index:3}.card-back{width:94%;height:94%;margin:3%;border-radius:8px;border:1px solid #ad9663;background:linear-gradient(145deg,#494847,#272625);box-shadow:2px 2px 0 #1e1d1c,3px 3px 0 #b49b6255,inset 0 0 15px #0e0d0c80;position:relative;display:grid;place-items:center}.back-inlay{position:absolute;inset:9%;border:1px solid #cbb47857;border-radius:4px;display:grid;place-items:center}.back-inlay:before{content:'';position:absolute;width:65%;aspect-ratio:1;transform:rotate(45deg);border:1px solid #cbb47838}.back-inlay svg{width:37%;height:auto;color:#d0b47b;filter:drop-shadow(0 2px 2px #0007)}.grave-back{margin:3%;width:94%;height:94%;border:1px solid #bfba9254;border-radius:8px;display:grid;place-items:center;color:#acabaa;background:#23222180;font-size:23px;box-shadow:inset 0 0 18px #0d0c0ba0}
.battle-dock{position:absolute;left:22px;right:22px;bottom:calc(var(--safe-bottom) + 24px);z-index:30;display:flex;flex-direction:column}.dock-options{order:1;display:flex;align-items:center;justify-content:flex-end;min-height:44px;margin:4px 0 0;color:#b7b6b5;font-size:11px}.explain-toggle{display:flex;align-items:center;justify-content:flex-end;gap:7px;min-height:44px;font-size:11px;padding:0}.explain-toggle i{width:24px;height:13px;border:1px solid #afaead4f;border-radius:12px;background:#21201f;position:relative}.explain-toggle i:after{content:'';position:absolute;width:7px;height:7px;left:2px;top:2px;border-radius:50%;background:#858483}.explain-toggle[aria-pressed=true] i:after{left:13px;background:#e5c892}.explain-toggle[aria-pressed=true] i{border-color:#baa06b7a;background:#8f754638}.dock-actions{order:0;display:grid;grid-template-columns:52px 1fr 52px;gap:11px;align-items:center}.auto-button,.speed-button{height:50px;border:1px solid #b5a07075;border-radius:50%;color:#dfc894;background:linear-gradient(#373635,#222120);box-shadow:inset 0 0 0 3px #14131255,0 3px 0 #151413;font-family:var(--font-ui);font-weight:600;font-size:14px}.auto-button[aria-pressed=true]{border-color:#e3c178;background:linear-gradient(#665a3c,#353433);box-shadow:0 0 18px #e0b96623}.dock-actions .primary-action{height:52px;font-size:15px}.battle-caption{position:absolute;left:10px;right:10px;top:47%;pointer-events:none;color:#f2ddaa;text-align:center;font-size:15px;letter-spacing:.12em;text-shadow:0 2px 8px #000,0 0 20px #000;opacity:0;transition:opacity .2s;z-index:10}.battle-caption.visible{opacity:1}
/* Intro dimming belongs to the full camera, below the enlarged card.
   Overscan covers the maximum camera shake; modal backdrops own dimming while open. */
#motion-layer,#fx-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:21}#fx-canvas{z-index:24}#battle-camera:before{content:"";position:absolute;inset:-32px;z-index:20;background:#0a0908;opacity:0;pointer-events:none;transition:opacity .18s}.revealing #battle-camera:before{opacity:.58}body:has(dialog:modal) .revealing #battle-camera:before{opacity:0}.revealing .battle-caption{top:calc(var(--safe-top) + 68px);z-index:23;font-size:14px}.flying-card{position:absolute;transform-origin:0 0;perspective:1000px;will-change:transform;filter:none;z-index:22}.flying-card:before{content:"";position:absolute;inset:2.2% 3.2% 2.25%;border-radius:10% / 6.67%;box-shadow:0 15px 14px #0008;pointer-events:none}.card-flipper{width:100%;height:100%;position:relative;transform-style:preserve-3d}.flight-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}.flight-back{transform:rotateY(180deg)}.flight-front .game-card{width:100%;height:100%;filter:none!important}.flight-back .card-back{border-width:2px}.awaiting-card{pointer-events:auto;cursor:pointer}.reveal-play{appearance:none;background:none;border:0;border-radius:0;box-shadow:none;padding:0;min-height:44px;line-height:1;display:block;cursor:pointer;font-family:var(--font-ui);position:absolute;top:calc(104% - 12px);left:0;right:0;text-align:center;font-size:12px;color:#e0d0af;letter-spacing:.12em;text-shadow:0 2px 5px #000;animation:hint-breathe 2s ease-in-out infinite}.flying-crown{position:absolute;color:#f2d391;filter:drop-shadow(0 0 9px #f8d873) drop-shadow(0 4px 4px #000);transform-origin:0 0}.flying-crown svg{width:100%;height:100%}.battle-pop{position:absolute;z-index:28;pointer-events:none;font-family:var(--font-ui);font-size:29px;font-weight:700;color:#ffe8b8;white-space:nowrap;text-shadow:0 2px 1px #24311e,0 0 15px #000}.battle-pop.reserve{font-family:inherit;font-size:12px;color:#b6e4e5}.battle-pop.guard{font-family:inherit;font-size:14px;color:#c6e6e9}.battle-pop.crown-pop{font-family:inherit;font-size:18px;color:#ffe1a0;letter-spacing:.07em}
.battle-pop.hero-damage-pop{color:#ffb1a4;text-shadow:0 2px 1px #57141a,0 0 16px #e64b42}.battle-pop.hero-heal-pop{color:#b9f1c9;text-shadow:0 2px 1px #333231,0 0 15px #6ad391}
.hero-damage-projectile{position:absolute;z-index:29;pointer-events:none;border-radius:50%;filter:drop-shadow(0 0 8px #f4c77f) drop-shadow(0 0 18px #a83d38);will-change:transform,opacity}.hero-damage-projectile:before,.hero-damage-projectile:after{content:"";position:absolute;inset:-110% -230%;border-radius:50%;background:linear-gradient(90deg,transparent,#ebcf9a66 58%,#fff1c9 85%,transparent);transform:rotate(-10deg);filter:blur(4px)}.hero-damage-projectile:after{inset:-45%;background:conic-gradient(from 20deg,#0000,#fff0bd,#a63838,#0000 60%);filter:blur(2px);animation:hero-projectile-spin .28s linear infinite}.hero-damage-projectile i,.hero-damage-projectile b,.hero-damage-projectile span{position:absolute;inset:14%;border-radius:42% 58% 48% 52%;background:#fff0c7;box-shadow:0 0 12px #e7b96b,0 0 25px #a53131}.hero-damage-projectile b{inset:29%;background:#fff;filter:blur(1px)}.hero-damage-projectile span{inset:-18%;background:none;border:2px solid #d6bd7b88;transform:rotate(45deg)}
.hero-damage-projectile.element-water{filter:drop-shadow(0 0 9px #a6dfe5) drop-shadow(0 0 18px #477f91)}.hero-damage-projectile.element-dark{filter:drop-shadow(0 0 9px #c9a3d5) drop-shadow(0 0 18px #604461)}.hero-damage-projectile.element-fire{filter:drop-shadow(0 0 9px #f0a67b) drop-shadow(0 0 18px #a63832)}.hero-damage-projectile.element-earth{filter:drop-shadow(0 0 9px #d6bd7e) drop-shadow(0 0 18px #6b6641)}.hero-damage-projectile.element-wind{filter:drop-shadow(0 0 9px #b9dfd2) drop-shadow(0 0 18px #777675)}.hero-damage-projectile.element-steel{filter:drop-shadow(0 0 9px #e0dfde) drop-shadow(0 0 18px #7a7978)}
.hero-defeated-0 .rail[data-player="0"] .leader-cell>.game-card,.hero-defeated-1 .rail[data-player="1"] .leader-cell>.game-card{visibility:hidden}.is-cause-focused .game-topbar,.is-cause-focused .battle-dock{filter:brightness(.65)}
/* Overkill carries a cut-glass gold shard into the hero, with its tail behind the flight axis. */
.hero-damage-projectile.is-overkill{border-radius:0;filter:drop-shadow(0 0 4px #fff8e6) drop-shadow(0 0 12px #dfbd73)}
.hero-damage-projectile.is-overkill:before{inset:26% 48% 26% -300%;border-radius:0;background:linear-gradient(90deg,transparent,#b3965633 28%,#e4c98399 75%,#fff9e7);clip-path:polygon(0 50%,100% 0,100% 100%);filter:blur(1px);transform:none}
.hero-damage-projectile.is-overkill:after{inset:41% 42% 41% -360%;background:linear-gradient(90deg,transparent,#fff7d599 72%,#fff);border-radius:0;filter:none;transform:none;animation:none}
.hero-damage-projectile.is-overkill i{inset:20% 5% 20% -15%;border-radius:0;clip-path:polygon(0 50%,58% 0,100% 50%,58% 100%);background:linear-gradient(160deg,#8b6c34,#e6cd8e 42%,#fffdf4 44%,#fff 52%,#b89550 55%,#f4dfad);box-shadow:none}
.hero-damage-projectile.is-overkill b{inset:45% 12% 45% -40%;background:#fffdf5;filter:none;border-radius:0;box-shadow:none}
.hero-damage-projectile.is-overkill span{inset:-15% -6%;background:none;border:1px solid #f5e4b46b;border-radius:50%;transform:scaleY(.48);box-shadow:none}
.hero-hit-number{position:absolute;z-index:32;display:flex;flex-direction:column;align-items:center;pointer-events:none;white-space:nowrap;line-height:1;transform:translate(-50%,-50%);color:#fff9e9;filter:drop-shadow(0 3px 2px #000b);text-shadow:0 2px 0 #453216,0 0 5px #12100ef2;will-change:transform,opacity;isolation:isolate}
.hero-hit-number:before{content:"";position:absolute;z-index:-1;inset:-10% -32%;border-radius:50%;background:radial-gradient(ellipse,#15110cd9 10%,#17130a6b 48%,transparent 72%);filter:blur(5px)}
.hero-hit-number b{font-family:var(--font-stats);font-weight:700;line-height:1;-webkit-text-stroke:.65px #a78b51}
.hero-hit-number span{font-family:var(--font-ui);font-weight:400;font-size:13px;line-height:1.2;color:#f1dfb9;margin-top:3px}
.hero-hit-number.is-shield{color:#e0f2ff}
@keyframes hero-projectile-spin{to{transform:rotate(405deg)}}
/* Collection and controls live in temporary game sheets. */
dialog{color:var(--ivory);background:linear-gradient(150deg,#363534fa,#1f1e1dfa);border:1px solid #b6a37470;border-radius:17px;box-shadow:0 30px 70px #000a;padding:28px 22px;max-height:calc(100dvh - 32px);max-width:calc(100vw - 24px);overflow:auto;scrollbar-width:thin}dialog::backdrop{background:#0c0b0ab8;backdrop-filter:blur(5px)}.dialog-close{position:absolute;top:8px;right:8px;border-radius:50%;width:40px;height:40px;font-size:27px;color:#d2bd91;background:#181716b8;z-index:5;line-height:36px}.sheet-title{font-size:23px;letter-spacing:.02em;margin-bottom:18px;font-weight:650;padding-right:35px}.sheet-subtitle{font-size:12px;color:#abaaa9;margin:-12px 0 18px}.game-sheet{width:360px}.menu-row{display:block;width:100%;text-align:left;font-size:15px;padding:15px 3px;border-bottom:1px solid #e3d29517}.menu-row[aria-pressed=true]{color:#edcf92}.match-options{padding-top:20px;color:#c3c2c1}.match-options summary{cursor:pointer}.match-options label{display:block;margin-top:14px;font-size:12px}.match-options select,.match-options input{width:100%;margin-top:6px;padding:10px;background:#181716;border:1px solid #b8aa7840;border-radius:6px}.inspect-dialog{width:min(430px,94vw);padding:24px 13px 18px}.inspect-dialog .game-card{width:min(350px,calc((100dvh - 135px) / 1.5));margin:auto}.inspect-meta{font-size:12px;text-align:center;margin-top:10px;color:#c9c8c7}.card-id{font-family:var(--font-ui);display:block;text-align:center;font-size:10px;color:#889c99;margin-top:3px}.collection-sheet{width:min(660px,96vw)}.deck-equipment{display:flex;gap:20px;justify-content:center;margin-bottom:22px}.deck-equipment>div{width:65px;text-align:center}.deck-equipment span{font-size:11px;color:#c5c4c3}.deck-row{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid #d6c89315}.deck-row>.game-card{width:44px;flex:0 0 44px}.deck-info{flex:1;min-width:0}.deck-info strong{display:block;font-size:13px}.deck-info small{font-size:10px;color:#acabaa}.quantity{display:flex;align-items:center;gap:8px;font-family:var(--font-ui)}.quantity-button{width:31px;height:35px;border:1px solid #bba87549;border-radius:6px;font-size:19px}.quantity span{width:14px;text-align:center}.deck-footer{display:flex;align-items:center;justify-content:space-between;margin:20px 0 8px;font-size:13px;color:#dec895}.text-button{color:#c5c4c3;font-size:12px;padding:10px}.validation{font-size:12px;color:#e6ad8c;margin-bottom:10px}.collection-sheet .primary-action{width:100%;margin-top:12px}#library-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px 7px}#library-grid figcaption{font-size:11px;color:#b7b6b5;text-align:center;margin-top:4px}.log-entry{padding:15px 0;border-bottom:1px solid #d8c78b1d}.log-entry strong{font-size:13px;color:#e2c993}.log-entry p{font-size:12px;color:#b6b5b4;margin-top:4px}.result-dialog{width:min(375px,92vw);text-align:center;padding:40px 30px 20px;background:radial-gradient(ellipse at top,#4a4b36,#222120 75%);overflow:hidden}.result-crown{width:65px;color:#f4d495;margin:5px auto 20px;filter:drop-shadow(0 0 18px #f4cf705e)}.result-eyebrow{font-size:11px;letter-spacing:.2em;color:#c1c0bf}.result-title{font-size:55px;font-weight:650;letter-spacing:.2em;margin:8px 0 10px;padding-left:.2em;color:#f1d7a1;text-shadow:0 3px 15px #0006}.result-detail{font-size:12px;color:#c0bfbe;margin-bottom:30px}.result-dialog .primary-action,.result-dialog .secondary-action{width:100%;margin:11px 0}#toast{position:fixed;left:50%;bottom:calc(var(--safe-bottom) + 130px);max-width:85vw;transform:translate(-50%,10px);z-index:99;pointer-events:none;background:#e3d2ab;color:#302f2e;border:1px solid #eee0bd;padding:10px 17px;border-radius:8px;font-size:12px;opacity:0;transition:.2s;text-align:center}#toast.show{opacity:1;transform:translate(-50%,0)}
@keyframes hero-idle{0%,100%{transform:rotate(-3deg) translateY(0)}50%{transform:rotate(-1deg) translateY(-6px)}}@keyframes hint-breathe{0%,100%{opacity:.6}50%{opacity:1}}
@media(min-width:700px){.hero-home{padding-left:45px;padding-right:45px}.arena{left:30px;right:30px}.battle-dock{left:35px;right:35px}}
@media(max-width:420px){#library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-home{padding-left:20px;padding-right:20px}.hero-name{font-size:26px}.hero-trait{font-size:12px}.home-equipment{left:0}.arena{left:15px;right:15px}.active-row{gap:12px}.power-readout b{font-size:29px}}
@media(max-height:720px){.hero-home{padding-top:55px;padding-bottom:12px}.home-kicker{margin-bottom:5px;font-size:10px}.hero-name{font-size:22px;margin-top:4px}.hero-trait{font-size:11px;line-height:1.5;margin-top:5px;min-height:33px}.hero-tabs{margin:8px 0 10px}.hero-tab{padding:5px 15px}.home-actions .primary-action,.home-actions .secondary-action{min-height:44px}.hero-portrait{width:min(62cqw,calc((100dvh - 273px) / 1.5),250px)!important}.home-deck-summary{margin-top:10px}.hero-affinity{font-size:10px}.battle-dock{bottom:calc(var(--safe-bottom) + 18px)}.arena{--arena-top:50px;--arena-bottom:134px;--card-max:60px}.game-topbar{top:calc(var(--safe-top) + 4px)}.player-sign{font-size:9px;height:10px;line-height:10px}.power-readout b{font-size:25px}.dock-options{margin-top:4px}.dock-actions .primary-action{height:47px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.game-card{position:relative;aspect-ratio:2/3;width:100%;container-type:inline-size;isolation:isolate;touch-action:manipulation;user-select:none;filter:drop-shadow(0 3px 4px #0005)}.card-surface{position:absolute;inset:0;overflow:hidden;clip-path:inset(2.2% 3.2% 2.25% round 10% / 6.67%)}.card-art,.card-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;transform-origin:0 0}.card-art{clip-path:inset(2.5% 3.5% 2.6% round 10% / 6.67%)}.card-number{position:absolute;transform:translate(-50%,-50%);line-height:1;font-family:var(--font-stats);font-weight:700;font-variant-numeric:lining-nums tabular-nums;color:#fff4d7;text-shadow:0 .2cqw .7cqw #130f0af0;pointer-events:none}.card-name{position:absolute;top:64.45%;left:50%;transform:translate(-50%,-50%);width:75%;text-align:center;font-size:4.5cqw;font-weight:750;line-height:1.2;white-space:nowrap;letter-spacing:-.04em;color:#fff0cf;text-shadow:0 .3cqw .5cqw #000}.card-rules{position:absolute;top:70%;left:15%;width:70%;font-size:3.65cqw;line-height:1.65;font-weight:550;color:#f8f1de;text-shadow:0 .3cqw .4cqw #0009;word-break:keep-all}.art-pending .card-surface{background:#333231}.art-pending .card-surface:before{content:'원화 준비 중';font-size:10cqw;color:#a7a6a5;position:absolute;top:30%;left:10%;right:10%;text-align:center}.game-card[role=button]{cursor:pointer}.game-card[role=button]:hover{filter:drop-shadow(0 0 4px #e4cea455)}
.card-health-socket{position:absolute;z-index:5;transform:translate(-50%,-50%);display:block;object-fit:contain;filter:saturate(.86) brightness(.9) drop-shadow(0 .7cqw .7cqw #090807bb);pointer-events:none}.health-number{z-index:7;color:#fff1d5;text-shadow:0 .22cqw .25cqw #421015,0 0 .7cqw #000}.leader-cell .card-health-socket{filter:saturate(.86) brightness(.9) drop-shadow(0 0 5px #8b343d75) drop-shadow(0 2px 2px #000)}
.hero-shield-badge{position:absolute;right:-8px;bottom:7%;z-index:9;min-width:23px;height:21px;padding:0 4px;border:1px solid #a9d9de;border-radius:11px;background:linear-gradient(145deg,#434241,#262524);box-shadow:0 2px 5px #0009,inset 0 0 7px #a7e9ef2e;display:flex;align-items:center;justify-content:center;gap:1px;color:#bde7e9;font:700 10px var(--font-stats)}.hero-shield-badge svg{width:11px;height:11px}.hero-shield-badge b{font:inherit;color:#f8f7f6}

/* Story-only card composition keeps the face below the top gem/crown in every card size. */
.card-surface>.card-art-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;pointer-events:none}
.card-surface>.card-art-subject{inset:12% 0 0;width:100%;height:88%;object-fit:contain;object-position:50% 0;clip-path:none}

/* Warhaven Bold cap height: 765/1000; digit ink centers: 383–393.5.
   This font-bound .00575em correction centers the ink through size morphs.
   See assets/fonts/warhaven/stats-metrics.json; socket/art positions stay fixed. */
@supports (text-box-trim:trim-both) and (text-box-edge:cap alphabetic){
 .card-number{text-box-trim:trim-both;text-box-edge:cap alphabetic;transform:translate(-50%,calc(-50% + .00575em))}
}

/* Keep the leader portrait clear in hero selection. Statistics remain on battle cards. */

#advance[aria-disabled="true"]:not(:disabled){filter:saturate(.55);cursor:default}

.app-instruction{font-size:14px;line-height:1.7;margin:14px 0;color:#d8d7d6}.app-instruction~button{margin-top:16px;width:100%}

.hero-editions{display:flex;gap:8px;justify-content:center;margin:0 0 8px}.hero-edition{flex:1;max-width:125px;border:1px solid #8c9fa14d;border-radius:8px;padding:10px 5px;color:#cccbca;background:#232221;font:650 13px var(--font-ui)}.hero-edition[aria-pressed=true]{border-color:#cdcccb;color:#f4e6c6;background:#4d4c4b}.edition-note{text-align:center;font-size:10px;color:#adacab;margin:0 0 16px}.hero-budget-number{color:#f4f4e3}

/* The play surface behaves like an app; text inputs retain normal editing. */
.game-shell,dialog{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.game-shell img,dialog img{-webkit-user-drag:none}
input,textarea{-webkit-user-select:text;user-select:text}

/* Battlefield Units overlap horizontally; the five smaller slots remain the Base. */
.arena{--battle-card:min(90px,calc(var(--card) * 1.6))}.active-row{grid-template-columns:42px minmax(0,1fr);gap:8px}.active-slot{width:100%;height:calc(var(--battle-card) * 1.5 + 18px);min-width:0}.battlefield-scroll{width:100%;height:100%;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x;position:relative}.battlefield-scroll::-webkit-scrollbar{display:none}.battlefield-track{position:relative;height:100%;width:max(100%,var(--battlefield-span));min-width:100%}.battlefield-unit{position:absolute;top:17px;width:var(--battle-card);height:calc(var(--battle-card) * 1.5)}.battlefield-unit>.game-card{width:100%;height:100%;touch-action:pan-x}.battlefield-unit .crown-marker{z-index:2;pointer-events:none}.active-slot .active-empty{width:var(--battle-card);height:calc(var(--battle-card) * 1.5 - 8px);left:calc(50% - var(--battle-card) / 2);top:21px;inset-inline-end:auto;bottom:auto}.active-slot .empty-crown{top:3px;left:50%;pointer-events:none}.active-status{position:absolute;right:2px;top:-3px;pointer-events:none;z-index:30}.power-readout{padding-top:15px}.power-readout b{font-size:30px}.active-status .next-bonus{font-size:9px;padding:2px 5px;background:#222120d9}.game-topbar .top-title{letter-spacing:.06em;font-size:16px}.field-row{position:relative}@media(max-width:420px){.active-row{gap:7px;grid-template-columns:37px minmax(0,1fr)}.power-readout b{font-size:27px}}@media(max-height:720px){.power-readout b{font-size:25px}}

/* Wallet chips get their own header row, clear of the title and menu. */
.lobby-topbar{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;height:auto;gap:3px 0}.lobby-topbar .top-title{text-align:center;white-space:nowrap}.lobby-topbar>.currency-chips{grid-column:2/4;grid-row:2;justify-self:end}.hero-home.deck-home{padding-top:calc(var(--safe-top) + 101px)}.deck-sheet-header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-right:25px;margin-bottom:18px;min-width:0}.deck-sheet-header .sheet-title{padding:0;margin:0;min-width:0;overflow-wrap:anywhere}.deck-sheet-header .currency-chips{flex:none}@media(max-width:350px){.lobby-topbar .top-title{font-size:14px;letter-spacing:.035em}.deck-sheet-header .sheet-title{font-size:20px}}@media(max-height:720px){.hero-home.deck-home{padding-top:calc(var(--safe-top) + 93px)}}

.art-zoom-button{width:36px;height:36px;flex:none;border:1px solid #b8b7b65c;border-radius:50%;display:grid;place-items:center;background:#282726ed;color:#dfd3ae;box-shadow:0 3px 10px #13121166;padding:8px;touch-action:manipulation}.art-zoom-button svg{width:20px;height:20px}.inspect-art-stage{position:relative;max-width:100%;display:grid;place-items:center}.inspect-art-stage>.art-zoom-button{position:absolute;right:1px;bottom:8px;z-index:3}
.profile-button{display:flex;align-items:center;gap:9px;min-width:0;max-width:100%;text-align:left;height:44px;padding:0}.profile-avatar{display:block;flex:none;width:37px;height:37px;border-radius:50%;padding:2px;border:1px solid #c2af81;background:linear-gradient(145deg,#9b8e6b,#535251);box-shadow:0 2px 7px #12111077}.profile-avatar img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 25%;border-radius:50%;border:1px solid #2e2d2c}.profile-nickname{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;letter-spacing:.03em;color:#e1d4b4}.profile-name-label{display:block;font-size:12px;color:#c7c6c5}.profile-name-input{display:block;width:100%;padding:12px;margin-top:7px;border:1px solid #b2b1b055;border-radius:8px;background:#201f1e;font-size:16px}.profile-save{width:100%;margin-top:18px}
.lobby-topbar{grid-template-columns:minmax(0,1fr) auto 44px;gap:5px 8px}.lobby-topbar>.profile-button{grid-column:1/3;grid-row:1;justify-self:start}.lobby-topbar>.icon-button{grid-column:3;grid-row:1}.lobby-topbar>.top-title{grid-column:1;grid-row:2;white-space:normal;text-align:left;font-size:15px;line-height:1.25;letter-spacing:.035em}.lobby-topbar>.currency-chips{grid-column:2/4;grid-row:2}.hero-home.deck-home{padding-top:calc(var(--safe-top) + 112px)}@media(max-width:350px){.lobby-topbar>.top-title{font-size:13px}.hero-home.deck-home{padding-top:calc(var(--safe-top) + 116px)}}

.power-readout .power-role-icon{display:block;width:20px;height:20px;margin:0 0 4px auto;color:#caba91;line-height:0}.power-role-icon svg{width:100%;height:100%}.inspect-art-stage>:is(.game-card,.related-card-carousel){width:min(100%,350px,calc((100dvh - 155px) / 1.5))}

.pile[role=button]{cursor:pointer;touch-action:manipulation}.pile[role=button]>.game-card{pointer-events:none}
.preparing-opening .rail .game-card,.preparing-opening .pile[data-zone=deck] .card-back,.preparing-opening .pile[data-zone=deck] .pile-count{visibility:hidden}

/* Mirrored battlefield: reserve equal side gutters and equal card head/foot room. */
.arena{--battle-card:min(76px,calc(var(--card) * 1.45))}.active-row{grid-template-columns:38px minmax(0,1fr) 38px;gap:8px}.active-slot{height:calc(var(--battle-card) * 1.5 + 34px)}.battlefield-unit{top:17px}.active-slot .active-empty{top:17px;height:calc(var(--battle-card) * 1.5)}.active-slot .empty-crown{top:3px}.power-readout{padding-top:0}.power-readout .power-role-icon{width:21px;height:21px}.empty-pile{background:none;box-shadow:none}.empty-pile .pile-count{background:#262524b0}@media(max-width:420px){.active-row{grid-template-columns:31px minmax(0,1fr) 31px;gap:7px}}

/* A shared camera keeps physical cards, flight carriers and their optics together. */
#battle-camera{position:absolute;inset:0;transform-origin:50% 50%}
/* Battle has one menu; the draw counter stays on the screen centerline. */
.battle-topbar{display:grid;grid-template-columns:44px 1fr 44px}.battle-topbar .draw-counter{grid-column:2;justify-self:center}.battle-topbar .icon-button{grid-column:3}
.overkill-pop{position:absolute;z-index:30;pointer-events:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;white-space:nowrap;isolation:isolate;padding:8px 18px 12px;transform-origin:center;filter:none}.overkill-pop::before{content:"";position:absolute;z-index:-1;inset:-10px -18px;background:radial-gradient(ellipse,#080705da 0%,#08070599 38%,#08070538 62%,transparent 78%);filter:blur(3px)}.overkill-pop::after{content:"";position:absolute;left:8%;right:8%;height:1px;bottom:8px;background:linear-gradient(90deg,transparent,#e4cd96 28%,#fff8e8 50%,#e4cd96 72%,transparent);box-shadow:0 0 7px #d1af6455}.overkill-pop span{font-size:clamp(12px,3.6cqw,18px);font-weight:400;letter-spacing:.12em;line-height:1.25;color:#ead5a6;text-shadow:0 1px 3px #000;-webkit-text-stroke:0}.overkill-pop b{font-family:var(--font-stats);font-weight:700;font-size:clamp(38px,11cqw,62px);line-height:1.12;color:#fff8e7;-webkit-text-stroke:.65px #8b7049;paint-order:stroke fill;text-shadow:0 2px 3px #000b,0 0 12px #c49e4b40}
.inspect-dialog{overflow:hidden;max-height:calc(100dvh - 28px)}#inspect-body{display:flex;flex-direction:column;max-height:calc(100dvh - 82px);min-height:0}.inspect-art-stage{flex:none}.inspect-info{flex:none;min-width:0;padding:0 3px 5px}.inspect-info .inspect-meta{margin-top:5px}

/* Equipment silhouettes belong to the empty board slots. */
/* Both rail/Base gaps reserve the same space without visible zone labels.
   Card sizing reserves 2×34px Battlefield insets, 2×16px rail padding and 5 gaps.
   The remaining six card rows need at most (3 + 2.46 + 4.35) × card width. */
.arena>.rail[data-player="1"]{padding-bottom:var(--rail-clearance)}
.arena>.rail[data-player="0"]{padding-top:var(--rail-clearance)}
.equipment-cell>.empty-hand{position:absolute;inset:8% 10%;width:auto;height:auto;margin:0;display:grid;place-items:center;color:#b8af89a0;background:#1e1d1c24;border-color:#bfaf852b;box-shadow:inset 0 0 12px #12111030;pointer-events:none}
.empty-hand svg{display:block;width:88%;height:auto;max-width:36px}
.equipment-cell>.game-card{position:relative;z-index:1}
.equipment-cell.two-handed>.empty-hand{background:#13121166;border-color:#b3a47a12;box-shadow:inset 0 0 16px #0b0a0940}
.equipment-cell.two-handed>.empty-hand svg{visibility:hidden}
#battle-load-status:empty{display:none}

.unclaimed-crown{width:44px;height:35px;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10;pointer-events:none}.power-readout .power-role-icon[hidden]{visibility:hidden;display:block}

/* One selected profile owns the former lobby title area. */
.lobby-topbar{grid-template-columns:minmax(0,1fr) 44px;grid-template-rows:72px auto;gap:2px 8px}.lobby-topbar>.profile-button{grid-column:1;grid-row:1;width:100%;height:72px;gap:12px}.lobby-topbar>.profile-button .player-avatar{flex:none}.lobby-topbar>.profile-button .profile-nickname{font-size:clamp(17px,4.7cqw,21px);font-weight:700;letter-spacing:.01em}.lobby-topbar>.icon-button{grid-column:2;grid-row:1;align-self:start;margin-top:10px}.lobby-topbar>.currency-chips{grid-column:1/3;grid-row:2;justify-self:end}.hero-home.deck-home{padding-top:calc(var(--safe-top) + 123px)}
/* Keep one hit target while each profile visual presses around its own center. */
.lobby-topbar>.profile-button:active:not(:disabled){transform:none}
.lobby-topbar>.profile-button>:is(.player-avatar,.profile-nickname){transform-origin:center}
.lobby-topbar>.profile-button:active:not(:disabled)>:is(.player-avatar,.profile-nickname){transform:scale(.96)}
/* A moving single card has no deck-edge extrusion or outer carrier plate. */
.flight-back .card-back,.flight-back .cosmetic-card-back,.opening-deck-card>.card-back{box-shadow:none;border:0}
.flying-card:before{content:none;display:none}

/* Fit the lobby Hero inside the space left by the enlarged profile header. */
.deck-home .hero-showcase{container-type:size}.hero-home.deck-home .hero-showcase .hero-portrait{width:min(75cqw,calc(90cqh / 1.5),290px)!important}

/* Combat amounts and playback speed share the card stat typeface. Text labels remain UI. */
.combat-number,.speed-button{font-family:var(--font-stats);font-variant-numeric:lining-nums tabular-nums}

/* Keep the battlefield grave stack visually spent; its count and inspected cards stay clear. */
.in-battle .arena .pile[data-zone="grave"] > .game-card > .card-surface::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(0, 0, 0, .36);
  pointer-events: none;
}
/* Connection failures leave a visible retry action after releasing loading. */
.game-connect-retry{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:24px;text-align:center;}

/* Keep the lower options row reserved when tutorials hide the explanation toggle.
   Initial poses are installed synchronously; no animation runs on label updates. */
.battle-dock[data-controls-entrance="running"]{pointer-events:none}

/* Catch dimmed-board taps below the enlarged card, above all board hit targets. */
#motion-layer>.reveal-backdrop{position:absolute;inset:-32px;z-index:0;pointer-events:auto;background:transparent;border:0;border-radius:0;box-shadow:none;padding:0;min-height:0;opacity:1;cursor:pointer;touch-action:manipulation;transform:none}
#motion-layer>.reveal-backdrop:disabled{opacity:1;cursor:default}
/* R168 lobby is ivory stone; battle still uses each player's selected mat. */
body { background: #e9e3d8; }
body::before { background: linear-gradient(#f6f1e8c9,#e9e2d8ed), url("assets/optimized/scene-lobby-ivory-768.007f931d906b.webp") center/cover; }
.game-shell[data-scene=lobby] { background: #f5f1e7 url("assets/optimized/scene-lobby-ivory-768.007f931d906b.webp") center/cover; color: #2c2924; }
.game-shell[data-scene=lobby] .arena-atmosphere { background: linear-gradient(#fffaf322,transparent 35%,#d8c6a222); }
.game-shell[data-scene=lobby]::after { box-shadow: inset 0 0 30px #967b3620; }
.game-shell[data-scene=lobby] :is(.home-deck-name,.home-title,.home-kicker,.top-title,.profile-player-name,.home-player-name) { color: #2c2924; text-shadow: none; }
.game-shell[data-scene=lobby] .game-topbar { text-shadow: none; }

/* Separate painted floor / sapphire / rim, sharing one immutable source texture. */
@property --ultimate-fill { syntax: '<number>'; inherits: true; initial-value: 0; }
.card-ultimate-socket{position:absolute;transform:translate(-50%,-50%);isolation:isolate;transition:--ultimate-fill 620ms cubic-bezier(.16,.7,.2,1)}
.ultimate-texture{position:absolute;left:-5.19823789%;top:-3.63321799%;width:110.4845815%;height:108.47750865%;pointer-events:none}
.ultimate-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.ultimate-well{position:absolute;inset:0;mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1254 1254'%3E%3Cpath fill='white' fill-rule='evenodd' d='M588 256 Q608 277 626 302 Q645 277 660 256 C846 272 986 414 992 586 L977 608 L994 629 C984 808 846 951 660 963 L627 928 L594 963 C407 950 267 809 258 630 L275 608 L258 584 C269 407 408 273 588 256Z'/%3E%3C/svg%3E");mask-size:100% 100%;mask-repeat:no-repeat}
.ultimate-floor{filter:grayscale(1) brightness(.2)}
.ultimate-fill{position:absolute;inset:0;--ultimate-level:calc(79% - var(--ultimate-fill)*60%);clip-path:polygon(0 calc(var(--ultimate-level) + .6%),20% calc(var(--ultimate-level) - .7%),40% calc(var(--ultimate-level) + .5%),60% calc(var(--ultimate-level) - .6%),80% calc(var(--ultimate-level) + .5%),100% calc(var(--ultimate-level) - .5%),100% 100%,0 100%)}
.ultimate-fill::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,transparent calc(var(--ultimate-level) - 1%),#b5eeff80 var(--ultimate-level),#6ccaff20 calc(var(--ultimate-level) + 1.2%),transparent calc(var(--ultimate-level) + 4%));mix-blend-mode:screen;pointer-events:none}
.ultimate-rim{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1254 1254'%3E%3Cpath fill='white' fill-rule='evenodd' d='M0 0H1254V1254H0Z M588 256 Q608 277 626 302 Q645 277 660 256 C846 272 986 414 992 586 L977 608 L994 629 C984 808 846 951 660 963 L627 928 L594 963 C407 950 267 809 258 630 L275 608 L258 584 C269 407 408 273 588 256Z'/%3E%3C/svg%3E");mask-size:100% 100%;mask-repeat:no-repeat}
.ultimate-fill::after{opacity:clamp(0,calc(min(var(--ultimate-fill),1 - var(--ultimate-fill))*40),1)}
.card-ultimate-socket.is-spent{filter:saturate(.25);opacity:.75}
.ultimate-number{color:#efffff;text-shadow:0 1px 2px #071936,0 0 1cqw #1a3d84}
.card-duration-socket{position:absolute;z-index:5;display:block;object-fit:contain;pointer-events:none;filter:drop-shadow(0 .5cqw .4cqw #09080799)}
.duration-number{z-index:7;color:#fff1d5;text-shadow:0 .25cqw .3cqw #17130e,0 0 .8cqw #17130e;}
@media(prefers-reduced-motion:reduce){.card-ultimate-socket{transition:none}}

.ultimate-energy{position:absolute;pointer-events:none;width:24px;height:24px;margin:-12px;z-index:24;border-radius:50%;background:radial-gradient(circle,#edffff,#5bdfff 18%,#2389ec60 45%,transparent 72%);filter:drop-shadow(0 0 9px #208bff);mix-blend-mode:screen}
.ultimate-energy i{position:absolute;border-radius:50%;width:9px;height:9px;background:#a9f5ff;box-shadow:0 0 7px #3db3ff;top:6px;left:-12px}.ultimate-energy i:nth-child(2){top:-8px;left:14px;width:6px;height:6px}.ultimate-energy i:nth-child(3){top:17px;left:-20px;width:4px;height:4px}
.ultimate-gain,.ultimate-title{color:#aeeeff!important;text-shadow:0 0 10px #268be0,0 2px 4px #071c33!important}.ultimate-title{font-size:clamp(17px,5cqw,27px)!important;white-space:nowrap}

/* Dusty sapphire keeps the approved gold ring unchanged. */
.ultimate-gem{filter:saturate(.44) brightness(.91)}
.ultimate-fill::after{filter:saturate(.45)}
.ultimate-number.is-live-gauge{font-size:14.5cqw!important;letter-spacing:-.065em;white-space:nowrap;color:#f3f0e5;text-shadow:0 1px 2px #0c171f,0 0 .5cqw #10232c}
.match-history-entry.is-incompatible{position:relative;min-height:92px;isolation:isolate}
.match-history-entry.is-incompatible>div,.match-history-entry.is-incompatible>button{opacity:.3;filter:grayscale(1)}
.match-history-incompatible{position:absolute;inset:0;z-index:2;display:grid;place-content:center;margin:0;padding:14px 20px;background:#f4f0e6b8;text-align:center;color:#625949;font-size:13px;line-height:1.6;pointer-events:none}
.field-slot-label{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;pointer-events:none;color:#b7ad9673;font-size:9px;line-height:1.15;font-weight:400;text-align:center}
.field-slot-label b{font-family:var(--font-stats);font-size:11px;font-weight:400}
.field-slot:has(.game-card)>.field-slot-label{visibility:hidden}

.arena>.crown-marker{z-index:1000;pointer-events:none}
.arena>.held-crown{position:absolute;grid-area:auto;width:33px;height:26px}
.battlefield-supports{position:absolute;left:0;bottom:0;display:flex;gap:3px;z-index:2;transform:translateY(35%)}
.battlefield-support{position:relative;width:calc(var(--battle-card)*.55);height:calc(var(--battle-card)*.825);filter:drop-shadow(0 0 6px #c4a45b55)}
.battlefield-support>.game-card{width:100%;height:100%}

.ultimate-siphon-stream{position:absolute;inset:0;pointer-events:none;z-index:23;mix-blend-mode:screen}
.ultimate-siphon-stream svg{width:100%;height:100%;overflow:visible}
.siphon-ribbon{fill:none;stroke:#a2ccd9;stroke-width:4;stroke-linecap:round;filter:drop-shadow(0 0 5px #4b859e)}
.siphon-ribbon.ribbon-1{stroke:#e0e9e7;stroke-width:6;filter:drop-shadow(0 0 8px #649db4)}
.siphon-ribbon.ribbon-2{stroke:#719eb5;stroke-width:3}
.ultimate-energy{width:32px;height:32px;margin:-16px;background:radial-gradient(circle,#edf1eb,#a4c7d2 18%,#668da780 45%,transparent 72%);filter:drop-shadow(0 0 10px #6496b2)}
.ultimate-energy i{background:#bbd4db;box-shadow:0 0 7px #6d9eb8}

.card-number.ultimate-number{color:#f3f0e5;-webkit-text-fill-color:currentColor;background-image:none}

.active-slot>.battlefield-supports{left:0;top:50%;bottom:auto;transform:translateY(-35%)}

/* Hero detail reserves a readable rules panel above the two stat medallions. */
.game-card.is-detail[data-type=hero] .card-name{top:50%}
.game-card.is-detail[data-type=hero] .card-rules{top:55%;left:12%;width:76%;font-size:4.25cqw;line-height:1.38}

/* The camera-level crown also clears in-flight cards and their clipping. */
#battle-camera>.held-crown{position:absolute;z-index:30;width:33px;height:26px;pointer-events:none}
.revealing #battle-camera>.held-crown,.revealing .arena>.crown-marker{z-index:19}
.game-shell:not([data-scene=battle]) #battle-camera>.held-crown{display:none}

.game-card.is-detail .ultimate-number.is-live-gauge{font-size:5.8cqw!important;letter-spacing:-.04em}

/* Structured rule labels carry meaning only at the beginning of a rule. */
.rules-paragraph{margin:0;line-height:inherit}.rules-paragraph+.rules-paragraph{margin-top:.55em}
.rule-tag{display:inline-block;vertical-align:.04em;padding:.12em .44em .16em;border-radius:.24em;background:#546069;color:#fff;font-family:var(--font-ui);font-size:.84em;line-height:1.1;font-weight:700;white-space:nowrap;text-shadow:none;-webkit-text-fill-color:currentColor;box-shadow:inset 0 0 0 1px #ffffff30}
.rule-tag-item{background:#536d32;color:#fffbe3}.rule-tag-spell{background:#735a91;color:#fff6ff}.rule-tag-ultimate{background:#304d87;color:#f1f7ff}.rule-tag-debuff{background:#7d3153;color:#fff0f5}.rule-tag-retreat{background:#3c6f69;color:#edfff8}.rule-tag-piercing{background:#8b4931;color:#fff8ea}.rule-tag-mortal{background:#554966;color:#fff4ff}.rule-tag-unique{background:#816324;color:#fff6d5}
.card-keyword-name .rule-tag{font-size:1em}.collection-readable-rules{line-height:1.7}.battle-spec-ultimate-rules{line-height:1.6;font-size:14px}
.game-card.is-detail .card-rules .rule-tag{font-size:.8em}
.ultimate-pips{position:absolute;inset:0;pointer-events:none}
.ultimate-use{position:absolute;width:24%;height:24%;transform:translate(-50%,-50%);pointer-events:none}
.ultimate-use>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.ultimate-use-spent{clip-path:circle(30.5% at 50% 50%);filter:grayscale(1) brightness(.13);opacity:0}
.ultimate-use.is-used>.ultimate-use-spent{opacity:1}

/* Related cards retain the detail card footprint; only their paint overlaps. */
.related-card-carousel{position:relative;isolation:isolate;aspect-ratio:2/3;touch-action:pan-y pinch-zoom;overflow:visible;outline:none;cursor:grab}
.related-card-carousel:active{cursor:grabbing}
.related-card-carousel>.related-card-slide{position:absolute;inset:0;width:100%;height:100%;transform-origin:center;will-change:transform;user-select:none}
.related-card-caption{position:absolute;top:100%;left:-20%;width:140%;padding-top:4px;text-align:center;color:#776b55;font-size:11px;line-height:1.2;pointer-events:none}
.related-card-carousel:focus-visible{outline:none}
:is(.collection-detail-art,.inspect-art-stage):has(>.related-card-carousel){padding-bottom:22px}

.rule-tag-unit{background:#965239;color:#fff7e9}.rule-tag-equipment{background:#c4aa74;color:#272620}.rule-tag-blocker{background:#415566;color:#f2f6f7}

/* Brief inspection reserves one stable artwork row and one scrollable notes row. */
#inspect-dialog{height:min(900px,calc(var(--safe-height,100dvh) - 28px));box-sizing:border-box}
#inspect-body{height:100%;max-height:none;display:grid;grid-template-rows:minmax(0,1fr) 88px minmax(88px,.24fr);row-gap:8px}
#inspect-body .inspect-art-stage{min-height:0;container-type:size;padding:0 26px 24px}
#inspect-body .inspect-art-stage>:is(.game-card,.related-card-carousel){width:min(300px,100cqw,calc(100cqh / 1.5));height:auto;aspect-ratio:2/3}
#inspect-body .inspect-info{margin-top:0;padding-bottom:0;min-height:0;overflow:auto;overscroll-behavior:contain}
#inspect-body>:is(.battle-spec,.inspect-keyword-section){grid-row:3;margin-top:0;min-height:0}
@media(orientation:landscape) and (max-height:540px){
 #inspect-dialog{width:min(720px,calc(var(--safe-width,100dvw) - 24px))}
 #inspect-body{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:max-content minmax(0,1fr);column-gap:14px}
 #inspect-body .inspect-art-stage{grid-area:1/1/3/2;padding-inline:14px}
 #inspect-body .inspect-info{grid-area:1/2}
 #inspect-body>:is(.battle-spec,.inspect-keyword-section){grid-area:2/2}
}