/* tokens.css — la charte « Nuit », chiffrée. Source : design/direction.md.
   Sombre et monochrome, comme l'icône de l'app : du noir, du graphite, du
   blanc. Aucun orange, aucun violet, aucun bleu. Le vert ne dit qu'un état. */

/* Space Grotesk (SIL OFL 1.1, assets/fonts/OFL.txt) : la famille des titres et du nom PlumSpace. */
@font-face {
  font-family: "Space Grotesk"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url(/assets/fonts/space-grotesk-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Space Grotesk"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url(/assets/fonts/space-grotesk-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* Fonds — le graphite de l'app (Templates/Template.swift, thème sombre). */
  --bg:       #07070A;   /* la page, sous la scène 3D */
  --bg-2:     #0E0E11;   /* cartes */
  --bg-3:     #141416;   /* stage de l'app, surfaces levées */
  --bg-4:     #1C1C1E;   /* bg de l'app */
  --frame:    #2C2C2E;   /* cadre de fenêtre */
  --pane:     #000000;
  --head:     #242424;   /* bandeau de volet */

  /* Texte. */
  --fg:       #F5F5F7;   /* titres, texte fort — 19:1 */
  --fg-2:     #D1D1D6;   /* sous-titres */
  --fg-3:     #A1A1A6;   /* corps — 8:1 */
  --fg-4:     #8E8E93;   /* légendes — 6:1 */
  --fg-5:     #636366;   /* désactivé, filets appuyés */

  /* Filets. */
  --line:     rgba(255,255,255,.08);
  --line-2:   rgba(255,255,255,.14);
  --line-3:   rgba(255,255,255,.24);
  --rule:     #38383A;

  /* Le seul « accent » : la lumière. Blanc, et un vert qui ne dit qu'un état. */
  --light:    #FFFFFF;
  --green:    #62C554;
  --red:      #F16A5D;   /* lignes retirées d'un diff, rien d'autre */

  /* Le volet actif de la démo : un liseré de lumière, pas de couleur. */
  --ws:       rgba(255,255,255,.62);
  --ws-glow:  rgba(255,255,255,.10);

  /* Familles : les titres en Space Grotesk ; le reste, celles du Mac, qui sont celles de l'app.
     --serif ne sert plus qu'aux faux sites des démos (window.css). */
  --display: "Space Grotesk", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --serif: ui-serif, "New York", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --sans:  -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --mono:  ui-monospace, "SF Mono", Menlo, Monaco, Consolas, monospace;

  /* Échelle. */
  --t-hero:  clamp(41px, min(5.9vw, 12vh), 84px);   /* fenêtre basse : suit aussi la hauteur */
  --t-h2:    clamp(34px, 4.6vw, 62px);
  --t-h3:    clamp(21px, 1vw + 16px, 25px);
  --t-lead:  clamp(17px, 0.55vw + 14.5px, 20px);
  --t-body:  16px;
  --t-mono:  12.5px;

  /* Rythme. */
  --gutter:  clamp(20px, 5vw, 40px);
  --max:     1200px;
  --section: clamp(104px, 12vw, 168px);

  /* Formes. */
  --r-window: 12px;
  --r-pane:   10px;
  --r-card:   20px;
  --r-btn:    12px;
  --r-key:    6px;

  --shadow-window: 0 0 0 1px rgba(255,255,255,.06), 0 40px 90px -30px rgba(0,0,0,.9), 0 0 120px -20px rgba(255,255,255,.06);

  /* Mouvement. */
  --ease:   cubic-bezier(.2,.7,.2,1);
  --t-fast: 200ms;
  --t-in:   600ms;
}
