@font-face {
  font-family: 'JinJuSerif';
  src: url('/fonts/JinJuSerif.ttf') format('truetype');
  font-display: swap;
  font-weight: 600;
}
/* ==========================================================================
   暖金皮肤 · 与 App 端同一套暖金色板
   加载顺序：必须位于 theme.css / design-v2.css / app-native.css 之后
   作用：重映射 token（含 app-native 的 --app-* 变量）+ 覆盖被 !important 锁死的底色
   ========================================================================== */



/* 用 html:root 提高特异性，压过任何后置样式表的 :root */
:root,
html:root {
  --ink-0: #200d07;
  --ink-1: #3a1710;
  --ink-2: #5e2a17;
  --ink-3: #8c4522;
  --panel: rgba(74, 32, 19, .86);
  --panel-solid: #4a2013;
  --line: rgba(255, 255, 255, .13);
  --line-strong: rgba(255, 255, 255, .24);
  --text: #fff6ec;
  --text-dim: #ecd0b4;
  --text-mute: #c2a088;

  --gold: #f2c15c;
  --gold-bright: #ffe7b0;
  --gold-deep: #c8922f;
  --jade: #7fd1c0;
  --danger: #ff7a6b;
  --warn: #ffcf6a;

  --accent: var(--gold);
  --accent-bright: var(--gold-bright);
  --accent-deep: var(--gold-deep);
  --accent-ink: #4a2a08;

  --shadow-sm: 0 2px 10px rgba(30, 12, 6, .45);
  --shadow-md: 0 14px 34px rgba(30, 12, 6, .55);
  --shadow-lg: 0 28px 60px rgba(30, 12, 6, .60);
  --glow: 0 10px 30px rgba(242, 193, 92, .28);

  /* app-native.css 自己的一套变量，一并改写，否则它会把底色刷回纯黑 */
  --app-bg: #200d07;
  --app-surface: rgba(74, 32, 19, .88);
  --app-surface-2: #4a2013;
  --app-line: rgba(255, 255, 255, .13);
  --app-line-strong: rgba(255, 255, 255, .24);
  --app-text: #fff6ec;

  /* 旧组件用的 surface 变量（games.css 等回落成近黑），统一改成蓝玻璃 */
  --surface-0: #200d07;
  --surface-1: rgba(74, 32, 19, .86);
  --surface-2: #4a2013;
  --surface-3: #4a2013;
  --text-secondary: #ecd0b4;
  --text-primary: #fff6ec;
  --border: rgba(255, 255, 255, .14);
  --border-strong: rgba(255, 255, 255, .26);

  /* 下载页 app.html 自带一套 --bg/--surface 变量 */
  --bg: #200d07;
  --surface: rgba(74, 32, 19, .88);
  --surface2: #4a2013;
  --dim: #ecd0b4;
  --mute: #c2a088;
}

/* app-native.css 在 html/body/.player-mode/.app-shell 上写了
   background + background-image: none !important，这里用同级或更高特异性覆盖 */
html,
html:root,
body,
body.player-mode,
.player-mode,
.app-shell,
#app {
  background-color: #200d07 !important;
  background-image:
    radial-gradient(120% 78% at 50% -6%, #a75a2c 0%, #5e2a17 42%, #200d07 100%) !important;
  background-attachment: fixed !important;
  color: var(--text);
}

/* 标题 / 数字使用显示体 */
h1, h2, h3, h4,
.brand b,
.game-name,
.game-title,
.player-name,
.lobby-heading h1,
.card-title,
.section-title,
button.primary,
.button-primary,
.amount,
.balance {
  font-family: 'JinJuSerif', 'Songti SC', 'Noto Serif CJK SC', 'Noto Serif SC', 'Source Han Serif SC', 'SimSun', serif !important;
  letter-spacing: .02em;
}

/* 面板统一玻璃质感 */
.panel,
.card,
.panel-solid,
.lobby-panel,
.app-card,
.list-card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, .03)),
    var(--panel) !important;
  border: 1px solid var(--line) !important;
}

/* 主按钮：金面 + 内高光，和 App 端 GoldButton 一致 */
button.primary,
.button-primary,
.btn-primary {
  background: linear-gradient(180deg, #ffdf9a 0%, #f2c15c 52%, #c8922f 100%) !important;
  border: 1px solid #ffe7b0 !important;
  color: #3a1f06 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .72),
    0 8px 22px rgba(242, 193, 92, .26) !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .35);
}

/* 弹窗统一改成蓝玻璃，去掉原来的近黑面板 */
dialog,
dialog[open] {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .10), rgba(255, 255, 255, .03)),
    #4a2013 !important;
  border: 1px solid rgba(242, 193, 92, .30) !important;
  border-radius: 18px !important;
  color: #fff6ec !important;
  box-shadow: 0 28px 60px rgba(18, 7, 3, .62) !important;
}

dialog::backdrop {
  background: rgba(26, 10, 5, .62);
  backdrop-filter: blur(4px);
}

dialog h2 {
  color: #f2c15c;
  font-family: 'JinJuSerif', 'Songti SC', 'Noto Serif CJK SC', 'Noto Serif SC', 'Source Han Serif SC', 'SimSun', serif;
}
.topbar,
.app-header,
.dock,
.lobby-tabbar,
.player-navigation,
#player-navigation,
.bottom-nav {
  background:
    linear-gradient(180deg, rgba(140, 72, 36, .55), rgba(58, 23, 14, .72)),
    #4a2013 !important;
  border-color: var(--line) !important;
  backdrop-filter: blur(18px) saturate(1.25);
  box-shadow: 0 -8px 28px rgba(20, 8, 4, .45);
}

.topbar {
  border-bottom: 1px solid rgba(242, 193, 92, .22) !important;
  box-shadow: 0 8px 26px rgba(20, 8, 4, .40) !important;
}

.player-navigation > *,
.bottom-nav > * {
  color: var(--text-dim);
}
.player-navigation [aria-current],
.player-navigation .active,
.bottom-nav [aria-current] {
  color: var(--gold) !important;
}

/* 游戏封面：用真实主视觉替换单字方块 */
.game-card .game-art.has-cover {
  padding: 0;
  overflow: hidden;
  position: relative;
}

.game-card .game-art.has-cover > img.cover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.game-card .game-art.has-cover > .game-icon {
  display: none;
}

.game-card .game-art.has-cover::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(180deg, rgba(42, 17, 9, 0) 42%, rgba(42, 17, 9, .58) 100%),
    linear-gradient(90deg, rgba(42, 17, 9, .30), rgba(42, 17, 9, 0) 46%);
  pointer-events: none;
}

.game-card .game-art.has-cover::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 3;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
  border-radius: inherit;
  pointer-events: none;
}

/* 品牌标记改用真实图标位图，去掉原先给单字做的边框与底色 */
img.brand-mark {
  border: 0 !important;
  background: transparent !important;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: block;
  object-fit: contain;
  box-shadow: 0 6px 14px rgba(20, 8, 4, .45);
}
.brand img.brand-mark + span b {
  letter-spacing: .04em;
}
/* 字号整体收半号：标题小一点，正文不动太多 */
h1 { font-size: 31px; }
h2 { font-size: 21px; }
h3 { font-size: 18px; }
.brand b { font-size: 21px; }
.game-copy h3 { font-size: 16.5px; }
.section-heading h2 { font-size: 20px; }