/* ==========================================================================
   Design tokens: black & gold (dark is the default; light via data-theme)
   ========================================================================== */

@font-face {
  font-family: 'Playfair Display';
  src: url('../fonts/playfair-display-latin.woff2') format('woff2');
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Montserrat';
  src: url('../fonts/montserrat-latin.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* Metric-matched fallbacks: until the web fonts load, the system fonts take up
   the same space, so text doesn't shift when they swap in. */
@font-face {
  font-family: 'Playfair Fallback';
  src: local('Georgia');
  size-adjust: 99.12%;
  ascent-override: 109.16%;
  descent-override: 25.32%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Montserrat Fallback';
  src: local('Arial'), local('Helvetica Neue'), local('Helvetica');
  size-adjust: 109.29%;
  ascent-override: 88.57%;
  descent-override: 22.97%;
  line-gap-override: 0%;
}

:root {
  color-scheme: dark;

  /* Surfaces */
  --bg: #0b0a08;
  --surface: #12110e;
  --surface-2: #1a1814;
  --surface-raised: #1e1b16;
  --glass: rgba(11, 10, 8, 0.72);
  --header-bg: rgba(11, 10, 8, 0.86);

  /* Text */
  --text: #f2ecdf;
  --text-2: rgba(242, 236, 223, 0.9);
  --muted: #b8b0a1;

  /* Lines */
  --line: rgba(242, 236, 223, 0.1);
  --line-2: rgba(242, 236, 223, 0.16);
  --line-strong: rgba(201, 165, 90, 0.32);

  /* Gold */
  --accent: #c9a55a;
  --accent-soft: #d9be85;
  --accent-text: #d9b970;
  --accent-grad: linear-gradient(135deg, #e6c987 0%, #c9a55a 48%, #a9843e 100%);
  --accent-glow: rgba(201, 165, 90, 0.28);
  --on-accent: #0b0a08;

  /* Always-dark areas (bands, footer, dark stages) */
  --band-bg: #12100c;
  --band-text: #f2ecdf;
  --band-muted: rgba(242, 236, 223, 0.62);
  --footer-bg: #070605;

  /* Status */
  --ok: #7cc47f;
  --warn: #e0a54a;
  --danger: #e07a6a;

  /* Hero dashboard card */
  --chip-bg: rgba(20, 18, 15, 0.9);
  --chip-bar: rgba(255, 255, 255, 0.03);

  /* Legacy palette names, mapped by role */
  --color-ink: var(--text);
  --color-ivory: var(--bg);
  --color-midnight: var(--band-bg);
  --color-sand: var(--surface-2);
  --color-stone: var(--line-2);
  --color-graphite: var(--muted);
  --color-sage: var(--accent);
  --color-sage-light: var(--accent-soft);
  --color-white: #ffffff;

  /* Type */
  --font-display: 'Playfair Display', 'Playfair Fallback', Didot, Georgia, serif;
  --font-sans: Montserrat, 'Montserrat Fallback', 'Helvetica Neue', Arial, sans-serif;
  --font-label: Montserrat, 'Montserrat Fallback', 'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'IBM Plex Mono', Consolas, monospace;

  /* Layout */
  --content-width: 1200px;
  --page-gutter: clamp(1.25rem, 5vw, 4.5rem);
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --space-5: 3rem;
  --space-6: 4.5rem;
  --space-7: 7rem;
  --border: 1px solid var(--line);
  --radius-sm: 4px;
  --radius-md: 8px;
  --shadow-soft: 0 18px 55px rgba(0, 0, 0, 0.35);
}

html[data-theme='light'] {
  color-scheme: light;
  --bg: #faf8f3;
  --surface: #ffffff;
  --surface-2: #f2ede3;
  --surface-raised: #ffffff;
  --glass: rgba(250, 248, 243, 0.88);
  --header-bg: rgba(250, 248, 243, 0.9);
  --text: #141210;
  --text-2: #3a3630;
  --muted: #6b655b;
  --line: rgba(20, 18, 16, 0.12);
  --line-2: rgba(20, 18, 16, 0.18);
  --line-strong: rgba(140, 108, 40, 0.35);
  --accent: #a8832f;
  --accent-soft: #c9a55a;
  --accent-text: #86672a;
  --accent-glow: rgba(168, 131, 47, 0.22);
  --band-bg: #0e0d0b;
  --footer-bg: #0e0d0b;
  --ok: #2f7a34;
  --warn: #a8691c;
  --danger: #a33a2a;
  --chip-bg: rgba(255, 255, 255, 0.95);
  --chip-bar: rgba(242, 237, 227, 0.7);
  --shadow-soft: 0 18px 55px rgba(20, 18, 16, 0.08);
}