/* GorilloBuild design tokens - the single source of truth.
 *
 * These used to be redeclared in a :root block on all 31 pages, and they had
 * drifted apart: the page background was #0d1117 on most pages, #0b1017 on
 * three and #0d1017 on the planner; the second surface had three values; muted
 * text had four. No single one of those is noticeable. The cumulative effect is
 * that moving between pages feels very slightly wrong, and that is worth more
 * than the difference between #0d1117 and #0b1017.
 *
 * Loaded before every page's own <style>, so a page can still override a token
 * deliberately. If you find yourself doing that, ask first whether the token
 * itself is wrong.
 */
:root {
  /* Surfaces, back to front. */
  --bg:            #0d1117;   /* the page itself */
  --surface:       #161d2a;   /* cards, panels, the nav */
  --surface2:      #1e2a3a;   /* raised things ON a surface: inputs, chips, hovers */
  --border:        #2a3548;

  /* Text. */
  --text:          #f0f4f8;
  --muted:         #7a8fa8;

  /* The brand accent. */
  --accent:        #4f7dfc;
  --accent-hover:  #7aa3f5;

  /* Tier colours. Gold is the Ultimate one and matches the tier badge on a
   * build card (rgba(232,196,120)); it was #d4af37 on four pages, which read
   * as a different, browner gold next to the badges. */
  --green:         #78CC82;
  --gold:          #e7c987;
  --gold-soft:     #e7c987;
  --gold-ink:      #3d2e05;
  /* Kept in sync with --gold: three pages build rgba() shadows from the parts. */
  --gold-rgb:      231, 201, 135;
}


/* Cross-document view transitions: every navigation on the site used to be a
 * hard cut to white and back. This is the whole feature in browsers that
 * support it, and is ignored entirely by the ones that do not - which is the
 * right risk profile for a static site with no router.
 *
 * Held short on purpose. A page transition you notice is a page transition that
 * is too slow.
 */
@view-transition { navigation: auto; }

::view-transition-old(root) { animation-duration: 90ms; }
::view-transition-new(root) { animation-duration: 140ms; }

@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}
