/* ============================================================================
   THE 801 — the members' lounge.  Layer 3 of 3. Load after core.css.

   Apply with data-theme="lounge" on <html> for lounge.the801lr.com and the
   age gate, or on any element to skin a block.

   Skin: dark, serif, copper. #211e1b / #f2ede6 are recovered from the 2023
   membersat801.com stylesheet, and as of 2026-10-01 so is the accent: the
   lounge is back on the recovered copper ramp, at cu300 #efb46f with cu200
   as its hover. Between 2026-09-24 and 2026-10-01 the accent was instead the
   gold sampled from the client's 2026 posters (hue 38.4° / saturation 37.5%
   over 28,866 masked pixels); gd300 survives here only as the --focus-ring.

   Differentiators from the event centre, all token-level, no component forked:
     surface      dark   (events: light)
     accent       copper #efb46f  (events: oxblood #7a2733)
     display face serif, mixed case, tight tracking  (events: sans, uppercase)
     radii        0  (events: 4px)

   SCOPE WARNING. This file skins only the pages that link tokens.css +
   core.css — currently the apex, the onboarding page and the two specimen
   sheets. The 12 real lounge pages under design/02-lounge/ load their own
   design/02-lounge/assets/styles.css and are NOT affected by anything here.
   That file uses a different neutral ramp (#1a1613 / #241f1a / #2b2520), so
   one hex measures differently in the two places: gold gd400 is 7.48 / 6.80
   there against 6.90 / 6.09 here. Same hex, different surfaces. Change one
   and the other does not move — and since 2026-10-01 this file's accent is
   copper cu300 while that file keeps its own, so the two now differ in hex as
   well as in surface. Measure against the file you are actually editing.

   Two things the numbers forbid in this skin:
     · Any accent this skin uses, as text or a border on a light surface. The
       shipping copper #efb46f is 1.73:1 on #fbf8f3 and its hover #f6d3a8 is
       1.34; the gd300 focus ring #e2cba3 is 1.49. If a light panel is ever
       needed here use --c-cu700 (7.24 on #fbf8f3) or --c-cu600 (5.42).
     · Relying on a surface fill alone to bound a control. n800 on n900 is
       1.13:1 and n900 on n800 is 1.13:1, so an input inside a card is
       invisible without its --border-control (n400: 3.92 on n800, 4.45 on
       n900). Never remove that border in this theme.
   ============================================================================ */

[data-theme="lounge"] {
  --surface:         var(--c-n900);   /* #211e1b — recovered "ink" */
  --surface-raised:  var(--c-n800);   /* #2c2824 — recovered "ink-soft" */
  --surface-sunken:  var(--c-n1000);
  --surface-inverse: var(--c-n1000);  /* the footer goes darker, not lighter */

  --text:            var(--c-n100);   /* 14.24 on n900 · 12.56 on n800 */
  --text-muted:      var(--c-n300);   /*  7.47 on n900 ·  6.59 on n800 */
  --text-on-inverse: var(--c-n100);   /* 16.54 on n1000 */
  --text-muted-on-inverse: var(--c-n300); /* 8.68 on n1000 */

  --accent:            var(--c-cu300); /* 9.03 on n900 · 7.96 on n800 */
  --accent-hover:      var(--c-cu200); /* 11.69 on n900 · 10.31 on n800 */
  --on-accent:         var(--c-n1000); /* 10.48 on cu300 · 13.58 on cu200 (hover).
                                          n100 on cu300 would be 1.58 — ink, not cream. */
  --accent-on-inverse: var(--c-cu300); /* 10.48 on n1000 */

  --border:          var(--c-n700);   /* decorative hairline, non-normative */
  --border-control:  var(--c-n400);   /* 4.45 n900 · 3.92 n800 · 5.17 n1000 */
  --border-on-inverse:         var(--c-n700);
  --border-control-on-inverse: var(--c-n400);  /* 5.17 on n1000 */

  --focus-ring:      var(--c-gd300);  /* 10.51 on n900 · 9.26 on n800 · 12.20 on n1000 */

  --danger: var(--c-danger-dark);     /* 8.12 on n900 · 7.16 on n800 */
  --ok:     var(--c-ok-dark);         /* 10.53 on n900 */
  --warn:   var(--c-warn-dark);       /* 10.82 on n900 */

  --radius-control: var(--r-0);
  --radius-card:    var(--r-0);

  --font-display:      var(--font-serif);
  --font-body:         var(--font-sans);
  --display-transform: none;
  --display-tracking:  var(--tracking-tight);
}

/* The lounge's one typographic signature: the largest headings set tighter
   than the scale's default, which is what makes a system serif read as a
   display face rather than as body copy scaled up. */
[data-theme="lounge"] h1,
[data-theme="lounge"] .x-display,
[data-theme="lounge"] .c-door__name { letter-spacing: -0.035em; line-height: 0.95; }

/* Dark surfaces render form controls with the light-mode UA stylesheet unless
   told otherwise: without this the native select arrow and the date picker
   glyph are black-on-dark and the calendar popup opens white. */
[data-theme="lounge"] { color-scheme: dark; }