/*
 * XY era: full art, secret rares and the Radiant Collection (finish owner f3, xy/f3).
 *
 * Draws, per class (xyPattern() in js/xy-foil.js; every XY print carries `era-xy`):
 *   xy-fa    `foil-ultra xy-fa[ xy-mega]`   full-art EX and Mega EX; `xy-secret-ex` (gold border
 *            secret EX) and `xy-shiny` (Ancient Origins 96-98) ride on it
 *   xy-tfa   `foil-ultra xy-fa xy-tfa`      full-art Supporter (tall vertical rainbow columns)
 *   xy-item  `foil-gold xy-secret xy-item`  gold Trainer Items and Energy
 *   xy-silver                               Dialga EX 122/119, the silver secret
 *   xy-rc    `foil-holo xy-rc` (RC1-RC27) and `foil-ultra xy-fa xy-rc` (RC28-RC32): the Radiant
 *            Collection's heart and star sparkle
 * Maps: TCG Live's own foil and etch maps for xy1-xy12 and dc1 (fetch_foil_maps.py); our text-safe
 * maps (assets/foil/xy-safe-*-v1.webp, xyMap() in js/xy-foil.js) only where TCG Live has none (the
 * Radiant Collection, g1 "a" prints). Evolutions 109-113 are flat (`foil-none`).
 * Reference note: .claude/skills/card-textures/reference/xy-fullart.md.
 *
 * Rules (SKILL.md): realism first, no outline or box-shadow on `.tcg`, every colour dodge closes in
 * contrast(0.8), no black speckle, no hairline gratings, no foil over text, verify in Chromium and
 * WebKit at phone size and run foil_coverage.mjs. Every selector repeats `era-xy` five times so it beats
 * the shared sheets. Bump this sheet's ?v= tag in index.html on every change.
 */

/* ======================================================================== */
/* Full art EX, Mega EX, secret EX and Supporter (xy-fa, xy-tfa)            */
/* ======================================================================== */

body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy {
  --xyfa-glitter: url("/assets/foil/glitter.png");
  --xyfa-flecks: url("/assets/foil/glitter-flecks.webp");
  --xyfa-seed-pos: calc(var(--seed-x, 0.5) * 100%) calc(var(--seed-y, 0.5) * 100%);
}

/* The family keeps sv-fullart.css's Ultra Rare layers (the same prismatic stock) and
   retunes them to the photos: broad near-vertical rainbow bands over the whole card
   (the bars lean at 100deg, not 128.5deg), the Pokemon keeping its colours, and the
   attack text calm (the safe map under it). Every colour-dodged chain closes in
   contrast(0.8) (Safari draws the divide by zero as blue blocks, verify.md). */
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy:is(.xy-fa, .xy-tfa).foil-ultra.has-foil-map .foil {
  --fa-bars: repeating-linear-gradient(100deg,
    #0e152e 0%, hsl(180, 10%, 60%) 4%, hsl(180, 29%, 66%) 5%,
    hsl(180, 10%, 60%) 6%, #0e152e 15%, #0e152e 18%);
  filter: brightness(calc((var(--pointer-from-center) * 0.45) + 0.5)) contrast(2) saturate(0.95) contrast(0.8);
  -webkit-mask-image: var(--art), var(--fa-light), var(--foil-map);
  -webkit-mask-composite: source-in, source-in, source-in;
  mask-image: var(--art), var(--fa-light), var(--foil-map);
  mask-composite: intersect, intersect, intersect;
  -webkit-mask-size: contain, 100% 100%, 100% 100%;
  mask-size: contain, 100% 100%, 100% 100%;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy:is(.xy-fa, .xy-tfa).foil-ultra.has-foil-map:not(.lit):not(.settling) .foil {
  filter: brightness(0.55) contrast(2.5) saturate(0.4) contrast(0.8);
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-fa.foil-ultra.has-foil-map .glare {
  opacity: calc(var(--card-opacity) * 0.6);
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-fa.foil-ultra.has-foil-map:is(.has-etch-map, .has-etch-tile) .foil::before {
  opacity: 0.35;
}

/* No etch map, no etch: a print TCG Live has no etch for (the gold Mega secrets of Flashfire,
   Furious Fists and Phantom Forces, the "a" and Black Star promos of the era) fell to the shared
   engraving tile, which draws as one regular diagonal hatch over the whole card, a line screen at
   phone size (rv-f3, 2026-10-01). Leave the foil smooth there rather than lay a wallpaper tile. */
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy:is(.xy-fa, .xy-item).has-etch-tile:not(.has-etch-map) .foil::before,
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy:is(.xy-fa, .xy-item).has-etch-tile:not(.has-etch-map) .glare::after {
  display: none;
}

/* Full-art Supporter: tall, narrower rainbow columns (TR's Handiwork, Pokemon Ranger,
   AZ, Lysandre in the photos), the character art readable, flatter light. */
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-tfa.foil-ultra.has-foil-map .foil {
  --fa-bars: repeating-linear-gradient(94deg,
    #0e152e 0%, hsl(180, 10%, 60%) 2.6%, hsl(180, 29%, 66%) 3.2%,
    hsl(180, 10%, 60%) 3.8%, #0e152e 9%, #0e152e 11%);
  /* The photos (Pokemon Ranger, TR's Handiwork, AZ) show tall columns of saturated red, green,
     blue and magenta, about seven across the card; the grey-teal bars of the Ultra recipe read as a
     pale pink wash beside them (rv-f3 side by side, 2026-10-01). Coloured columns, dodged at mid
     brightness (a bright tint dodges to white), moved sideways with the tilt; the safe map and the
     light pool still cut them off the text. */
  background-image: repeating-linear-gradient(94deg,
    hsl(0, 85%, 62%) 0%, hsl(50, 90%, 62%) 3%, hsl(130, 75%, 58%) 6%, hsl(190, 85%, 60%) 9%,
    hsl(250, 80%, 66%) 12%, hsl(310, 80%, 64%) 15%, hsl(0, 85%, 62%) 18%);
  background-size: 260% 100%;
  background-position: var(--background-x) 0;
  background-blend-mode: normal;
  filter: brightness(calc((var(--pointer-from-center) * 0.25) + 0.5)) contrast(1.5) saturate(1.25) contrast(0.8);
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-tfa.foil-ultra.has-foil-map .glare {
  background-image: radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsl(0, 0%, 80%) 5%, hsl(200, 5%, 45%) 65%, hsl(320, 20%, 15%) 150%);
  filter: brightness(0.9) contrast(1.1);
  opacity: calc(var(--card-opacity) * 0.4);
}

/* ======================================================================== */
/* Gold Trainer Items and Energy (xy-secret xy-item, `foil-gold`)           */
/* ======================================================================== */
/* Photos (Weakness Policy, VS Seeker, Trainers' Mail, Energy Retrieval): the whole card
   is gold, art and frame; tilted it gives a warm gold shimmer with a soft rainbow only
   along the lower edge, and the white text box stays a pale satin. Same stock as
   sv-fullart.css's gold, so its layers stay and are retuned: the dodge chain closes in
   contrast(0.8) (Eternatus V, Noah 2026-09-29), the header band (TRAINER / ITEM) and the
   white text box are calmed by the safe map, and the lit etch lines are cut to the map. */
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-item.foil-gold.has-foil-map .foil {
  filter: brightness(0.62) contrast(1.5) saturate(0.45) contrast(0.8);
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-item.foil-gold.has-foil-map:not(.lit):not(.settling) .foil {
  filter: brightness(0.6) contrast(1.5) saturate(0.3) contrast(0.8);
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-item.foil-gold.has-foil-map:is(.has-etch-map, .has-etch-tile) .glare::after {
  background-image: radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsla(0, 0%, 100%, 0.8) 0%, hsla(0, 0%, 100%, 0.45) 30%, hsla(0, 0%, 100%, 0.25) 80%);
  -webkit-mask-image: var(--fa-etch), var(--foil-map);
  -webkit-mask-composite: source-in, source-in;
  mask-image: var(--fa-etch), var(--foil-map);
  mask-composite: intersect, intersect;
  -webkit-mask-size: var(--fa-etch-size), 100% 100%;
  mask-size: var(--fa-etch-size), 100% 100%;
  -webkit-mask-position: var(--fa-etch-pos), center;
  mask-position: var(--fa-etch-pos), center;
  -webkit-mask-repeat: var(--fa-etch-repeat), no-repeat;
  mask-repeat: var(--fa-etch-repeat), no-repeat;
  opacity: calc(0.45 + var(--pointer-from-center) * 0.35);
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-item.foil-gold.has-foil-map .foil::after {
  opacity: calc(0.25 + var(--pointer-from-center) * 0.4);
}

/* ======================================================================== */
/* Dialga EX 122/119 (xy-silver): the one silver secret                     */
/* ======================================================================== */
/* The art is white line work on silver (Phantom Forces' secret, photo
   acR856cS6GQ): colour-dodge cannot brighten white, so the foil is MULTIPLIED on as
   a silver ramp with a pale rainbow, floor above 80% (a thumb on the text box must not
   grey the card, verify.md), the etch drawn as soft grey relief, and the glare kept low. */
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-silver.foil-ultra.has-foil-map .foil {
  --xys-spectrum: hsl(2, 90%, 89%), hsl(53, 95%, 88%), hsl(93, 80%, 88%), hsl(176, 90%, 89%),
    hsl(228, 90%, 92%), hsl(283, 80%, 91%), hsl(2, 90%, 89%);
  background-image: repeating-linear-gradient(100deg, var(--xys-spectrum), var(--xys-spectrum)),
    radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
      hsl(210, 10%, 100%) 0%, hsl(210, 12%, 96%) 45%, hsl(210, 14%, 91%) 100%);
  background-size: 260% 100%, 100% 100%;
  background-position: var(--background-x) 0, center;
  background-blend-mode: multiply;
  filter: none;
  mix-blend-mode: multiply;
  opacity: calc((0.5 + var(--card-opacity) * 0.5) * var(--foil-strength, 1));
  -webkit-mask-image: var(--art);
  -webkit-mask-composite: source-over;
  mask-image: var(--art);
  mask-composite: add;
  -webkit-mask-size: contain;
  mask-size: contain;
}
/* multiplied foil: a dimmed text box would show as a pale panel, so no map under it */
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-silver.foil-ultra.has-foil-map:not(.lit):not(.settling) .foil {
  filter: none;
  opacity: calc(0.45 * var(--foil-strength, 1));
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-silver.foil-ultra.has-foil-map .foil::after {
  background-image: none;
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-silver.foil-ultra.has-foil-map:is(.has-etch-map, .has-etch-tile) .foil::before {
  background-image: linear-gradient(hsl(215, 14%, 72%), hsl(215, 14%, 72%));
  background-size: 100% 100%;
  background-blend-mode: normal;
  mix-blend-mode: multiply;
  opacity: 0.3;
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-silver.foil-ultra.has-foil-map .glare {
  /* the Ultra glare's hard-light grey (75% to 42%) darkened the silver by 20-30 levels away from the
     lamp (measured 207 to 165 at the thumb pose); silver only lightens: a screened white pool */
  background-image: radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
    hsla(0, 0%, 100%, 0.6) 0%, hsla(0, 0%, 100%, 0.2) 40%, hsla(0, 0%, 100%, 0) 85%);
  background-size: 100% 100%;
  filter: none;
  mix-blend-mode: screen;
  opacity: calc(var(--card-opacity) * 0.5);
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-silver.foil-ultra.has-foil-map:is(.has-etch-map, .has-etch-tile) .glare::after {
  background-image: none;
}


/* ======================================================================== */
/* Generations' Radiant Collection (xy-rc)                                  */
/* ======================================================================== */
/* RC1-RC27 (`foil-holo xy-rc`) and RC28-RC32 (`foil-ultra xy-fa xy-rc`, the full-art recipe
   above plus this sparkle sheet). Photos (Flareon EX RC6, Sylveon EX RC32, Altaria RC24):
   every RC card, Common to full art, carries a confetti of heart and star shaped foil over
   the whole card on a pastel iridescent wash; hearts and stars catch the light one after
   the other as the card turns. The regular frames take the `rc` safe map (art window full,
   name bar and text calm); TCG Live has no map for the Collection, so the map is ours. */
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-rc {
  --xyrc-sparkle: url("/assets/foil/xy-rc-sparkle-v1.webp");
  --xyrc-wash: hsl(330, 50%, 66%), hsl(38, 60%, 66%), hsl(120, 42%, 62%), hsl(188, 58%, 64%),
    hsl(262, 52%, 68%), hsl(330, 50%, 66%);
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-rc.foil-holo.has-foil-map .foil {
  /* the art must keep its colours: the foil only ADDS the sparkle (screen), no dodge */
  background-image: var(--xyrc-sparkle), var(--xyrc-sparkle);
  background-size: 250px 250px, 170px 170px;
  background-repeat: repeat, repeat;
  background-position:
    calc(var(--pointer-from-left) * -70px) calc(var(--pointer-from-top) * -50px),
    calc(var(--pointer-from-left) * 90px + 60px) calc(var(--pointer-from-top) * 60px + 30px);
  filter: none;
  mix-blend-mode: screen;
  opacity: calc((0.4 + var(--card-opacity) * 0.3) * var(--foil-strength, 1));
  -webkit-mask-image: var(--foil-map);
  mask-image: var(--foil-map);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-rc.foil-holo.has-foil-map:not(.lit):not(.settling) .foil {
  opacity: calc(0.42 * var(--foil-strength, 1));
}
/* pastel hearts and stars that change colour with the tilt, over the white ones */
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-rc.foil-holo.has-foil-map .foil::after {
  background-image: repeating-linear-gradient(112deg, var(--xyrc-wash));
  background-size: 300% 100%;
  background-position: var(--background-x) 0;
  -webkit-mask-image: var(--xyrc-sparkle);
  mask-image: var(--xyrc-sparkle);
  -webkit-mask-size: 210px 210px;
  mask-size: 210px 210px;
  -webkit-mask-position: calc(var(--pointer-from-left) * 50px + 40px) calc(var(--pointer-from-top) * -60px);
  mask-position: calc(var(--pointer-from-left) * 50px + 40px) calc(var(--pointer-from-top) * -60px);
  opacity: calc(0.35 + var(--pointer-from-center) * 0.5);
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-rc.foil-holo.has-foil-map .foil::before {
  background-image: none;
}
/* the wash: a pastel rainbow that only tints the print (soft light), moving with the tilt */
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-rc.foil-holo.has-foil-map .glare {
  background-image: radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),
      hsla(0, 0%, 100%, 0.55) 0%, hsla(0, 0%, 100%, 0) 65%),
    repeating-linear-gradient(112deg, var(--xyrc-wash));
  background-size: 100% 100%, 300% 100%;
  background-position: center, var(--background-x) 0;
  mix-blend-mode: soft-light;
  opacity: calc(var(--card-opacity) * 0.75);
  -webkit-mask-image: var(--foil-map);
  mask-image: var(--foil-map);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-rc.foil-holo.has-foil-map .glare::after {
  background-image: none;
}

/* RC28-RC32 (full-art recipe above): the same hearts and stars ride on its ::after, lit only */
body.fx-holo.fx-holo.fx-holo .tcg.era-xy.era-xy.era-xy.era-xy.era-xy.xy-rc.xy-fa.foil-ultra.has-foil-map .foil::after {
  background-image: repeating-linear-gradient(112deg, var(--xyrc-wash));
  background-size: 300% 100%;
  background-position: var(--background-x) 0;
  -webkit-mask-image: var(--xyrc-sparkle);
  mask-image: var(--xyrc-sparkle);
  -webkit-mask-size: 210px 210px;
  mask-size: 210px 210px;
  -webkit-mask-position: calc(var(--pointer-from-left) * 50px + 40px) calc(var(--pointer-from-top) * -60px);
  mask-position: calc(var(--pointer-from-left) * 50px + 40px) calc(var(--pointer-from-top) * -60px);
  opacity: calc(0.25 + var(--pointer-from-center) * 0.4);
}