/* ==========================================================================
   Design tokens — 「深邃暗金 VIP」. Deep charcoal + champagne gold, mobile-first,
   the club-grade default look. Dark gold is the DEFAULT (:root); an ivory+gold
   light variant lives under [data-theme="light"]. Toggle via the existing
   [data-theme] mechanism (App.initTheme / App.toggleTheme) — key "theme".
   ========================================================================== */
:root {
  color-scheme: dark;

  /* Surfaces — layered depth */
  --bg: #0B0B0E;
  --surface: #15161B;
  --surface-2: #1D1F26;
  --border: rgba(198, 161, 91, 0.18);   /* hairline gold */
  --divider: rgba(255, 255, 255, 0.06); /* faint neutral separator */

  /* Text */
  --text: #F5F1E8;      /* warm white */
  --text-sub: #A8A296;  /* grey gold */

  /* Champagne gold */
  --brand: #C6A15B;
  --brand-hi: #E4C97E;
  --brand-active: #A9863F;
  --brand-soft: rgba(198, 161, 91, 0.14);
  --brand-grad: linear-gradient(135deg, #E4C97E 0%, #C6A15B 45%, #A9863F 100%);
  --on-brand: #1A140A;  /* dark ink on gold — makes gold feel expensive */

  /* Status (tuned for dark gold) */
  --danger: #E36B6B;
  --success: #5FB985;
  --warning: #D9A441;

  /* Shape */
  --radius: 14px;
  --radius-lg: 20px;
  --radius-pill: 999px;

  /* Elevation */
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.45), 0 6px 20px rgba(0, 0, 0, 0.35);
  --shadow-2: 0 16px 48px rgba(0, 0, 0, 0.55);
  --glow-gold: 0 0 0 1px rgba(198, 161, 91, 0.25), 0 8px 30px rgba(0, 0, 0, 0.5);

  /* Rhythm */
  --gap: 16px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);

  /* Type */
  --font-sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", "Segoe UI", Roboto, sans-serif;
  --font-serif: "Noto Serif SC", "Songti SC", "STSong", "STSongti-SC-Regular", serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
}

/* Explicit dark selector mirrors :root so App.toggleTheme("dark") is a no-op
   visual-wise but keeps the attribute consistent. */
[data-theme="dark"] { color-scheme: dark; }

/* Ivory + gold — a coordinated light counterpart, no leftover SaaS blue. */
[data-theme="light"] {
  color-scheme: light;

  --bg: #F7F3EA;
  --surface: #FFFDF8;
  --surface-2: #F1EADB;
  --border: rgba(169, 134, 63, 0.28);
  --divider: rgba(26, 20, 10, 0.08);

  --text: #2A2418;
  --text-sub: #7A7060;

  --brand: #A9863F;
  --brand-hi: #C6A15B;
  --brand-active: #8A6D30;
  --brand-soft: rgba(169, 134, 63, 0.12);
  --brand-grad: linear-gradient(135deg, #D9BE78 0%, #C6A15B 45%, #A9863F 100%);
  --on-brand: #2A2418;

  --danger: #C0504E;
  --success: #3E9E6B;
  --warning: #B5822B;

  --shadow-1: 0 1px 2px rgba(120, 100, 60, 0.10), 0 6px 20px rgba(120, 100, 60, 0.10);
  --shadow-2: 0 14px 44px rgba(120, 100, 60, 0.16);
  --glow-gold: 0 0 0 1px rgba(169, 134, 63, 0.30), 0 8px 26px rgba(169, 134, 63, 0.14);
}