/* =====================================================================
   ambient-jelia.nyc.css — GENERATED by bin/gen-ambient-m5.py on 2026-09-02.
   DO NOT HAND-EDIT: regenerate and re-upload instead.

   dark navy consulting site. Albedo solves to site.css's own --navy-2 (#2b2b2b), so panels are LIT, never recoloured. The sticky header and the two hero CTAs are lit WITHOUT a surface so the cyan primary keeps its brand colour - the first version of this map only touched .card/.app, which are all below the fold, so the page looked unchanged on load.

   A SEPARATE FILE from the site's own stylesheet on purpose: this is a
   lighting layer over a design that already works. Removing the links
   removes the whole thing and the site is exactly as it was.

   Must load AFTER the site's stylesheet — its components declare their
   background at the same specificity, so only a later sheet can hand the
   surface to the lighting model.
   ===================================================================== */

:root{
  --amb-light-x:-1; --amb-light-y:-1;
  --amb-key-light-intensity:.82;
  --amb-fill-light-intensity:.58;
  --amb-light-hue:196; --amb-light-saturation:16%;
  /* x1.16 above a flat --navy-2. Solving the albedo to the site's EXACT card
     colour was the first instinct and it was wrong: it makes a lit card and an
     unlit page identical, so on a dark site - where the cast shadow is dark on
     dark and therefore invisible - the whole rig collapses to a 1px bevel and
     the page reads as unchanged. Letting the material sit slightly proud is
     what "lit" physically means. #2b2b2b -> #313131: same hue, same palette. */
  --amb-albedo:color(srgb-linear 0.0339 0.0339 0.0339);
}

/* .card, .app
   raised slabs. Thicker and lifted than the localhost tuning because this is a DARK site: the cast shadow contributes almost nothing on a dark ground, so the round-over is doing the work and needs the width to be seen */
.card, .app{
  --amb-thickness:2; --amb-elevation:1; --amb-fillet:1; --amb-fillet-width:2;
  --_amb-chamfer-w: max(-1 * var(--amb-thickness), min(var(--amb-chamfer-width), var(--amb-thickness)));
  --_amb-fillet-w: max(-1 * var(--amb-thickness), min(var(--amb-fillet-width), var(--amb-thickness)));
  --_amb-sh-gate: max(0, min(var(--amb-elevation) + var(--amb-thickness), 1));
  --_amb-body-gate: max(0, min(var(--amb-thickness), 1));
  --_amb-sweep-a: calc(
    var(--_amb-sh-gate) * var(--_amb-body-gate) *
      max(0, 1 - var(--amb-elevation) / 3) *
      (var(--amb-thickness) * 0.02 + 0.047)
  );
  box-shadow: hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        0%
        / calc(
            var(--_amb-sh-gate) *
              (
                (var(--amb-key-light-intensity) - var(--amb-fill-light-intensity))
                  * 0.13 + var(--amb-elevation) * -0.077 + 0.368 -
                  var(--_amb-body-gate) * max(0, 1 - var(--amb-elevation)) * 0.14
              )
          )
      )
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 3.8px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 3.8px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 2.7px)
      0.8px,
    hsl(var(--amb-light-hue) var(--amb-light-saturation) 0% / var(--_amb-sweep-a))
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 2.85px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 2.85px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 2px)
      calc(var(--amb-thickness) * 0.9px),
    hsl(var(--amb-light-hue) var(--amb-light-saturation) 0% / var(--_amb-sweep-a))
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 1.9px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 1.9px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 1.35px)
      calc(var(--amb-thickness) * 0.6px),
    hsl(var(--amb-light-hue) var(--amb-light-saturation) 0% / var(--_amb-sweep-a))
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 0.95px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 0.95px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 0.7px)
      calc(var(--amb-thickness) * 0.3px),
    inset calc(var(--amb-light-x) * var(--_amb-chamfer-w) * -1px)
      calc(var(--amb-light-y) * var(--_amb-chamfer-w) * -1px) 0px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        100%
        / calc(
            var(--amb-chamfer) * max(0, min(var(--amb-thickness), 1)) *
              (
                var(--amb-key-light-intensity) * 1.57 +
                  var(--amb-fill-light-intensity) * 0.85 - 1.03
              )
          )
      ),
    inset calc(var(--amb-light-x) * var(--_amb-chamfer-w) * 1px)
      calc(var(--amb-light-y) * var(--_amb-chamfer-w) * 1px) 0px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        0%
        / calc(
            var(--amb-chamfer) * max(0, min(var(--amb-thickness), 1)) *
              (
                (var(--amb-key-light-intensity) - var(--amb-fill-light-intensity))
                  * 0.19 + 0.24
              )
          )
      ),
    inset calc(var(--amb-light-x) * var(--_amb-fillet-w) * -1.4px)
      calc(var(--amb-light-y) * var(--_amb-fillet-w) * -1.4px) 2px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        100%
        / calc(
            var(--amb-fillet) * max(0, min(var(--amb-thickness), 1)) *
              (
                var(--amb-key-light-intensity) * 1.44 +
                  var(--amb-fill-light-intensity) * 0.85 - 0.99
              )
          )
      ),
    inset calc(var(--amb-light-x) * var(--_amb-fillet-w) * 1.4px)
      calc(var(--amb-light-y) * var(--_amb-fillet-w) * 1.4px) 2px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        0%
        / calc(
            var(--amb-fillet) * max(0, min(var(--amb-thickness), 1)) *
              (
                (var(--amb-key-light-intensity) - var(--amb-fill-light-intensity))
                  * 0.23 + 0.3
              )
          )
      );
}

.card, .app{ background-color:var(--amb-lit); }

/* .stat
   a readout tile. Thinner than the cards so the numbers stay the loud thing; keeps its cyan top rule as the accent */
.stat{
  --amb-thickness:1; --amb-elevation:0; --amb-fillet:1;
  --_amb-chamfer-w: max(-1 * var(--amb-thickness), min(var(--amb-chamfer-width), var(--amb-thickness)));
  --_amb-fillet-w: max(-1 * var(--amb-thickness), min(var(--amb-fillet-width), var(--amb-thickness)));
  --_amb-sh-gate: max(0, min(var(--amb-elevation) + var(--amb-thickness), 1));
  --_amb-body-gate: max(0, min(var(--amb-thickness), 1));
  --_amb-sweep-a: calc(
    var(--_amb-sh-gate) * var(--_amb-body-gate) *
      max(0, 1 - var(--amb-elevation) / 3) *
      (var(--amb-thickness) * 0.02 + 0.047)
  );
  box-shadow: hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        0%
        / calc(
            var(--_amb-sh-gate) *
              (
                (var(--amb-key-light-intensity) - var(--amb-fill-light-intensity))
                  * 0.13 + var(--amb-elevation) * -0.077 + 0.368 -
                  var(--_amb-body-gate) * max(0, 1 - var(--amb-elevation)) * 0.14
              )
          )
      )
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 3.8px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 3.8px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 2.7px)
      0.8px,
    hsl(var(--amb-light-hue) var(--amb-light-saturation) 0% / var(--_amb-sweep-a))
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 2.85px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 2.85px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 2px)
      calc(var(--amb-thickness) * 0.9px),
    hsl(var(--amb-light-hue) var(--amb-light-saturation) 0% / var(--_amb-sweep-a))
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 1.9px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 1.9px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 1.35px)
      calc(var(--amb-thickness) * 0.6px),
    hsl(var(--amb-light-hue) var(--amb-light-saturation) 0% / var(--_amb-sweep-a))
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 0.95px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 0.95px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 0.7px)
      calc(var(--amb-thickness) * 0.3px),
    inset calc(var(--amb-light-x) * var(--_amb-chamfer-w) * -1px)
      calc(var(--amb-light-y) * var(--_amb-chamfer-w) * -1px) 0px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        100%
        / calc(
            var(--amb-chamfer) * max(0, min(var(--amb-thickness), 1)) *
              (
                var(--amb-key-light-intensity) * 1.57 +
                  var(--amb-fill-light-intensity) * 0.85 - 1.03
              )
          )
      ),
    inset calc(var(--amb-light-x) * var(--_amb-chamfer-w) * 1px)
      calc(var(--amb-light-y) * var(--_amb-chamfer-w) * 1px) 0px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        0%
        / calc(
            var(--amb-chamfer) * max(0, min(var(--amb-thickness), 1)) *
              (
                (var(--amb-key-light-intensity) - var(--amb-fill-light-intensity))
                  * 0.19 + 0.24
              )
          )
      ),
    inset calc(var(--amb-light-x) * var(--_amb-fillet-w) * -1.4px)
      calc(var(--amb-light-y) * var(--_amb-fillet-w) * -1.4px) 2px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        100%
        / calc(
            var(--amb-fillet) * max(0, min(var(--amb-thickness), 1)) *
              (
                var(--amb-key-light-intensity) * 1.44 +
                  var(--amb-fill-light-intensity) * 0.85 - 0.99
              )
          )
      ),
    inset calc(var(--amb-light-x) * var(--_amb-fillet-w) * 1.4px)
      calc(var(--amb-light-y) * var(--_amb-fillet-w) * 1.4px) 2px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        0%
        / calc(
            var(--amb-fillet) * max(0, min(var(--amb-thickness), 1)) *
              (
                (var(--amb-key-light-intensity) - var(--amb-fill-light-intensity))
                  * 0.23 + 0.3
              )
          )
      );
}

/* .stat — box metrics the original design
   never needed, because it was not a box before. */
.stat{ padding:1rem 1.2rem 1.1rem; border-radius:8px; }

.stat{ background-color:var(--amb-lit); }

/* header
   sticky sheet: no body, but it genuinely floats over the content, so it casts. Keeps its own translucent blur. */
header{
  --amb-thickness:0; --amb-elevation:2;
  --_amb-chamfer-w: max(-1 * var(--amb-thickness), min(var(--amb-chamfer-width), var(--amb-thickness)));
  --_amb-fillet-w: max(-1 * var(--amb-thickness), min(var(--amb-fillet-width), var(--amb-thickness)));
  --_amb-sh-gate: max(0, min(var(--amb-elevation) + var(--amb-thickness), 1));
  --_amb-body-gate: max(0, min(var(--amb-thickness), 1));
  --_amb-sweep-a: calc(
    var(--_amb-sh-gate) * var(--_amb-body-gate) *
      max(0, 1 - var(--amb-elevation) / 3) *
      (var(--amb-thickness) * 0.02 + 0.047)
  );
  box-shadow: hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        0%
        / calc(
            var(--_amb-sh-gate) *
              (
                (var(--amb-key-light-intensity) - var(--amb-fill-light-intensity))
                  * 0.13 + var(--amb-elevation) * -0.077 + 0.368 -
                  var(--_amb-body-gate) * max(0, 1 - var(--amb-elevation)) * 0.14
              )
          )
      )
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 3.8px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 3.8px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 2.7px)
      0.8px,
    hsl(var(--amb-light-hue) var(--amb-light-saturation) 0% / var(--_amb-sweep-a))
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 2.85px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 2.85px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 2px)
      calc(var(--amb-thickness) * 0.9px),
    hsl(var(--amb-light-hue) var(--amb-light-saturation) 0% / var(--_amb-sweep-a))
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 1.9px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 1.9px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 1.35px)
      calc(var(--amb-thickness) * 0.6px),
    hsl(var(--amb-light-hue) var(--amb-light-saturation) 0% / var(--_amb-sweep-a))
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 0.95px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 0.95px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 0.7px)
      calc(var(--amb-thickness) * 0.3px),
    inset calc(var(--amb-light-x) * var(--_amb-chamfer-w) * -1px)
      calc(var(--amb-light-y) * var(--_amb-chamfer-w) * -1px) 0px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        100%
        / calc(
            var(--amb-chamfer) * max(0, min(var(--amb-thickness), 1)) *
              (
                var(--amb-key-light-intensity) * 1.57 +
                  var(--amb-fill-light-intensity) * 0.85 - 1.03
              )
          )
      ),
    inset calc(var(--amb-light-x) * var(--_amb-chamfer-w) * 1px)
      calc(var(--amb-light-y) * var(--_amb-chamfer-w) * 1px) 0px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        0%
        / calc(
            var(--amb-chamfer) * max(0, min(var(--amb-thickness), 1)) *
              (
                (var(--amb-key-light-intensity) - var(--amb-fill-light-intensity))
                  * 0.19 + 0.24
              )
          )
      ),
    inset calc(var(--amb-light-x) * var(--_amb-fillet-w) * -1.4px)
      calc(var(--amb-light-y) * var(--_amb-fillet-w) * -1.4px) 2px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        100%
        / calc(
            var(--amb-fillet) * max(0, min(var(--amb-thickness), 1)) *
              (
                var(--amb-key-light-intensity) * 1.44 +
                  var(--amb-fill-light-intensity) * 0.85 - 0.99
              )
          )
      ),
    inset calc(var(--amb-light-x) * var(--_amb-fillet-w) * 1.4px)
      calc(var(--amb-light-y) * var(--_amb-fillet-w) * 1.4px) 2px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        0%
        / calc(
            var(--amb-fillet) * max(0, min(var(--amb-thickness), 1)) *
              (
                (var(--amb-key-light-intensity) - var(--amb-fill-light-intensity))
                  * 0.23 + 0.3
              )
          )
      );
}

/* no surface assigned for header — deliberate. */

/* .btn
   a control you press. LIGHTING ONLY so .btn-p keeps its cyan and .btn-s stays transparent. */
.btn{
  --amb-thickness:1; --amb-elevation:0; --amb-chamfer:1;
  --_amb-chamfer-w: max(-1 * var(--amb-thickness), min(var(--amb-chamfer-width), var(--amb-thickness)));
  --_amb-fillet-w: max(-1 * var(--amb-thickness), min(var(--amb-fillet-width), var(--amb-thickness)));
  --_amb-sh-gate: max(0, min(var(--amb-elevation) + var(--amb-thickness), 1));
  --_amb-body-gate: max(0, min(var(--amb-thickness), 1));
  --_amb-sweep-a: calc(
    var(--_amb-sh-gate) * var(--_amb-body-gate) *
      max(0, 1 - var(--amb-elevation) / 3) *
      (var(--amb-thickness) * 0.02 + 0.047)
  );
  box-shadow: hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        0%
        / calc(
            var(--_amb-sh-gate) *
              (
                (var(--amb-key-light-intensity) - var(--amb-fill-light-intensity))
                  * 0.13 + var(--amb-elevation) * -0.077 + 0.368 -
                  var(--_amb-body-gate) * max(0, 1 - var(--amb-elevation)) * 0.14
              )
          )
      )
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 3.8px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 3.8px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 2.7px)
      0.8px,
    hsl(var(--amb-light-hue) var(--amb-light-saturation) 0% / var(--_amb-sweep-a))
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 2.85px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 2.85px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 2px)
      calc(var(--amb-thickness) * 0.9px),
    hsl(var(--amb-light-hue) var(--amb-light-saturation) 0% / var(--_amb-sweep-a))
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 1.9px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 1.9px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 1.35px)
      calc(var(--amb-thickness) * 0.6px),
    hsl(var(--amb-light-hue) var(--amb-light-saturation) 0% / var(--_amb-sweep-a))
      calc(
        var(--amb-light-x) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 0.95px) * -1
      )
      calc(
        var(--amb-light-y) *
          (var(--amb-elevation) * 6.8px + var(--amb-thickness) * 0.95px) * -1
      )
      calc(var(--amb-elevation) * 4.8px + var(--amb-thickness) * 0.7px)
      calc(var(--amb-thickness) * 0.3px),
    inset calc(var(--amb-light-x) * var(--_amb-chamfer-w) * -1px)
      calc(var(--amb-light-y) * var(--_amb-chamfer-w) * -1px) 0px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        100%
        / calc(
            var(--amb-chamfer) * max(0, min(var(--amb-thickness), 1)) *
              (
                var(--amb-key-light-intensity) * 1.57 +
                  var(--amb-fill-light-intensity) * 0.85 - 1.03
              )
          )
      ),
    inset calc(var(--amb-light-x) * var(--_amb-chamfer-w) * 1px)
      calc(var(--amb-light-y) * var(--_amb-chamfer-w) * 1px) 0px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        0%
        / calc(
            var(--amb-chamfer) * max(0, min(var(--amb-thickness), 1)) *
              (
                (var(--amb-key-light-intensity) - var(--amb-fill-light-intensity))
                  * 0.19 + 0.24
              )
          )
      ),
    inset calc(var(--amb-light-x) * var(--_amb-fillet-w) * -1.4px)
      calc(var(--amb-light-y) * var(--_amb-fillet-w) * -1.4px) 2px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        100%
        / calc(
            var(--amb-fillet) * max(0, min(var(--amb-thickness), 1)) *
              (
                var(--amb-key-light-intensity) * 1.44 +
                  var(--amb-fill-light-intensity) * 0.85 - 0.99
              )
          )
      ),
    inset calc(var(--amb-light-x) * var(--_amb-fillet-w) * 1.4px)
      calc(var(--amb-light-y) * var(--_amb-fillet-w) * 1.4px) 2px 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        0%
        / calc(
            var(--amb-fillet) * max(0, min(var(--amb-thickness), 1)) *
              (
                (var(--amb-key-light-intensity) - var(--amb-fill-light-intensity))
                  * 0.23 + 0.3
              )
          )
      );
}

/* no surface assigned for .btn — deliberate. */

/* .app .plate
   the 54px icon frame is the one true recess; --amb-shade cuts the same material darker rather than adding a second one */
.app .plate{
  --amb-shade:.52;
  --amb-thickness: 1;
  --_amb-groove-exposure: calc(
    var(--amb-key-light-intensity) * 0.6623 +
      var(--amb-fill-light-intensity) * 0.5527
  );
  --_amb-groove-diffuse: color(
    from var(--amb-albedo) srgb-linear
    calc(r * var(--amb-shade) * var(--_amb-groove-exposure))
    calc(g * var(--amb-shade) * var(--_amb-groove-exposure))
    calc(b * var(--amb-shade) * var(--_amb-groove-exposure))
  );
  background-color: color-mix(
    in srgb,
    var(--_amb-groove-diffuse),
    hsl(from var(--_amb-groove-diffuse) var(--amb-light-hue) calc(100 - s) l)
      var(--amb-light-saturation)
  );
  box-shadow:
    inset calc(var(--amb-light-x) * var(--amb-thickness) * -3.6px)
      calc(var(--amb-light-y) * var(--amb-thickness) * -3.6px)
      calc(var(--amb-thickness) * 2.7px) 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        0%
        / calc(
            max(0, min(var(--amb-thickness), 1)) *
              (
                (var(--amb-key-light-intensity) - var(--amb-fill-light-intensity))
                  * 0.24 + 0.31
              )
          )
      ),
    inset calc(var(--amb-light-x) * var(--amb-thickness) * 2.7px)
      calc(var(--amb-light-y) * var(--amb-thickness) * 2.7px)
      calc(var(--amb-thickness) * 5.1px) 0px
      hsl(
        var(--amb-light-hue)
        var(--amb-light-saturation)
        100%
        / calc(
            max(0, min(var(--amb-thickness), 1)) *
              max(0, min(
                var(--amb-key-light-intensity) * 1.5 +
                  var(--amb-fill-light-intensity) * 0.72 - 0.96,
                1
              ))
          )
      );
}

/* no surface assigned for .app .plate — deliberate. */

@media(prefers-reduced-motion:no-preference){
  .card, .app{ transition:--amb-elevation .18s ease; }
  .card:hover, .app:hover{ --amb-elevation:1; }
}

/* libcsys neutral: no hue in the lighting layer (J 2026-10-16 'neutral coloring for now') */
*{--amb-light-saturation:0% !important;--amb-highlight-color:#9a9a9a !important}