/* ==========================================================================
   Tema Tic Cat Toe — rosa pastel. Cores e fontes herdadas 1:1 do app
   (src/theme.ts): BG rgb(253,224,236), TEXT rgb(86,50,74), P1 rgb(232,84,128),
   grid rgb(214,160,190), etc. Fontes Fredoka (corpo) + Sniglet (display),
   as mesmas TTF que o jogo empacota. Sobrepõe os tokens NEUTROS do site.css
   nas páginas /ticcattoe/. Carregar DEPOIS de site.css.
   ========================================================================== */
@font-face {
  font-family: "Fredoka";
  src: url("/assets/fonts/Fredoka.ttf") format("truetype");
  font-weight: 300 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Sniglet";
  src: url("/assets/fonts/SnigletExtraBold.ttf") format("truetype");
  font-weight: 800; font-style: normal; font-display: swap;
}

:root {
  color-scheme: light; /* o jogo é rosa pastel e não tem tema escuro — nunca escurece */
  --font:         "Fredoka", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Sniglet", var(--font);

  --bg:        #FDE0EC; /* rosa pastel (BG do jogo) */
  --surface:   #FFF4F9; /* cards (branco rosado, BG2) */
  --surface-2: #FBD3E4; /* preenchimentos / chips */
  --line:      #EEBBD3; /* divisórias (mauve suave) */
  --ink:       #56324A; /* títulos/texto (ameixa, TEXT) */
  --ink-soft:  #7E4C6A; /* texto secundário (escurecido p/ AA no rosa) */
  --meta:      #8A5A76; /* legendas (DIM escurecido p/ AA no rosa) */

  --accent:        #E85480; /* rosa do Jogador 1 (P1_COL) — uso gráfico/fills */
  --accent-strong: #B62F60; /* rosa escuro p/ TEXTO/links/eyebrow (AA no rosa) */
  --coral:         #F09628; /* laranja (OLD_COL) */
  --success:       #46B460; /* verde (GREEN) */
  --brand-red:     #E85480;
  --info:          #4A90D2; /* azul do Jogador 2 (P2_COL) */

  --shadow:    0 18px 40px -24px rgba(120, 40, 80, .40);
  --shadow-sm: 0 8px 20px -14px rgba(120, 40, 80, .34);
}

/* Títulos e marca na fonte de display do jogo (Sniglet) */
h1, h2, h3, .brand b { font-family: var(--font-display); letter-spacing: 0; }

/* O jogo é rosa pastel e não tem tema escuro. Se o sistema estiver no escuro,
   REafirmamos a mesma paleta rosa (nada de roxo) — a página fica rosa sempre. */
@media (prefers-color-scheme: dark) {
  :root {
    --bg:        #FDE0EC;
    --surface:   #FFF4F9;
    --surface-2: #FBD3E4;
    --line:      #EEBBD3;
    --ink:       #56324A;
    --ink-soft:  #7E4C6A;
    --meta:      #8A5A76;

    --accent:        #E85480;
    --accent-strong: #B62F60;
    --coral:         #F09628;
    --success:       #46B460;
    --brand-red:     #E85480;
    --info:          #4A90D2;

    /* botão/toggle: rosa escuro + texto branco, igual ao claro */
    --btn-bg: var(--accent-strong);
    --btn-fg: #fff;

    --shadow:    0 18px 40px -24px rgba(120, 40, 80, .40);
    --shadow-sm: 0 8px 20px -14px rgba(120, 40, 80, .34);
  }
}
