/* ============================================================================
   The current. An email river under the yellow field.
   Drop-in: add class "current-host" to the hero section, include current.js.
   The canvas repaints the same --field yellow and drifts pale envelope forms
   under it. Every form pixel is LIGHTER than the field, so ink contrast on
   the hero can only rise over a form, never fall. No landing.html edits here.
   ========================================================================== */

.current-host {
  position: relative;
  isolation: isolate;
}

/* The river colours, derived from ledger tokens so a token change follows.
   Forms are the field pulled toward paper: white envelopes seen through a
   thin yellow sheet read as paler, duller yellow, not as white. */
.current-host {
  --current-base:   var(--field);
  /* Form bodies: paper showing through the sheet. Depth keeps the ratio,
     the near band nearly reaches paper. */
  --current-form-1: color-mix(in oklab, var(--field), var(--paper) 45%); /* deep */
  --current-form-2: color-mix(in oklab, var(--field), var(--paper) 65%); /* mid  */
  --current-form-3: color-mix(in oklab, var(--field), var(--paper) 85%); /* near */
  /* The drawn line on a form: outline, flap crease, subject rules. */
  --current-ink: color-mix(in oklab, var(--field), var(--yellow-deep) 55%);

  /* The sheet itself: broad folds of lighter and darker yellow. The dark
     side spends the measured contrast budget (floor 9:1 on the headline). */
  --current-wave-light: color-mix(in oklab, var(--field), var(--paper) 70%);
  --current-wave-dark:  color-mix(in oklab, var(--field), var(--yellow-deep) 50%);
}

.current-canvas {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  user-select: none;
}

/* Everything the hero already contains rides above the water. */
.current-host > :not(.current-canvas) {
  position: relative;
  z-index: 1;
}