/* Morae — design tokens. Navy surfaces and a cool light one, hairline frames, one amber accent with meaning.
   Every other file uses these names (v4 "Sistema", 29/10: the language of technology, systems and AI). */

:root {
  --meianoite: #070c22;
  --marinho: #0c1a3d;
  --marinho-2: #13244f;
  --papel: #f6f5f1; /* the warm sheet of v2: kept for compatibility, the light surface is now --claro */
  --papel-2: #ecebe5;
  --branco: #ffffff;
  --tinta: #0e1424;
  --ardosia: #5a6478;
  --gelo: #eef2fa;
  --nevoa: #a9b4cf;
  --ambar: #e3a04a; /* the accent on navy: an active wire, a data packet, focus, the current item */
  --ambar-texto: #8f5610; /* the accent on the light surface (AA as text) */
  --ambar-luz: #f6d29b;
  --linha: rgba(12, 26, 61, 0.12); /* a hairline on the light surface */
  --linha-escura: rgba(238, 242, 250, 0.14); /* a hairline on navy */

  /* extensions (v2, 29/10) */
  --ambar-fio: #d4913c;
  --ambar-halo: rgba(227, 160, 74, 0.18);
  --papel-3: #e2e0d8;
  --noite-2: #0a1230;
  --tela-fundo: #0b0f1c; /* behind every screen, before it loads */
  --nevoa-2: rgba(238, 242, 250, 0.62);

  /* v4 "Sistema" (29/10) */
  --claro: #f2f4f8; /* the light surface: a cool, clean panel (not the warm sheet) */
  --claro-2: #e8ecf2; /* inset on the light surface */
  --claro-3: #dce2eb;
  --painel: #0a1330; /* an inset panel on navy (a node, a display) */
  --painel-2: #0e1938;
  --linha-forte: rgba(12, 26, 61, 0.26); /* a frame that stands out, on light */
  --linha-forte-escura: rgba(238, 242, 250, 0.3); /* the same on navy */
  --marca-canto: rgba(238, 242, 250, 0.46); /* corner markers on navy */
  --marca-canto-claro: rgba(12, 26, 61, 0.4); /* corner markers on light */
  --ponto-grade: rgba(238, 242, 250, 0.075); /* the faint dot grid of the act and the close */
  --canto: 5px; /* the small dot where frame lines meet */
  --porta-tam: 7px; /* a port on a node (a small circle) */
  --raio-pilula: 999px; /* buttons */
  --raio-botao: var(--raio-pilula);
  --raio-no: 14px; /* a node */

  --fonte: "Geist", "Inter Tight", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fonte-marca: "Unbounded", "Geist", system-ui, sans-serif;
  --fonte-mono: "Geist Mono", ui-monospace, "SFMono-Regular", "Cascadia Mono", Menlo, Consolas, monospace; /* rails and metadata only */

  --ease-saida: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-entra: cubic-bezier(0.7, 0, 0.84, 0);
  --ease-meio: cubic-bezier(0.65, 0, 0.35, 1);

  --gutter: clamp(16px, 4vw, 56px);
  --largura: 1320px;
  --topo-h: 68px;
  --raio-folha: 0px; /* full-width sections meet on a straight line (the only sharp edges of the site) */
  --raio-1: 10px; /* small pieces: tags, inputs */
  --raio-2: 16px; /* cards, devices, small panels */
  --raio-3: 24px; /* panels, the quick view, big cards */
  --sombra-janela: 0 30px 60px -36px rgba(7, 12, 34, 0.35), 0 0 0 1px rgba(12, 26, 61, 0.1);
  --sombra-escura: 0 40px 90px -40px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(238, 242, 250, 0.08);
  --sombra-objeto: 0 40px 80px -46px rgba(7, 12, 34, 0.5), 0 16px 30px -22px rgba(7, 12, 34, 0.32);

  /* fluid type scale */
  --t-0: clamp(13px, 0.2vw + 12px, 14px);
  --t-1: clamp(15px, 0.3vw + 14px, 17px);
  --t-2: clamp(18px, 0.6vw + 15px, 21px);
  --t-3: clamp(24px, 1.4vw + 17px, 32px);
  --t-4: clamp(32px, 2.6vw + 20px, 52px);
  --t-5: clamp(40px, 4.6vw + 20px, 84px);
}
