/*
 * Paldean Fates (set sv4pt5): the Shiny Vault's foil and the set's gold cards.
 * Drawn from photos of the physical cards and Pokémon TCG Live's name for
 * each print; the research is in the card-textures skill,
 * .claude/skills/card-textures/reference/paldean-fates.md.
 *
 * - Shiny Rare and Shiny Ultra Rare (TCG Live: SUN_PILLAR / ETCHED). Silver
 *   mirror foil cut with a fingerprint etch: fine wavy ridges in whorls round
 *   the Pokémon, a finer hatch on the Pokémon, the stars and sparkles left
 *   smooth. A Shiny Rare is foil in the art window (Pokémon included) and the
 *   silver border; a Shiny Ultra Rare is foil edge to edge, text box too. The
 *   light shows as broad rainbow bands sliding across the silver.
 * - Hyper Rare (SV_ULTRA_SCODIX / ETCHED). Not plain gold: gold line art on a
 *   teal ground, the whole card thick with glitter flecks that wink one by
 *   one, a rainbow band, and the line art raised in a clear Scodix varnish.
 *
 * Both need the card's TCG Live maps (js/foil-maps.js): the foil map is the
 * mask and the etch map is the fingerprint itself, used as an image here.
 *
 * Layer ideas follow pokemon-cards-css and pokemon-cards-151 by Simon Goellner
 * (@simeydotme), GPL-3.0; see NOTICE.md.
 *
 * Each finish rides on a second class next to the older pattern class
 * (`foil-holo foil-shiny`, `foil-ultra foil-shiny`, `foil-gold foil-scodix`),
 * so the Classic engine is untouched. The class is repeated four times so
 * these rules outrank the map-aware full-art and gold rules in
 * sv-fullart.css (`.foil-gold.has-foil-map:not(.foil-tera):not(.foil-classic)`,
 * one class fewer), whichever order the sheets load in. Loaded last.
 *
 * Rest state (PR 5): a resting card paints `.foil` alone, so the silver, the
 * fingerprint and a hint of colour all live on `.foil`; the pseudo layers and
 * `.glare` only exist while a card is held or settling.
 *
 * Shining Fates' Shiny Vault (swsh45 SV001-SV120, `sf-shiny` with `sf-v` /
 * `sf-vmax`, routed by swshPattern() in js/foil-maps.js) is drawn here too,
 * at the end: upstream's Sword & Shield shiny recipes on our layers, with the
 * card's own TCG Live etch at native size as the texture (`--etch-hd`).
 */

body.fx-holo.fx-holo.fx-holo .tcg.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map,
body.fx-holo.fx-holo.fx-holo .tcg.foil-scodix.foil-scodix.foil-scodix.foil-scodix.has-foil-map,
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map {
  --pf-glitter: url("/assets/foil/glitter-flecks.webp");
  --pf-glitter-fine: url("/assets/foil/glitter-fine.webp");
}

/* Shared shape: the map is the mask (restated from maps.css at this
   specificity, since the older full-art and gold rules set their own), the
   shine rises with the light, and the older recipes' layers are cleared. */
body.fx-holo.fx-holo.fx-holo .tcg.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map .foil,
body.fx-holo.fx-holo.fx-holo .tcg.foil-scodix.foil-scodix.foil-scodix.foil-scodix.has-foil-map .foil,
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map .foil {
  clip-path: none;
  border-radius: 0;
  -webkit-mask-image: var(--art), var(--foil-map);
  -webkit-mask-composite: source-in, source-over;
  mask-image: var(--art), var(--foil-map);
  mask-composite: intersect, add;
  mask-mode: alpha;
  -webkit-mask-size: contain, 100% 100%;
  mask-size: contain, 100% 100%;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  background-repeat: repeat;
  opacity: calc((0.2 + var(--card-opacity) * 0.8) * var(--foil-strength, 1));
}
body.fx-holo.fx-holo.fx-holo .tcg.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map .foil::before,
body.fx-holo.fx-holo.fx-holo .tcg.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map .foil::after,
body.fx-holo.fx-holo.fx-holo .tcg.foil-scodix.foil-scodix.foil-scodix.foil-scodix.has-foil-map .foil::before,
body.fx-holo.fx-holo.fx-holo .tcg.foil-scodix.foil-scodix.foil-scodix.foil-scodix.has-foil-map .foil::after,
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map .foil::before,
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map .foil::after {
  background-image: none;
  background-size: auto;
  background-position: center;
  background-repeat: repeat;
  background-blend-mode: normal;
  mix-blend-mode: normal;
  filter: none;
  -webkit-mask-image: none;
  mask-image: none;
  clip-path: none;
  opacity: 1;
}
body.fx-holo.fx-holo.fx-holo .tcg.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map .glare::after,
body.fx-holo.fx-holo.fx-holo .tcg.foil-scodix.foil-scodix.foil-scodix.foil-scodix.has-foil-map .glare::after,
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map .glare::after {
  background: none;
  -webkit-mask-image: none;
  mask-image: none;
  mix-blend-mode: normal;
  filter: none;
  opacity: 1;
}
body.fx-holo.fx-holo.fx-holo .tcg.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map .glare,
body.fx-holo.fx-holo.fx-holo .tcg.foil-scodix.foil-scodix.foil-scodix.foil-scodix.has-foil-map .glare,
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map .glare {
  clip-path: none;
  border-radius: 0;
}

/* ---- Shiny Rare and Shiny Ultra Rare: SUN_PILLAR / ETCHED ------------------
   Photos (reference/paldean-fates.md): the art window and the frame are
   bright silver, not white; the fingerprint whorl shows as soft rings that
   travel as the card tips; broad pastel rainbow bands slide across, cyan and
   gold and lilac; the Pokémon is foil under its ink, so a band passes
   through it. A Shiny Ultra Rare is the same edge to edge, text box too,
   with wider, stronger bands.

   The scan under the foil is white where the silver is, so the silver must
   darken it: `.foil` multiplies onto the card, which is also what makes the
   rest state work with one layer.

   `.foil` (at rest and lit), bottom up:
   - a silver ramp centred on the pointer, near-white under the lamp and
     mid grey away from it, which is what reads as a mirror;
   - the rainbow bands, pastel and translucent, so over the silver they come
     out as tinted silver rather than paint;
   - the etch map soft-lit on top: at card size its ridges are too fine to
     see one by one, and they add a faint grain to the silver instead.
   `::before` (held only) is the same bands screened on at low strength, so
   a band that crosses the Pokémon's ink lightens it with colour.
   `::after` (held only) is the fingerprint catching the light. A fine etch
   flashes where its lines face the lamp, so whole arcs of one direction
   light together, and on the real cards that reads as rings round the
   Pokémon. The line-direction map (`--etch-angle`, a grey per direction) is
   difference-blended with a flat grey set by the pointer, inverted and
   pushed through a steep contrast, which leaves light only on the arcs
   whose direction matches; each colour channel matches a slightly
   different direction, so the arcs have rainbow edges, like a grating.
   `.glare` is the specular highlight of the mirror. */
body.fx-holo.fx-holo.fx-holo .tcg.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map {
  /* Sun pillar: one band --pf-w wide every --pf-period, both in the band
     layer's own units (it is twice the card). */
  --pf-w: 9%;
  --pf-period: 30%;
  --pf-band-angle: 118deg;
  --pf-a: 0.62;
  --pf-lo: 85%;
  --pf-screen: 0.38;
  --pf-p: calc(0.15 + (var(--pointer-from-left, 0.5) * 0.8 + var(--pointer-from-top, 0.5) * 0.2) * 0.8);
}
body.fx-holo.fx-holo.fx-holo .tcg.foil-ultra.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map {
  --pf-w: 13%;
  --pf-period: 26%;
  --pf-a: 0.85;
  --pf-lo: 81%;
  --pf-screen: 0.5;
}
body.fx-holo.fx-holo.fx-holo .tcg.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map .foil {
  background-image:
    var(--etch-map, linear-gradient(transparent, transparent)),
    repeating-linear-gradient(var(--pf-band-angle),
      transparent 0%,
      hsla(0, 90%, 72%, var(--pf-a)) calc(var(--pf-w) * 0.14),
      hsla(42, 100%, 66%, var(--pf-a)) calc(var(--pf-w) * 0.3),
      hsla(100, 80%, 66%, var(--pf-a)) calc(var(--pf-w) * 0.46),
      hsla(186, 90%, 64%, var(--pf-a)) calc(var(--pf-w) * 0.62),
      hsla(230, 90%, 74%, var(--pf-a)) calc(var(--pf-w) * 0.78),
      hsla(285, 80%, 76%, var(--pf-a)) calc(var(--pf-w) * 0.9),
      transparent var(--pf-w), transparent var(--pf-period)),
    radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
      hsl(210, 10%, 97%) 0%, hsl(210, 9%, 92%) 24%, hsl(210, 8%, var(--pf-lo)) 100%);
  background-size: 100% 100%, 200% 200%, 100% 100%;
  background-position: center,
    calc((var(--background-x) - 50%) * 3 + 50%) calc((var(--background-y) - 50%) * 3 + 50%),
    center;
  background-repeat: no-repeat, repeat, no-repeat;
  background-blend-mode: soft-light, normal, normal;
  filter: saturate(1.05);
  mix-blend-mode: multiply;
  opacity: calc((0.85 + var(--card-opacity) * 0.15) * var(--foil-strength, 1));
}
/* Resting: silver with a hint of colour. */
body.fx-holo.fx-holo.fx-holo .tcg.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map:not(.lit):not(.settling) .foil {
  filter: saturate(0.6);
  opacity: calc(0.85 * var(--foil-strength, 1));
}
body.fx-holo.fx-holo.fx-holo .tcg.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map .foil::before {
  background-image:
    repeating-linear-gradient(var(--pf-band-angle),
      transparent 0%,
      hsl(0, 100%, 62%) calc(var(--pf-w) * 0.14),
      hsl(42, 100%, 58%) calc(var(--pf-w) * 0.3),
      hsl(100, 90%, 56%) calc(var(--pf-w) * 0.46),
      hsl(186, 100%, 56%) calc(var(--pf-w) * 0.62),
      hsl(230, 100%, 68%) calc(var(--pf-w) * 0.78),
      hsl(285, 90%, 70%) calc(var(--pf-w) * 0.9),
      transparent var(--pf-w), transparent var(--pf-period));
  background-size: 200% 200%;
  background-position: calc((var(--background-x) - 50%) * 3 + 50%) calc((var(--background-y) - 50%) * 3 + 50%);
  background-repeat: repeat;
  mix-blend-mode: screen;
  opacity: calc(var(--card-opacity) * var(--pf-screen));
}
body.fx-holo.fx-holo.fx-holo .tcg.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map.has-etch-angle .foil::after {
  background-image:
    linear-gradient(rgb(calc(var(--pf-p) * 255 + 24) calc(var(--pf-p) * 255) calc(var(--pf-p) * 255 - 24)),
      rgb(calc(var(--pf-p) * 255 + 24) calc(var(--pf-p) * 255) calc(var(--pf-p) * 255 - 24))),
    var(--etch-angle);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-blend-mode: difference, normal;
  /* 1 - |angle - pointer|, then everything more than ~0.2 away fades to
     black: soft-edged arcs, so they read as ripples rather than wires. */
  filter: invert(1) brightness(0.6) contrast(6);
  -webkit-mask-image: var(--etch-map);
  mask-image: var(--etch-map);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  mix-blend-mode: screen;
  opacity: calc(var(--card-opacity) * 0.9);
}
/* The ridges facing away from the lamp, half a turn round the whorl, as
   the dark half of the same ripples. The half turn wraps (`mod`), so where
   the pointer crosses the middle of the card (--pf-p = 0.5) the direction it
   asks for jumps from the last grey of the map to the first, and the whole
   layer flashed light and dark as you moved across the card (Noah,
   2026-09-29, Safari). The layer fades out towards that line instead, so
   the jump happens while it is invisible. */
body.fx-holo.fx-holo.fx-holo .tcg.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map.has-etch-angle .glare::after {
  --pf-q: mod(calc(var(--pf-p) + 0.5), 1);
  background-image:
    linear-gradient(rgb(calc(var(--pf-q) * 255) calc(var(--pf-q) * 255) calc(var(--pf-q) * 255)),
      rgb(calc(var(--pf-q) * 255) calc(var(--pf-q) * 255) calc(var(--pf-q) * 255))),
    var(--etch-angle);
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-blend-mode: difference, normal;
  filter: brightness(0.6) contrast(6) invert(1);
  -webkit-mask-image: var(--etch-map);
  mask-image: var(--etch-map);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  mix-blend-mode: multiply;
  opacity: calc(var(--card-opacity) * 0.45 * min(1, abs(calc(var(--pf-p) - 0.5)) * 6.25));
}
/* The mirror's highlight: near-white under the lamp, a shade darker away. */
body.fx-holo.fx-holo.fx-holo .tcg.foil-shiny.foil-shiny.foil-shiny.foil-shiny.has-foil-map .glare {
  background-image: radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsla(0, 0%, 100%, 0.55) 4%, hsla(0, 0%, 100%, 0.18) 24%, hsla(0, 0%, 0%, 0.12) 90%);
  background-size: cover;
  background-position: center;
  mix-blend-mode: overlay;
  filter: none;
  opacity: calc(var(--card-opacity) * 0.7);
}

/* ---- Hyper Rare: SV_ULTRA_SCODIX / ETCHED ------------------------------------
   Gold line art on a teal ground, all of it foil and all of it glittering;
   the Pokémon's gold fills carry a fine line etch, and the line art itself
   is raised in a clear Scodix varnish. One broad rainbow band, nearly level,
   rolls up and down the card as it tips.

   Same hard-light group as the shinies. `.foil`, bottom up:
   - white with the soft engraving difference-blended dark onto it (the
     line art as darker gold outlines, the hatch as a satin tone), the
     light pool multiplied in;
   - the fine glitter screened on once: sparse pinpoints on the teal and
     the gold alike, the grain of the real card, never a speckle;
   - the rainbow band, which recolours whatever it crosses.
   `::before` winks: the fine glitter multiplied by itself at another
   scale, one copy moving with the pointer, so only the grains that line up
   light, and which ones changes as the card turns.
   `::after` is the lit edge of the raised line art: the etch, nudged a pixel
   or two towards the light, minus the etch where it is, leaves a sliver on
   the side facing the lamp. `.glare::after` is the same sliver on the far
   side, as shadow. */
body.fx-holo.fx-holo.fx-holo .tcg.foil-scodix.foil-scodix.foil-scodix.foil-scodix.has-foil-map {
  --pf-lx: calc((var(--pointer-from-left, 0.5) - 0.5) * 3px);
  --pf-ly: calc((var(--pointer-from-top, 0.5) - 0.5) * 3px);
}
body.fx-holo.fx-holo.fx-holo .tcg.foil-scodix.foil-scodix.foil-scodix.foil-scodix.has-foil-map .foil {
  --pf-a: 0.55;
  /* Bottom up: white; the soft engraving difference-blended onto it (the
     etch blurred a little, `--etch-soft`, scripts/soften_etch.py: the thick
     line art stays dark, the fine hatch on the gold fills averages to a
     satin tone, which is what the photos show at arm's length); a 40%
     floor screened on so an outline stops at 40%, not black; the light
     pool multiplied in (56% at the pointer, 44% far: plain foil sits at
     hard-light's neutral); one copy of the fine glitter screened on
     (sparse pinpoints, the grain in the Ting-Lu ex photo); the rainbow
     band on top: one level pillar about a third of the card tall (12.5% of
     the 300% layer), translucent, the way the Chien-Pao ex photo shows it.
     It was 15% of the layer at 0.8 and then, briefly, 28% at 0.62: the
     first recoloured the teal like a plain rainbow holo, the second washed
     the whole card at some tilts (Noah's second screenshot, 20:12).
     Rebuilt 2026-09-28 (second time): the sharp etch at full strength plus
     two dense glitter copies (one of them difference-blended to near black)
     came out as a rough speckle over the gold and the text at viewer size
     (Chien-Pao ex 242, Noah: "I really hope this isnt the one it pushed").
     The real card is smooth satin gold with darker gold outlines on a
     finely shimmering teal. */
  background-image:
    linear-gradient(176deg,
      transparent 44.5%,
      hsla(0, 95%, 60%, var(--pf-a)) 47%,
      hsla(30, 100%, 58%, var(--pf-a)) 48.5%,
      hsla(55, 100%, 58%, var(--pf-a)) 50%,
      hsla(110, 85%, 55%, var(--pf-a)) 51.5%,
      hsla(180, 90%, 55%, var(--pf-a)) 53%,
      hsla(225, 90%, 62%, var(--pf-a)) 54.5%,
      transparent 57%),
    var(--pf-glitter-fine),
    radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
      hsl(0, 0%, 56%) 0%, hsl(0, 0%, 50%) 40%, hsl(0, 0%, 44%) 100%),
    linear-gradient(hsl(0, 0%, 40%), hsl(0, 0%, 40%)),
    var(--etch-soft, var(--etch-map, linear-gradient(transparent, transparent))),
    linear-gradient(#fff, #fff);
  background-size: 100% 300%, 170px 170px, 100% 100%, 100% 100%, 100% 100%, 100% 100%;
  background-position:
    center calc((var(--background-y) - 50%) * 2.5 + 50%),
    center, center, center, center, center;
  background-repeat: no-repeat, repeat, no-repeat, no-repeat, no-repeat, no-repeat;
  background-blend-mode: normal, screen, multiply, screen, difference, normal;
  filter: saturate(0.9);
  mix-blend-mode: hard-light;
}
/* Resting, the outlines and the grain still show (the real card's line art
   is visible in any light: Ting-Lu ex in flat light); the band drops to a
   hint. */
body.fx-holo.fx-holo.fx-holo .tcg.foil-scodix.foil-scodix.foil-scodix.foil-scodix.has-foil-map:not(.lit):not(.settling) .foil {
  --pf-a: 0.2;
  filter: saturate(0.55);
  opacity: calc(0.6 * var(--foil-strength, 1));
}
/* Winks: the fine glitter multiplied by itself at two scales, one copy
   moving with the pointer, so only the grains that line up light and which
   ones changes as the card turns. Held low: a few points, not a speckle. */
body.fx-holo.fx-holo.fx-holo .tcg.foil-scodix.foil-scodix.foil-scodix.foil-scodix.has-foil-map .foil::before {
  background-image: var(--pf-glitter-fine), var(--pf-glitter-fine);
  background-size: 170px 170px, 214px 214px;
  background-position: center,
    calc(50% + var(--pointer-from-left, 0.5) * 90px) calc(50% + var(--pointer-from-top, 0.5) * 70px);
  background-blend-mode: multiply, normal;
  filter: brightness(3) saturate(1.2);
  mix-blend-mode: screen;
  opacity: calc(var(--card-opacity) * 0.4);
}
body.fx-holo.fx-holo.fx-holo .tcg.foil-scodix.foil-scodix.foil-scodix.foil-scodix.has-foil-map .foil::after {
  background-image: radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsl(50, 100%, 96%) 0%, hsl(45, 80%, 80%) 35%, hsl(40, 50%, 60%) 100%);
  -webkit-mask-image: var(--etch-soft, var(--etch-map)), var(--etch-soft, var(--etch-map));
  mask-image: var(--etch-soft, var(--etch-map)), var(--etch-soft, var(--etch-map));
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: var(--pf-lx) var(--pf-ly), 0 0;
  mask-position: var(--pf-lx) var(--pf-ly), 0 0;
  -webkit-mask-composite: source-out;
  mask-composite: subtract;
  mix-blend-mode: screen;
  opacity: calc(var(--card-opacity) * 0.55);
}
body.fx-holo.fx-holo.fx-holo .tcg.foil-scodix.foil-scodix.foil-scodix.foil-scodix.has-foil-map .glare {
  background-image: radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsla(0, 0%, 100%, 0.55) 6%, hsla(0, 0%, 100%, 0.15) 30%, hsla(0, 0%, 0%, 0.3) 95%);
  background-size: cover;
  background-position: center;
  mix-blend-mode: overlay;
  filter: none;
  opacity: calc(var(--card-opacity) * 0.6);
}
body.fx-holo.fx-holo.fx-holo .tcg.foil-scodix.foil-scodix.foil-scodix.foil-scodix.has-foil-map .glare::after {
  background: hsl(35, 60%, 18%);
  -webkit-mask-image: var(--etch-soft, var(--etch-map)), var(--etch-soft, var(--etch-map));
  mask-image: var(--etch-soft, var(--etch-map)), var(--etch-soft, var(--etch-map));
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: calc(var(--pf-lx) * -1) calc(var(--pf-ly) * -1), 0 0;
  mask-position: calc(var(--pf-lx) * -1) calc(var(--pf-ly) * -1), 0 0;
  -webkit-mask-composite: source-out;
  mask-composite: subtract;
  mix-blend-mode: multiply;
  opacity: calc(var(--card-opacity) * 0.35);
}

/* ---- Shining Fates' Shiny Vault: sf-shiny ------------------------------------
   Photos (texture-refs/shiny-vault: Inteleon SV027 and Dottler SV008 in
   hand, Boltund SV040 flat, Charizard VMAX SV107 on marble): a baby shiny
   is silver in the art window plus its silver frame, the text matte; a
   shiny V or VMAX is silver edge to edge. The silver carries TCG Live's
   fingerprint etch (fine rings round the Pokémon, a hatch over it) and a
   dense sparkle, and in hand it flashes white and prismatic with a soft
   rainbow wash; the Pokémon's printed colours stay. Upstream's demo
   (poke-holo.simey.me, "Shiny Vault") is the look Noah wants (2026-09-29),
   so this is upstream's rare shiny / rare shiny v / rare shiny vmax on
   our layers, judged beside it card for card at the same poses.

   The texture is the card's own etch at Live's native size (`--etch-hd`,
   733 px, a luminance image: dark ground, bright rings), not the 400 px
   blurred copy the era's other recipes mask with. Its dark ground matters:
   soft-lit over the pillar and bars it squares the stack down everywhere
   except on the rings, so after the colour dodge the rings are what catch
   the light. The era's earlier shiny recipe (swsh.css, superseded) put a
   white radial into the dodge and blew the whole window to paper.

   Baby shiny and shiny V, `.foil` (upstream's shine), bottom up: a faint
   pointer-centred dim, the 133deg light bars (hard-light), the sun pillar
   (hue: it recolours the bars), the etch (soft-light). Brightness rises
   with the tilt (0.4 head-on to 0.8 at the edge), then contrast 1.4 and
   saturate 2.25; the closing brightness(0.92) keeps every channel under
   0.92 (the leading brightness carries the 1/0.92 back), since a channel
   at 1.0 under the dodge divides dark ink to pure colour in Safari
   (blocks). A closing contrast() would do it too, but it lifts the black
   floor, and a floor of 0.1 under the dodge brightens the whole window a
   tenth and flattens the rings. `::after` is the exclusion twin, sliding the other
   way: the pastel tint on the white areas. `::before` is the white pool at
   the pointer, overlaid. `.glare` multiplies a white-to-dark radial in,
   scaled by the tilt: the silver goes dark away from the lamp. */
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map {
  --sf-space: 5%;
  --sf-angle: 133deg;
  /* Upstream's masks are weaker than our floor-stretched maps (their window
     sits near 0.69 where ours is 0.82, measured on Minccino SV093, Lapras V
     SV110 and Charizard VMAX SV107), and the dodge over a white window is
     sensitive to that: at full map strength the rings and the tint flatten
     towards paper. The map is scaled down to match. */
  --sf-mask: 0.78;
  --sf-etch: var(--etch-hd, linear-gradient(#000, #000));
  --sf-bars: repeating-linear-gradient(var(--sf-angle),
    #0e152e 0%, hsl(180, 10%, 60%) 3.8%, hsl(180, 29%, 66%) 4.5%, hsl(180, 10%, 60%) 5.2%,
    #0e152e 10%, #0e152e 12%);
  --sf-dim: radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsla(0, 0%, 0%, 0.1) 12%, hsla(0, 0%, 0%, 0.15) 20%, hsla(0, 0%, 0%, 0.25) 120%);
}
/* The pillar is declared per layer so each takes its own rotated palette
   (base.css turns the ramp on the pseudo layers). */
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map .foil,
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map .foil::after {
  --sf-pillar: repeating-linear-gradient(0deg,
    var(--sunpillar-clr-1) calc(var(--sf-space) * 1),
    var(--sunpillar-clr-2) calc(var(--sf-space) * 2),
    var(--sunpillar-clr-3) calc(var(--sf-space) * 3),
    var(--sunpillar-clr-4) calc(var(--sf-space) * 4),
    var(--sunpillar-clr-5) calc(var(--sf-space) * 5),
    var(--sunpillar-clr-6) calc(var(--sf-space) * 6),
    var(--sunpillar-clr-1) calc(var(--sf-space) * 7));
}
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map .foil {
  -webkit-mask-image: var(--art), var(--foil-map), linear-gradient(rgba(0, 0, 0, var(--sf-mask)), rgba(0, 0, 0, var(--sf-mask)));
  -webkit-mask-composite: source-in, source-in, source-over;
  mask-image: var(--art), var(--foil-map), linear-gradient(rgba(0, 0, 0, var(--sf-mask)), rgba(0, 0, 0, var(--sf-mask)));
  mask-composite: intersect, intersect, add;
  -webkit-mask-size: contain, 100% 100%, 100% 100%;
  mask-size: contain, 100% 100%, 100% 100%;
  background-image: var(--sf-etch), var(--sf-pillar), var(--sf-bars), var(--sf-dim);
  background-size: 100% 100%, 200% 700%, 300% 100%, 200% 100%;
  background-position: center,
    0% var(--background-y),
    calc(var(--background-x) + (var(--background-y) * 0.2)) var(--background-y),
    var(--background-x) var(--background-y);
  background-repeat: no-repeat, repeat, repeat, no-repeat;
  background-blend-mode: soft-light, hue, hard-light, normal;
  filter: brightness(calc((var(--pointer-from-center) * 0.435) + 0.435)) contrast(1.4) saturate(2.25) brightness(0.92);
  mix-blend-mode: color-dodge;
}
/* Resting: the rings and a little silver, no colour to speak of. */
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map:not(.lit):not(.settling) .foil {
  filter: brightness(0.67) contrast(1.4) saturate(0.8) brightness(0.92);
  opacity: calc(0.45 * var(--foil-strength, 1));
}
/* The twin's bars slide the opposite way. Upstream puts them at a negative
   position, which on a 195%-wide tile drops its edge inside the card and the
   wrapped copy draws a hard vertical seam that moves with the tilt (#87 on
   the V cards); mirroring as 100% - position keeps the same direction and
   speed and the tile over the whole card. */
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map .foil::after {
  background-image: var(--sf-etch), var(--sf-pillar), var(--sf-bars), var(--sf-dim);
  background-size: 100% 100%, 200% 400%, 195% 100%, 200% 100%;
  background-position: center,
    0% var(--background-y),
    calc(100% - (var(--background-x) + (var(--background-y) * 0.2))) calc(var(--background-y) * -1),
    var(--background-x) var(--background-y);
  background-repeat: no-repeat, repeat, repeat, no-repeat;
  background-blend-mode: soft-light, hue, hard-light, normal;
  filter: brightness(calc((var(--pointer-from-center) * 0.4) + 0.8)) contrast(1.5) saturate(1.25);
  mix-blend-mode: exclusion;
}
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map .foil::before {
  background-image: radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsl(0, 0%, 100%) 0%, hsla(0, 0%, 0%, 0) 40%);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  mix-blend-mode: overlay;
  opacity: 0.75;
  z-index: 1;
}
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.has-foil-map .glare {
  background-image: radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsl(0, 0%, 100%) 0%, hsl(320, 5%, 15%) 150%);
  background-size: cover;
  background-position: center;
  mix-blend-mode: multiply;
  filter: brightness(1.2) contrast(1) saturate(0.7);
  opacity: calc(var(--card-opacity) * var(--pointer-from-center));
}
/* Shiny V (edge to edge): the same shine, a darker, tighter glare. */
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.sf-v.has-foil-map {
  --sf-mask: 0.82;
}
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.sf-v.has-foil-map .glare {
  background-image: radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsl(0, 0%, 90%) 5%, hsl(200, 5%, 45%) 80%, hsl(320, 40%, 10%) 150%);
  background-size: 120% 140%;
  mix-blend-mode: darken;
  filter: brightness(0.88) contrast(2.25) saturate(0.7);
  opacity: calc(var(--card-opacity) * var(--pointer-from-center) * 0.75);
}

/* Shiny VMAX (upstream's rare shiny vmax, the swsecret glitter): the whole
   card is a glitter foil under a printed rainbow. `.foil`: two copies of
   the glitter, a seven-colour rainbow at -30deg (400%, sliding 1.5x), a
   colour-burn radial dark at the pointer and white far off. `::before`: the
   etch as light (colour-burned with a pointer pool, lightened on, 0.35).
   `::after`: the pillar in hue, dimming towards the edge. `.glare` and its
   `::after` (masked to the foil) are soft overlays. */
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.sf-vmax.has-foil-map {
  --sf-angle: -30deg;
  --sf-mask: 0.7;
  --sf-r1: hsl(0, 57%, 37%);
  --sf-r2: hsl(40, 53%, 39%);
  --sf-r3: hsl(90, 60%, 35%);
  --sf-r4: hsl(180, 60%, 35%);
  --sf-r5: hsl(180, 60%, 35%);
  --sf-r6: hsl(210, 57%, 39%);
  --sf-r7: hsl(280, 55%, 31%);
}
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.sf-vmax.has-foil-map .foil {
  background-image:
    var(--holo-glitter),
    var(--holo-glitter),
    linear-gradient(var(--sf-angle),
      var(--sf-r1), var(--sf-r2), var(--sf-r3), var(--sf-r4), var(--sf-r5), var(--sf-r6), var(--sf-r7),
      var(--sf-r1), var(--sf-r2), var(--sf-r3), var(--sf-r4), var(--sf-r5), var(--sf-r6), var(--sf-r7),
      var(--sf-r1), var(--sf-r2), var(--sf-r3), var(--sf-r4), var(--sf-r5), var(--sf-r6), var(--sf-r7),
      var(--sf-r1)),
    radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
      hsla(248, 5%, 10%, 1) 10%, hsla(206, 5%, 80%, 0.1) 50%, hsla(0, 0%, 95%, 0.98) 90%);
  background-size: var(--glittersize) var(--glittersize), var(--glittersize) var(--glittersize), 400% 400%, cover;
  background-position: 40% 45%, 55% 55%,
    calc(var(--background-x) * 1.5) calc(var(--background-y) * 1.5), center;
  background-repeat: repeat, repeat, no-repeat, no-repeat;
  background-blend-mode: soft-light, overlay, color-burn, normal;
  filter: brightness(1.087) contrast(1) saturate(0.85) brightness(0.92);
  mix-blend-mode: color-dodge;
}
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.sf-vmax.has-foil-map:not(.lit):not(.settling) .foil {
  filter: brightness(0.87) contrast(1) saturate(0.5) brightness(0.92);
  opacity: calc(0.35 * var(--foil-strength, 1));
}
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.sf-vmax.has-foil-map .foil::before {
  background-image:
    var(--sf-etch),
    radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
      hsla(248, 5%, 91%, 0.95) 10%, hsla(206, 5%, 68%, 0.5) 50%, hsl(0, 0%, 0%) 120%);
  background-size: 100% 100%, cover;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;
  background-blend-mode: color-burn, normal;
  mix-blend-mode: lighten;
  filter: brightness(1) contrast(1) saturate(0.4);
  opacity: 0.35;
  z-index: auto;
}
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.sf-vmax.has-foil-map .foil::after {
  background-image: repeating-linear-gradient(var(--sf-angle),
    var(--sunpillar-clr-1) calc(var(--sf-space) * 1),
    var(--sunpillar-clr-2) calc(var(--sf-space) * 2),
    var(--sunpillar-clr-3) calc(var(--sf-space) * 3),
    var(--sunpillar-clr-4) calc(var(--sf-space) * 4),
    var(--sunpillar-clr-5) calc(var(--sf-space) * 5),
    var(--sunpillar-clr-6) calc(var(--sf-space) * 6),
    var(--sunpillar-clr-1) calc(var(--sf-space) * 7));
  background-size: 400% 800%;
  /* Down the card the 800% bands moved x 3, about two spectra a sweep;
     x 1.6 drifts one, as a real holo does (Noah, 2026-10-02). */
  background-position: calc(50% + (50% - var(--background-x)) * 3) calc(50% + (50% - var(--background-y)) * 1.6);
  background-repeat: repeat;
  background-blend-mode: normal;
  filter: brightness(calc(0.75 - (var(--pointer-from-center) * 0.5))) contrast(1) saturate(1);
  mix-blend-mode: hue;
}
/* Upstream's VMAX glares run to black (0.33 and 0.75 alpha) through overlay,
   which stretches the light greys of Charizard's ink into dark dots away from
   the pointer (dark_specks.py: 138 on SV107). Their far ends sit at 25% grey
   here, the most the speck gate allows; the VMAX reads a little lighter far
   from the light than the demo and keeps its ink clean. */
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.sf-vmax.has-foil-map .glare {
  background-image: radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsla(248, 5%, 90%, 0.45) 0%, hsla(206, 5%, 35%, 0.45) 45%, hsla(0, 0%, 25%, 0.3) 120%);
  background-size: cover;
  background-position: center;
  mix-blend-mode: overlay;
  filter: brightness(1) contrast(1.25);
  opacity: var(--card-opacity);
}
body.fx-holo.fx-holo.fx-holo .tcg.sf-shiny.sf-shiny.sf-shiny.sf-shiny.sf-vmax.has-foil-map .glare::after {
  background: radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsla(248, 5%, 90%, 0.75) 0%, hsla(206, 5%, 35%, 0.6) 45%, hsla(0, 0%, 25%, 0.55) 100%);
  -webkit-mask-image: var(--art), var(--foil-map);
  -webkit-mask-composite: source-in, source-over;
  mask-image: var(--art), var(--foil-map);
  mask-composite: intersect, add;
  mask-mode: alpha;
  -webkit-mask-size: contain, 100% 100%;
  mask-size: contain, 100% 100%;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  mix-blend-mode: overlay;
  filter: brightness(1) contrast(1.25);
  opacity: 1;
}