/**
 * GoldenOT — Design tokens (GoldenOT chrome reference)
 * Values from docs/research/goldenot/DESIGN_TOKENS.md — do not invent new hexes.
 * Branding/art: GoldenOT only. Outfits/monsters/items GIFs stay on existing paths.
 */

:root {
  /* Surfaces */
  --bg-page: #0f1722;
  --bg-panel: #061217;
  --bg-input: #1c2531;

  /* Borders */
  --border: #334459;
  --border-row-top: #223843;
  --border-row-bottom: #000000;
  --border-table-cell: #262f3b;

  /* Text */
  --text: #9cabb9;
  --text-muted: #a9acad;
  --text-link: #b2dbee;
  --text-table: #c0e2f1;
  --heading-sand: #d4c0a1;
  --gold: #e1bb34;
  --white: #ffffff;
  --nav-hover: #bec0c1;

  /* Accents (menu highlights) */
  --accent-yellow: #e4e711;
  --accent-green: #50d508;
  --accent-red: #f2300d;

  /* CTA banners (alert-success style) */
  --cta-green-bg: #d4edda;
  --cta-green-text: #155724;

  /* Typography */
  --font-body: Verdana, Arial, Helvetica, sans-serif;
  --font-display: "Spectral", spectral, Georgia, serif;
  --font-countdown: "Alegreya SC", Georgia, serif;
  --font-size-body: 12px;
  --line-height-body: 18px;
  --font-size-nav: 16px;
  --font-size-menu-cat: 18px;
  --font-size-menu-link: 12px;
  --font-size-cta: 30px;
  --letter-spacing-nav: 0.6px;

  /* Layout */
  --container-max-xl: 1330px;
  --container-max-lg: 1140px;
  --space-hero: 156px;
  --header-height: 124px;
  --navbar-height: 75px;
  --menu-category-height: 43px;
  --radius: 0;

  /* Legacy content helpers (tibiacom pages still emit these colors) */
  --legacy-table-sand: #d4c0a1;
}