/* ============================================================
   Esse Werks — Livery layer architecture (A3b: three-layer lock)

   Replaces the old on-top overlay. Base + livery + content are three
   locked layers sharing ONE positioned container so they scroll and
   resize as a single unit — the livery can never drift over text.

     .ew-page              position: relative   (shared container)
       .ew-layer-bg        position: absolute; inset:0; z-index:0
                           → monochrome base + measurement grid +
                             livery wash, composed with CSS multiple
                             backgrounds. Decorative, non-interactive.
         .ew-layer-livery  → placeholder block-text watermark slot
                             (real motif-kit art fills --livery-motif)
       .ew-layer-content   position: relative; z-index:1
                           → ALL text + UI, normal flow. Never tinted.

   STATE is one global switch: body[data-livery="<id>"]. ew-livery.js
   flips that attribute and sets the --livery-* custom properties from
   the livery metaobject; every background re-reads them and reskins
   in lockstep. Liveries stay data-driven (no hardcoded "3").

   Functional signal colors (--success / --accent-warm here; --danger
   lives in global.css) are NEVER remapped by a livery.

   STACKING HYGIENE: never put transform, filter, opacity < 1 or
   will-change on .ew-page / .ew-layer-bg / .ew-layer-content (or on
   body / html). Any of those creates a stacking context that traps
   z-index and turns descendant position:fixed into position:absolute.
   position:relative + z-index is fine and is all this model needs.
   ============================================================ */

:root {
  /* Functional accents — livery-independent.
     --accent default = house red (#E11D2C); small accent text uses --accent-text (--ew-red-tint, AA-safe) — the resting,
     no-livery identity accent. A livery overrides it via the
     body[data-livery] rule below. */
  --accent:        var(--ew-red);
  --accent-text:   var(--ew-red-tint);   /* AA-safe accent for SMALL red text on black; follows the livery accent when one is active */
  --on-accent:     var(--ew-white);      /* text/glyph ON an --accent fill: white reads on house red (4.76:1) */
  --accent-warm:   #ff6a3d;
  --success:       #c2ff00;

  /* Per-livery accent values (canonical). Mirrors the LIVERY_ACCENTS
     map in assets/ew-livery.js — one source of truth for surfaces that
     need to color a per-tile element by its mapped livery (e.g. the
     use-case tap-card hover bar + arrow). Add a new entry here AND in
     ew-livery.js when a livery is added. */
  --livery-performance: #c2ff00;   /* telemetry green                  */
  --livery-drifter:     #ff6a3d;   /* signal orange                    */
  --livery-oemplus:     #5fd2ff;   /* OEM+ accent — RGB 95, 210, 255   */

  /* Livery state tokens — neutral defaults. ew-livery.js overrides
     --livery-accent (and, when real art exists, --livery-motif /
     --livery-blend) on <body> from the active livery metaobject. */
  --livery-accent: var(--ew-red);  /* preventive: this :root default is otherwise inert (ew-livery.js sets it on <body>), but must default to house red, never a stale lime/livery color */
  --livery-motif:  none;     /* real motif-kit art → url(...) later   */
  --livery-blend:  normal;   /* background-blend-mode for the bg comp */

  /* Monochrome base layer constant (site-wide, never varies). bug #21
     removed the measurement-grid + livery-motif backdrop — content now
     sits on a flat near-black field. The livery state mechanism
     (body[data-livery]) still drives copy voice and CTA accent. */
  --ew-base-color: var(--ew-black, #0a0a0b);

  /* Opaque panel fills. Originally semi-transparent so the livery
     backdrop could read through; with the backdrop removed (bug #21),
     panels render solid grey for full legibility. */
  --ew-panel:      var(--ew-graphite, #161618);
  --ew-panel-deep: var(--ew-carbon,   #1f1f22);
}

/* A livery is active → --accent follows the livery accent so CTAs and
   highlights reskin. Drop the attribute → --accent reverts to neutral. */
body[data-livery] {
  --accent:      var(--livery-accent, var(--ew-red));
  --accent-text: var(--livery-accent, var(--ew-red-tint));
  --on-accent:   var(--ew-black);   /* bright liveries need dark on-fill text (4.16–16.58:1) */
}

/* Functional signals stay constant regardless of livery */
body[data-livery] .ew-required,
body[data-livery] [data-required-marker],
.ew-field__label .ew-required { color: var(--danger); }

/* ============================================================
   livery-v1 — default-voice override (§"Default = Performance")

   Before livery-v1 the per-section CSS made the "neutral" voice
   variant the default-visible for undeclared visitors. The spec
   makes Performance the visible default for the undeclared
   (BM3-directory traffic profile). When body has no [data-livery],
   render the Performance voice everywhere it exists.
   ============================================================ */
body:not([data-livery]) [data-voice="performance"] { display: inline !important; }
body:not([data-livery]) [data-voice="neutral"],
body:not([data-livery]) [data-voice="drifter"],
body:not([data-livery]) [data-voice="oemplus"] { display: none !important; }

/* ============================================================
   THREE-LAYER STACK
   ============================================================ */

/* bug #21: lock body to the brand near-black field so nothing depends
   on Dawn's color-scheme default. Belt-and-braces with .ew-layer-bg. */
html, body { background-color: var(--ew-base-color, #0a0a0b); }

/* Shared positioned container. One in-flow child (.ew-layer-content);
   .ew-layer-bg is absolute so it is not a grid item. The 1fr row
   stretches .ew-layer-content to the full container height. */
.ew-page {
  position: relative;
  display: grid;
  grid-template-rows: 1fr;
  grid-template-columns: 100%;
  min-height: 100%;
}

/* BASE layer — behind all content. Flat near-black after bug #21
   stripped the measurement grid + livery motif. The .ew-page /
   .ew-layer-* container architecture stays in place so future
   ambient-art work can compose into this slot without a refactor. */
.ew-layer-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;          /* purely decorative — never interactive */
  background: var(--ew-base-color);
}

/* CONTENT layer — all text + UI, normal document flow. Carries the
   sticky-footer grid that <body> used to own (header / main / footer;
   first two rows auto to absorb an optional announcement bar). */
.ew-layer-content {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  grid-template-columns: 100%;
  min-height: 100%;
}

/* LIVERY MOTIF — disabled in livery-v1 polish (bug #21). The slot
   element is kept in the DOM (theme.liquid still renders it) so future
   ambient-art work can re-enable without a layout refactor, but it
   renders nothing today. ew-livery.js no-ops the watermark tiler. */
.ew-layer-livery { display: none; }
