/* css/tokens.css —— 全站共享的设计令牌、重置、基础排版
 * 变量名与 calculator/css/theme.css 一致，方便以后各子工具共用同一套配色。
 * 新工具可以直接 <link rel="stylesheet" href="../css/tokens.css"> 复用。 */

:root {
  /* 深色主题令牌（默认） */
  --bg: #0e1116;
  --bg-glow-1: rgba(91, 157, 255, 0.12);
  --bg-glow-2: rgba(245, 166, 35, 0.08);
  --surface: #161b23;
  --surface-2: #1c232e;
  --raised: #232c39;
  --border: #2a3444;
  --border-2: #3a475e;

  --text: #e8ecf3;
  --muted: #97a3b8;
  --faint: #66738c;

  --accent: #5b9dff;
  --accent-ink: #081428;
  --op: #f5a623;
  --op-ink: #2a1800;
  --bit: #37d3a7;
  --bit-ink: #062018;
  --danger: #ff6b6b;
  --sign: #ff8a3d;
  --ring: rgba(91, 157, 255, 0.4);
  --shadow: 0 12px 34px -18px rgba(0, 0, 0, 0.7);

  --radius: 18px;
  --radius-sm: 12px;
  --mono: ui-monospace, "Cascadia Code", "JetBrains Mono", "SF Mono", Consolas, monospace;
  --sans: system-ui, -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

html[data-theme="light"] {
  --bg: #eef1f7;
  --bg-glow-1: rgba(91, 157, 255, 0.18);
  --bg-glow-2: rgba(245, 166, 35, 0.14);
  --surface: #ffffff;
  --surface-2: #f2f5fa;
  --raised: #e7edf6;
  --border: #d5deec;
  --border-2: #c0cde0;

  --text: #16202f;
  --muted: #5a6a82;
  --faint: #8a97ab;

  --accent: #2f6fed;
  --accent-ink: #ffffff;
  --op: #d9840a;
  --op-ink: #2a1800;
  --bit: #0f9d6b;
  --bit-ink: #ffffff;
  --danger: #e23b3b;
  --sign: #e2661a;
  --ring: rgba(47, 111, 237, 0.35);
  --shadow: 0 12px 30px -18px rgba(30, 50, 90, 0.35);
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

body {
  min-height: 100vh;
  font-family: var(--sans);
  color: var(--text);
  background:
    radial-gradient(1100px 600px at 12% -8%, var(--bg-glow-1), transparent 60%),
    radial-gradient(900px 500px at 100% 0%, var(--bg-glow-2), transparent 55%),
    var(--bg);
  background-attachment: fixed;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  transition: background-color 0.25s ease, color 0.25s ease;
}

a {
  color: var(--accent);
}

code {
  font-family: var(--mono);
  font-size: 0.92em;
  background: var(--surface-2);
  border: 1px solid var(--border);
  padding: 0.05em 0.4em;
  border-radius: 6px;
}

button {
  font-family: inherit;
  cursor: pointer;
}

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}