/* Tokens da marca Combine (combine-deck-kit/brand) como estão no canvas das telas. Claro em :root, escuro em
   [data-theme="dark"] no <html>. Cores só por estes tokens; nada de hex solto nas telas. */
@font-face { font-family: "Inter"; src: url("../assets/fonts/inter-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../assets/fonts/inter-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../assets/fonts/inter-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../assets/fonts/inter-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../assets/fonts/montserrat-latin-300-normal.woff2") format("woff2"); font-weight: 300; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../assets/fonts/montserrat-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("../assets/fonts/jetbrains-mono-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("../assets/fonts/jetbrains-mono-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; }

:root {
  color-scheme: light;
  --font-display: "Montserrat", Arial, sans-serif;
  --font-sans: "Inter", Arial, sans-serif;
  --font-mono: "JetBrains Mono", "Courier New", monospace;

  --bg: #FAFAF9;
  --glow: #FCE8E3;
  --surface: #FFFFFF;
  --tabbar: #FFFFFF;
  --line: #EEECEA;
  --divider: #E7E5E4;
  --connector: #D6D3D1;
  --ink: #002117;
  --text: #57534E;
  --subtle: #78716C;
  --chip: #F5F5F4;
  --chip-ink: #44403C;
  --primary: #002117;
  --on-primary: #FFFFFF;
  --panel: #002117;
  --on-panel: #FFFFFF;
  --on-panel-muted: #A3ACAA;
  --panel-chip: rgba(255, 255, 255, .08);
  --panel-surface: rgba(255, 255, 255, .05);
  --panel-line: rgba(255, 255, 255, .10);
  --panel-divider: rgba(255, 255, 255, .16);
  --seg-on: #FFFFFF;
  --seg-shadow: 0 2px 8px rgba(0, 33, 23, .10);
  --shadow: 0 12px 40px rgba(0, 33, 23, .08);
  --scrim: rgba(0, 33, 23, .45);
  --error: #A33A26;

  --coral: #E8705A;
  --on-coral: #FFFFFF;
  --emerald: #00D492;
  --mint: #D0FAE5;
  --on-mint: #002117;

  /* tiers: sempre com o nome escrito, nunca só a cor */
  --tier-gold-bg: #FDF0D5;
  --tier-gold-ink: #7A4B00;
  --tier-silver-bg: var(--chip);
  --tier-silver-ink: var(--chip-ink);
  --tier-bronze-bg: var(--surface);
  --tier-bronze-ink: #7A4B00;
  --tier-bronze-line: #F5C46B;
  --tier-anti-bg: #FDE6E1;
  --tier-anti-ink: #A33A26;

  --r-tag: 6px;
  --r-input: 8px;
  --r-btn: 10px;
  --r-card: 14px;
  --r-panel: 16px;
  --r-sheet: 20px;
  --tap: 44px;
}

[data-theme="dark"] {
  color-scheme: dark;
  --bg: #001A12;
  --glow: #0B3B2B;
  --surface: rgba(255, 255, 255, .05);
  --tabbar: #001A12;
  --line: rgba(255, 255, 255, .10);
  --divider: rgba(255, 255, 255, .16);
  --connector: rgba(255, 255, 255, .24);
  --ink: #FFFFFF;
  --text: #A3ACAA;
  --subtle: #A3ACAA;
  --chip: rgba(255, 255, 255, .08);
  --chip-ink: #E3E9E7;
  --primary: #FFFFFF;
  --on-primary: #002117;
  --panel: #0F5A41;
  --on-panel-muted: #DDE5E2;
  --seg-on: rgba(255, 255, 255, .16);
  --seg-shadow: none;
  --shadow: none;
  --scrim: rgba(0, 0, 0, .55);
  --error: #F4A593;
  --tier-bronze-bg: transparent;
  --tier-bronze-ink: #F5C46B;
}