@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&family=Noto+Serif+SC:wght@600;700;900&display=swap";*{box-sizing:border-box}:root{--duration-stagger: 40ms;--duration-micro: 80ms;--duration-quick: .15s;--duration-fast: .25s;--duration-medium: .35s;--duration-slow: .4s;--duration-very-slow: .5s;--ease-smooth-out: cubic-bezier(.22, 1, .36, 1);--ease-in-out: ease-in-out;--ease-out: ease-out;--ease-linear: linear;--ease-bounce: cubic-bezier(.34, 1.36, .64, 1);--ease-bounce-strong: cubic-bezier(.34, 3.85, .64, 1);--distance-micro: 4px;--distance-small: 6px;--distance-base: 8px;--distance-medium: 12px;--distance-large: 30px;--scale-large: .96;--scale-medium: .97;--scale-small: .98;--scale-tiny: .99;--blur-small: 2px;--blur-medium: 3px;--blur-large: 8px;--tilt-perspective: 1000px;--tilt-return: 1s;--tilt-return-ease: cubic-bezier(.22, 1, .36, 1);--tilt-follow: .4s;--tilt-follow-ease: cubic-bezier(.22, 1, .36, 1);--tilt-glare-opacity: .32;--tilt-glare-fade: .3s;--tilt-glare-ease: cubic-bezier(.22, 1, .36, 1);--tabs-dur: .25s;--tabs-ease: cubic-bezier(.22, 1, .36, 1);--tabs-text-muted: rgba(240, 234, 222, .55);--tabs-text-active: #f0eade;--tabs-bar-bg: rgba(22, 29, 47, .85);--tabs-pill-bg: linear-gradient(135deg, #c23a2b, #8b1e15);--panel-open-dur: .4s;--panel-close-dur: .35s;--panel-translate-y: 18px;--panel-blur: 2px;--panel-ease: cubic-bezier(.22, 1, .36, 1);--modal-open-dur: .25s;--modal-close-dur: .15s;--modal-scale: .96;--modal-scale-close: .96;--modal-ease: cubic-bezier(.22, 1, .36, 1);--bg-deep: #080c14;--bg-base: #0e1420;--bg-surface: #161d2f;--bg-elevated: #1c2540;--bg-glass: rgba(22, 29, 47, .72);--glass-border: rgba(212, 168, 83, .12);--glass-border-hover: rgba(212, 168, 83, .28);--glass-blur: 20px;--gold-bright: #f5d273;--gold-primary: #d4a853;--gold-dim: #a07d38;--gold-glow: rgba(212, 168, 83, .25);--red-primary: #c23a2b;--red-light: #e85142;--red-deep: #8b1e15;--red-glow: rgba(194, 58, 43, .25);--teal: #2a8a7a;--teal-light: #3cc4ad;--text-primary: #f0eade;--text-secondary: rgba(240, 234, 222, .68);--text-muted: rgba(240, 234, 222, .4)}html{min-height:100%;background:var(--bg-deep)}body{min-height:100vh;margin:0;color:var(--text-primary);font-family:Inter,Noto Sans SC,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Microsoft YaHei,sans-serif;letter-spacing:0;background:radial-gradient(ellipse 120% 60% at 50% 0%,rgba(28,37,64,.7) 0%,transparent 70%),radial-gradient(ellipse 80% 50% at 80% 100%,rgba(139,30,21,.12) 0%,transparent 60%),linear-gradient(180deg,var(--bg-deep) 0%,var(--bg-base) 100%);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#d4a85333;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#d4a85359}button{font:inherit}.app-shell{width:100%;min-height:100vh;min-height:100dvh;display:grid;align-items:center;padding:28px 18px}.game-panel{width:min(1280px,100%);margin:0 auto}.game-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px;padding-bottom:20px;border-bottom:1px solid rgba(212,168,83,.1)}.game-kicker{margin:0 0 6px;color:var(--gold-primary);font-size:.76rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.game-hero h1{margin:0;color:var(--text-primary);font-family:"Noto Serif SC",serif;font-size:2.65rem;font-weight:900;line-height:1;letter-spacing:.02em;background:linear-gradient(180deg,#f5f0e8,#d4a853);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.game-hero-actions{display:flex;gap:10px}.secondary-action{min-height:40px;border:1px solid rgba(212,168,83,.2);border-radius:10px;padding:0 16px;color:var(--text-primary);font-weight:600;background:#161d2f99;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);cursor:pointer;white-space:nowrap;transition:background var(--duration-quick) var(--ease-out),border-color var(--duration-quick) var(--ease-out),transform var(--duration-quick) var(--ease-out),box-shadow var(--duration-quick) var(--ease-out)}.secondary-action:hover{border-color:var(--gold-primary);background:#161d2fd9;box-shadow:0 0 20px #d4a8531a}.secondary-action:active{transform:translateY(1px)}.secondary-action:focus-visible,.primary-action:focus-visible,.synth-button:focus-visible{outline:2px solid var(--gold-primary);outline-offset:3px}.secondary-action:disabled,.primary-action:disabled,.synth-button:disabled{cursor:not-allowed;filter:none;opacity:.4}.game-view-nav{display:flex;justify-content:center;margin-bottom:20px}.game-view-stack{position:relative;min-width:0}.game-view[hidden]{display:none}.game-view.is-closing{position:absolute;top:0;right:0;bottom:0;left:0;width:100%}.t-tabs{position:relative;display:inline-flex;align-items:center;gap:4px;padding:4px;border-radius:48px;background:var(--tabs-bar-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(212,168,83,.08);box-shadow:0 4px 24px #0000004d}.t-tab{position:relative;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;height:34px;padding:4px 22px;color:var(--tabs-text-muted);font-weight:700;cursor:pointer;border-radius:48px;z-index:1;transition:color var(--tabs-dur) var(--tabs-ease)}.t-tab:not([aria-selected=true]):hover,.t-tab[aria-selected=true]{color:var(--tabs-text-active)}.t-tabs-pill{position:absolute;top:4px;left:0;height:34px;width:0;background:var(--tabs-pill-bg);border-radius:48px;transform:translate(0);transition:transform var(--tabs-dur) var(--tabs-ease),width var(--tabs-dur) var(--tabs-ease);will-change:transform,width;z-index:0;pointer-events:none;box-shadow:0 2px 12px var(--red-glow)}.t-panel-slide{transform:translateY(var(--panel-translate-y));opacity:0;filter:blur(var(--panel-blur));pointer-events:none;transition:transform var(--panel-close-dur) var(--panel-ease),opacity var(--panel-close-dur) var(--panel-ease),filter var(--panel-close-dur) var(--panel-ease);will-change:transform,opacity,filter}.t-panel-slide[data-open=true]{transform:translateY(0);opacity:1;filter:blur(0);pointer-events:auto;transition:transform var(--panel-open-dur) var(--panel-ease),opacity var(--panel-open-dur) var(--panel-ease),filter var(--panel-open-dur) var(--panel-ease)}.rules-overlay{position:fixed;z-index:100;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;overflow-y:auto;padding:24px;background:#05080ec7;opacity:0;transition:opacity var(--modal-open-dur) var(--modal-ease)}.rules-overlay[hidden]{display:none}.rules-overlay.is-open{opacity:1}.rules-overlay:not(.is-open){transition-duration:var(--modal-close-dur)}.has-open-dialog{overflow:hidden}.t-modal{transform-origin:center;transform:scale(var(--modal-scale));opacity:0;pointer-events:none;transition:transform var(--modal-open-dur) var(--modal-ease),opacity var(--modal-open-dur) var(--modal-ease);will-change:transform,opacity}.t-modal.is-open{transform:scale(1);opacity:1;pointer-events:auto}.t-modal.is-closing{transform:scale(var(--modal-scale-close));opacity:0;pointer-events:none;transition:transform var(--modal-close-dur) var(--modal-ease),opacity var(--modal-close-dur) var(--modal-ease)}.rules-dialog{width:min(860px,100%);max-height:min(780px,calc(100dvh - 48px));overflow-y:auto;border:1px solid var(--glass-border-hover);border-radius:14px;padding:28px;color:var(--text-primary);background:#0e1420fa;box-shadow:0 24px 80px #0000008f}.rules-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.rules-header h2{margin:0;color:var(--gold-bright);font-family:"Noto Serif SC",serif;font-size:2rem;letter-spacing:.02em}.rules-close{width:40px;height:40px;display:grid;flex:0 0 40px;place-items:center;border:1px solid rgba(212,168,83,.2);border-radius:50%;padding:0;color:var(--text-primary);font-size:1.55rem;line-height:1;background:#161d2fcc;cursor:pointer}.rules-close:hover,.rules-close:focus-visible{border-color:var(--gold-primary);outline:none}.rules-summary{margin:16px 0 24px;color:var(--text-secondary);line-height:1.6}.rules-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.rules-step{min-width:0;border-left:2px solid var(--gold-dim);padding:4px 16px 14px;background:linear-gradient(90deg,rgba(212,168,83,.06),transparent)}.rules-step>span{color:var(--red-light);font-size:.72rem;font-weight:900;letter-spacing:.08em}.rules-step h3{margin:7px 0;font-family:"Noto Serif SC",serif;font-size:1.05rem;letter-spacing:.02em}.rules-step p,.rules-notes p{margin:0;color:var(--text-secondary);font-size:.88rem;line-height:1.65}.rules-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:22px;border-top:1px solid var(--glass-border);padding-top:18px}.rules-notes strong{color:var(--gold-primary)}@media (prefers-reduced-motion: reduce){.t-tabs-pill,.t-tab,.t-panel-slide,.rules-overlay,.t-modal{transition:none!important}}@media (max-width: 560px){.app-shell{align-items:start;padding:18px 12px}.game-hero{align-items:flex-start;flex-direction:column}.game-hero h1{font-size:2.1rem}.game-hero-actions{width:100%}.game-hero-actions .secondary-action{flex:1 1 0}.rules-overlay{align-items:end;padding:12px}.rules-dialog{max-height:calc(100dvh - 24px);border-radius:12px;padding:22px 18px}.rules-grid,.rules-notes{grid-template-columns:1fr}}@keyframes ssr-breathe{0%,to{box-shadow:0 0 0 1px #d4a8534d,0 0 20px #d4a8531a,0 8px 32px #0006}50%{box-shadow:0 0 0 1px #d4a85380,0 0 30px #d4a85333,0 8px 32px #0006}}@keyframes shimmer-sweep{0%{transform:translate(-100%) rotate(12deg)}to{transform:translate(200%) rotate(12deg)}}.card-game{display:grid;gap:20px}.pack-panel,.pull-panel,.collection-panel{border:1px solid var(--glass-border);border-radius:14px;background:var(--bg-glass);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));box-shadow:0 8px 40px #00000059,inset 0 1px #ffffff0a}.pack-panel{display:grid;grid-template-columns:minmax(220px,.9fr) 1.4fr;gap:18px;padding:18px}.pack-art{position:relative;min-height:280px;overflow:hidden;border-radius:12px;background:linear-gradient(145deg,#8b1e15b3,#080c14e6),linear-gradient(to bottom right,#1c2540,#080c14);will-change:transform;border:1px solid rgba(212,168,83,.15)}.pack-art-image{position:absolute;top:12px;right:12px;bottom:12px;left:12px;border-radius:10px;background-image:url(../cards/three-kingdoms-card-sheet.png);background-size:155%;background-position:50% 50%;filter:saturate(1.15) contrast(1.08) brightness(.85)}.pack-art:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 35%,rgba(212,168,83,.08),transparent 40%),linear-gradient(180deg,transparent 40%,rgba(8,12,20,.85))}.pack-seal{position:absolute;left:18px;right:18px;bottom:18px;z-index:1;border:1px solid var(--gold-primary);border-radius:10px;padding:12px 14px;color:var(--gold-bright);font-size:.78rem;font-weight:900;letter-spacing:.15em;text-align:center;text-transform:uppercase;background:#080c14cc;box-shadow:0 0 20px #d4a8531f,inset 0 0 12px #d4a8530d}.pack-actions{display:grid;align-content:space-between;gap:14px}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.stat-card{min-height:68px;display:grid;align-content:center;border-radius:10px;padding:10px 12px;color:var(--text-primary);background:linear-gradient(145deg,var(--bg-elevated),var(--bg-surface));border:1px solid rgba(255,255,255,.04);box-shadow:inset 0 1px #ffffff08}.stat-card span{font-size:.76rem;font-weight:600;color:var(--gold-dim);letter-spacing:.02em}.stat-card strong{margin-top:3px;font-size:clamp(1.25rem,4vw,1.85rem);line-height:1;background:linear-gradient(180deg,#f5f0e8,var(--gold-primary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.action-row{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:10px}.primary-action,.secondary-action,.synth-button{min-height:44px;border:0;border-radius:10px;padding:0 16px;font-weight:800;cursor:pointer;transition:transform var(--duration-quick) var(--ease-out),filter var(--duration-quick) var(--ease-out),opacity var(--duration-quick) var(--ease-out),box-shadow var(--duration-quick) var(--ease-out)}.primary-action{color:#fff;background:linear-gradient(135deg,var(--red-light),var(--red-primary),var(--red-deep));box-shadow:0 4px 16px var(--red-glow);border:1px solid rgba(232,81,66,.3)}.secondary-action{color:var(--text-primary);background:#161d2fb3;border:1px solid rgba(212,168,83,.18)}.primary-action:hover{filter:brightness(1.12);box-shadow:0 6px 24px var(--red-glow),0 0 0 1px #e8514266;transform:translateY(-1px)}.secondary-action:hover{border-color:var(--glass-border-hover);background:#161d2fe6}.synth-button:hover{filter:brightness(1.1);box-shadow:0 4px 20px var(--gold-glow);transform:translateY(-1px)}.primary-action:active,.secondary-action:active,.synth-button:active{transform:translateY(1px)}.status-line{min-height:24px;margin:0;color:var(--text-secondary);font-size:.92rem}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:16px 18px 0;color:var(--gold-primary);font-weight:900;font-family:"Noto Serif SC",serif;letter-spacing:.03em}.section-heading small{color:var(--text-muted);font-size:.82rem;font-weight:600;font-family:Inter,Noto Sans SC,sans-serif}.pull-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;padding:14px 18px 18px;perspective:900px}.empty-pulls{grid-column:1 / -1;min-height:110px;display:grid;place-items:center;border:1px dashed rgba(212,168,83,.15);border-radius:10px;color:var(--text-muted);background:#161d2f4d}.mini-card{min-width:0;overflow:hidden;border:1px solid rgba(212,168,83,.12);border-radius:10px;background:var(--bg-surface);transform-origin:50% 60%;transform-style:preserve-3d;will-change:transform,opacity;transition:border-color var(--duration-quick) var(--ease-out)}.mini-card:hover{border-color:var(--glass-border-hover)}.mini-card .card-art{height:118px}.mini-card-info{display:flex;justify-content:space-between;gap:8px;padding:8px 10px;color:var(--text-primary);font-size:.88rem;background:#080c1480}.mini-card-info span{color:var(--gold-bright);font-weight:800}.collection-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:14px 18px 18px}.hero-card-wrap{min-width:0;perspective:var(--tilt-perspective)}.t-tilt{touch-action:none}.t-tilt-card{position:relative;border-radius:12px;overflow:hidden;transform:perspective(var(--tilt-perspective)) rotateX(var(--tilt-rx, 0deg)) rotateY(var(--tilt-ry, 0deg));transform-style:preserve-3d;transition:transform var(--tilt-return) var(--tilt-return-ease);will-change:transform}.t-tilt-card.is-tilting{transition:transform var(--tilt-follow) var(--tilt-follow-ease)}.t-tilt-glare{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:0;mix-blend-mode:screen;background:radial-gradient(circle 95px at var(--tilt-gx, 50%) var(--tilt-gy, 50%),rgba(255,255,255,.48),rgba(255,255,255,.06) 52%,rgba(255,255,255,0) 84%),radial-gradient(circle 200px at var(--tilt-gx, 50%) var(--tilt-gy, 50%),rgba(255,255,255,.22),rgba(255,255,255,.04) 58%,rgba(255,255,255,0) 78%),radial-gradient(circle 360px at var(--tilt-gx, 50%) var(--tilt-gy, 50%),rgba(255,255,255,.1),rgba(255,255,255,0) 88%);transition:opacity var(--tilt-glare-fade) var(--tilt-glare-ease);z-index:3}.t-tilt.is-hover .t-tilt-glare{opacity:var(--tilt-glare-opacity)}.hero-card{position:relative;min-width:0;overflow:hidden;border:1px solid rgba(255,255,255,.06);border-radius:12px;background:linear-gradient(180deg,#12162a,#0d1020);transform-origin:50% 65%;transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.hero-card.locked{filter:grayscale(.92) brightness(.55)}.hero-card.locked .card-art{opacity:.35}.card-ribbon{position:absolute;top:10px;right:10px;z-index:2;border-radius:999px;padding:5px 10px;font-size:.72rem;font-weight:900;letter-spacing:.04em;overflow:hidden}.rarity-ssr .card-ribbon{color:#1a1206;background:linear-gradient(135deg,var(--gold-bright),var(--gold-primary));box-shadow:0 2px 8px #d4a85359}.rarity-sr .card-ribbon{color:#0d1a2d;background:linear-gradient(135deg,#a5c8ff,#7ba6e0);box-shadow:0 2px 8px #7ba6e040}.rarity-ssr .card-ribbon:after{content:"";position:absolute;top:-50%;left:-50%;width:40%;height:200%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);animation:shimmer-sweep 3s ease-in-out infinite}.card-art{position:relative;width:100%;background-size:300% 200%;background-repeat:no-repeat;background-color:var(--bg-surface)}.hero-card>.card-art{height:260px}.hero-card>.card-art:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,transparent 50%,rgba(12,16,32,.6) 100%);pointer-events:none}.hero-card-body{display:grid;gap:10px;padding:14px;color:var(--text-primary)}.hero-card-title{display:flex;justify-content:space-between;gap:10px}.hero-card-title h2{margin:0;font-family:"Noto Serif SC",serif;font-size:1.35rem;line-height:1.05;letter-spacing:.02em}.hero-card-title p,.card-quote{margin:4px 0 0;color:var(--text-secondary);font-size:.86rem;line-height:1.5}.hero-card-title span{width:36px;height:36px;display:grid;flex:0 0 auto;place-items:center;border-radius:50%;color:var(--text-primary);font-weight:900;font-size:.85rem;background:#d4a85326;border:1px solid rgba(212,168,83,.25)}.star-line{color:var(--gold-bright);font-size:1rem;letter-spacing:.1em;text-shadow:0 0 8px rgba(245,210,115,.5)}.card-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.card-meta span{border-radius:8px;padding:7px 6px;color:var(--text-primary);font-size:.78rem;font-weight:700;text-align:center;background:#ffffff0f;border:1px solid rgba(255,255,255,.04)}.synth-button{color:#1a1206;background:linear-gradient(135deg,var(--gold-bright),var(--gold-primary),var(--gold-dim));border:1px solid rgba(245,210,115,.3);box-shadow:0 2px 12px #d4a85326}.synth-button:disabled{cursor:not-allowed;opacity:.35}.rarity-ssr{box-shadow:0 0 0 1px #d4a85340,0 0 24px #d4a8531f,0 8px 32px #0006}.rarity-ssr.owned{animation:ssr-breathe 4s ease-in-out infinite}.rarity-sr{box-shadow:0 0 0 1px #7ba6e033,0 0 20px #648cdc14,0 8px 32px #00000059}.faction-蜀{--faction: #2d9b5a}.faction-魏{--faction: #4478c8}.faction-吴{--faction: #c23a2b}.hero-card:after{content:"";position:absolute;inset:auto 0 0;height:3px;background:var(--faction, var(--gold-primary));box-shadow:0 0 12px var(--faction, var(--gold-primary))}@media (prefers-reduced-motion: reduce){.t-tilt-card{transform:none!important;transition:none!important}.rarity-ssr.owned{animation:none}.rarity-ssr .card-ribbon:after{animation:none}.primary-action,.secondary-action,.synth-button{transition:none}}@media (max-width: 920px){.pack-panel{grid-template-columns:1fr}.collection-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 640px){.stats-grid,.action-row,.pull-strip,.collection-grid{grid-template-columns:1fr}.pack-art{min-height:220px}.mini-card{display:grid;grid-template-columns:110px 1fr}.mini-card .card-art{height:110px}}.battle-intro,.battle-opening,.battle-stage{position:relative;overflow:hidden;border:1px solid var(--glass-border);border-radius:14px;box-shadow:0 8px 40px #0006,inset 0 1px #ffffff08}.battle-intro,.battle-opening{min-height:620px;display:grid;align-items:end;background-image:linear-gradient(90deg,#080c14eb,#080c1473,#080c1426),url(../ui/command-hall-bg.png);background-size:cover;background-position:center}.battle-intro-content{width:min(580px,100%);padding:48px;color:var(--text-primary)}.battle-eyebrow{margin:0 0 10px;color:var(--gold-primary);font-size:.76rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.battle-intro h2,.battle-opening h2,.battle-outcome h2{margin:0;font-family:"Noto Serif SC",serif;font-size:3.4rem;font-weight:900;line-height:1;letter-spacing:.04em;background:linear-gradient(180deg,#f5f0e8 20%,var(--gold-primary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.battle-opponent-line{display:flex;flex-wrap:wrap;gap:8px 20px;margin:20px 0 32px;color:var(--text-secondary);font-size:.9rem;font-weight:700}.battle-opponent-line span{padding:4px 12px;background:#161d2f99;border:1px solid rgba(255,255,255,.06);border-radius:6px}.battle-primary,.battle-secondary,.end-turn-button{min-height:46px;border:0;border-radius:10px;padding:0 20px;font:inherit;font-weight:900;cursor:pointer;transition:transform var(--duration-quick) var(--ease-out),filter var(--duration-quick) var(--ease-out),opacity var(--duration-quick) var(--ease-out),box-shadow var(--duration-quick) var(--ease-out)}.battle-primary,.end-turn-button{color:#fff;background:linear-gradient(135deg,var(--red-light),var(--red-primary),var(--red-deep));border:1px solid rgba(232,81,66,.3);box-shadow:0 4px 16px var(--red-glow)}.battle-secondary{color:var(--text-primary);background:#161d2fb3;border:1px solid rgba(212,168,83,.18)}.battle-primary:hover,.end-turn-button:hover{filter:brightness(1.12);box-shadow:0 6px 24px var(--red-glow);transform:translateY(-1px)}.battle-secondary:hover{border-color:var(--glass-border-hover);background:#161d2fe6}.battle-primary:active,.battle-secondary:active,.end-turn-button:active{transform:translateY(1px)}.battle-primary:disabled,.battle-secondary:disabled,.end-turn-button:disabled{cursor:not-allowed;filter:none;opacity:.4}.battle-primary:focus-visible,.battle-secondary:focus-visible,.end-turn-button:focus-visible,.battle-slot:focus-visible,.battle-hand-card:focus-visible,.commander-crest:focus-visible{outline:2px solid var(--gold-primary);outline-offset:3px}.battle-opening{align-items:center;padding:36px;background-image:linear-gradient(180deg,#080c148c,#080c14e0),url(../ui/command-hall-bg.png)}.opening-header{color:var(--text-primary);text-align:center}.opening-header h2{font-size:2.25rem}.opening-hand{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;width:min(940px,100%);margin:28px auto;perspective:1000px}.opening-card{position:relative;min-width:0;overflow:hidden;border:1px solid rgba(212,168,83,.3);border-radius:12px;color:var(--text-primary);background:linear-gradient(180deg,#12162a,#0d1020);transform-style:preserve-3d;transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.opening-card:hover{border-color:var(--gold-primary);box-shadow:0 8px 30px #d4a8531f}.opening-card .battle-card-art{height:190px}.opening-card>div{display:grid;gap:4px;padding:14px;background:#080c1480}.opening-card strong{font-family:"Noto Serif SC",serif;font-size:1.15rem}.opening-card span,.opening-card p{margin:0;color:var(--text-secondary);font-size:.76rem;line-height:1.45}.opening-actions{display:flex;justify-content:center;gap:12px}.battle-opening>.battle-message{margin-top:14px;text-align:center}.battle-stage{min-height:620px;color:var(--text-primary);background-image:url(../ui/battlefield-bg.png);background-size:cover;background-position:center}.battle-stage-shade{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#080c14a6,#080c141a 35%,#080c1426 65%,#080c14bf),linear-gradient(90deg,rgba(8,12,20,.35),transparent 18%,transparent 82%,rgba(8,12,20,.35));pointer-events:none}.battle-layout{position:relative;z-index:1;min-height:620px;display:grid;grid-template-rows:auto 1fr auto 1fr auto;gap:10px;padding:16px}.battle-hud{display:flex;align-items:center;gap:10px}.enemy-hud{justify-content:center}.commander-crest,.battle-counter,.command-meter{min-height:52px;display:grid;align-content:center;border:1px solid rgba(212,168,83,.2);border-radius:10px;padding:7px 14px;color:var(--text-primary);background:#0c101ce0;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 4px 16px #0000004d}button.commander-crest{min-width:138px;font:inherit;cursor:pointer;transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}button.commander-crest:disabled{cursor:default;opacity:1}.commander-crest span,.battle-counter span,.command-meter span{color:var(--gold-dim);font-size:.7rem;font-weight:800;letter-spacing:.04em}.commander-crest strong,.battle-counter strong,.command-meter strong{color:var(--gold-bright);font-size:1.25rem;line-height:1;text-shadow:0 0 10px rgba(245,210,115,.25)}.commander-crest.is-targetable{border-color:var(--red-light);box-shadow:0 0 0 3px #e8514233,0 0 20px #e851421f;animation:target-pulse 2s ease-in-out infinite}@keyframes target-pulse{0%,to{box-shadow:0 0 0 3px #e8514233,0 0 20px #e851421f}50%{box-shadow:0 0 0 4px #e851424d,0 0 28px #e8514233}}.battle-board{display:grid;grid-template-columns:repeat(3,minmax(90px,112px));align-items:center;justify-content:center;gap:12px;min-height:140px}.battle-slot{position:relative;width:100%;aspect-ratio:4 / 5;min-width:0;overflow:hidden;border:1px solid rgba(240,234,222,.15);border-radius:10px}.battle-slot.is-empty{display:grid;place-items:center;border-style:dashed;border-color:#f0eade1f;color:var(--text-muted);background:#161d2f26;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.battle-slot.is-empty span{width:30px;height:30px;display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;font-size:.75rem}button.battle-unit{display:block;padding:0;color:var(--text-primary);text-align:left;background:linear-gradient(180deg,#12162a,#0d1020);cursor:pointer;transition:transform var(--duration-fast) var(--ease-smooth-out),border-color var(--duration-fast) var(--ease-smooth-out),box-shadow var(--duration-fast) var(--ease-smooth-out)}button.battle-unit:disabled{cursor:default;opacity:1}.battle-unit.is-selected{border-color:var(--gold-bright);box-shadow:0 0 0 3px #f5d27340,0 0 24px #f5d2731f;transform:translateY(-6px)}.battle-unit.is-targetable{border-color:var(--red-light);box-shadow:0 0 0 3px #e8514240,0 0 20px #e851421f}.battle-card-art{display:block;width:100%;height:100%;background-color:var(--bg-surface);background-repeat:no-repeat;background-size:300% 200%}.battle-unit .battle-card-art{position:absolute;top:0;right:0;bottom:44px;left:0;height:auto}.unit-name,.unit-role,.unit-stats,.unit-keyword{position:absolute;z-index:1}.unit-name{left:8px;bottom:24px;font-family:"Noto Serif SC",serif;font-size:.9rem;font-weight:900;text-shadow:0 1px 4px rgba(0,0,0,.6)}.unit-role{left:8px;bottom:8px;color:var(--text-secondary);font-size:.66rem}.unit-stats{right:6px;bottom:6px;display:flex;gap:4px}.unit-stats b,.hand-card-stats b{min-width:24px;height:24px;display:grid;place-items:center;border-radius:50%;color:#fff;font-size:.72rem;background:var(--red-primary);box-shadow:0 2px 6px #0000004d}.unit-stats b:first-child,.hand-card-stats b:first-child{background:var(--teal)}.unit-keyword{top:6px;left:6px;border-radius:6px;padding:3px 7px;color:#1a1206;font-size:.62rem;font-weight:900;letter-spacing:.02em;background:linear-gradient(135deg,var(--gold-bright),var(--gold-primary));box-shadow:0 2px 6px #d4a8534d}.battle-unit:after{content:"";position:absolute;inset:auto 0 0;height:44px;background:linear-gradient(180deg,#0c101cd9,#0c101cf5)}.battle-unit .battle-card-art,.battle-unit:after{position:absolute}.battle-turn-band{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:16px;width:min(720px,100%);min-height:56px;margin:0 auto;border-top:1px solid rgba(212,168,83,.12);border-bottom:1px solid rgba(212,168,83,.12);padding:8px 14px;background:#0c101cb3;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:8px}.battle-turn-band>div{display:grid}.battle-turn-band span{color:var(--gold-primary);font-size:.7rem;font-weight:800;letter-spacing:.04em}.battle-turn-band strong{font-size:.9rem;font-family:"Noto Serif SC",serif}.battle-message{min-width:0;margin:0;color:var(--text-secondary);font-size:.84rem}.battle-player-area{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:end;gap:12px}.player-status{display:grid;gap:8px}.battle-hand{display:flex;align-items:end;gap:8px;min-width:0;overflow-x:auto;padding:8px 4px;scrollbar-width:thin;scrollbar-color:rgba(212,168,83,.2) transparent}.battle-hand-card{position:relative;width:100px;aspect-ratio:3 / 4;flex:0 0 100px;overflow:hidden;border:1px solid rgba(212,168,83,.3);border-radius:10px;padding:0;color:var(--text-primary);text-align:left;background:linear-gradient(180deg,#12162a,#0d1020);cursor:pointer;transition:transform var(--duration-fast) var(--ease-smooth-out),filter var(--duration-fast) var(--ease-smooth-out),border-color var(--duration-fast) var(--ease-smooth-out),box-shadow var(--duration-fast) var(--ease-smooth-out)}.battle-hand-card:hover:not(:disabled){transform:translateY(-10px);border-color:var(--gold-primary);box-shadow:0 8px 24px #d4a85326}.battle-hand-card:disabled{cursor:not-allowed;filter:saturate(.45) brightness(.6);border-color:#ffffff0f}.battle-hand-card .battle-card-art{position:absolute;top:0;right:0;bottom:50px;left:0;height:auto}.hand-cost{position:absolute;top:5px;left:5px;z-index:2;width:26px;height:26px;display:grid;place-items:center;border-radius:50%;color:#fff!important;font-size:.74rem!important;font-weight:900;background:linear-gradient(135deg,var(--teal-light),var(--teal));box-shadow:0 2px 6px #00000059}.hand-card-name,.hand-card-skill,.hand-card-stats{position:absolute;z-index:2}.hand-card-name{left:7px;bottom:29px;font-family:"Noto Serif SC",serif;font-size:.78rem;font-weight:900;text-shadow:0 1px 4px rgba(0,0,0,.5)}.hand-card-skill{left:7px;bottom:10px;max-width:58px;overflow:hidden;color:var(--text-secondary);font-size:.58rem;text-overflow:ellipsis;white-space:nowrap}.hand-card-stats{right:5px;bottom:5px;display:flex;gap:3px}.battle-hand-card:after{content:"";position:absolute;inset:auto 0 0;height:50px;background:linear-gradient(180deg,#0c101ce0,#0c101cf7)}.end-turn-button{min-width:108px;letter-spacing:.02em}.battle-outcome{position:absolute;z-index:5;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:20px;background:#080c14d1;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.battle-outcome-panel{width:min(420px,100%);border:1px solid rgba(212,168,83,.35);border-radius:14px;padding:36px;color:var(--text-primary);text-align:center;background:linear-gradient(180deg,#161d2ff2,#0e1420fa);box-shadow:0 24px 80px #00000080,0 0 40px #d4a85314,inset 0 1px #ffffff0d}.battle-outcome-panel h2{margin-bottom:14px;font-size:2.5rem}.battle-outcome-panel>strong{display:block;margin-bottom:24px;color:var(--text-secondary)}@media (prefers-reduced-motion: reduce){.battle-primary,.battle-secondary,.end-turn-button,.battle-unit,.battle-hand-card{transition:none!important}.commander-crest.is-targetable{animation:none}}@media (max-width: 760px){.battle-intro,.battle-opening{min-height:560px}.battle-intro-content,.battle-opening{padding:22px}.battle-intro h2{font-size:2.5rem}.opening-hand{grid-template-columns:repeat(2,minmax(0,1fr))}.opening-card .battle-card-art{height:150px}.battle-stage,.battle-layout{min-height:660px}.battle-layout{padding:10px}.battle-board{grid-template-columns:repeat(3,minmax(88px,120px));gap:7px;min-height:150px}.battle-player-area{grid-template-columns:1fr auto}.player-status{grid-column:1 / -1;grid-template-columns:repeat(2,minmax(0,1fr))}.battle-hand{grid-column:1}.end-turn-button{grid-column:2;grid-row:2}}@media (max-width: 460px){.battle-opening{padding:16px 12px}.opening-card>div{padding:9px}.opening-card p{display:none}.opening-actions{display:grid;grid-template-columns:1fr 1fr}.battle-hud{gap:6px}button.commander-crest{min-width:118px}.commander-crest,.battle-counter,.command-meter{padding:6px 8px}.battle-board{grid-template-columns:repeat(3,minmax(0,1fr))}.battle-turn-band{grid-template-columns:1fr;gap:4px}.battle-hand-card{width:96px;flex-basis:96px}.end-turn-button{min-width:88px;padding:0 10px}}