/* =====================================================================
 * AI看K线 - 网页版全局主题（编辑杂志风 · 暖羊皮纸底）
 * 浅色默认（暖羊皮纸 #f4f1e7，与开场遮罩页同色调）、可切深色（专业终端）。
 * 涨/跌保留 A股 习惯：红涨绿跌。
 * 与小程序 app.wxss 的 .theme-light / .theme-dark 等价。
 * ===================================================================== */
:root,
:root[data-theme="light"] {
  --bg: #f4f1e7;            /* 暖羊皮纸：与开场遮罩页一致 */
  --bg-2: #ece5d0;          /* 稍深暖色：条纹/次级背景 */
  --card: #fffdf7;          /* 暖白卡片：避免冷白割裂 */
  --card-2: #f8f3e4;        /* 次级卡片暖白 */
  --text: #18181b;
  --sub: #52525b;
  --dim: #a1a1aa;
  --accent: #e0342a;        /* 品牌红：克制用作强调/激活态 */
  --accent-2: #71717a;      /* 中性（平盘/次级强调） */
  --accent-grad: #e0342a;   /* 扁平单色（极简：去渐变） */
  --up: #d0021b;            /* A 股：红涨 */
  --down: #00875a;          /* A 股：绿跌 */
  --mid: #71717a;
  --border: #ddd6c2;        /* 暖色发丝边框 */
  --border-strong: #c9bf9f;
  --chip: rgba(24, 24, 27, 0.045);
  --shadow: 0 1px 2px rgba(24, 24, 27, 0.03), 0 1px 3px rgba(24, 24, 27, 0.02);
  --scrim: rgba(244, 241, 231, 0.82);
  /* 暖光晕（呼应开场遮罩页 .intro-bg 黄色墨迹）：极淡，固定于视口，
     仅从边角渗入，卡片不透明故数字可读性不受影响。 */
  --glow-1: rgba(248, 218, 90, 0.15);   /* 暖黄主光：右上 */
  --glow-2: rgba(238, 170, 140, 0.09);  /* 淡粉余晖：左下 */
  /* 圆角阶梯：全站统一一套语言（卡片/组件/迷你） */
  --r-lg: 16px;
  --r-md: 12px;
  --r-sm: 8px;
  --r-pill: 999px;
  /* 中性主按钮底色（近黑，Vercel 风；深色主题自动转亮） */
  --ink: #18181b;
  --ink-inv: #ffffff;
  --serif: 'Inter', ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  --mono: var(--serif);
}

:root[data-theme="dark"] {
  --bg: #0a0a0b;
  --bg-2: #141416;
  --card: #18181b;
  --card-2: #1f1f23;
  --text: #fafafa;
  --sub: #a1a1aa;
  --dim: #71717a;
  --accent: #f5462d;
  --accent-2: #d4d4d8;
  --accent-grad: #f5462d;
  --up: #f5462d;
  --down: #16b87a;
  --mid: #d4d4d8;
  --border: #27272a;
  --border-strong: #3f3f46;
  --chip: rgba(255, 255, 255, 0.05);
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.45), 0 1px 3px rgba(0, 0, 0, 0.35);
  --scrim: rgba(10, 10, 11, 0.82);
  /* 深色终端：不加暖光晕，保持专业冷感 */
  --glow-1: transparent;
  --glow-2: transparent;
  --ink: #fafafa;
  --ink-inv: #18181b;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  /* 多层背景：暖黄光晕(右上) + 淡粉余晖(左下) + 暖羊皮纸底。
     background-attachment:fixed 让光晕锁定视口，滚动时如环境光不随移动，
     与开场遮罩页同源氛围但克制得多（透明度 0.15/0.09 vs 遮罩页 0.62）。 */
  background:
    radial-gradient(circle at 82% 8%, var(--glow-1) 0%, transparent 46%),
    radial-gradient(circle at 14% 92%, var(--glow-2) 0%, transparent 40%),
    var(--bg);
  background-attachment: fixed;
  color: var(--text);
  font-family: var(--serif);
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

/* 通用类 */
.up { color: var(--up); }
.down { color: var(--down); }
.mid { color: var(--mid); }
.dim { color: var(--dim); }

/* 无障碍：键盘焦点环 — 全站统一 */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }
button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 2px; }
input:focus-visible { outline: 2px solid var(--accent); outline-offset: 0; }
/* 对于已经自己的 focus 样式的元素，降级 outline 权重 */
.topbar-search-input:focus-visible { outline: 2px solid var(--accent); outline-offset: 0; }

/* 图标 SVG 统一角色 */
svg[aria-hidden="true"] { pointer-events: none; }

/* ── Toast 通知 ── */
@keyframes toastIn { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
.toast-el { will-change: transform, opacity; }

/* ── 骨架屏 ── */
@keyframes skelPulse { 0%,100% { opacity:.4; } 50% { opacity:.8; } }
.skel-overlay { animation: skelPulse 1.4s ease-in-out infinite; }
.skel-spinner { width:28px; height:28px; border:3px solid var(--border,#e4e4e7); border-top-color:var(--accent,#d0021b); border-radius:50%; animation: skelSpin .7s linear infinite; }
@keyframes skelSpin { to { transform:rotate(360deg); } }
.sub { color: var(--sub); }
.mono { font-family: var(--mono); letter-spacing: 0.3px; }

/* 滚动条 */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 4px; }
::-webkit-scrollbar-track { background: transparent; }
