/*
	Design tokens for the dark editorial direction (G1).

	Ported from mockups/01-dark-editorial/css/styles.css, which is frozen. That file
	scoped everything to a .dark-editorial class because five directions shared one
	document tree; here the direction IS the site, so the tokens sit on :root and the
	scoping class is gone.

	Loaded before home.css and after global.css, so the last four declarations below
	re-point the four shell names global.css invented for the placeholder page. One
	palette drives the page; global.css keeps owning the reset, the fonts and the
	skip link.

	Contrast, computed against the composited background (WCAG 2.1). Every value here
	is a measurement, not an intention: text pairs clear 4.5:1 and rings clear 3:1.

	  #ececf0 text on #0a0a0c canvas ........ 16.79:1
	  #9a9aa4 muted on #0a0a0c canvas ........ 7.09:1
	  #9a9aa4 muted on #0d0d11 lead .......... 6.96:1
	  #9a9aa4 muted on #131317 panel ......... 6.65:1
	  #9a9aa4 muted on a tracker plate ....... 4.67:1  (worst band, worst pixel; see below)
	  #85858f muted-2 on #0a0a0c canvas ...... 5.42:1
	  #85858f muted-2 on #131317 panel ....... 5.08:1
	  #ff5c1a accent on #0a0a0c canvas ....... 6.40:1  (surfaces and rules only)
	  #ff7a42 accent-text on #0a0a0c canvas .. 7.64:1  (the only orange used AS text)
	  #ff7a42 accent-text on #131317 panel ... 7.16:1
	  #0a0a0c ink on #ff5c1a newsletter band .. 6.80:1
	  #3a1206 soft ink on #ff5c1a band ....... 5.36:1

	--muted-2 is the one token with a ceiling: it never goes on a tracker plate,
	where the glow lifts the ground and drops it under 4.5:1. Quiet text there
	uses --muted.

	THE FOUR TRACKER ACCENTS. One exception to the single-orange discipline, and it
	stops at the four full-bleed tracker bands: each band inks its own kicker, dashes,
	row dates, rules and stage markers, and everything else on the page stays orange.
	The release calendar keeps the house pair, so the exception adds three hues rather
	than four.

	  release-calendar ... #ff5c1a surface / #ff7a42 text   (the house pair)
	  tour-guide ......... #f0c04e
	  festival-tracker ... #7ef0c1
	  award-watch ........ #c99df0

	The three new hues are far brighter than the orange, so each one is text-safe at
	full strength and needs no second variant: the --accent/--accent-text split exists
	because #ff5c1a alone fails as ink, and #f0c04e, #7ef0c1 and #c99df0 do not. The
	*-text names below are still declared per band, so a hue that later fails as ink
	gets its brighter variant in one place and every accent-inked rule follows.

	What the brightness costs is the plate. A band's glow and dot screen are inked from
	its own accent, and mint at the orange's opacity would lift the ground far past
	where the orange lifts it, dropping --muted under 4.5:1 across the band. So each
	band carries --plate-ink in home.css, one scale over the whole plate layer, set so
	the band's lit ground composites to the luminance the orange plate already reaches:
	1, 0.64, 0.57, 0.74 for the four above. That holds every accent opacity under the
	orange plate's, which is the ceiling the design sets, and it is what lets the
	neutral figures at the top of this file stand on all four bands instead of only on
	the one they were measured on.

	Contrast below is measured, not modelled: every pairing was read off the rendered
	page in Chrome at 1440, taking the brightest pixel behind the element as its
	ground, which is the glow at its hottest with a dot of the screen on top of it.

	                                    release   tour     festival  award
	  ground behind the head lockup ... #4e2619  #383020  #233430  #342d3e
	  accent as ink: kicker ...........  5.32:1   8.51:1  10.77:1   6.69:1
	  accent as ink: row dates ........  6.94:1   9.39:1  12.93:1      n/a
	  accent as ink: live stage label .     n/a      n/a      n/a   8.11:1
	  accent as rule: kicker dash .....  4.46:1   8.51:1  10.77:1   6.69:1
	  accent as rule: lockup dash .....  4.21:1   7.67:1   9.42:1   6.01:1
	  accent as rule: urgent row ......     n/a   7.26:1      n/a      n/a
	  accent as marker: stage rail ....     n/a      n/a      n/a   8.12:1
	  accent as focus ring ............  5.32:1   8.51:1  10.77:1   6.69:1
	  --muted, quietest text on a plate  4.91:1   4.67:1   4.74:1   5.08:1
	  --text, the band heading ........ 11.93:1  13.06:1  12.57:1  13.14:1
	  key square on the #0a0a0c rail ..  6.40:1  11.64:1  14.24:1   9.01:1

	Every ink clears 4.5:1 and every rule, marker and ring clears 3:1. The tightest
	figures on the page are the two orange ones, at 4.21:1 and 4.46:1, and both are
	rules rather than type; the tightest ink anywhere is --muted under the tour guide's
	lockup at 4.67:1, which is the figure the table at the top of this file quotes. The
	5.48:1 it used to quote was read when award watch was the only plate and that plate
	was orange; the same pairing on the same lockup reads 5.08:1 now.

	The rail's own links are not part of the exception. They are --muted on the canvas
	at 5.40:1 measured over the hairline, and only the key square beside each label
	carries the band's colour.
*/

:root {
	/* Grounds, darkest to lightest. Four is the whole set; a fifth would be a
	   value the reader cannot tell apart from one of these. */
	--canvas: #0a0a0c;
	--lead-canvas: #0d0d11;
	--footer-ground: #0e0e12;
	--panel: #131317;

	/* Two rule weights: the hairline divides, the bright one bounds. */
	--hairline: #26262c;
	--hairline-bright: #34343c;

	/* Text, loudest to quietest. */
	--text: #ececf0;
	--muted: #9a9aa4;
	--muted-2: #85858f;

	/* Signal orange, split in two. --accent is a surface and a rule; it is never
	   set as text on carbon. --accent-text is the tint that is, and the split is
	   the whole discipline: one orange for ink on it, one orange made of ink. */
	--accent: #ff5c1a;
	--accent-text: #ff7a42;
	--accent-ink: #0a0a0c;
	--accent-ink-soft: #3a1206;

	/* The four tracker accents, read only by the [data-tracker] map in home.css and
	   by nothing else on the page. Same split as the orange for the same reason: one
	   name for surfaces, one for ink. Three of the four point at the same hex twice
	   because the hue is bright enough to be both, and they keep the split anyway so
	   the rules that read them never have to know which case they are in. */
	--tracker-release: #ff5c1a;
	--tracker-release-text: #ff7a42;
	--tracker-tour: #f0c04e;
	--tracker-tour-text: #f0c04e;
	--tracker-festival: #7ef0c1;
	--tracker-festival-text: #7ef0c1;
	--tracker-award: #c99df0;
	--tracker-award-text: #c99df0;

	/* The story-card families. Twelve story types read as eight colours: releases,
	   tours, festivals and awards reuse the four tracker accents above, and these four
	   cover the rest. Band changes (a lineup move, a reunion, a breakup) share coral,
	   the industry desk (business, legal, charts) shares steel, a debut takes lime,
	   and a death notice is matte so it never takes a colour. Read by the [data-accent]
	   maps in home.css and news.css and by nothing else. The three bright hues sit in
	   the same lightness band as the tour/festival/award three, so each is its own ink;
	   matte follows the muted pair, which is already measured on every ground. */
	--type-band: #f0847e;
	--type-band-text: #f0847e;
	--type-industry: #7ab6f0;
	--type-industry-text: #7ab6f0;
	--type-new: #b8f07e;
	--type-new-text: #b8f07e;
	--type-matte: #85858f;
	--type-matte-text: #9a9aa4;

	/* Re-pointed by any section that changes the ground under a focus ring, so the
	   ring rule itself is written once and never restated. */
	--focus-ring: var(--accent-text);

	--gutter: clamp(1.15rem, 3.4vw, 2.75rem);
	--measure: 1360px;

	/* The sticky masthead's height plus air, so an anchored section never lands
	   underneath it. The masthead measures 115px once the brand row and the genre rail
	   are laid out; this is that, rounded up, with room to breathe. */
	--sticky-clearance: 8.25rem;

	/* global.css named these for the placeholder page. Kept as aliases so the shell
	   rules it already ships (body, skip link, icon, focus) follow this palette
	   instead of holding a second copy of it. */
	--surface: var(--canvas);
	--ink: var(--text);
	--ink-quiet: var(--muted);
	--rule: var(--hairline);
}
