/* 四套主题：全部走 CSS 变量，data-theme 切换 */

:root {
  --radius: 10px;
}

/* ---------- 霓虹 Neon（默认）---------- */
:root,
[data-theme='neon'] {
  --c-bg: #0d1024;
  --c-surface: #191e3d;
  --c-surface2: #232a52;
  --c-cell: #141833;
  --c-line: #2a3160;
  --c-line-bold: #4e5aa8;
  --c-fg: #e8ecff;
  --c-given: #dfe6ff;
  --c-user: #35e0ff;
  --c-accent: #e94f75;
  --c-accent2: #35e0ff;
  --c-gold: #ffd166;
  --c-danger: #ff5470;
  --c-muted: #8a93c9;
  --c-selected: #2b3268;
  --c-peer: #1b2044;
  --c-same: #33306b;
  --c-on-accent: #ffffff;
  --c-card: #161a38;
  --font-ui: 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif;
  --font-num: 'Consolas', 'JetBrains Mono', monospace;
  --board-shadow: 0 0 40px rgba(233, 79, 117, 0.18), 0 0 80px rgba(53, 224, 255, 0.1), inset 0 0 0 1px #3a4285;
  --brand-shadow: 0 0 14px rgba(233, 79, 117, 0.8);
  --btn-shadow: 0 4px 18px rgba(233, 79, 117, 0.35);
  --overlay-bg: rgba(8, 10, 26, 0.62);
}

[data-theme='neon'] .cell.user .val {
  text-shadow: 0 0 12px rgba(53, 224, 255, 0.75);
}

[data-theme='neon'] .cell.selected {
  box-shadow: inset 0 0 18px rgba(233, 79, 117, 0.35);
}

[data-theme='neon'] .board {
  border: 1px solid #3d468c;
}

/* ---------- 极光 Aurora ---------- */
[data-theme='aurora'] {
  --c-bg: #101228;
  --c-surface: rgba(255, 255, 255, 0.08);
  --c-surface2: rgba(255, 255, 255, 0.14);
  --c-cell: rgba(255, 255, 255, 0.07);
  --c-line: rgba(255, 255, 255, 0.14);
  --c-line-bold: rgba(255, 255, 255, 0.42);
  --c-fg: #eef1ff;
  --c-given: #f2f4ff;
  --c-user: #9ce8d8;
  --c-accent: #6d5df6;
  --c-accent2: #38e0c8;
  --c-gold: #ffd9a0;
  --c-danger: #ff7b9c;
  --c-muted: #9aa3d0;
  --c-selected: rgba(109, 93, 246, 0.35);
  --c-peer: rgba(255, 255, 255, 0.05);
  --c-same: rgba(56, 224, 200, 0.22);
  --c-on-accent: #ffffff;
  --c-card: rgba(24, 26, 56, 0.82);
  --font-ui: 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', system-ui, sans-serif;
  --font-num: 'Segoe UI', 'PingFang SC', system-ui, sans-serif;
  --board-shadow: 0 18px 60px rgba(20, 16, 80, 0.6);
  --brand-shadow: 0 0 16px rgba(109, 93, 246, 0.7);
  --btn-shadow: 0 6px 24px rgba(109, 93, 246, 0.45);
  --overlay-bg: rgba(12, 13, 34, 0.5);
}

[data-theme='aurora'] body {
  background:
    radial-gradient(1200px 700px at 85% -10%, rgba(56, 224, 200, 0.16), transparent 60%),
    radial-gradient(1000px 800px at -10% 30%, rgba(109, 93, 246, 0.28), transparent 55%),
    radial-gradient(900px 600px at 50% 110%, rgba(255, 123, 156, 0.14), transparent 60%),
    #101228;
  background-attachment: fixed;
}

[data-theme='aurora'] #side .seg,
[data-theme='aurora'] #side #status-row,
[data-theme='aurora'] .pad,
[data-theme='aurora'] .action-row {
  position: relative;
}

[data-theme='aurora'] .pad-num,
[data-theme='aurora'] .tool-btn,
[data-theme='aurora'] .diff-btn {
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* ---------- 和纸 Washi ---------- */
[data-theme='washi'] {
  --c-bg: #f4eddf;
  --c-surface: #ece2cd;
  --c-surface2: #e2d5ba;
  --c-cell: #faf5ea;
  --c-line: #d8cbb0;
  --c-line-bold: #45382a;
  --c-fg: #3a2f24;
  --c-given: #2c241b;
  --c-user: #c41e3a;
  --c-accent: #c41e3a;
  --c-accent2: #e08a3c;
  --c-gold: #b98a2f;
  --c-danger: #b3352c;
  --c-muted: #8d7c63;
  --c-selected: #f3dfc0;
  --c-peer: #f1e8d6;
  --c-same: #f6e3c8;
  --c-on-accent: #fff8ee;
  --c-card: #f8f2e4;
  --font-ui: 'Georgia', 'Songti SC', 'SimSun', serif;
  --font-num: 'Segoe Script', 'Bradley Hand', 'KaiTi', 'STKaiti', cursive;
  --board-shadow: 0 10px 30px rgba(90, 65, 30, 0.18);
  --brand-shadow: 0 2px 10px rgba(196, 30, 58, 0.4);
  --btn-shadow: 0 4px 14px rgba(196, 30, 58, 0.3);
  --overlay-bg: rgba(244, 237, 223, 0.6);
}

[data-theme='washi'] body {
  background-image: radial-gradient(rgba(140, 115, 75, 0.06) 1px, transparent 1.5px);
  background-size: 22px 22px;
}

[data-theme='washi'] .cell.user .val {
  transform: rotate(-2deg);
  opacity: 0.92;
}

[data-theme='washi'] .board {
  border-radius: 4px;
}

/* ---------- 极简 Mono ---------- */
[data-theme='mono'] {
  --c-bg: #ffffff;
  --c-surface: #f2f2f2;
  --c-surface2: #e6e6e6;
  --c-cell: #ffffff;
  --c-line: #d4d4d4;
  --c-line-bold: #111111;
  --c-fg: #111111;
  --c-given: #111111;
  --c-user: #0033cc;
  --c-accent: #111111;
  --c-accent2: #555555;
  --c-gold: #8f7400;
  --c-danger: #cc0000;
  --c-muted: #8a8a8a;
  --c-selected: #eaeaea;
  --c-peer: #f6f6f6;
  --c-same: #e8e8ff;
  --c-on-accent: #ffffff;
  --c-card: #ffffff;
  --radius: 4px;
  --font-ui: 'Helvetica Neue', Arial, 'PingFang SC', 'Microsoft YaHei', sans-serif;
  --font-num: 'Helvetica Neue', Arial, sans-serif;
  --board-shadow: none;
  --brand-shadow: none;
  --btn-shadow: none;
  --overlay-bg: rgba(255, 255, 255, 0.7);
}

[data-theme='mono'] #overlay-card {
  border: 2px solid #111;
  box-shadow: 6px 6px 0 #111;
}

[data-theme='mono'] .theme-chip[data-theme='mono'],
[data-theme='mono'] .sw-mono {
  border: 1px solid #999;
}