/* Palette — DESIGN.md v0.2 §1. Cool-shifted greys, blue accent, red secondary, silver metal.
   These hexes are authoritative; do not adjust them. */
:root{
  /* --- Greys: the foundation (cool-shifted, never neutral) ---------------- */
  --bg-void:#0A0B0D;      /* page base */
  --bg-deep:#101216;      /* section fields */
  --surface-1:#16191F;    /* card base, pre-glass */
  --surface-2:#1E222A;    /* raised surface, hover */
  --stroke-1:#272C35;     /* hairline borders */
  --stroke-2:#3A404C;     /* emphasized borders */
  --text-1:#E8EAEE;       /* primary text — never pure white */
  --text-2:#9BA3B0;       /* secondary */
  --text-3:#5F6773;       /* muted, timestamps, hints */

  /* --- Blue: accent ------------------------------------------------------ */
  --blue-core:#3B82F6;
  --blue-bright:#60A5FA;
  --blue-deep:#1D4ED8;
  --blue-glow:rgba(59,130,246,.18);/* @kind color */

  /* --- Red: secondary. The rarest colour on the page. -------------------- */
  --red-core:#DC2626;
  --red-bright:#EF4444;
  --red-deep:#991B1B;

  /* --- Silver: the metal. Mark and mark-derived elements only. ----------- */
  --silver-high:#E2E5EA;
  --silver-mid:#A8AEB8;
  --silver-low:#6B7280;
  --silver-shadow:#3F4550;

  /* --- Semantic ---------------------------------------------------------- */
  --canvas:var(--bg-void);
  --surface-card:var(--surface-1);
  --surface-raised:var(--surface-2);
  --glass-fill:rgba(30,34,42,.55);
  --glass-fill-opaque:rgba(30,34,42,.94);
  --glass-stroke:rgba(255,255,255,.07);
  --glass-stroke-accent:rgba(59,130,246,.28);
  --glass-highlight:rgba(255,255,255,.06);

  --text-body:var(--text-2);
  --text-muted:var(--text-3);
  --text-inverse:var(--bg-void);
  --text-accent:var(--blue-bright);
  --text-link:var(--blue-bright);
  --text-link-hover:var(--blue-light,#93B4FA);

  --border-hairline:var(--stroke-1);
  --border-subtle:var(--stroke-1);
  --border-strong:var(--stroke-2);
  --border-focus:var(--blue-core);

  --accent:var(--blue-core);
  --accent-hover:var(--blue-bright);
  --accent-press:var(--blue-deep);
  --accent-contrast:#FFFFFF;

  /* Verified state is BLUE, never green — green is the colour of every fake
     trust badge in crypto (DESIGN.md §6). There is deliberately no --success. */
  --verified:var(--blue-core);
  --danger:var(--red-core);
  --danger-hover:var(--red-bright);
  --warning:#C98A1E;
  --info:var(--blue-core);

  --focus-ring:0 0 0 2px var(--bg-void),0 0 0 4px var(--blue-core);/* @kind shadow */

  /* Ambient page wash — DESIGN.md §2. Blue dominant, red at ~half strength.
     This is where the entire glow budget goes: behind things, never outlining them. */
  --wash-page:radial-gradient(900px circle at 15% 0%,rgba(59,130,246,.10),transparent 55%),radial-gradient(700px circle at 85% 25%,rgba(220,38,38,.055),transparent 55%);/* @kind other */
}
