:root {
  --ink: #f7f4e8;
  --muted: #a9acb5;
  --panel: rgba(24, 26, 32, .88);
  --line: rgba(255,255,255,.12);
  --gold: #ffc13b;
  --red: #ff4d3d;
  --blue: #43a8ff;
  --green: #67d17b;
}
* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
  margin: 0; color: var(--ink); background: #101216;
  font-family: "SimSun", "宋体", serif;
  font-weight: 700;
  overflow-x: hidden;
}
button { font: inherit; }
.main-menu { min-height: 100vh; display: grid; place-items: center; padding: 22px; background: radial-gradient(circle at 50% 20%, #34394a, #111318 65%); }
.main-menu[hidden], .game-shell[hidden] { display: none; }
.menu-card { width: min(820px, 100%); padding: clamp(22px, 4vw, 42px); border: 1px solid var(--line); border-radius: 24px; background: rgba(24,26,32,.94); box-shadow: 0 28px 90px rgba(0,0,0,.45); }
.menu-card h1 { margin: 8px 0 6px; font-size: clamp(36px, 7vw, 64px); }
.menu-lead { margin: 0 0 24px; color: var(--muted); }
.character-picker { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0; padding: 0; border: 0; }
.character-picker legend { margin-bottom: 10px; color: var(--gold); font-weight: 800; }
.character-option { min-width: 0; min-height: 92px; position: relative; display: flex; align-items: center; gap: 12px; padding: 11px; border: 1px solid var(--line); border-radius: 14px; background: #20232b; cursor: pointer; transition: .15s ease; }
.character-option:hover { border-color: rgba(255,193,59,.65); transform: translateY(-2px); }
.character-option:has(input:checked) { border-color: var(--gold); background: #30291d; box-shadow: inset 0 0 22px rgba(255,193,59,.1); }
.character-option input { position: absolute; opacity: 0; }
.character-option img { width: 70px; height: 70px; object-fit: contain; image-rendering: pixelated; }
.character-option span { min-width: 0; display: grid; gap: 5px; }
.character-option b { font-size: 16px; }
.character-option small { color: var(--muted); }
.character-option em { position: absolute; top: 7px; right: 7px; padding: 3px 6px; color: #17130a; background: var(--gold); font-size: 9px; font-style: normal; font-weight: 900; }
.unavailable-character { width: 100%; color: var(--ink); text-align: left; opacity: .76; filter: saturate(.72); }
.unavailable-character:hover { opacity: 1; border-color: #78e6df; }
.menu-caption { margin: 12px auto 0; width: fit-content; padding: 9px 14px; color: #f4fbff; border: 2px solid #72d8d3; background: #111820; box-shadow: 4px 4px 0 #050609; opacity: 0; transform: translateY(8px); }
.menu-caption.show { opacity: 1; transform: translateY(0); transition: .16s steps(3); }
.menu-caption[hidden] { display: none; }
.follow-gate { margin-top: 14px; padding: 12px 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-left: 3px solid var(--gold); background: rgba(255,193,59,.08); }
.follow-gate[hidden] { display: none; }
.follow-gate p { margin: 0; color: #d8d9de; font-size: 12px; }
.follow-gate button { flex: 0 0 auto; padding: 8px 11px; color: var(--ink); border: 1px solid var(--line); background: #292d36; cursor: pointer; }
.menu-volume { margin-top: 14px; padding: 11px 13px; display: grid; grid-template-columns: auto 1fr 42px; align-items: center; gap: 12px; color: var(--muted); border: 1px solid var(--line); border-radius: 12px; background: #1d2027; font-size: 12px; }
.menu-volume input { width: 100%; accent-color: var(--gold); }
.menu-volume output { color: var(--ink); text-align: right; font: 700 11px "SimSun", "宋体", serif; }
.ai-config { margin-top: 14px; padding: 13px; border: 1px solid #33445e; border-radius: 12px; background: linear-gradient(135deg,rgba(38,71,112,.22),rgba(29,32,39,.96)); }
.ai-config__title { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ai-config__title b { color: #dceaff; }
.ai-config__title span { padding: 3px 7px; border: 1px solid #5a6679; color: var(--muted); font-size: 10px; }
.ai-config__title span[data-state="connected"] { border-color: #48c78e; color: #8ceabf; }
.ai-config__title span[data-state="error"] { border-color: #e45c70; color: #ff9baa; }
.ai-config p { margin: 8px 0; color: #aeb7c7; font-size: 11px; line-height: 1.55; }
.ai-config code { color: #91bfff; }
.ai-config__controls { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.ai-config__controls input { min-width: 0; padding: 10px 11px; color: var(--ink); border: 1px solid var(--line); border-radius: 8px; outline: none; background: #141820; }
.ai-config__controls input:focus { border-color: #6ca9ff; }
.ai-config__controls button { padding: 9px 13px; color: #eaf3ff; border: 1px solid #557bac; border-radius: 8px; background: #27456c; cursor: pointer; }
.ai-config__controls button:disabled { opacity: .55; cursor: wait; }
.ai-config > small { display: block; margin-top: 7px; color: #747f91; font-size: 9px; }
.start-game { width: 100%; margin-top: 16px; padding: 15px; border: 0; border-radius: 12px; color: #17130a; background: var(--gold); font-weight: 900; font-size: 18px; cursor: pointer; }
.start-game:disabled { opacity: .55; cursor: wait; }
.menu-note { display: block; margin-top: 9px; text-align: center; color: #777d89; }
.game-shell { width: min(1180px, 100%); min-height: 100vh; margin: auto; padding: 20px clamp(14px, 3vw, 36px) 28px; display: grid; grid-template-rows: auto 1fr auto; gap: 14px; }
.topbar { display: flex; justify-content: space-between; align-items: center; }
.eyebrow { font: 700 10px/1 "SimSun", "宋体", serif; letter-spacing: .18em; color: var(--gold); }
h1 { margin: 5px 0 0; font-size: clamp(23px, 3vw, 34px); letter-spacing: -.06em; }
.streak-chip { display: inline-flex; gap: 7px; margin-top: 7px; padding: 5px 9px; color: #fff2b4; border: 2px solid #d79318; background: #17130d; box-shadow: 3px 3px 0 #07080b; font: 800 11px "SimSun", "宋体", serif; }
.icon-button { width: 42px; height: 42px; color: var(--ink); background: #242730; border: 1px solid var(--line); border-radius: 50%; cursor: pointer; }
.audio-tools { display: flex; align-items: center; gap: 9px; }
.roster-control, .volume-control { height: 42px; padding: 0 10px; display: flex; align-items: center; gap: 8px; color: var(--muted); background: #1d2027; border: 1px solid var(--line); border-radius: 12px; font-size: 11px; }
.roster-control b { color: var(--ink); }
.volume-control input { width: 90px; accent-color: var(--gold); }
.volume-control output { width: 32px; color: var(--ink); font: 700 10px "SimSun", "宋体", serif; }
.arena {
  min-height: 470px; position: relative; isolation: isolate; overflow: hidden;
  display: grid; grid-template-columns: 1fr 80px 1fr; align-items: end;
  border: 1px solid var(--line); border-radius: 24px;
  background:
    radial-gradient(circle at 50% 88%, rgba(255,193,59,.2), transparent 36%),
    linear-gradient(180deg, #252a34 0 42%, #171a20 42% 100%);
  box-shadow: inset 0 0 70px rgba(0,0,0,.45), 0 22px 60px rgba(0,0,0,.25);
}
.arena::before { content: ""; position: absolute; inset: 42% 0 auto; height: 2px; background: rgba(255,255,255,.08); z-index: -1; }
.arena::after { content: ""; position: absolute; left: 10%; right: 10%; bottom: 34px; height: 82px; border-radius: 50%; background: radial-gradient(ellipse, rgba(0,0,0,.5), transparent 65%); z-index: -1; transform: scale(1.5); transform-origin: 50% 50%; }
.speed-lines { position: absolute; inset: 0; z-index: -2; opacity: .25; background: repeating-linear-gradient(165deg, transparent 0 35px, rgba(255,255,255,.04) 36px 37px); }
.audience-emojis { position: absolute; z-index: 8; inset: 0; overflow: hidden; pointer-events: none; }
.audience-emoji { position: absolute; left: var(--x); top: var(--y); opacity: 0; font-size: clamp(24px,3.4vw,40px); filter: saturate(.95) drop-shadow(0 3px 2px rgba(0,0,0,.24)); animation: audienceReact 9.45s cubic-bezier(.16,.8,.2,1) both; }
.fighter { min-width: 0; height: 100%; padding: 18px; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; position: relative; z-index: 2; }
.status-card { position: absolute; top: 18px; left: 18px; right: 18px; padding: 13px 15px; border: 3px solid #b77b18; background: rgba(10,14,22,.92); border-radius: 0; box-shadow: inset 0 0 0 2px #242d3d, 4px 4px 0 rgba(0,0,0,.65); image-rendering: pixelated; }
.name-row, .numbers { display: flex; justify-content: space-between; align-items: baseline; }
.name-row strong { font-size: 20px; }
.name-row span { font-size: 11px; color: var(--muted); }
.numbers { margin: 4px 0 9px; font: 700 11px/1 "SimSun", "宋体", serif; color: var(--muted); }
.meter { height: 9px; overflow: hidden; background: #0d0f13; border: 1px solid rgba(255,255,255,.08); }
.meter i { display: block; width: 100%; height: 100%; background: var(--green); transition: width .18s linear, background .2s; }
.meter.skill { height: 5px; }
.meter.skill i { width: 0; background: var(--gold); }
.status-card small { display: flex; justify-content: space-between; margin-top: 5px; color: var(--muted); font-size: 10px; }
.status-card small b { color: var(--ink); }
.buff-strip { min-height: 22px; margin-top: 8px; display: flex; flex-wrap: wrap; gap: 4px; }
.buff-strip span { padding: 3px 5px; color: #ffe59b; border: 1px solid #745019; background: #221b12; font: 700 9px/1.3 "SimSun", "宋体", serif; }
.buff-strip--enemy span { color: #ffb6aa; border-color: #743028; background: #291412; }
.sprite-wrap { width: min(34vw, 300px); aspect-ratio: 1; display: grid; place-items: center; transform-origin: 50% 94%; position: relative; }
.sprite { width: 100%; height: 100%; object-fit: contain; image-rendering: pixelated; image-rendering: crisp-edges; user-select: none; transform-origin: 50% 94%; }
.fighter--player .sprite { transform: scaleX(-1); }
.fighter--player .sprite.native-right { transform: scaleX(1); }
.fighter--enemy .sprite.native-right { transform: scaleX(-1); }
.breathing { animation: breathe 1.05s cubic-bezier(.45,0,.55,1) infinite alternate; will-change: transform; }
.fighter--player .breathing { animation-name: breathePlayer; }
.fighter--player .breathing.native-right { animation-name: breathe; }
.fighter--enemy .breathing.native-right { animation-name: breathePlayer; }
/* 脚底锚定不动，身体在 Y 轴 0.9～1.0 间起伏。 */
@keyframes breathe {
  0% { transform: scaleY(.9); }
  100% { transform: scaleY(1); }
}
@keyframes breathePlayer {
  0% { transform: scale(-1,.9); }
  100% { transform: scale(-1,1); }
}
.sprite-wrap.defending { filter: drop-shadow(0 0 5px var(--blue)) drop-shadow(0 0 14px var(--blue)); }
.sprite-wrap.charging { filter: drop-shadow(0 0 6px var(--red)) drop-shadow(0 0 16px var(--red)); animation: chargePulse .35s infinite alternate; }
.sprite-wrap.hit { animation: hitShake .28s steps(2); filter: brightness(1.6) sepia(1) saturate(4); }
.sprite-wrap.stunned { filter: grayscale(.7) brightness(.7); }
.sprite-wrap.frenzy { filter: drop-shadow(0 0 6px #ff421f) drop-shadow(0 0 18px #ff8a00); animation: frenzyPulse .18s steps(2) infinite alternate; }
.caption { position: absolute; z-index: 3; bottom: min(38vw, 315px); min-height: 42px; font-weight: 900; font-size: clamp(22px, 3vw, 36px); color: white; text-shadow: 3px 3px 0 #111, -1px -1px 0 #111; pointer-events: none; }
.caption.long { width: min(42vw, 430px); text-align: center; font-size: clamp(13px, 1.7vw, 20px); line-height: 1.45; }
.caption.long.show { animation-duration: var(--caption-duration, 3.8s); }
.caption.show { animation: captionPop var(--caption-duration, 1.85s) both; }
.boss-intro { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; overflow: hidden; color: #f4f4ed; background: #050608; }
.boss-intro[hidden] { display: none; }
.boss-intro::before, .boss-intro::after { content: ""; position: absolute; inset: 0; pointer-events: none; }
.boss-intro::before { opacity: .65; background: repeating-linear-gradient(0deg,rgba(255,255,255,.09) 0 1px,transparent 1px 4px); animation: memoryScan .12s steps(2) infinite; }
.boss-intro::after { background: linear-gradient(90deg,transparent 0 8%,rgba(255,255,255,.09) 8% 9%,transparent 9% 63%,rgba(255,255,255,.06) 63% 66%,transparent 66%); mix-blend-mode: screen; animation: memoryTear .18s steps(2) infinite; }
.boss-intro__noise { position: absolute; inset: -25%; opacity: calc(.25 + var(--glitch, 0) * .55); background-image: radial-gradient(#fff 0 1px,transparent 1px),radial-gradient(#888 0 1px,transparent 1px); background-position: 0 0,3px 3px; background-size: 6px 6px; animation: memoryNoise .08s steps(2) infinite; }
.boss-intro__year { position: relative; z-index: 2; font: 900 clamp(72px,18vw,220px)/1 "SimSun","宋体",serif; letter-spacing: -.08em; text-shadow: 7px 0 #ff3155,-7px 0 #32bfff,0 0 28px #fff; }
.boss-intro__year.is-blurred { filter: blur(8px); letter-spacing: .02em; transform: scale(1.07); }
.boss-intro__focus { position: absolute; z-index: 3; inset: 0; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at 50% 46%,#252525 0 18%,#050608 52%); }
.boss-intro__focus[hidden] { display: none; }
.boss-intro__focus::after { content:""; position:absolute; inset:0; background:radial-gradient(circle,transparent 28%,rgba(0,0,0,.78) 72%),repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.05) 3px 4px); pointer-events:none; }
.boss-intro__focus img { width:min(78vw,760px); max-height:92vh; object-fit:contain; image-rendering:pixelated; filter:contrast(1.08) grayscale(.15); }
.boss-intro__focus.is-zooming { animation:bossCameraIn 1.15s cubic-bezier(.16,.78,.18,1) both; }
.boss-intro__focus.is-switching { transform:scale(1.72); }
.boss-intro__focus.is-switching::before { content:"FACE MEMORY ERROR"; position:absolute; z-index:4; left:50%; bottom:8%; transform:translateX(-50%); color:#fff; font:900 11px "SimSun","宋体",serif; letter-spacing:.28em; text-shadow:3px 0 #f24,-3px 0 #2cf; }
.boss-intro__focus img.face-swap { animation:bossFaceSwap .13s steps(2) both; }
.boss-intro__focus.is-returning { animation:bossCameraOut .95s cubic-bezier(.4,0,.2,1) both; }
.game-shell.boss-intro-active > .topbar,.game-shell.boss-intro-active > .command-panel { opacity: 0; }
.game-shell.boss-intro-active .arena { opacity: 0; }
.game-shell.boss-intro-active.boss-stage-visible .arena { opacity: 1; }
.game-shell.boss-intro-active .fighter--player,.game-shell.boss-intro-active .status-card,.game-shell.boss-intro-active .cooldown,.game-shell.boss-intro-active .caption,.game-shell.boss-intro-active .versus { opacity: 0; }
.sprite-wrap.boss-hidden { opacity: 0; }
.sprite-wrap.boss-fall { animation: bossFall 1.1s steps(8) forwards; transform-origin: 50% 100%; }
.reward-choice.memory-choice { border-color: #7d87a0; background: linear-gradient(145deg,#242936,#11141a); }
.reward-choice.memory-choice img { filter: grayscale(1) drop-shadow(0 0 8px rgba(255,255,255,.45)); }
.cooldown { width: min(80%, 260px); height: 24px; margin-top: -2px; padding: 3px; position: relative; overflow: hidden; border: 1px solid var(--line); background: rgba(0,0,0,.45); }
.cooldown i { position: absolute; inset: 0; width: 0; background: rgba(255,193,59,.26); }
.cooldown span { position: relative; display: block; text-align: center; font-size: 11px; line-height: 16px; color: #dfe2e8; }
.versus { align-self: center; margin-bottom: 120px; text-align: center; font: 900 italic 28px/1 Arial; color: var(--gold); transform: rotate(-8deg); text-shadow: 3px 3px 0 #000; }
.command-panel { padding: 14px; border: 4px solid #c18820; border-radius: 0; background: rgba(10,14,22,.94); box-shadow: inset 0 0 0 2px #263248, 5px 5px 0 #07080b; }
.round-info { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; }
.round-info span { padding: 6px 8px; background: #101216; color: var(--gold); font: 700 12px/1 "SimSun", "宋体", serif; }
.round-info p { margin: 0; color: #d4d6dc; font-size: 13px; }
.commands { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; }
.commands button { min-width: 0; padding: 11px; display: flex; gap: 9px; align-items: center; text-align: left; color: var(--ink); border: 1px solid var(--line); background: #252933; cursor: pointer; transition: transform .12s, border-color .12s, background .12s; }
.commands button:hover:not(:disabled) { transform: translateY(-2px); border-color: var(--gold); background: #303540; }
.commands button:active:not(:disabled) { transform: translateY(1px); }
.commands button:disabled { opacity: .35; cursor: not-allowed; }
.commands .skill-button:disabled { opacity: 1; color: var(--ink); }
.commands .skill-button:disabled > kbd, .commands .skill-button:disabled > span { opacity: .35; }
.commands kbd { flex: 0 0 27px; width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid #555b67; background: #111318; color: var(--muted); font: 700 11px "SimSun", "宋体", serif; }
.commands span { min-width: 0; display: grid; }
.commands b { font-size: 14px; }
.commands small { overflow: hidden; color: var(--muted); white-space: nowrap; text-overflow: ellipsis; font-size: 10px; }
.commands .skill-button:not(:disabled) { border-color: #a87815; background: linear-gradient(135deg, #463618, #2b251b); box-shadow: inset 0 0 18px rgba(255,193,59,.12); }
.skill-button { position: relative; }
.skill-button::after {
  content: attr(data-tooltip); position: absolute; z-index: 30; left: 50%; bottom: calc(100% + 12px);
  width: min(310px, 76vw); padding: 10px 12px; color: var(--ink); background: #101217;
  border: 1px solid rgba(255,193,59,.55); box-shadow: 0 12px 34px rgba(0,0,0,.45);
  font-size: 12px; line-height: 1.55; white-space: normal; pointer-events: none;
  opacity: 0; transform: translate(-50%, 7px); transition: opacity .15s, transform .15s;
}
.skill-button:hover::after, .skill-button:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }
.hint { margin: 9px 2px 0; color: #777d89; font-size: 10px; }
.result { position: fixed; inset: 0; z-index: 20; display: grid; place-items: center; padding: 20px; background: rgba(8,9,11,.75); backdrop-filter: blur(8px); }
.result[hidden] { display: none; }
.result > div { width: min(390px, 100%); padding: 30px; text-align: center; border: 1px solid var(--line); background: #1b1e25; box-shadow: 0 25px 80px #000; }
.result span { color: var(--gold); font-size: 11px; letter-spacing: .2em; }
.result h2 { margin: 10px 0; font-size: 42px; }
.result p { color: var(--muted); }
.result button { margin-top: 10px; padding: 11px 28px; border: 0; background: var(--gold); color: #17130a; font-weight: 900; cursor: pointer; }
.result .secondary-button { margin-left: 7px; color: var(--ink); background: #303540; }
.coin-revive-actions[hidden] { display:none; }
.coin-revive-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:18px; }
.coin-revive-actions button { margin:0; padding:11px 14px; }
.coin-revive-actions .secondary-button { grid-column:1/-1; margin-left:0; }
.result button[hidden] { display:none; }
.reward { position: fixed; inset: 0; z-index: 24; display: grid; place-items: center; padding: 18px; background: rgba(4,6,11,.82); backdrop-filter: blur(5px); }
.reward[hidden] { display: none; }
.reward-card { width: min(820px,100%); padding: clamp(24px,4vw,38px); color: var(--ink); border: 4px solid #e0a42a; background: #111724; box-shadow: inset 0 0 0 2px #28344a, 6px 6px 0 #050609; image-rendering: pixelated; }
.reward-card h2 { margin: 8px 0; font-size: clamp(28px,5vw,48px); }
.reward-card > p { color: var(--muted); }
.reward-choices { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 22px; }
.reward-choice { min-width: 0; padding: 15px 12px; display: grid; justify-items: center; gap: 8px; color: var(--ink); border: 3px solid #7c5a23; background: #1d2636; box-shadow: inset 0 0 0 2px #0b0e14, 4px 4px 0 #050609; cursor: pointer; }
.reward-choice:hover, .reward-choice:focus-visible { border-color: #ffd25a; transform: translateY(-3px); }
.reward-choice img { width: 84px; height: 84px; object-fit: contain; image-rendering: pixelated; }
.reward-choice b { color: #ffd25a; font-size: 16px; }
.reward-choice small { color: var(--muted); line-height: 1.5; }
@keyframes chargePulse { from { transform: scale(.99); } to { transform: scale(1.02); } }
@keyframes hitShake { 0%,100% { transform: translateX(0); } 25% { transform: translateX(-10px); } 75% { transform: translateX(10px); } }
@keyframes captionPop { 0% { transform: translateY(16px) scale(.5); opacity: 0; } 25%,70% { transform: translateY(0) scale(1.1); opacity: 1; } 100% { transform: translateY(-20px); opacity: 0; } }
@keyframes memoryNoise { from { transform: translate(-2%,-1%); } to { transform: translate(2%,1%); } }
@keyframes memoryScan { from { transform: translateY(-3px); } to { transform: translateY(3px); } }
@keyframes memoryTear { from { transform: translateX(-5%); } to { transform: translateX(5%); } }
@keyframes bossCameraIn { 0% { opacity:0; transform:scale(.34); filter:blur(12px); } 24% { opacity:1; } 100% { opacity:1; transform:scale(1.72); filter:blur(0); } }
@keyframes bossCameraOut { from { opacity:1; transform:scale(1.72); filter:blur(0); } to { opacity:0; transform:scale(.52); filter:blur(8px); } }
@keyframes bossFaceSwap { 0% { transform:translateX(-8px) scale(1.025); filter:contrast(1.6) grayscale(1); } 50% { transform:translateX(8px) scale(.985); filter:contrast(.7) invert(.08); } 100% { transform:none; } }
@keyframes bossFall { 0% { opacity: 1; transform: rotate(0) translateY(0); filter: grayscale(0); } 70% { opacity: .8; transform: rotate(78deg) translateY(18px); filter: grayscale(1); } 100% { opacity: 0; transform: rotate(90deg) translateY(45px); filter: grayscale(1) blur(3px); } }
@keyframes frenzyPulse { from { transform: translateX(-2px) scale(1); } to { transform: translateX(2px) scale(1.025); } }
@keyframes audienceReact { 0% { opacity:0; transform:translate(-50%,14px) scale(.45); } 18%,58% { opacity:.72; transform:translate(-50%,0) scale(var(--scale)); } 100% { opacity:0; transform:translate(calc(-50% + var(--drift)),-70px) scale(calc(var(--scale) * .82)); } }
@media (max-width: 720px) {
  .main-menu { padding: 12px; }
  .menu-card { padding: 20px 14px; }
  .character-picker { grid-template-columns: 1fr; }
  .character-option { min-height: 76px; }
  .character-option img { width: 54px; height: 54px; }
  .follow-gate { align-items: stretch; flex-direction: column; }
  .ai-config__controls { grid-template-columns: 1fr; }
  .game-shell { padding: 12px; }
  .arena { min-height: 440px; grid-template-columns: 1fr 34px 1fr; }
  .fighter { padding: 7px; }
  .status-card { top: 8px; left: 6px; right: 6px; padding: 9px; }
  .name-row strong { font-size: 16px; }
  .sprite-wrap { width: min(45vw, 230px); }
  .versus { font-size: 19px; margin-bottom: 110px; }
  .commands { grid-template-columns: 1fr 1fr; }
  .reward-choices { grid-template-columns: 1fr; }
  .reward-choice { grid-template-columns: 58px 1fr; justify-items: start; text-align: left; }
  .reward-choice img { width: 58px; height: 58px; grid-row: span 2; }
  .commands button { padding: 9px; }
  .caption { bottom: 245px; }
  .topbar { align-items: flex-start; }
  .audio-tools { flex-wrap: wrap; justify-content: flex-end; }
  .volume-control { order: 3; width: 100%; }
  .volume-control input { flex: 1; }
  .roster-control { max-width: 156px; }
}
/* 呼吸是战斗可读性的一部分，因此即使系统开启“减少动态效果”也保留；只停用高频充能闪动。 */
@media (prefers-reduced-motion: reduce) { .sprite-wrap.charging { animation: none; } }

/* v11 · 米白现代论坛主题 */
:root {
  --ink: #352a21;
  --muted: #8b7b6a;
  --line: #ddcfba;
  --gold: #d8894d;
  --red: #d95b54;
  --blue: #6c91ad;
  --green: #72a77b;
  --paper: #fffdf8;
  --cream: #f4ecdc;
  --oat: #e9dcc7;
  --coffee: #4b382b;
}
body {
  color: var(--ink);
  background-color: var(--cream);
  background-image: linear-gradient(rgba(118,91,63,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(118,91,63,.055) 1px,transparent 1px);
  background-size: 24px 24px;
}
button, input { font-family: inherit; }
.main-menu { min-height: 100vh; display: block; padding: 92px 22px 34px; background: transparent; }
.forum-header {
  position: fixed; z-index: 15; inset: 0 0 auto; height: 66px; padding: 0 max(24px,calc((100vw - 1180px)/2));
  display: flex; justify-content: space-between; align-items: center; gap: 40px;
  color: var(--coffee); border-bottom: 1px solid #e2d5c3; background: rgba(255,253,248,.96); box-shadow: 0 3px 18px rgba(77,52,29,.08);
}
.forum-header b { font-size: 23px; letter-spacing: .08em; }
.menu-card {
  width: min(1040px,100%); margin: 0 auto; padding: clamp(26px,4vw,46px);
  border: 1px solid #d9c8ae; border-radius: 16px; color: var(--ink); background: rgba(255,253,248,.97);
  box-shadow: 0 18px 55px rgba(92,61,31,.12), inset 0 0 0 4px rgba(244,236,220,.65);
}
.menu-card h1 { margin: 8px 0 5px; color: #3b291e; text-align: center; font-size: clamp(38px,6vw,58px); letter-spacing: .08em; }
.menu-card > .eyebrow { display: block; text-align: center; }
.menu-lead { text-align: center; color: var(--muted); }
.eyebrow { color: #c06d39; }
.character-picker { grid-template-columns: repeat(3,1fr); gap: 13px; margin-top: 20px; }
.character-picker legend { width: 100%; padding: 0 0 10px; color: #6c5848; text-align: center; font-size: 17px; }
.character-option {
  min-height: 164px; justify-content: flex-start; align-items: center; flex-direction: row; gap: 14px; padding: 12px 16px;
  color: var(--ink); border: 1px solid #dfd1bd; border-radius: 12px; background: #fffcf5; box-shadow: 0 4px 12px rgba(91,60,30,.05);
}
.character-option:hover { border-color: #d19060; box-shadow: 0 8px 18px rgba(129,77,36,.1); }
.character-option:has(input:checked) { border-color: #d47d43; background: #fff4e4; box-shadow: inset 0 0 0 2px #f2c89e,0 8px 20px rgba(129,77,36,.11); }
.character-option img { flex: 0 0 140px; width: 140px; height: 140px; }
.character-option span { flex: 1; justify-items: start; align-content: center; text-align: left; }
.character-option b { color: #493528; font-size: 18px; }
.character-option small { color: #968471; font-size: 13px; line-height: 1.45; white-space: normal; }
.character-option em { color: #fff; background: #d8894d; border-radius: 10px; }
.unavailable-character { opacity: .58; background: #f1ece4; }
.unavailable-character:hover { opacity: .78; border-color: #b7a693; }
.menu-caption { color: #594536; border: 1px solid #d79a70; border-radius: 8px; background: #fff7eb; box-shadow: 3px 3px 0 #ead8bd; }
.follow-gate { border: 1px solid #ead0a8; border-left: 4px solid #d8894d; border-radius: 8px; background: #fff8eb; }
.follow-gate p { color: #6f5c4a; }
.follow-gate button { color: #724424; border-color: #dfbd91; border-radius: 7px; background: #fff; }
.menu-volume { color: #766555; border-color: #dfd1bd; background: #faf5eb; }
.menu-volume output { color: #594536; }
.menu-volume input,.volume-control input { accent-color: #d8894d; }
.ai-config { border-color: #d9c8ae; background: #fbf7ef; }
.ai-config__title b { color: #4b382b; }
.ai-config p { color: #7c6b5b; }
.ai-config code { color: #af6537; }
.ai-config__controls input { color: #4b382b; border-color: #ddcfba; background: #fff; }
.ai-config__controls button { color: #fff; border-color: #ba6d3e; background: #c77949; }
.ai-config > small { color: #9b8a77; }
.start-game { border: 1px solid #b86637; border-radius: 8px; color: #fff; background: #d77f45; box-shadow: inset 0 -3px 0 rgba(112,52,20,.18),4px 4px 0 #e7c6a4; }
.start-game:hover { background: #c96f38; transform: translateY(-1px); }
.menu-note { color: #9a8975; }

.game-shell { width: min(1180px,100%); color: var(--ink); }
.topbar { min-height: 66px; padding: 10px 16px; border: 1px solid #dfd1bd; border-radius: 12px; background: rgba(255,253,248,.96); box-shadow: 0 6px 22px rgba(90,58,27,.08); }
.topbar h1 { color: #3f2d21; letter-spacing: .06em; }
.streak-chip { color: #994f28; border: 1px solid #deb68f; border-radius: 12px; background: #fff3e5; box-shadow: none; }
.roster-control,.volume-control { color: #857362; border-color: #dfd1bd; background: #faf6ee; }
.roster-control b,.volume-control output { color: #493528; }
.icon-button { color: #6b5848; border-color: #dfd1bd; background: #fffaf1; }
.arena {
  min-height: 500px; border: 1px solid #d8c7ae; border-radius: 15px;
  background-color: rgba(255,253,248,.96);
  background-image: linear-gradient(rgba(159,127,91,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(159,127,91,.06) 1px,transparent 1px),linear-gradient(180deg,transparent 0 68%,rgba(220,201,174,.35) 68% 69%,transparent 69%);
  background-size: 18px 18px,18px 18px,100% 100%; box-shadow: 0 14px 38px rgba(93,62,31,.1);
}
.arena::before { inset: 68% 0 auto; background: #e4d5c1; }
.speed-lines { opacity: .12; filter: sepia(1); }
.fighter { border-right: 1px dashed rgba(173,140,104,.28); }
.fighter--enemy { border-right: 0; border-left: 1px dashed rgba(173,140,104,.28); }
.status-card { color: var(--ink); border: 1px solid #ddcfba; border-radius: 10px; background: rgba(255,253,248,.96); box-shadow: 3px 3px 0 #eee2d1; }
.name-row strong { color: #4a3527; }
.name-row span,.numbers { color: #8e7c69; }
.meter { border-color: #e0d5c5; border-radius: 8px; background: #ede6da; }
.meter.hp i { background: #7db58a; }
.meter.skill i { background: #d99a55; }
.buff-strip span { color: #795f4b; border-color: #ddc4a6; background: #fff2de; }
.sprite { filter: drop-shadow(0 8px 0 rgba(118,82,49,.12)); }
.cooldown { border-color: #dfcfba; border-radius: 12px; background: rgba(255,253,248,.94); }
.cooldown i { background: rgba(216,137,77,.2); }
.cooldown span { color: #665344; }
.versus { color: #a45b32; text-shadow: 2px 2px 0 #ead5bd; }
.caption { color: #a6532c; border: 0; background: transparent; box-shadow: none; text-shadow: none; }
.caption.dialogue { padding: 8px 12px; color: #4d3829; border: 1px solid #d7b990; border-radius: 10px; background: rgba(255,253,248,.96); box-shadow: 4px 4px 0 #ebdcc8; }
.command-panel { border: 1px solid #d8c7ae; border-radius: 12px; background: rgba(255,253,248,.97); box-shadow: 0 8px 24px rgba(90,58,27,.08); }
.round-info span { color: #a85d32; border-radius: 8px; background: #fff0df; }
.round-info p { color: #695546; }
.commands button { color: #4d392c; border-color: #dfd1bd; border-radius: 9px; background: #fffaf2; }
.commands button:hover:not(:disabled) { border-color: #d07a45; background: #fff1df; }
.commands kbd { color: #9e5b35; border-color: #ddc4a7; border-radius: 6px; background: #fff; }
.commands small,.hint { color: #958371; }
.commands .skill-button:not(:disabled) { border-color: #ce8a57; background: #fff0dc; box-shadow: inset 0 0 0 2px #f4d5b5; }
.skill-button::after { color: #4d392c; border-color: #d5a477; border-radius: 8px; background: #fffdf8; box-shadow: 0 12px 34px rgba(91,57,27,.16); }
.result,.reward { background: rgba(101,78,55,.34); backdrop-filter: blur(6px); }
.result > div,.reward-card { color: #4a3527; border: 1px solid #d7c3a8; border-radius: 14px; background: #fffdf8; box-shadow: 0 22px 70px rgba(70,44,21,.2),inset 0 0 0 4px #f6eddf; }
.result span { color: #bd6b39; }
.result p,.reward-card > p { color: #806e5c; }
.result button { color: #fff; border-radius: 7px; background: #cf7843; }
.result .secondary-button { color: #6a5544; background: #eee3d4; }
.reward-choice { color: #4b382b; border: 1px solid #dbc8ae; border-radius: 10px; background: #fffaf1; box-shadow: 3px 3px 0 #eadcc9; }
.reward-choice:hover,.reward-choice:focus-visible { border-color: #d17c48; }
.reward-choice b { color: #9c542f; }
.reward-choice small { color: #897664; }
.reward-choice.memory-choice { border-color: #a69b8d; background: #f2eee8; }
.reward-choice.memory-choice img { filter: grayscale(1) drop-shadow(0 0 5px rgba(100,83,66,.25)); }

.scene-transition { position: fixed; inset: 0; z-index: 70; display: grid; place-items: center; overflow: hidden; background: #f4ecdc; }
.scene-transition[hidden] { display: none; }
.scene-transition__grid { position: absolute; inset: 0; opacity: .42; background-image: linear-gradient(#d8c7ae 1px,transparent 1px),linear-gradient(90deg,#d8c7ae 1px,transparent 1px); background-size: 22px 22px; }
.scene-transition__grid::before,.scene-transition__grid::after { content:""; position:absolute; width:34%; height:100%; background:repeating-linear-gradient(180deg,transparent 0 28px,rgba(201,122,73,.16) 28px 30px); }
.scene-transition__grid::before { left:0; }.scene-transition__grid::after { right:0; transform:scaleX(-1); }
.scene-transition__card { position: relative; width: min(430px,82vw); padding: 24px; text-align: center; border: 1px solid #cfa77d; border-radius: 10px; background: #fffdf8; box-shadow: 6px 6px 0 #dfcbb2; }
.scene-transition__card span { display:block; color:#b16b3f; font-size:10px; letter-spacing:.2em; }
.scene-transition__card strong { display:block; margin:10px 0 15px; font-size:18px; }
.scene-transition__card i { display:block; width:100%; height:8px; overflow:hidden; border:1px solid #e0cbb1; background:#f5ecdf; }
.scene-transition__card i::before { content:""; display:block; height:100%; width:38%; background:#d8894d; animation:forumLoad .7s steps(7) infinite; }
.scene-transition.enter { animation:forumWipeIn .33s steps(8) both; }
.scene-transition.hold .scene-transition__card { animation:forumCardPing .2s steps(2) both; }
.scene-transition.leave { animation:forumWipeOut .38s steps(8) both; }
.main-menu.is-entering .forum-header { animation:uiHeaderDrop .38s cubic-bezier(.2,.8,.2,1) both; }
.main-menu.is-entering .menu-card { animation:uiPanelRise .48s cubic-bezier(.16,.84,.28,1) both; }
.main-menu.is-entering .menu-lead,.main-menu.is-entering .character-picker legend,.main-menu.is-entering .menu-volume,.main-menu.is-entering .ai-config,.main-menu.is-entering .start-game { animation:uiTextSweep .42s cubic-bezier(.16,.84,.28,1) both; }
.main-menu.is-entering .character-option { animation:uiCardDeal .46s cubic-bezier(.16,.84,.28,1) both; }
.main-menu.is-entering .character-option:nth-of-type(1) { animation-delay:.05s; }.main-menu.is-entering .character-option:nth-of-type(2) { animation-delay:.09s; }.main-menu.is-entering .character-option:nth-of-type(3) { animation-delay:.13s; }.main-menu.is-entering .character-option:nth-of-type(4) { animation-delay:.17s; }.main-menu.is-entering .character-option:nth-of-type(5) { animation-delay:.21s; }
.game-shell.is-entering .topbar { animation:uiHeaderDrop .35s cubic-bezier(.2,.8,.2,1) both; }
.game-shell.is-entering .arena { animation:uiPanelReveal .46s steps(7) .06s both; }
.game-shell.is-entering .command-panel { animation:uiPanelRise .4s cubic-bezier(.16,.84,.28,1) .12s both; }
.game-shell.is-entering .fighter--player .status-card { animation:uiSlideLeft .45s cubic-bezier(.16,.84,.28,1) .12s both; }
.game-shell.is-entering .fighter--enemy .status-card { animation:uiSlideRight .45s cubic-bezier(.16,.84,.28,1) .12s both; }
.game-shell.is-entering .sprite-wrap { animation:uiFighterPop .5s cubic-bezier(.16,.9,.3,1.3) .18s both; }
.game-shell.is-entering .versus { animation:uiVsStamp .38s steps(5) .2s both; }
.game-shell.is-entering .commands button { animation:uiButtonLift .34s cubic-bezier(.16,.84,.28,1) both; }
.game-shell.is-entering .commands button:nth-child(1){animation-delay:.2s}.game-shell.is-entering .commands button:nth-child(2){animation-delay:.25s}.game-shell.is-entering .commands button:nth-child(3){animation-delay:.3s}.game-shell.is-entering .commands button:nth-child(4){animation-delay:.35s}
.result.is-opening,.reward.is-opening { animation:uiOverlayFade .3s ease both; }
.result.is-opening > div,.reward.is-opening .reward-card { animation:uiModalSpring .46s cubic-bezier(.14,.88,.28,1.24) both; }
.reward.is-opening .reward-choice { animation:uiCardDeal .42s cubic-bezier(.16,.84,.28,1) both; }
.reward.is-opening .reward-choice:nth-child(2){animation-delay:.07s}.reward.is-opening .reward-choice:nth-child(3){animation-delay:.14s}
@keyframes forumWipeIn { from { clip-path:inset(0 100% 0 0); } to { clip-path:inset(0); } }
@keyframes forumWipeOut { from { clip-path:inset(0); } to { clip-path:inset(0 0 0 100%); } }
@keyframes forumLoad { from { transform:translateX(-110%); } to { transform:translateX(280%); } }
@keyframes forumCardPing { from { transform:translateY(3px); } to { transform:translateY(0); } }
@keyframes forumCardIn { from { opacity:0; transform:translateY(18px) scale(.98); } to { opacity:1; transform:none; } }
@keyframes uiHeaderDrop { from { opacity:0; transform:translateY(-18px); } to { opacity:1; transform:none; } }
@keyframes uiPanelRise { from { opacity:0; transform:translateY(24px) scale(.985); } to { opacity:1; transform:none; } }
@keyframes uiPanelReveal { from { opacity:0; clip-path:inset(0 50%); } to { opacity:1; clip-path:inset(0); } }
@keyframes uiTextSweep { from { opacity:0; transform:translateX(-18px); } to { opacity:1; transform:none; } }
@keyframes uiCardDeal { from { opacity:0; transform:translateY(20px) rotateX(16deg) scale(.96); } to { opacity:1; transform:none; } }
@keyframes uiSlideLeft { from { opacity:0; transform:translateX(-34px); } to { opacity:1; transform:none; } }
@keyframes uiSlideRight { from { opacity:0; transform:translateX(34px); } to { opacity:1; transform:none; } }
@keyframes uiFighterPop { from { opacity:0; transform:translateY(28px) scale(.82); } to { opacity:1; transform:none; } }
@keyframes uiVsStamp { from { opacity:0; transform:rotate(-24deg) scale(2.2); } to { opacity:1; transform:rotate(-8deg) scale(1); } }
@keyframes uiButtonLift { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
@keyframes uiOverlayFade { from { opacity:0; backdrop-filter:blur(0); } to { opacity:1; } }
@keyframes uiModalSpring { from { opacity:0; transform:translateY(24px) scale(.9); } to { opacity:1; transform:none; } }

/* Motion system: every screen has an exit, transition and staged entrance. */
.main-menu.is-leaving .forum-header { animation:uiHeaderLeave .22s ease both; }
.main-menu.is-leaving .menu-card { animation:uiPageSubmit .28s cubic-bezier(.55,0,1,.45) both; }
.game-shell.is-leaving { animation:uiBattleLeave .28s ease both; }
.character-option:has(input:checked) img { animation:selectedCharacterPulse .36s cubic-bezier(.2,.9,.25,1.25) both; }
.character-option:has(input:checked)::after { content:"已选择"; position:absolute; right:12px; bottom:10px; color:#bd6b3b; font:900 10px "SimSun","宋体",serif; animation:uiTextSweep .25s both; }
.commands button:active { transform:translateY(3px) scale(.985); box-shadow:inset 0 2px 6px rgba(89,49,18,.18); }
.reward-choice.is-selected { z-index:2; animation:rewardCollect .68s cubic-bezier(.14,.86,.22,1) both !important; }
.reward-choice.is-rejected { animation:rewardDismiss .38s ease both !important; }
.result.is-opening::before,.reward.is-opening::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(255,255,255,.56),transparent); animation:overlayScan .52s ease both; }

/* Boss cinematic uses the real battlefield sprite instead of a second portrait. */
.boss-intro.stage-transparent { background:rgba(5,6,8,.12); pointer-events:none; transition:background .35s ease; }
.boss-intro.stage-transparent::before { opacity:.24; }
.boss-intro.stage-transparent::after { opacity:.32; }
.boss-intro.stage-transparent .boss-intro__noise { opacity:.18; }
.arena.boss-camera-focus { z-index:90; transform-origin:76% 63%; animation:bossArenaCameraIn 1.25s cubic-bezier(.16,.78,.18,1) both; }
.arena.boss-camera-return { z-index:90; transform-origin:76% 63%; animation:bossArenaCameraOut 1.1s cubic-bezier(.42,0,.2,1) both; }
.arena.boss-face-shock .fighter--enemy .sprite { animation:bossRealFaceShock .14s steps(2) both; }
.game-shell.boss-hud-reveal .topbar { animation:uiHeaderDrop .38s both; }
.game-shell.boss-hud-reveal .fighter--player { animation:uiSlideLeft .48s .08s both; }
.game-shell.boss-hud-reveal .fighter--enemy .status-card { animation:uiSlideRight .48s .12s both; }
.game-shell.boss-hud-reveal .versus { animation:uiVsStamp .42s .2s steps(5) both; }
.game-shell.boss-hud-reveal .cooldown { animation:uiPanelRise .38s .26s both; }
.game-shell.boss-hud-reveal .command-panel { animation:uiPanelRise .44s .32s both; }
.game-shell.boss-hud-reveal .commands button { animation:uiButtonLift .34s both; }
.game-shell.boss-hud-reveal .commands button:nth-child(1){animation-delay:.4s}.game-shell.boss-hud-reveal .commands button:nth-child(2){animation-delay:.47s}.game-shell.boss-hud-reveal .commands button:nth-child(3){animation-delay:.54s}.game-shell.boss-hud-reveal .commands button:nth-child(4){animation-delay:.61s}

@keyframes uiHeaderLeave { to { opacity:0; transform:translateY(-18px); } }
@keyframes uiPageSubmit { 0%{opacity:1;transform:none} 55%{transform:scale(.985) translateY(5px)} 100%{opacity:0;transform:translateY(-28px) scale(.95);filter:blur(4px)} }
@keyframes uiBattleLeave { to { opacity:0; transform:scale(.975); filter:blur(4px); } }
@keyframes selectedCharacterPulse { 0%{transform:scale(.88)} 65%{transform:scale(1.08)} 100%{transform:scale(1)} }
@keyframes rewardCollect { 0%{opacity:1;transform:none} 58%{transform:translateY(-14px) scale(1.07);box-shadow:0 18px 35px rgba(196,111,59,.28)} 100%{opacity:0;transform:translateY(-90px) scale(.72)} }
@keyframes rewardDismiss { to { opacity:0; transform:translateY(22px) scale(.9);filter:grayscale(1) blur(2px)} }
@keyframes overlayScan { from{transform:translateX(-100%)} to{transform:translateX(100%)} }
@keyframes bossArenaCameraIn { 0%{opacity:0;transform:scale(.96);filter:blur(10px) grayscale(1)} 20%{opacity:1} 100%{opacity:1;transform:scale(2.35);filter:blur(0) contrast(1.16)} }
@keyframes bossArenaCameraOut { from{opacity:1;transform:scale(2.35);filter:contrast(1.16)} to{opacity:1;transform:scale(1);filter:none} }
@keyframes bossRealFaceShock { 0%{transform:translateX(-7px) scale(1.02);filter:contrast(1.65) grayscale(1)} 50%{transform:translateX(7px) scale(.99);filter:contrast(.8) hue-rotate(18deg)} 100%{transform:none} }

@media (max-width: 720px) {
  .main-menu { padding: 76px 10px 18px; }
  .forum-header { height: 58px; padding: 0 14px; gap: 8px; }
  .forum-header b { font-size: 18px; }
  .menu-card { padding: 22px 12px; }
  .character-picker { grid-template-columns: 1fr 1fr; }
  .character-option { min-height: 148px; gap: 8px; padding: 10px; }
  .character-option img { flex-basis: 118px; width: 118px; height: 118px; }
  .character-option b { font-size: 16px; }
  .character-option small { font-size: 12px; }
  .topbar { gap: 8px; }
  .arena { min-height: 450px; }
  .commands { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px) {
  .character-picker { grid-template-columns: 1fr; }
  .character-option { min-height: 142px; padding: 10px 16px; }
  .character-option img { flex-basis: 120px; width: 120px; height: 120px; }
}
@media (prefers-reduced-motion: reduce) {
  .scene-transition.enter,.scene-transition.leave,.scene-transition__card i::before,.reward-card,.is-entering *,.is-opening,.is-opening *,.boss-intro__focus { animation-duration:.14s !important; animation-iteration-count:1 !important; }
}

/* v20 · 百度贴吧式“主题帖 / 楼层回复”视觉。 */
:root {
  --ink:#2d2f33; --muted:#8a9199; --line:#d9e0e7; --gold:#3f7fc4;
  --red:#e05a4f; --blue:#3f7fc4; --green:#58a66a;
  --paper:#fff; --cream:#eef2f6; --oat:#e7edf3; --coffee:#26384b;
}
body { color:var(--ink); background:#eef2f6; background-image:none; font-family:Arial,"Microsoft YaHei","宋体",sans-serif; font-weight:500; }
.main-menu { padding-top:86px; background:linear-gradient(#e9f2fb 0 172px,#eef2f6 172px); }
.forum-header {
  height:54px; padding:0 max(20px,calc((100vw - 1060px)/2)); justify-content:flex-start; gap:20px;
  color:#334b65; border:0; border-bottom:3px solid #3f7fc4; border-radius:0; background:#fff; box-shadow:0 1px 5px rgba(46,78,108,.13);
}
.forum-header b { color:#245f9e; font-size:21px; letter-spacing:0; }
.tieba-breadcrumb { color:#8a96a3; font-size:12px; font-weight:400; }
.menu-card { width:min(1060px,100%); padding:0 0 24px; overflow:hidden; border:1px solid #d5dde5; border-radius:3px; background:#fff; box-shadow:0 2px 8px rgba(52,78,104,.08); }
.menu-card > .eyebrow { padding:11px 20px; color:#77889a; text-align:left; border-bottom:1px solid #e2e7ec; background:#f7f9fb; font-size:12px; letter-spacing:0; }
.menu-card h1 { margin:24px 24px 6px; color:#283b4e; text-align:left; font-size:34px; letter-spacing:0; }
.menu-lead { margin:0 24px 18px; color:#667686; text-align:left; font-size:14px; }
.menu-lead b { color:#2d6fb3; }
.character-picker { counter-reset:reply-floor; grid-template-columns:1fr 1fr; gap:0; margin:0 24px; border:1px solid #dce3e9; border-bottom:0; }
.character-picker legend { width:calc(100% + 2px); margin-left:-1px; padding:10px 14px; color:#50677e; text-align:left; border:1px solid #dce3e9; background:#f3f6f8; font-size:14px; }
.character-picker legend span { color:#9aa4ae; font-size:12px; font-weight:400; }
.character-option {
  counter-increment:reply-floor; min-height:136px; display:grid; grid-template-columns:42px 112px minmax(0,1fr); gap:10px; padding:10px 14px 10px 8px;
  color:#333; border:0; border-right:1px solid #e3e8ed; border-bottom:1px solid #e3e8ed; border-radius:0; background:#fff; box-shadow:none;
}
.character-option:nth-of-type(even) { border-right:0; }
.character-option::before { content:counter(reply-floor); width:34px; height:28px; display:grid; place-items:center; align-self:center; color:#8c99a5; border:1px solid #dce3e9; border-radius:3px; background:#f5f7f9; font-size:12px; font-weight:400; }
.character-option:hover { z-index:1; border-color:#c5d8eb; background:#f7fbff; box-shadow:inset 3px 0 #4c8bca; transform:none; }
.character-option:has(input:checked) { z-index:2; border-color:#a9c9e8; background:#edf6ff; box-shadow:inset 4px 0 #3f7fc4; }
.character-option:has(input:checked)::after { right:10px; bottom:8px; color:#2d70b3; }
.character-option img { grid-column:2; flex:none; width:112px; height:112px; }
.character-option span { grid-column:3; justify-items:start; text-align:left; }
.character-option b { color:#2f4356; font-size:17px; }
.character-option small { color:#7f8b96; font-size:12px; }
.character-option em { color:#fff; border-radius:2px; background:#5b8fc3; }
.unavailable-character { opacity:.6; background:#f7f8f9; }
.menu-caption,.follow-gate,.ai-config,.menu-volume { margin-left:24px; margin-right:24px; border-color:#d9e2ea; border-radius:2px; background:#f7f9fb; box-shadow:none; }
.menu-caption { color:#3a6f9f; }
.follow-gate { border-left-color:#4b87c2; }
.ai-config__title b,.menu-volume output { color:#344b61; }
.ai-config code { color:#2f73b4; }
.ai-config__controls input { border-color:#cfd9e2; border-radius:2px; }
.ai-config__controls button,.start-game { color:#fff; border-color:#2f6fae; border-radius:3px; background:#3f7fc4; box-shadow:inset 0 1px rgba(255,255,255,.22); }
.start-game { width:calc(100% - 48px); margin:18px 24px 0; }
.start-game:hover { background:#316fae; }
.menu-note { display:block; color:#9aa4ad; }

.game-shell { width:min(1180px,100%); }
.topbar { min-height:58px; border:1px solid #d5dde5; border-radius:3px; background:#fff; box-shadow:0 2px 7px rgba(50,76,101,.08); }
.topbar h1 { color:#245f9e; font-size:25px; }
.streak-chip { color:#326eaa; border-color:#c8d9e8; border-radius:3px; background:#edf6ff; }
.roster-control,.volume-control,.icon-button { color:#637587; border-color:#d7e0e8; border-radius:3px; background:#f7f9fb; }
.arena { min-height:500px; border-color:#d3dce5; border-radius:3px; background:#fff; background-image:linear-gradient(90deg,#f4f7fa 0 78px,transparent 78px),linear-gradient(180deg,transparent 0 70%,#edf1f4 70% 70.5%,transparent 70.5%); box-shadow:0 2px 8px rgba(50,76,101,.08); }
.arena::before { inset:70% 0 auto; background:#dce4eb; }
.fighter { border-right:1px solid #e2e7ec; }
.fighter--player::before,.fighter--enemy::before { position:absolute; z-index:14; left:10px; top:15px; width:54px; color:#8a98a5; text-align:center; font-size:11px; font-weight:400; }
.fighter--player::before { content:"1楼 · 楼主"; }.fighter--enemy::before { content:"2楼"; }
.status-card { left:82px; right:14px; color:#303840; border-color:#d7e0e8; border-radius:2px; background:#fff; box-shadow:0 1px 3px rgba(45,69,92,.08); }
.name-row strong { color:#2d659c; }
.meter { border-color:#dce3e9; border-radius:2px; background:#edf1f4; }
.meter.hp i { background:#63a66f; }.meter.skill i { background:#4a87c3; }
.buff-strip span { color:#3e6f9f; border-color:#c9dbea; border-radius:2px; background:#edf6ff; }
.sprite { filter:drop-shadow(0 8px 0 rgba(59,85,109,.1)); }
.cooldown { border-color:#d4dee7; border-radius:3px; background:#fff; }
.cooldown i { background:rgba(63,127,196,.17); }
.versus { color:#3678b8; text-shadow:2px 2px 0 #dceaf7; }
.caption.dialogue { color:#334b61; border-color:#c8d9e8; border-radius:3px; background:#f7fbff; box-shadow:3px 3px 0 #dae6f1; }
.command-panel { border-color:#d3dce5; border-radius:3px; background:#fff; box-shadow:0 2px 7px rgba(50,76,101,.08); }
.round-info span { color:#2d6eaa; border-radius:2px; background:#eaf4fd; }
.commands button { color:#33485c; border-color:#d5dfe8; border-radius:3px; background:#f8fafc; }
.commands button:hover:not(:disabled),.commands .skill-button:not(:disabled) { border-color:#8fb7da; background:#edf6ff; box-shadow:inset 0 0 0 1px #c8dff2; }
.commands kbd { color:#2d6faa; border-color:#cbdce9; border-radius:2px; }
.skill-button::after { border-color:#aecbe3; border-radius:3px; background:#fff; }
.result,.reward { background:rgba(38,58,77,.32); }
.result > div,.reward-card { color:#33475a; border-color:#cbd7e1; border-radius:3px; background:#fff; box-shadow:0 15px 50px rgba(35,58,78,.2); }
.result span,.reward-choice b { color:#2f70ad; }
.result button { border-radius:3px; background:#3f7fc4; }.result .secondary-button { color:#53687b; background:#edf1f5; }
.reward-choice { border-color:#d4dee6; border-radius:3px; background:#fafcfd; box-shadow:2px 2px 0 #e4e9ee; }
.reward-choice:hover,.reward-choice:focus-visible { border-color:#7faed5; }
.scene-transition { background:#eef2f6; }.scene-transition__card { border-color:#bdcedc; border-radius:3px; box-shadow:5px 5px 0 #d6e0e8; }.scene-transition__card span { color:#3677b4; }.scene-transition__card i::before { background:#3f7fc4; }
.audience-emoji { width:42px; height:42px; display:grid; place-items:center; font-size:0; filter:drop-shadow(0 3px 2px rgba(41,63,82,.22)); }
.audience-emoji img { width:38px; height:38px; object-fit:contain; image-rendering:pixelated; }

@media (max-width:720px) {
  .tieba-breadcrumb { display:none; }
  .main-menu { padding-top:70px; }
  .character-picker { grid-template-columns:1fr; margin:0 10px; }
  .character-option { grid-template-columns:34px 96px minmax(0,1fr); min-height:116px; border-right:0; }
  .character-option img { width:96px; height:96px; }
  .menu-caption,.follow-gate,.ai-config,.menu-volume { margin-left:10px; margin-right:10px; }
  .start-game { width:calc(100% - 20px); margin-left:10px; margin-right:10px; }
  .status-card { left:58px; }
  .fighter--player::before,.fighter--enemy::before { left:4px; width:48px; }
}

/* Post-battle event thread: a full Tieba-style page, not a generic modal. */
.event-screen { min-height:100vh; color:#26384a; background:linear-gradient(180deg,#e8f2fb 0 76px,#f2f5f8 76px 100%); overflow-x:hidden; }
.event-screen[hidden] { display:none; }
.event-forum-header { height:76px; display:flex; align-items:center; justify-content:space-between; padding:0 max(22px,calc((100vw - 1080px)/2)); color:#fff; border-bottom:4px solid #cddbe7; background:linear-gradient(90deg,#285f96,#3d7fb9 58%,#2c679e); box-shadow:0 5px 18px rgba(32,72,108,.2); }
.event-forum-header > div { display:flex; align-items:baseline; gap:16px; }
.event-forum-header b { font-size:24px; letter-spacing:.04em; text-shadow:0 2px #1c4e7b; }
.event-forum-header span { font-size:12px; opacity:.86; }
.event-online { padding:7px 11px; border:1px solid rgba(255,255,255,.38); border-radius:2px; background:rgba(255,255,255,.1); }
.event-online i { display:inline-block; width:7px; height:7px; margin-right:6px; border-radius:50%; background:#c8ff8e; box-shadow:0 0 8px #c8ff8e; }
.event-thread { width:min(1080px,calc(100% - 28px)); margin:0 auto; padding:18px 0 46px; }
.event-breadcrumb { margin-bottom:12px; color:#70879b; font-size:12px; }
.event-topic,.event-reply-box { border:1px solid #c8d5df; border-radius:3px; background:#fff; box-shadow:0 8px 26px rgba(40,67,90,.09); overflow:hidden; }
.event-topic__header { min-height:66px; display:flex; align-items:center; gap:12px; padding:11px 18px; border-bottom:1px solid #d7e0e7; background:linear-gradient(#fff,#f7fafc); }
.event-topic__header h2 { flex:1; margin:0; color:#273b4e; font-size:22px; }
.event-tag { padding:4px 8px; color:#fff; border-radius:2px; background:#e46f46; box-shadow:inset 0 -2px rgba(126,48,25,.16); font-size:12px; }
.event-topic__meta { color:#8395a5; font-size:12px; }
.event-floor { display:grid; grid-template-columns:158px minmax(0,1fr); min-height:470px; }
.event-author { padding:24px 15px; display:flex; flex-direction:column; align-items:center; gap:7px; border-right:1px solid #dce5ec; background:#f1f6fa; text-align:center; }
.event-avatar { width:64px; height:64px; display:grid; place-items:center; color:#fff; border:5px solid #fff; outline:1px solid #bbcad6; background:linear-gradient(135deg,#4b86bb,#85b2d7); box-shadow:0 5px 12px rgba(43,86,123,.18); font-size:27px; }
.event-author b { color:#356e9f; font-size:13px; }
.event-author small { color:#8a9aa8; line-height:1.45; }
.event-post { min-width:0; padding:28px 32px 18px; display:flex; flex-direction:column; }
.event-copy { margin:0 0 12px; font-size:18px; line-height:1.8; }
.event-quote { margin:0 0 20px; padding:10px 14px; color:#596d7f; border-left:4px solid #78a8cf; background:#f2f7fb; font-size:15px; }
.event-image-frame { width:min(650px,100%); margin:0; padding:7px; border:1px solid #bfcdd8; background:#eef3f6; box-shadow:3px 3px 0 #dce5eb; }
.event-image-frame img { display:block; width:100%; max-height:440px; object-fit:cover; object-position:center 39%; image-rendering:pixelated; }
.event-image-frame figcaption { padding:7px 4px 1px; color:#8595a2; font-size:11px; }
.event-post footer { margin-top:auto; padding-top:18px; display:flex; justify-content:flex-end; gap:14px; color:#8ca0b0; font-size:11px; }
.event-reply-box { margin-top:14px; }
.event-reply-box > header { padding:11px 16px; display:flex; justify-content:space-between; color:#3d6688; border-bottom:1px solid #d8e2e9; background:#edf4f9; }
.event-reply-choices { padding:14px; display:grid; gap:10px; }
.event-reply-option { position:relative; width:100%; margin:0; padding:15px; display:grid; grid-template-columns:50px 1fr auto; align-items:center; gap:14px; overflow:hidden; color:#304558; text-align:left; border:1px solid #bdcfdd; border-radius:3px; background:#fff; box-shadow:2px 2px 0 #e3eaf0; cursor:pointer; transition:border-color .18s,transform .18s,box-shadow .18s; }
.event-reply-option:hover,.event-reply-option:focus-visible { border-color:#5e99c8; transform:translateY(-2px); box-shadow:0 7px 18px rgba(45,94,134,.16); }
.event-reply-avatar { width:46px; height:46px; display:grid; place-items:center; color:#fff; background:#6d9fc6; box-shadow:inset 0 0 0 3px #dceaf4; }
.event-reply-content { display:flex; flex-direction:column; gap:5px; }
.event-reply-content b { color:#2d6d9f; font-size:16px; }
.event-reply-content small { color:#748899; line-height:1.45; }
.event-reply-action { padding:8px 13px; color:#fff; border-radius:2px; background:#3f7fb4; box-shadow:inset 0 -2px #2c6595; font-size:12px; }
.event-reply-status { min-height:37px; margin:0; padding:0 16px 13px 80px; color:#8495a3; font-size:12px; }
.event-image-frame[hidden] { display:none; }
.event-reply-option.is-posting::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(84,151,203,.23),transparent); animation:eventReplyScan .52s linear infinite; }
.event-reply-option.is-posting .event-reply-action { color:transparent; }
.event-reply-option.is-posting .event-reply-action::after { content:"发送中"; color:#fff; position:absolute; right:13px; }
.event-reply-option.is-posted { border-color:#6fa562; background:#f4fbf1; box-shadow:0 0 0 3px rgba(92,154,76,.12); }
.event-reply-option.is-posted .event-reply-action { background:#61a255; box-shadow:inset 0 -2px #477d3e; }
.event-reply-option.is-rejected { opacity:.28; transform:translateX(16px) scale(.985); filter:grayscale(1); }
.event-screen.is-replied .event-reply-status { color:#4f9146; font-weight:700; animation:eventStatusPop .38s cubic-bezier(.15,.88,.24,1.25) both; }
.event-screen.is-entering { animation:eventPageWash .48s ease both; }
.event-screen.is-entering .event-forum-header { animation:eventHeaderDrop .42s cubic-bezier(.16,.84,.28,1) both; }
.event-screen.is-entering .event-breadcrumb { animation:eventCrumbIn .3s ease .08s both; }
.event-screen.is-entering .event-topic { animation:eventThreadUnfold .58s steps(8) .08s both; transform-origin:50% 0; }
.event-screen.is-entering .event-author { animation:eventAuthorSlide .46s cubic-bezier(.16,.84,.28,1) .22s both; }
.event-screen.is-entering .event-copy { animation:eventLineIn .36s ease .27s both; }
.event-screen.is-entering .event-quote { animation:eventLineIn .36s ease .34s both; }
.event-screen.is-entering .event-image-frame { animation:eventImageDecode .7s steps(10) .4s both; }
.event-screen.is-entering .event-reply-box { animation:eventReplyRise .5s cubic-bezier(.14,.86,.24,1.12) .5s both; }
.event-screen.is-entering .event-reply-option { animation:eventReplyDeal .4s cubic-bezier(.16,.84,.28,1) .64s both; }
.event-screen.is-entering .event-reply-option:nth-child(2) { animation-delay:.72s; }
.event-screen.is-leaving .event-thread { animation:eventThreadLeave .24s ease both; }
.event-screen.is-leaving .event-forum-header { animation:uiHeaderLeave .22s ease both; }
@keyframes eventPageWash { from{opacity:0;background-color:#fff} to{opacity:1} }
@keyframes eventHeaderDrop { from{opacity:0;transform:translateY(-76px)} to{opacity:1;transform:none} }
@keyframes eventCrumbIn { from{opacity:0;transform:translateX(-24px)} to{opacity:1;transform:none} }
@keyframes eventThreadUnfold { from{opacity:0;clip-path:inset(0 0 100% 0);transform:scaleY(.88)} to{opacity:1;clip-path:inset(0);transform:none} }
@keyframes eventAuthorSlide { from{opacity:0;transform:translateX(-48px)} to{opacity:1;transform:none} }
@keyframes eventLineIn { from{opacity:0;transform:translateY(13px)} to{opacity:1;transform:none} }
@keyframes eventImageDecode { 0%{opacity:0;clip-path:inset(0 100% 0 0);filter:contrast(2) saturate(0)} 65%{opacity:1;filter:contrast(1.4) saturate(.7)} 100%{clip-path:inset(0);filter:none} }
@keyframes eventReplyRise { from{opacity:0;transform:translateY(48px) scale(.98)} to{opacity:1;transform:none} }
@keyframes eventReplyDeal { from{opacity:0;transform:translateX(55px)} to{opacity:1;transform:none} }
@keyframes eventReplyScan { from{transform:translateX(-110%)} to{transform:translateX(110%)} }
@keyframes eventStatusPop { from{opacity:0;transform:translateY(8px) scale(.97)} to{opacity:1;transform:none} }
@keyframes eventThreadLeave { to{opacity:0;transform:translateY(-22px) scale(.985);filter:blur(2px)} }
@media (max-width:700px) {
  .event-forum-header { height:62px; padding:0 14px; }.event-forum-header b{font-size:19px}.event-online{display:none}
  .event-thread { width:calc(100% - 14px); padding-top:10px; }.event-topic__header{padding:10px}.event-topic__meta{display:none}
  .event-floor { grid-template-columns:1fr; }.event-author { padding:11px 14px; flex-direction:row; justify-content:flex-start; border-right:0; border-bottom:1px solid #dce5ec; }.event-avatar{width:40px;height:40px;border-width:3px;font-size:17px}.event-author small{margin-left:auto}
  .event-post { padding:18px 14px 12px; }.event-copy{font-size:16px}.event-image-frame img{max-height:350px}
  .event-reply-choices{padding:10px}.event-reply-option { grid-template-columns:42px 1fr; }.event-reply-avatar{width:40px;height:40px}.event-reply-action{grid-column:2;justify-self:start}.event-reply-status{padding-left:64px}
}
@media (prefers-reduced-motion:reduce) {
  .event-screen.is-entering,.event-screen.is-entering *,.event-screen.is-leaving *,.event-reply-option.is-posting::after { animation-duration:.14s !important; animation-iteration-count:1 !important; }
}

/* Echo form is presented as a special forum reply option on the character page. */
.echo-toggle { position:relative; margin:14px 24px 0; padding:14px 16px; display:grid; grid-template-columns:54px minmax(0,1fr) auto; align-items:center; gap:14px; color:#3d5265; border:1px solid #cedce7; border-radius:3px; background:linear-gradient(90deg,#f6faff,#fff); box-shadow:inset 4px 0 #91b6d6; cursor:pointer; overflow:hidden; transition:border-color .2s,background .2s,box-shadow .2s,transform .2s; }
.echo-toggle:hover { border-color:#8db7d9; transform:translateY(-1px); box-shadow:inset 4px 0 #4d8fc7,0 7px 16px rgba(49,95,134,.1); }
.echo-toggle input { position:absolute; opacity:0; pointer-events:none; }
.echo-toggle__switch { width:52px; height:28px; padding:3px; display:block; border:1px solid #abc1d2; border-radius:15px; background:#dce6ee; box-shadow:inset 0 2px 4px rgba(49,72,92,.14); }
.echo-toggle__switch i { width:20px; height:20px; display:block; border-radius:50%; background:#fff; box-shadow:0 2px 5px rgba(35,62,85,.25); transition:transform .24s cubic-bezier(.18,.9,.24,1.25),background .2s; }
.echo-toggle__copy { display:flex; flex-direction:column; gap:4px; }
.echo-toggle__copy b { color:#2f608b; font-size:16px; }
.echo-toggle__copy small { color:#7d8e9c; line-height:1.45; }
.echo-toggle > em { padding:5px 9px; color:#fff; border-radius:2px; background:#739fbe; font-style:normal; font-weight:900; box-shadow:inset 0 -2px rgba(36,81,116,.2); }
.echo-toggle:has(input:checked) { border-color:#729fca; background:linear-gradient(90deg,#e7f4ff,#f7fbff); box-shadow:inset 5px 0 #2f79b8,0 0 0 3px rgba(76,139,202,.1); }
.echo-toggle:has(input:checked) .echo-toggle__switch { border-color:#347ab4; background:#4c91c9; }
.echo-toggle:has(input:checked) .echo-toggle__switch i { transform:translateX(23px); background:#eef9ff; }
.echo-toggle:has(input:checked) > em { background:#2f79b8; animation:echoBadgePulse 1.2s steps(2) infinite; }
.main-menu.is-entering .echo-toggle { animation:uiTextSweep .42s cubic-bezier(.16,.84,.28,1) .2s both; }
body.damage-flash::after { content:""; position:fixed; inset:0; z-index:19; pointer-events:none; background:radial-gradient(circle at 50% 50%,transparent 25%,rgba(146,19,28,var(--hit-alpha,.12))); animation:damageFlash var(--hit-duration,220ms) steps(3) both; }
.sprite-wrap.echo-cast::after { content:"回响"; position:absolute; left:50%; top:18%; z-index:7; padding:4px 9px; color:#fff; border:2px solid #d9f3ff; border-radius:2px; background:#367eb8; box-shadow:0 0 0 3px rgba(48,125,187,.2),0 0 18px #7ed4ff; font-weight:900; letter-spacing:.12em; transform:translate(-50%,0); animation:echoCastBurst .52s steps(5) both; pointer-events:none; }
.sprite-wrap.echo-cast .sprite { animation:echoSpritePulse .52s steps(3) both; }
@keyframes echoBadgePulse { 50%{filter:brightness(1.24);transform:scale(1.06)} }
@keyframes damageFlash { 0%{opacity:0} 18%{opacity:1} 100%{opacity:0} }
@keyframes echoCastBurst { 0%{opacity:0;transform:translate(-50%,8px) scale(.65)} 28%{opacity:1;transform:translate(-50%,-6px) scale(1.15)} 100%{opacity:0;transform:translate(-50%,-30px) scale(.92)} }
@keyframes echoSpritePulse { 0%,100%{filter:drop-shadow(0 8px 0 rgba(59,85,109,.1));opacity:1} 50%{filter:drop-shadow(0 0 15px #69c8ff);opacity:.78} }
@media (max-width:720px) {
  .echo-toggle { margin:10px 10px 0; padding:12px; grid-template-columns:48px minmax(0,1fr) auto; gap:10px; }
  .echo-toggle__switch { width:46px; }.echo-toggle:has(input:checked) .echo-toggle__switch i { transform:translateX(17px); }
  .echo-toggle__copy b { font-size:15px; }.echo-toggle__copy small { font-size:11px; }
}
@media (prefers-reduced-motion:reduce) {
  .echo-toggle:has(input:checked) > em,.main-menu.is-entering .echo-toggle,body.damage-flash::after,.sprite-wrap.echo-cast::after,.sprite-wrap.echo-cast .sprite { animation-duration:.14s !important; animation-iteration-count:1 !important; }
}

/* 投币复活始终可见，避免接口异常时看起来像功能缺失。 */
.coin-status-card { margin:14px 24px 0; padding:13px 15px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:7px 16px; color:#4b5e70; border:1px solid #d5e0e8; border-left:4px solid #6f9fc6; border-radius:3px; background:#f7fafc; }
.coin-status-card > div:first-child { display:flex; align-items:center; gap:12px; }
.coin-status-card b { color:#2e5271; font-size:16px; }
.coin-status-card span { padding:3px 8px; color:#6b7d8d; border:1px solid #d6e0e8; border-radius:2px; background:#fff; font-size:12px; font-weight:700; }
.coin-status-card p { margin:0; color:#7a8b99; font-size:12px; }
.coin-status-card__actions { grid-column:2; grid-row:1 / span 2; display:flex; gap:7px; }
.coin-status-card__actions button { padding:8px 11px; color:#35688f; border:1px solid #b9cedd; border-radius:2px; background:#fff; cursor:pointer; font-weight:700; }
.coin-status-card__actions button:hover { border-color:#669ac2; background:#eef7ff; }
.coin-status-card__actions button:disabled { opacity:.55; cursor:wait; }
.coin-status-card[data-state="confirmed"] { border-left-color:#65a35c; background:#f5fbf3; }
.coin-status-card[data-state="confirmed"] span { color:#397b36; border-color:#bcd8b7; background:#fff; }
.coin-status-card[data-state="unauthorized"],.coin-status-card[data-state="denied"],.coin-status-card[data-state="error"] { border-left-color:#d88a4b; background:#fff9f1; }
.main-menu.is-entering .coin-status-card { animation:uiTextSweep .42s cubic-bezier(.16,.84,.28,1) .18s both; }
@media (max-width:720px) {
  .coin-status-card { margin:10px 10px 0; grid-template-columns:1fr; }
  .coin-status-card > div:first-child { align-items:flex-start; flex-direction:column; gap:6px; }
  .coin-status-card__actions { grid-column:1; grid-row:auto; }
  .coin-status-card__actions button { flex:1; }
}
@media (prefers-reduced-motion:reduce) { .main-menu.is-entering .coin-status-card { animation-duration:.14s !important; } }