/**
 * Passerio · landing — tokens partilhados (página + telemóvel + ilustrações)
 *
 * Fonte de verdade: a V2 (ramo diag/observability-gate). A V1 (main) está morta — não usar
 * ecrãs, cartões, imagens nem regras da V1.
 *
 * Valores lidos de scratchpad/v2/src/design/tokens.css (V2) e src/design/motion.css. Os nomes
 * curtos (--sand-50, --clay…) são os da landing; no fim há aliases com os nomes da V2
 * (--color-sand-50, --color-clay-500…) para o CSS copiado da V2 funcionar sem tradução.
 * Não inventar cores: fora desta lista não há cores, exceto as --ilu-* (só ilustração da landing).
 * Tema claro de propósito: a app não tem modo escuro e as ilustrações são high-key.
 *
 * Tipografia V2 (decisão Daniel, 17 set 2026): Plus Jakarta Sans «diz, etiqueta e mede»
 * (títulos, nomes, preços, botões, tabs, kickers, horas · 600, h1/preços 700) + DM Sans
 * «explica» (corpo e meta · 400/500). ZERO mono. Botões, tabs e kickers em caixa normal sem
 * tracking; MAIÚSCULAS só em tags estáticas de 10px/600 com +0.04em; números tabulares nos dados;
 * nada abaixo de 10px, nada interativo abaixo de 12px, títulos nunca mais apertados que −0.02em.
 */
:root {
  color-scheme: light;

  /* ─── Sand · neutros ─── */
  --sand-50: #FBF9F5;   /* fundo da app */
  --sand-100: #F5F1E9;
  --sand-200: #EAE2D2;
  --sand-300: #D4C8B0;
  --sand-400: #A89C82;
  --sand-500: #888780;
  --sand-600: #52483A;  /* corpo */
  --sand-700: #7A6F5A;  /* labels secundários · piso de contraste */
  --sand-800: #1F1A14;  /* texto principal */
  --sand-900: #100D0A;  /* tinta */
  --mesa: #E7E1D6;
  --hairline: #F1EFE8;
  --hairline-alt: #EDEAE2;
  --divider: #D2C8B6;
  --decor: #C7BCA6;     /* ornamento, NUNCA texto */
  --card: #FFFFFF;
  --scrim: rgba(16, 13, 10, 0.30);
  --disabled-bg: #E0D6C4;
  --disabled-text: #A89C82;

  /* ─── Clay · marca / ação (um primary por contexto) ─── */
  --clay-50: #FDF1EB;
  --clay: #D8492C;
  --clay-press: #B83822;
  --clay-text: #B0472B;   /* texto clay pequeno — obrigatório */
  --clay-deep: #8F3721;   /* só hover de destrutivo */
  --clay-800: #6B1F14;
  --clay-900: #902A1A;
  --clay-bg: #FDF1EB;
  --clay-border: #E7A98F;
  --clay-tile-border: #F5DDD1;
  --gradient-clay: linear-gradient(135deg, #D8492C, #B83822); /* SÓ fita «Recomendado» */

  /* ─── Ink · facto / transporte ─── */
  --ink: #1E3A5F;         /* ink-700 */
  --ink-text: #26405C;
  --ink-bg: #EAF0F5;
  --ink-border: #C4D6E4;
  --ink-soft: #88A4B5;    /* ink-300 */
  --ink-100: #DDE6EC;
  --ink-300: #88A4B5;     /* acento do voo */
  --ink-500: #5C8298;     /* experiências */
  --ink-700: #1E3A5F;
  --ink-900: #0D1A2C;     /* chão dos bilhetes */
  --ink-wash: rgba(30, 58, 95, 0.1);

  /* ─── Moss · sucesso / origem / «Comprado» ─── */
  --moss: #5C7A4A;        /* moss-500 */
  --moss-50: #F2F6EC;
  --moss-500: #5C7A4A;
  --moss-700: #34472A;
  --moss-deep: #34472A;
  --moss-bg: #F2F6EC;
  --moss-border: #CFE0BE;
  --moss-variant: #8FA57A;
  --moss-tile: #EDF2E6;

  /* ─── Ameixa · estrada (carro e táxi) — Daniel, 16 set 2026 ─── */
  --ameixa: #7B4E6F;
  --ameixa-500: #7B4E6F;

  /* ─── Ochre · estimativa (sempre com til «~» e tracejado) ─── */
  --ochre: #A67D1C;       /* ochre-500 · chão do comboio */
  --ochre-100: #F4E4B8;
  --ochre-200: #E5D5B3;
  --ochre-300: #E0B355;   /* «preço no parceiro» no talão escuro (literal de v2.css:2013) */
  --ochre-500: #A67D1C;
  --ochre-text: #8A6714;
  --ochre-filete: #C9A54A;
  --ochre-bg: #FEFBF3;
  --ochre-tag-bg: #F6EED9;
  --ochre-border: #E9D9A8;
  --ochre-node: #EBDDBA;

  /* ─── Roteiro ─── */
  --spine: #E2D8C6;
  --spine-sub: #E6DCC6;
  --skel-base: #EFE8DA;
  --skel-hi: #F8F4EC;

  /* ─── Botões §08 ─── */
  --btn-border-neutral: #C9BDA6;
  --btn-hover-bg-neutral: #F5F1E9;
  --btn-hover-border-neutral: #A89C82;
  --btn-ghost-hover-bg: #F1EAD9;
  --btn-dash-adiar: #C4B79B;
  --btn-text-adiar: #A0937A;
  --btn-off-bg: #F1EDE3;
  --btn-off-border: #E4DAC6;
  --btn-off-text: #B8AD97;
  --iconbtn-mapa-border: #C9D8E4;

  /* ─── Tabs §12 (Construir · Mapa · Ler) ─── */
  --tabs-rail-bg: #EFE8DA;
  --tabs-rail-border: #E4DAC6;
  --tabs-text-inactive: #A0937A;

  /* ─── Cor por modo de transporte (V2Voos.jsx:96-110) e o chão do bilhete (v2.css:2186-2285) ─── */
  --modo-voo: var(--ink-300);
  --modo-comboio: var(--ochre-500);   /* o chão do comboio desce ao ochre-500 */
  --modo-autocarro: var(--moss-500);
  --modo-estrada: var(--ameixa-500);

  /* ─── Ilustração (paleta própria da landing, na família da arte V2 — nunca em UI) ─── */
  --ilu-cal: #FBF7F2;
  --ilu-cal-sombra: #EFE3D6;
  --ilu-arco-sombra: #EADACD;
  --ilu-arco-fundo: #E4CFBC;
  --ilu-areia: #E5D2BD;
  --ilu-areia-forte: #D0B79D;
  --ilu-ceu-horizonte: #FBE6DA;
  --ilu-sol: #F9CDB7;
  --ilu-terracota: #D8A483;
  --ilu-terracota-luz: #E7B595;
  --ilu-terracota-sombra: #CB8C6B;
  --ilu-salvia-escura: #8B866E;
  --ilu-salvia: #A09A82;
  --ilu-salvia-clara: #BEB9A0;
  --ilu-mar: #DCE1E3;
  --ilu-mar-perto: #D5DDE0;

  /* ─── Tipografia V2 — duas famílias, nenhuma outra ─── */
  --font-serif: 'Plus Jakarta Sans', 'Plus Jakarta Sans Fallback', system-ui, -apple-system, 'Segoe UI', sans-serif;  /* diz: títulos, nomes, preços */
  --font-sans: 'DM Sans', 'DM Sans Fallback', system-ui, -apple-system, 'Segoe UI', sans-serif;                        /* explica: corpo, meta */
  --font-mono: 'Plus Jakarta Sans', 'Plus Jakarta Sans Fallback', system-ui, -apple-system, 'Segoe UI', sans-serif;   /* etiqueta e mede: botões, tags, dados (tnum) · já não é mono */

  /* ─── Forma §06 ─── */
  --r-tag: 5px;
  --r-tile: 9px;
  --r-inner: 12px;
  --r-bilhete: 14px;
  --r-card: 16px;
  --r-sheet: 24px;
  --r-pill: 999px;

  --shadow-solto: 0 3px 8px -5px rgba(16, 13, 10, 0.30);
  --shadow-faixa: 0 14px 30px -24px rgba(16, 13, 10, 0.40);
  --shadow-painel: 0 28px 56px -34px rgba(16, 13, 10, 0.40);
  --shadow-folha: 0 -20px 44px -22px rgba(16, 13, 10, 0.45);
  --shadow-realce-clay: 0 8px 18px -8px rgba(216, 73, 44, 0.70);

  /* ─── Movimento §06 — nunca bounce, parallax ou > 0.5s (dentro do telemóvel) ─── */
  --motion-bloco: 0.34s ease;                        /* entrada de bloco · y+6 → 0 */
  --motion-folha: 0.3s cubic-bezier(.2, .8, .2, 1);  /* bottom sheet (norma) */
  --motion-hover: 120ms ease-out;
  --motion-shimmer: 1.2s linear infinite;
  --motion-agulha: 2.4s linear infinite;
  --motion-barra: 0.5s ease;
  --motion-slide: 0.3s cubic-bezier(.32, .72, 0, 1); /* troca de aba no Workspace (TripWorkspace.jsx:1382) */
  --motion-drag: 0.4s cubic-bezier(.32, .72, 0, 1);  /* DragSheet: conversa e folhas (DragSheet.jsx:20) */
  --ease-folha: cubic-bezier(.2, .8, .2, 1);         /* ease-out de assinatura (página, arte) */
  --ease-drawer: cubic-bezier(.32, .72, 0, 1);       /* DragSheet / slide / BottomSheet da V2 */
  --ease-move: cubic-bezier(.77, 0, .175, 1);        /* deslocação no ecrã (landing) */

  /* ═══ Aliases com os nomes da V2 (src/design/tokens.css) — para CSS copiado da V2 ═══ */
  --color-sand-50: var(--sand-50);   --color-sand-100: var(--sand-100); --color-sand-200: var(--sand-200);
  --color-sand-300: var(--sand-300); --color-sand-400: var(--sand-400); --color-sand-500: var(--sand-500);
  --color-sand-600: var(--sand-600); --color-sand-700: var(--sand-700); --color-sand-800: var(--sand-800);
  --color-sand-900: var(--sand-900);
  --color-clay-50: var(--clay-50);   --color-clay-500: var(--clay);     --color-clay-600: var(--clay-press);
  --color-clay-800: var(--clay-800); --color-clay-900: var(--clay-900); --color-clay-text: var(--clay-text);
  --color-clay-border: var(--clay-border); --color-clay-deep: var(--clay-deep); --color-clay-tile-border: var(--clay-tile-border);
  --color-ink-100: var(--ink-100);   --color-ink-300: var(--ink-300);   --color-ink-500: var(--ink-500);
  --color-ink-700: var(--ink-700);   --color-ink-900: var(--ink-900);   --color-ink-wash: var(--ink-wash);
  --color-ink-text: var(--ink-text); --color-ink-bg: var(--ink-bg);     --color-ink-border: var(--ink-border);
  --color-moss-50: var(--moss-50);   --color-moss-500: var(--moss-500); --color-moss-700: var(--moss-700);
  --color-moss-border: var(--moss-border); --color-moss-variant: var(--moss-variant); --color-moss-tile: var(--moss-tile);
  --color-ameixa-500: var(--ameixa-500);
  --color-ochre-100: var(--ochre-100); --color-ochre-200: var(--ochre-200); --color-ochre-300: var(--ochre-300);
  --color-ochre-500: var(--ochre-500); --color-ochre-text: var(--ochre-text); --color-ochre-filete: var(--ochre-filete);
  --color-ochre-bg: var(--ochre-bg); --color-ochre-tag-bg: var(--ochre-tag-bg); --color-ochre-border: var(--ochre-border);
  --color-ochre-node: var(--ochre-node);
  --color-spine: var(--spine); --color-spine-sub: var(--spine-sub);
  --color-mesa: var(--mesa); --color-hairline: var(--hairline); --color-hairline-alt: var(--hairline-alt);
  --color-divider-section: var(--divider); --color-decor: var(--decor); --color-scrim: var(--scrim);
  --color-disabled-bg: var(--disabled-bg); --color-disabled-text: var(--disabled-text);
  --color-bg-app: var(--sand-50); --color-bg-card: var(--card);
  --radius-tag: var(--r-tag); --radius-tile: var(--r-tile); --radius-inner: var(--r-inner);
  --radius-card: var(--r-card); --radius-sheet: var(--r-sheet); --radius-pill: var(--r-pill);
  --touch-min: 44px;
}

/* Fallback com as métricas das fontes V2 (medidas no browser contra Arial / Liberation Sans:
   largura, ascendente e descendente). Enquanto o Google Fonts não chega (display=swap), o texto
   ocupa quase o mesmo espaço e a troca não empurra o layout. Só acrescentam um nome à pilha. */
@font-face {
  font-family: 'Plus Jakarta Sans Fallback';
  font-weight: 100 550;
  src: local('Arial'), local('ArialMT'), local('Liberation Sans'), local('Arimo'), local('Helvetica Neue'), local('Helvetica');
  size-adjust: 104.7%;
  ascent-override: 99.3%;
  descent-override: 21%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Plus Jakarta Sans Fallback';
  font-weight: 551 900;
  src: local('Arial Bold'), local('Arial-BoldMT'), local('Liberation Sans Bold'), local('Arimo Bold'), local('Helvetica Neue Bold'), local('Helvetica Bold');
  size-adjust: 101%;
  ascent-override: 103%;
  descent-override: 21.8%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'DM Sans Fallback';
  font-weight: 100 550;
  src: local('Arial'), local('ArialMT'), local('Liberation Sans'), local('Arimo'), local('Helvetica Neue'), local('Helvetica');
  size-adjust: 93.6%;
  ascent-override: 105.8%;
  descent-override: 33.1%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'DM Sans Fallback';
  font-weight: 551 900;
  src: local('Arial Bold'), local('Arial-BoldMT'), local('Liberation Sans Bold'), local('Arimo Bold'), local('Helvetica Neue Bold'), local('Helvetica Bold');
  size-adjust: 92.4%;
  ascent-override: 107.1%;
  descent-override: 33.5%;
  line-gap-override: 0%;
}

@keyframes ds-entrada {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: none; }
}
@keyframes ds-shimmer {
  from { background-position: 100% 0; }
  to   { background-position: -100% 0; }
}
@keyframes ds-spin {
  to { transform: rotate(360deg); }
}