/**
 * One palette, for every page Acta serves.
 *
 * The app, the admin console and the sign-in pages each carried their own
 * colours, so signing in looked like a different product from the one you
 * then landed in - a blue-violet accent against the app's pink, and a
 * different grey for every surface. Nobody chose that; it is what happens
 * when a page is written on its own.
 *
 * The names under "aliases" exist because the auth pages were written against
 * them. Keeping them as aliases means those pages did not have to be rewritten
 * rule by rule to join the system - and a new page should use the canonical
 * names above.
 */
:root {
  --paper: #f3f3f7;
  --surface: #fff;
  --surface-2: #eaeaf1;
  --surface-3: #e1e1eb;
  --text: #17161f;
  --text-2: #413f4e;
  --muted: #6e6b7e;
  --rule: #dcdbe6;
  --signal: #b32455;
  --signal-soft: #f7e4ec;
  --ok: #26713a;
  --warn: #9a5b00;
  --danger: #b32455;
  /*
   * Two names the app already referenced and nobody had ever defined, so
   * `border-left: 3px solid var(--rule-2)` resolved to nothing and the border
   * silently disappeared. Found by listing every var() against the tokens.
   */
  --rule-2: #c9c7d6;
  --signal-line: #e8b9c9;
  --ff: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, monospace;

  /* ---- aliases, for pages written before the system existed ---- */
  --bg: var(--paper);
  --panel: var(--surface);
  --panel-2: var(--surface-2);
  --line: var(--rule);
  --ink: var(--text);
  --dim: var(--muted);
  --accent: var(--signal);
}

@media (prefers-color-scheme: dark) {
  :root {
    --paper: #111017;
    --surface: #191823;
    --surface-2: #22212e;
    --surface-3: #2c2a3a;
    --text: #e9e8f0;
    --text-2: #c3c1d2;
    --muted: #918ea5;
    --rule: #2e2c3c;
    --signal: #f0729d;
    --signal-soft: #2e1a24;
    --ok: #5fcb7f;
    --warn: #e0a340;
    --danger: #f0729d;
    --rule-2: #3b3850;
    --signal-line: #5c3246;
  }
}

/**
 * The `hidden` attribute has to win.
 *
 * It works through the browser's own `[hidden] { display: none }`, which any
 * class selector outranks - `.names { display: flex }` did exactly that, so
 * fields the markup called hidden stayed on screen. It looked like a caching
 * problem for most of an afternoon and was not one.
 */
[hidden] { display: none !important; }