/* ============================================================
   westminster.α — design tokens
   v2.0 · dark only · onedark-derived
   ------------------------------------------------------------
   This file is the single source of truth for the brand.
   Every color, type face, spacing rule, and semantic meaning
   is encoded here. Apps and the website import this directly.
   ============================================================ */

:root {
  /* -- color, structural ------------------------------------ */
  --wa-bg:        #282c34;  /* page background, the slate */
  --wa-surface:   #21252b;  /* cards, tiles, secondary panels */
  --wa-sunken:    #1c1f24;  /* image plates, code blocks, wells */
  --wa-rule:      #3e4451;  /* dividers, hairlines, borders */
  --wa-rule-soft: #2c313a;  /* very faint structural lines */

  /* -- color, text ------------------------------------------ */
  --wa-text:      #abb2bf;  /* body text, the muted off-white */
  --wa-text-mute: #5c6370;  /* metadata, captions, comments */
  --wa-text-dim:  #4b5263;  /* further-deemphasized elements */

  /* -- color, semantic accents ------------------------------
     Each accent has a single reserved role. Never used for
     decoration. If you find yourself wanting a color for
     "visual interest," you have made a mistake.            */
  --wa-link:      #61afef;  /* hyperlinks, only */
  --wa-ok:        #98c379;  /* success states, only */
  --wa-warn:      #d19a66;  /* warnings, only */
  --wa-err:       #e06c75;  /* errors, only */
  --wa-ns:        #c678dd;  /* the namespace separator (.) */
  --wa-alpha:     #e5c07b;  /* the α glyph itself, and only that */

  /* -- typography ------------------------------------------- */
  --wa-mono: 'Source Code Pro', 'Menlo', 'Consolas', 'SF Mono', monospace;
  --wa-sans: 'Inter', -apple-system, system-ui, sans-serif;

  /* type scale (mono-first) */
  --wa-fs-display: 22px;   /* h1, lede */
  --wa-fs-h2:      16px;
  --wa-fs-h3:      14px;
  --wa-fs-body:    14px;
  --wa-fs-small:   12px;
  --wa-fs-meta:    11px;   /* metadata, captions, section markers */
  --wa-fs-micro:   10px;   /* spec rows, fine print */

  --wa-lh-tight:   1.3;
  --wa-lh-normal:  1.6;
  --wa-lh-loose:   1.75;   /* lede, body prose */

  /* -- layout ----------------------------------------------- */
  --wa-unit:       4px;    /* base spacing unit */
  --wa-gap-xs:     8px;
  --wa-gap-sm:     14px;
  --wa-gap-md:     22px;
  --wa-gap-lg:     32px;
  --wa-gap-xl:     56px;

  --wa-radius:     4px;    /* tiles, surfaces */
  --wa-radius-sm:  2px;    /* inline pills */

  --wa-page-max:   720px;  /* primary content column */
  --wa-page-pad:   28px;

  /* -- motion ----------------------------------------------- */
  --wa-ease:       cubic-bezier(0.2, 0, 0, 1);
  --wa-dur-fast:   120ms;
  --wa-dur-norm:   240ms;
}

/* ============================================================
   defaults — apply tokens to bare HTML
   ============================================================ */

html, body {
  margin: 0;
  padding: 0;
  background: var(--wa-bg);
  color: var(--wa-text);
  font-family: var(--wa-mono);
  font-size: var(--wa-fs-body);
  line-height: var(--wa-lh-normal);
  font-feature-settings: 'liga' 1, 'calt' 1;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a {
  color: var(--wa-link);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color var(--wa-dur-fast) var(--wa-ease);
}
a:hover { border-bottom-color: var(--wa-link); }

::selection { background: var(--wa-alpha); color: var(--wa-bg); }

/* the wordmark — composable from spans */
.wa-mark { font-family: var(--wa-mono); color: var(--wa-text); }
.wa-mark .ns { color: var(--wa-ns); }
.wa-mark .a  { color: var(--wa-alpha); }