/* Local Rules — design tokens
   Settled. Lifted from the identity artifacts. Do not change values without
   a decision recorded in docs/design-spec.md.

   THE STAKES PALETTE. Revised 5 Sep 2026; see docs/design-spec.md, "The mark
   goes red". The accents are no longer named after stationery, they are named
   after the four colors the Rules of Golf already use to mark a course, which
   is the vocabulary the publication is named after:

     BLACK READS    headlines, body copy, borders
     RED MARKS      lateral penalty stake. The number box. Nothing else, ever.
     BLUE LABELS    ground-under-repair stake. Kickers, eyebrows, links, keys.
     YELLOW HOLDS   penalty stake. RESERVED: at most one object on a page.
     GRAY RECEDES   metadata, data VALUES, hairlines
     (the stock itself is the white out-of-bounds stake: the page boundary)

   Only --stake is new. Blue, yellow, gray and the stock are unchanged, which
   is the whole reason red won: at 145 degrees from ledger blue it joins the
   palette without evicting anything. Green sat 43 degrees away and could not.

   Note: data values are GRAY, not blue. Blue labels the field; gray states it.
*/

:root {
  /* stock */
  --paper:      #E9E8E4;
  --paper-lt:   #F5F4F1;

  /* The crest plate. A club's own mark is someone else's artwork with its own
     color assumptions — most are dark figures on white, so a plate that
     inverted with the stock would swallow them. This token is DELIBERATELY not
     overridden in the dark block below: the plate stays light in both stocks,
     like a museum mount. It is the one ground in the system that does not
     follow the OS, and the reason is that its contents are not ours. */
  --plate:      #F7F6F3;

  /* ink */
  --ink:        #17181C;
  --ink-70:     rgba(23, 24, 28, .70);
  --ink-50:     rgba(23, 24, 28, .50);
  --ink-14:     rgba(23, 24, 28, .14);

  /* accents */
  --blue:       #1B4272;
  --blue-35:    rgba(27, 66, 114, .35);
  /* Hover ground for facet links. It covered the post rows too until 11 Sep
     2026, when the owner saw it live and sent those back to --paper-lt: on a
     row whose title is --ink, a wash of the link ink reads as a blue panel
     rather than a lit one. The facet links keep it because their text IS blue,
     so the ground and the type agree. See .lr-row:hover in screen.css. */
  --blue-wash:  rgba(27, 66, 114, .07);

  /* The mark. Red lives here and nowhere else.
     #B82B30 is the equal-weight solve at H358 S62: 6.13:1 for the white figure
     inside the chip, 5.00:1 for the chip against the stock. Both computed, not
     eyeballed. A knocked-out chip is a DARK object, which is why it holds an
     edge on either stock without borrowing a border the way the old yellow box
     had to. */
  --stake:      #B82B30;
  --stake-35:   rgba(184, 43, 48, .35);

  /* Yellow's job, settled 5 Sep 2026: it is the HIGHLIGHTER. ::selection and
     nothing else. Selecting a passage is marking it, which is what a penalty
     stake does to a piece of ground, and a page only ever has one selection —
     so "at most one yellow object on a page" is enforced by the browser rather
     than by discipline. Ink on it is 9.89:1 light, 8.65:1 dark. The pull figure
     stays ink by the ruling in docs/design-spec.md; this does not reopen it. */
  --pencil:     #EFBA1F;
  --gray:       #63666B;   /* AA fix: #6B6E73 was 4.17:1 on --paper, under the 4.5 floor.
                              #63666B is 4.70:1 on stock, 5.24:1 on panel, 3.08:1 against
                              ink so gray still recedes. Light mode only. */
  --gray-30:    rgba(99, 102, 107, .32);   /* tracks --gray above */

  /* type */
  --display:    "Barlow Condensed", "Trade Gothic Condensed", sans-serif;
  --mono:       "DM Mono", ui-monospace, monospace;
  --body:       "Source Serif 4", Georgia, serif;

  --track-mono:    .16em;   /* labels, eyebrows */
  --track-tagline: .20em;   /* tagline only */
  --lh-display:    .86;     /* wordmark */
  --lh-body:       1.6;

  /* structure */
  /* Zero in BOTH stocks now. The old 2px existed because a light yellow chip
     could not hold an edge against light stock; a filled red chip carries its
     own edge, so the dark-mode conditional that used to zero this is gone.
     Kept as a token because the small tiers scale it with calc(). */
  --numbox-border-width: 0;
  --numbox-border-color: transparent;

  --rule-major: 2px;
  --rule-hair:  1px;
  --measure:    62ch;
  --wrap:       760px;
}

/* Dark stock. Follows the OS via prefers-color-scheme. No toggle, no JS.
   Five values change. Every component reads tokens, so nothing else does.
   Contrast verified: ink/stock 13.13, blue/stock 7.84, figure/pencil 8.65.

   Two deliberate departures from a straight inversion:
     - Stock is a lifted charcoal, not near-black. It should read as different
       paper, not inverted paper.
     - The stake lifts one step rather than dropping. Red at #B82B30 on
       charcoal is 2.4:1 and reads as a hole in the page; #C22E32 clears 3.0:1
       as a shape while keeping the white figure inside it at 5.63:1, which is
       the number that actually matters. A chip is a shape, its figure is text,
       and only the text has a 4.5 floor.
     - Pencil still drops one step, for the same reason as before: at full
       strength on charcoal it would be the brightest object on the page.
*/
@media (prefers-color-scheme: dark) {
  :root {
    --paper:    #1B1C20;
    --paper-lt: #25272C;

    --ink:      #E3E2DE;
    --ink-70:   rgba(227, 226, 222, .70);
    --ink-50:   rgba(227, 226, 222, .50);
    --ink-14:   rgba(227, 226, 222, .16);

    --blue:     #8FB3DE;
    --blue-35:  rgba(143, 179, 222, .35);
    --stake:    #C22E32;
    --stake-35: rgba(194, 46, 50, .35);
    --blue-wash: rgba(143, 179, 222, .10);
    --pencil:   #E0AE1C;
    --gray:     #989BA1;
    --gray-30:  rgba(152, 155, 161, .34);

  }
}

/* Base. Everything else builds on this. */
html, body { margin: 0; padding: 0; }
* { box-sizing: border-box; }

body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--body);
  font-size: 17px;
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
}

/* Bottom padding reduced 100px -> 56px on 28 Aug 2026. The 100px was set when
   nothing followed the content; partials/sitefoot.hbs now renders on every page,
   so that padding became a void between the colophon's closing 2px rule and the
   footer's 2px rule, and the page read as ending twice. 56px is enough to
   separate the two without either rule looking orphaned. */
.lr-wrap { max-width: var(--wrap); margin: 0 auto; padding: 44px 24px 56px; }

.lr-eyebrow {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: var(--track-mono);
  text-transform: uppercase;
  color: var(--blue);
}

.lr-rule { height: var(--rule-major); background: var(--ink); }

.lr-wordmark {
  font-family: var(--display);
  font-weight: 700;
  text-transform: uppercase;
  font-size: clamp(46px, 13vw, 86px);
  line-height: var(--lh-display);
  margin: 6px 0 0;
}

.lr-tagline {
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: var(--track-tagline);
  text-transform: uppercase;
  color: var(--blue);
  margin: 12px 0 14px;
}

/* The mark. Red lives here and nowhere else. */
.lr-numbox {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  flex: none;
  border: var(--numbox-border-width) solid var(--numbox-border-color);
  background: var(--stake);
  line-height: 1;
}
.lr-numbox .lbl {
  font-family: var(--mono);
  font-weight: 500;
  font-size: 8px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #FFF;   /* the chip is red in both stocks, so the figure is white in both */
}
.lr-numbox .fig {
  font-family: var(--display);
  font-weight: 700;
  color: #FFF;   /* the chip is red in both stocks, so the figure is white in both */
}

/* Data-block keys are blue. Data-block values are gray. */
.lr-key {
  display: block;
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: .17em;
  text-transform: uppercase;
  color: var(--blue);
}
.lr-val {
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: .05em;
  color: var(--gray);
  font-variant-numeric: tabular-nums;
}

/* ---- chart series colours ------------------------------------------------
   Charts may use all four stakes as FILLS; see docs/design-spec.md, "Charts may
   use the whole palette". c5 and c6 are tint steps of colours already in the
   system, never new hues. on-cN is the ink that sits ON that fill. ---------- */
:root{--c1:var(--blue);--c2:var(--stake);--c3:var(--pencil);--c4:var(--ink);
  --c-blue:#1B4272;--c-red:#B82B30;--c-yellow:#EFBA1F;--c-slate:#A2B3CA;
  --r1:#1B4272;--r2:#3B5E88;--r3:#5C7A9E;--r4:#7E96B4;--r5:#A2B3CA;--r6:#C6D1E0;
  /* Categorical slots 5 and 6, for a six-way split. Both are tint steps of
     colors already in the system -- slate is the blue ramp's light end, and
     gray is the palette's own "gray recedes" -- so the set stays derivable
     rather than introducing a hue. The two smallest slices take them. */
  --c5:#A2B3CA;--c6:#C3C5C9;
  /* c4b replaces c4 (ink) as a categorical fill. A black slice in a donut
     reads as a hole in the page rather than a category, so the fourth slot is
     the blue ramp's middle step. c4 stays defined -- bar charts still use ink
     legitimately, where it is a bar and not one wedge among six. */
  --c4b:#3B5E88;
  --on-c1:#F5F4F1;--on-c2:#F5F4F1;--on-c3:#17181C;--on-c4:#F5F4F1;
  --on-c4b:#F5F4F1;--on-c5:#17181C;--on-c6:#17181C;--on-r5:#17181C}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --c-blue:#8FB3DE;--c-red:#C22E32;--c-yellow:#E0AE1C;--c-slate:#506E92;
  --r1:#C3D6EE;--r2:#A9C3E4;--r3:#8FB3DE;--r4:#6F91B8;--r5:#506E92;--r6:#34506E;
  --c5:#6F91B8;--c6:#7C8087;--c4b:#A9C3E4;
  --on-c1:#17181C;--on-c2:#F5F4F1;--on-c3:#17181C;--on-c4:#1B1C20;
  --on-c4b:#17181C;--on-c5:#17181C;--on-c6:#17181C;--on-r5:#E3E2DE}}