/* ==========================================================================
   Campos 2026 — tokens
   Conceito: quadro de horários de uma linha de serra. Ver DESIGN.md.
   ========================================================================== */
:root {
  /* --- Cor ----------------------------------------------------------- */
  --ink:        #16261D;   /* preto-pinheiro */
  --ink-2:      #3C4C42;
  --ink-3:      #66766B;
  --ink-4:      #94A199;

  --forest:     #1E4633;
  --forest-2:   #2E6248;
  --forest-3:   #4C8567;
  --forest-4:   #A9C4B4;
  --forest-5:   #D7E3DA;

  --wood:       #7A5B3C;
  --wood-2:     #9C7A55;
  --wood-3:     #D8C7B1;

  --brass:      #A8801F;
  --brass-2:    #C7A248;
  --brass-3:    #EBDCB4;
  --brass-4:    #F6EFDC;

  --rust:       #9A3A2B;
  --rust-2:     #F4E2DE;

  --mist:       #EBEFE8;   /* página */
  --mist-2:     #E1E7DE;   /* rebaixado */
  --paper:      #FCFBF7;   /* superfície */

  --line:       #CFD8CE;   /* hairline */
  --line-2:     #B7C3B6;   /* hairline forte */
  --rail:       #A8B7A9;   /* trilho */

  /* --- Semântica ----------------------------------------------------- */
  --bg:           var(--mist);
  --bg-sunken:    var(--mist-2);
  --surface:      var(--paper);
  --text:         var(--ink);
  --text-2:       var(--ink-2);
  --text-3:       var(--ink-3);
  --text-4:       var(--ink-4);
  --on-forest:    #F2F6F0;

  /* Status: verde = acontecendo/feito, latão = pendente, ferrugem = fora */
  --st-planejado-fg: var(--ink-2);      --st-planejado-bg: var(--mist-2);
  --st-reservado-fg: #7A5C11;           --st-reservado-bg: var(--brass-4);
  --st-confirmado-fg: #1F5470;          --st-confirmado-bg: #E2EEF4;
  --st-concluido-fg: var(--forest);     --st-concluido-bg: var(--forest-5);
  --st-cancelado-fg: var(--rust);       --st-cancelado-bg: var(--rust-2);

  /* --- Tipografia ---------------------------------------------------- */
  /* Placa: DIN da sinalização de transporte. Dado, horário, título. */
  --font-sign: "Bahnschrift SemiCondensed", "Bahnschrift", "DIN Alternate",
               "DIN Condensed", "Avenir Next Condensed", "Segoe UI", system-ui, sans-serif;
  /* Leitura: serifada de texto para prosa. */
  --font-text: "Sitka Text", Charter, Constantia, "Iowan Old Style", Georgia, serif;
  --font-mono: "Cascadia Mono", Consolas, "SF Mono", ui-monospace, monospace;

  --fs-12: 0.75rem;
  --fs-13: 0.8125rem;
  --fs-15: 0.9375rem;
  --fs-17: 1.0625rem;
  --fs-20: 1.25rem;
  --fs-26: 1.625rem;
  --fs-34: clamp(1.75rem, 1.4rem + 1.4vw, 2.125rem);
  --fs-46: clamp(2.1rem, 1.5rem + 2.9vw, 2.875rem);

  /* --- Espaço -------------------------------------------------------- */
  --s1: 4px;  --s2: 8px;  --s3: 12px; --s4: 16px;
  --s5: 20px; --s6: 26px; --s7: 34px; --s8: 46px; --s9: 62px;

  /* --- Forma: o raio conta hierarquia -------------------------------- */
  --r-cell:  0;      /* célula de tabela */
  --r-plate: 3px;    /* placa de estação, botão, chip quadrado */
  --r-panel: 8px;    /* painel, cartão de apoio */
  --r-lift:  14px;   /* o único objeto elevado da tela */
  --r-pill:  999px;

  /* Sombra só no que realmente flutua */
  --sh-lift: 0 1px 1px rgba(22,38,29,.04), 0 10px 24px -10px rgba(22,38,29,.22);
  --sh-over: 0 2px 4px rgba(22,38,29,.06), 0 24px 48px -16px rgba(22,38,29,.34);

  --focus: 0 0 0 2px var(--paper), 0 0 0 4px var(--forest-2);

  /* --- Movimento ----------------------------------------------------- */
  --ease: cubic-bezier(.3, .7, .3, 1);
  --t1: 110ms; --t2: 180ms; --t3: 280ms;

  /* --- Layout -------------------------------------------------------- */
  --rail-w: 80px;
  --sidebar-w: 244px;
  --header-h: 56px;
  --bottomnav-h: 60px;
  --content-max: 1560px;
  --measure: 68ch;
  --safe-b: env(safe-area-inset-bottom, 0px);
  --safe-t: env(safe-area-inset-top, 0px);
}

@media (prefers-reduced-motion: reduce) {
  :root { --t1: 0ms; --t2: 0ms; --t3: 0ms; }
}