/*

  SECRET RARE (GOLD)

*/




/*

  SHINE LAYERS

*/

.card[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine,
.card[data-set="swshp"][data-number="swsh145"] .card__shine {

  --shift: 1px;
  --imgsize: cover;
  --foil: url("../_images/foil/R-M.png?v=20250105holo2");

  background-image:
    var(--glitter), 
    var(--glitter), 
    conic-gradient( 
      var(--sunpillar-clr-4), 
      var(--sunpillar-clr-5),
      var(--sunpillar-clr-6), 
      var(--sunpillar-clr-1), 
      var(--sunpillar-clr-4) 
    ), 
    radial-gradient( 
      farthest-corner circle at var(--pointer-x) var(--pointer-y), 
      hsla(150, 00%, 0%, .98) 10%, 
      hsla(0, 0%, 95%, .15) 90% 
    );

  background-size: var(--glittersize) var(--glittersize), var(--glittersize) var(--glittersize), cover, cover;
  background-position: 45% 45%, 55% 55%, center center, center center;
  background-blend-mode: soft-light, hard-light, overlay;
  mix-blend-mode: color-dodge;
  filter: brightness(calc( 0.4 + (var(--pointer-from-center) * 0.2) )) contrast(1) saturate(2.7);

}

.card[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine:before,
.card[data-set="swshp"][data-number="swsh145"] .card__shine:before {
  
  content: "";
  -webkit-mask-image: none !important;
  mask-image: none !important;

  background-image:
    var(--foil), 
    linear-gradient( 45deg, hsl(46, 95%, 50%), hsl(52, 100%, 69%) ), 
    radial-gradient( 
      farthest-corner circle at var(--pointer-x) var(--pointer-y), 
      hsla(10, 20%, 90%, 0.95) 10%, 
      hsl(0, 0%, 0%) 70% 
    );

  background-size: var(--imgsize), cover, cover;
  background-position: center center, center center, center center;
  background-blend-mode: hard-light, multiply;

  mix-blend-mode: lighten;
  filter: brightness(1.25) contrast(1.25) saturate(0.35);
  opacity: .8;

}

.card[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine:after,
.card[data-set="swshp"][data-number="swsh145"] .card__shine:after {

  content: "";

  -webkit-mask-image: none !important;
  mask-image: none !important;

  background-image: var(--glitter);
  background-size: var(--glittersize) var(--glittersize);
  background-position: calc(50% - ((var(--shift)*2) * var(--pointer-from-left)) + var(--shift)) calc(50% - ((var(--shift)*2) * var(--pointer-from-top)) + var(--shift));

  filter: brightness(calc((var(--pointer-from-center)*0.6) + 0.6)) contrast(1.5);
  mix-blend-mode: overlay;

}






/*

  GLARE LAYERS

*/

.card[data-rarity="rare secret"]:not([data-set="secret"]) .card__glare,
.card[data-set="swshp"][data-number="swsh145"] .card__glare {
	
	background-image: 
    radial-gradient( 
      farthest-corner circle at var(--pointer-x) var(--pointer-y), 
      hsla(45, 8%, 80%, 0.3) 0%, 
      hsl(22, 15%, 12%) 180%
    );

	filter: brightness(1.3) contrast(1.5);
  mix-blend-mode: hard-light;

}










/*

  NO MASK

*/


.card:not(.masked)[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine,
.card:not(.masked)[data-set="swshp"][data-number="swsh145"] .card__shine {

  --foil: url("../_images/foil/R-M.png?v=20250105holo2");
  --imgsize: 33%;
  
  filter: brightness( calc( ( var( --pointer-from-center ) * 0.3 ) + 0.2 ) ) contrast(2) saturate(0.75);

}

/*

  R -> UR と同じ見た目に寄せる（cosmos 相当）
  テクスチャだけ R-M.png に切替

*/

.card[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine,
.card:not(.masked)[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine {
  --space: 1%;
  --mask: none;
  --mask-scale: 120%;
  --cosmosbg: 50% 50% !important;

  background-image:
    none,
    repeating-linear-gradient(
      82deg,
      hsl(53, 65%, 60%) calc(var(--space)*1),
      hsl(93, 56%, 50%) calc(var(--space)*2),
      hsl(176, 54%, 49%) calc(var(--space)*3),
      hsl(228, 59%, 55%) calc(var(--space)*4),
      hsl(283, 60%, 55%) calc(var(--space)*5),
      hsl(326, 59%, 51%) calc(var(--space)*6),
      hsl(326, 59%, 51%) calc(var(--space)*7),
      hsl(283, 60%, 55%) calc(var(--space)*8),
      hsl(228, 59%, 55%) calc(var(--space)*9),
      hsl(176, 54%, 49%) calc(var(--space)*10),
      hsl(93, 56%, 50%) calc(var(--space)*11),
      hsl(53, 65%, 60%) calc(var(--space)*12)
    ),
    radial-gradient(
      farthest-corner circle
      at var(--pointer-x) var(--pointer-y),
      hsla(180, 100%, 89%, 0.5) 5%,
      hsla(180, 14%, 57%, 0.3) 40%,
      hsl(0, 0%, 0%) 130%
    );

  background-blend-mode:
    color-burn,
    multiply;

  background-position:
    var(--cosmosbg, center center),
    calc(10% + (var(--pointer-from-left) * 80%)) calc(10% + (var(--pointer-from-top) * 80%)),
    center center;

  background-size: 100% 100%, 400% 900%, cover;
  filter: brightness(1) contrast(1) saturate(.8);
  mix-blend-mode: color-dodge;
}

.card[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine,
.card[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine:before,
.card[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine:after,
.card:not(.masked)[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine,
.card:not(.masked)[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine:before,
.card:not(.masked)[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine:after {
  -webkit-mask-image: var(--mask);
  mask-image: var(--mask);
  -webkit-mask-size: var(--mask-scale) var(--mask-scale);
  mask-size: var(--mask-scale) var(--mask-scale);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
}

.card[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine:before,
.card:not(.masked)[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine:before {
  content: "";
  z-index: 2;

  background-image:
    none,
    repeating-linear-gradient(
      82deg,
      hsl(53, 65%, 60%) calc(var(--space)*1),
      hsl(93, 56%, 50%) calc(var(--space)*2),
      hsl(176, 54%, 49%) calc(var(--space)*3),
      hsl(228, 59%, 55%) calc(var(--space)*4),
      hsl(283, 60%, 55%) calc(var(--space)*5),
      hsl(326, 59%, 51%) calc(var(--space)*6),
      hsl(326, 59%, 51%) calc(var(--space)*7),
      hsl(283, 60%, 55%) calc(var(--space)*8),
      hsl(228, 59%, 55%) calc(var(--space)*9),
      hsl(176, 54%, 49%) calc(var(--space)*10),
      hsl(93, 56%, 50%) calc(var(--space)*11),
      hsl(53, 65%, 60%) calc(var(--space)*12)
    );

  background-blend-mode:
    lighten,
    multiply;

  background-position:
    var(--cosmosbg, center center),
    calc(15% + (var(--pointer-from-left) * 70%)) calc(15% + (var(--pointer-from-top) * 70%)),
    center center;

  background-size: 100% 100%, 400% 900%, cover;
  filter: brightness(1.25) contrast(1.75) saturate(.8);
  mix-blend-mode: overlay;
}

.card[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine:after,
.card:not(.masked)[data-rarity="rare secret"]:not([data-set="secret"]) .card__shine:after {
  content: "";
  z-index: 3;

  background-image:
    var(--foil),
    repeating-linear-gradient(
      82deg,
      hsl(53, 65%, 60%) calc(var(--space)*1),
      hsl(93, 56%, 50%) calc(var(--space)*2),
      hsl(176, 54%, 49%) calc(var(--space)*3),
      hsl(228, 59%, 55%) calc(var(--space)*4),
      hsl(283, 60%, 55%) calc(var(--space)*5),
      hsl(326, 59%, 51%) calc(var(--space)*6),
      hsl(326, 59%, 51%) calc(var(--space)*7),
      hsl(283, 60%, 55%) calc(var(--space)*8),
      hsl(228, 59%, 55%) calc(var(--space)*9),
      hsl(176, 54%, 49%) calc(var(--space)*10),
      hsl(93, 56%, 50%) calc(var(--space)*11),
      hsl(53, 65%, 60%) calc(var(--space)*12)
    );

  background-blend-mode:
    multiply,
    multiply;

  background-position:
    var(--cosmosbg, center center),
    calc(20% + (var(--pointer-from-left) * 60%)) calc(20% + (var(--pointer-from-top) * 60%)),
    center center;

  background-size: 100% 100%, 400% 900%, cover;
  filter: brightness(1.25) contrast(1.75) saturate(.8);
  mix-blend-mode: multiply;
}

.card[data-rarity="rare secret"]:not([data-set="secret"]) .card__glare {
  background-image:
    radial-gradient(
      farthest-corner circle at var(--pointer-x) var(--pointer-y),
      hsla(204, 100%, 95%, 0.8) 5%,
      hsla(250, 15%, 20%, 1) 150%
    );
  filter: brightness(.75) contrast(2) saturate(2);
  mix-blend-mode: overlay;
  opacity: calc(var(--card-opacity) * (0.25 + var(--pointer-from-center)));
}

.card[data-rarity="rare secret"]:not([data-set="secret"]) .card__glare:after {
  content: "";

  background-image:
    radial-gradient(
      farthest-corner circle at var(--pointer-x) var(--pointer-y),
      hsl(280, 100%, 96%) 5%,
      hsl(0, 0%, 10%) 60%
    );

  filter: brightness(.75) contrast(2.5) saturate(2);
  mix-blend-mode: soft-light;
  opacity: calc(1 - var(--pointer-from-top) * .75);
}











