/* Duke design system. One source for the landing (copied to web/ by deploy.sh) and the values the app mirrors in RunState.swift.
   The icon is nine game tiles on ink, one per game, the white one in the middle playing now. The UI owns one colour, Duke orange,
   the Factorio tile's warmth; every game keeps its own colour (--g-*). Dark mode is true black, like a console between games.
   Type: the system font, bold (Duke Sans retired 2026-11-01). 8 point grid, one radius set, 48 point capsule controls. */

:root {
  /* colour */
  --accent: #e8691a;          /* Duke orange: highlights, correct answers, the focus ring */
  --accent-light: #2e2e34;    /* icon gradient top: ink */
  --accent-deep: #0c0c0e;     /* icon gradient bottom */
  --ink: #16161a;             /* the icon tile, the band */
  --link: #c2410c;            /* AA on white */
  --btn: #c2410c;             /* white text passes AA */
  --band: #16161a;
  --band-sub: #c7c7cc;
  --band-art: #e8691a;
  --band-line: rgba(255, 255, 255, .24);
  --ring: color-mix(in srgb, var(--accent) 30%, transparent);
  --bg: #fff;
  --surface: #f5f5f7;
  --line: rgba(0, 0, 0, .1);
  --text: #1d1d1f;
  --sub: rgba(29, 29, 31, .64); /* .6 was 4.46:1 on white */

  /* games: one colour each, white glyph on top, all AA against white text */
  --g-duolingo: #2e8b3a;
  --g-factorio: #c4570f;
  --g-gdt: #0063ba;
  --g-fez: #b08a00;
  --g-papers: #b5302a;
  --g-oni: #3d7a5c;
  --g-pokemon: #203868;      /* the Sapphire text box navy */
  --g-mirage: #9a4a1f;
  --g-pikmin: #1f6e3a;       /* the Pikmin 2 graph green */

  /* the nine, lifted to hold on black: the strip under the nav, the frame, the art on the band, the dot (the dotfiles landing does this with Catppuccin) */
  --l-duolingo: #4cc15a; --l-factorio: #f08a3c; --l-gdt: #3d9be0; --l-fez: #e6bd1a; --l-papers: #e8564e;
  --l-oni: #5cb88c; --l-pokemon: #5b82d6; --l-mirage: #d98550; --l-pikmin: #4fb06a;
  --strip: linear-gradient(90deg, var(--l-duolingo) 0 11.11%, var(--l-factorio) 0 22.22%, var(--l-gdt) 0 33.33%, var(--l-fez) 0 44.44%, var(--l-papers) 0 55.55%, var(--l-oni) 0 66.66%, var(--l-pokemon) 0 77.77%, var(--l-mirage) 0 88.88%, var(--l-pikmin) 0);

  /* type */
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --size-display: 34px;       /* 41 line */
  --size-title: 22px;         /* 28 line */
  --size-body: 17px;          /* 24 line */
  --size-subhead: 15px;       /* 20 line */
  --size-footnote: 13px;      /* 16 line */

  /* space: the 8 point grid */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px; --sp-9: 96px;
  --measure: 680px;
  --wrap: 1120px;

  /* shape */
  --control: 48px;
  --r-card: 28px;
  --r-group: 20px;
  --r-pill: 999px;
  --r-icon: 22.5%;
  --motion: .2s ease;
}

@media (prefers-color-scheme: dark) {
  :root {
    --link: #ff8a3d;
    --bg: #000;               /* true black, a console between games */
    --surface: #1c1c1e;
    --band: #1c1c1e;
    --line: rgba(255, 255, 255, .12);
    --text: #f5f5f7;
    --sub: rgba(245, 245, 247, .6);
  }
}