/* moment酒吧 · 主题层（浅色 / 暗色双态）
   加载顺序必须是：style.css → 页面级样式 → h5.css → 本文件（最后）。
   本文件只做两件事：
     1) 暗色令牌覆盖（属性选择器特指度更高，与顺序无关）；
     2) 主题切换的 View Transition 圆形裁切（触点扩散，见 assets/js/theme.js）。
   浅色形态一律不动 —— 浅色值都写在 style.css / 各页 :root 里。 */
html[data-theme="dark"]{
  color-scheme:dark;

  /* 基础令牌：**午夜蓝**（2026-09-25 电蓝方向）
     暗色下页面底直接就是午夜底色，面板比它亮一档 */
  --bg:#07121F; --panel:#0C1B2E; --panel2:#122538;
  --panel-line:rgba(133,183,235,.20); --line-strong:rgba(55,138,221,.52);
  --ink:#EAF2FA; --ink2:#B9CFE4; --ink3:#7E97AE;
  --line:rgba(133,183,235,.12);
  --accent:#378ADD; --accent2:#85B7EB;
  --deep:#0C447C; --mid:#85B7EB; --sky:#B5D4F4;
  --navy:#85B7EB;
  --live:#E24B4A; --ok:#5FA87C; --warn:#D9A05B; --danger:#E0796F;
  /* ⚠️ 这里**必须显式给出 --card/--card2**：
     它们在 style.css 里是 var(--panel)/var(--panel2) 的别名，但
     `artist-icon.html` / `home.html` 这类**自包含页不引 style.css**，
     只靠 theme.css 覆盖 —— 不给显式值它们在暗色下会留着各自的浅色值（踩过）。 */
  --card:#0C1B2E; --card2:#122538;
  --shadow:0 12px 30px rgba(0,0,0,.5);
  --shadow-sm:none;
  --text-main:var(--ink); --text-dim:var(--ink3);
  --gold:var(--accent); --pink:var(--accent); --green:var(--deep);

  /* 结构令牌（浅色默认值在 style.css / home 页 :root，此处只给暗色形态） */
  --stage:#04090F;
  --block:#040B14;              /* 比页面底更深，才能「压住」 */
  --ring:rgba(7,18,31,.9);
  --tabbar-bg:rgba(7,18,31,.94);
  --av-grad:linear-gradient(135deg,#1B3A5C,#0C447C);
  --soft-grad:linear-gradient(135deg,#0C447C,#1B3A5C);
  --chip-green:#16321F;
  --pill:rgba(12,27,46,.92);
  --veil:rgba(9,21,36,.96);

  /* menu.css 的 --mk-* 面（商品图底衬 / 详情页浮层） */
  --mk-tint:#0C1B2E; --mk-tint2:#122538; --mk-sheet:#0C1B2E;
  --mk-veil:rgba(12,27,46,.9); --mk-bar:rgba(7,18,31,.95);

  /* artist-icon.html 自包含的那套小令牌（它不引 style.css，必须在这里补齐暗色形态） */
  --card-2:#122538; --text:#EAF2FA; --dim:#7E97AE;
}

/* ---- 组件级暗色修正：令牌够不着的硬编码 ---- */
/* 排名角标：白字压浅海军蓝在暗色下不可读，回到深蓝浅字 */
html[data-theme="dark"] .av .rank.rm{background:#22303F;color:#D9E4F0}
/* 深蓝卡面（翻牌/抽奖背面）在暗色下提亮描边，免得糊成一团 */
html[data-theme="dark"] .pcard .pf.back,
html[data-theme="dark"] .draw-card .face.back{border-color:rgba(199,181,166,.35)}

/* ---- 主题切换 · 圆形裁切（从触点铺满页面） ----
   旧帧垫底不动，新帧用 JS animate() 按 circle(0 → R) 裁切露出；
   减动效偏好下 theme.js 不走视图过渡，这里只是兜底把默认淡入关掉。 */
::view-transition-old(root),
::view-transition-new(root){animation:none;mix-blend-mode:normal}
