
/* MONSTARICA rarity finish revision v37
   Goal: instantly readable rarity differences; Foil has outline glitter as strong as a card border;
   HR is a distinct all-over gold glitter treatment.
*/
.game-card[data-rarity-tier]{
  --rim-thickness:3px;
  --rim-light:#8ea3b6;--rim-shadow:#243447;--rim-hot:#ffffff;
  --frame-glow:0 0 0 1px color-mix(in srgb,var(--rim-light) 45%,transparent), inset 0 0 0 1px #ffffff22, 0 10px 22px #0008;
  --frame-aura:0 0 0 color-mix(in srgb,var(--rim-light) 40%,transparent);
  --beam-alpha:0;--beam-2-alpha:0;--holo-power:0;--star-power:0;--grain-power:0;
  --edge-opacity:.12;--sweep-speed:8.5s;--bg-metal:transparent;
  --top-strip:#101621;--info-panel:#0b1018f5;--info-border:rgba(255,255,255,.18);
  border:2px solid var(--rim-light)!important;
  background:
    linear-gradient(160deg,color-mix(in srgb,var(--rim-light) 96%,#fff0) 0%, color-mix(in srgb,var(--rim-shadow) 92%,#000) 18%, #0e141c 33%, color-mix(in srgb,var(--rim-shadow) 88%,#000) 72%, color-mix(in srgb,var(--rim-light) 94%,#fff0) 100%)!important;
  box-shadow:var(--frame-glow),var(--frame-aura)!important;
}
.game-card[data-rarity-tier]::before{
  content:""!important;position:absolute!important;inset:0!important;z-index:4!important;pointer-events:none!important;border-radius:inherit;
  padding:var(--rim-thickness);
  background:
    conic-gradient(from 35deg,
      color-mix(in srgb,var(--rim-shadow) 96%,#000) 0deg,
      color-mix(in srgb,var(--rim-light) 82%,#fff) 28deg,
      #ffffff 42deg,
      color-mix(in srgb,var(--rim-light) 88%,#fff) 58deg,
      color-mix(in srgb,var(--rim-shadow) 92%,#000) 95deg,
      color-mix(in srgb,var(--rim-hot) 95%,#fff) 132deg,
      color-mix(in srgb,var(--rim-shadow) 96%,#000) 174deg,
      color-mix(in srgb,var(--rim-light) 85%,#fff) 214deg,
      #ffffff 242deg,
      color-mix(in srgb,var(--rim-shadow) 96%,#000) 301deg,
      color-mix(in srgb,var(--rim-light) 88%,#fff) 344deg)!important;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  opacity:var(--edge-opacity)!important;mix-blend-mode:screen;
  animation:v37RimSpin 14s linear infinite;
}
.game-card[data-rarity-tier]::after{
  content:"";position:absolute;inset:-44%;z-index:5;pointer-events:none;
  background:
    linear-gradient(112deg,transparent 36%,#ffffff00 43%,#fff8 48%,#fffd 50%,#aef1ff78 53%,transparent 60%),
    linear-gradient(128deg,transparent 28%,#ffffff00 42%,#fff6 49%,#fffc 50%,#fff4 52%,transparent 61%);
  opacity:0;mix-blend-mode:screen;animation:v37CardSweep var(--sweep-speed) ease-in-out infinite;
}
.game-card[data-rarity-tier] .card-art{
  isolation:isolate;overflow:hidden;
  background:
    radial-gradient(ellipse at 18% 14%, color-mix(in srgb,var(--art-tone-4) 70%,white) 0%, transparent 34%),
    radial-gradient(ellipse at 82% 78%, color-mix(in srgb,var(--art-tone-1) 80%,white) 0%, transparent 42%),
    linear-gradient(148deg,var(--art-tone-3) 0%, var(--art-tone-1) 44%, var(--art-tone-2) 72%, var(--art-tone-3) 100%)!important;
}
.game-card[data-rarity-tier] .card-art img{
  position:relative;z-index:3;width:100%;height:100%;object-fit:contain;pointer-events:none;
  filter:drop-shadow(0 12px 12px #000b) saturate(1.08) contrast(1.03)!important;
}
.game-card[data-rarity-tier] .card-art .holo-scene{
  position:absolute;inset:-30%;z-index:1;pointer-events:none;
  background:
    var(--bg-metal),
    conic-gradient(from 16deg at 50% 50%, transparent 0deg, #ffffff3a 22deg, transparent 50deg, #c2e9ff7f 88deg, transparent 121deg, #fff2b273 168deg, transparent 208deg, #f0c6ff71 268deg, transparent 300deg, #ffffff2b 337deg, transparent 360deg),
    repeating-linear-gradient(126deg,transparent 0 18px,#ffffff2a 19px 21px,transparent 23px 58px),
    linear-gradient(35deg,var(--art-tone-1),transparent 40%,var(--art-tone-4) 65%,var(--art-tone-2));
  background-blend-mode:screen,screen,soft-light,overlay;
  opacity:var(--holo-power)!important;mix-blend-mode:screen;
  animation:v37ArtShift 11s ease-in-out infinite alternate;
}
.game-card[data-rarity-tier] .card-art .holo-stars{
  position:absolute;inset:0;z-index:2;pointer-events:none;
  background-image:
    radial-gradient(circle at 12% 12%,#fff 0 1px,#ffffffaa 2px,transparent 4px),
    radial-gradient(circle at 82% 17%,#fff 0 1.4px,#ffffffb5 3px,transparent 7px),
    radial-gradient(circle at 66% 60%,#fff 0 1px,#ffffffbf 2.2px,transparent 5px),
    radial-gradient(circle at 19% 78%,#fff 0 1.7px,#ffffffc5 3px,transparent 8px),
    radial-gradient(circle at 92% 87%,#fff 0 1px,#fff9 2px,transparent 5px),
    repeating-radial-gradient(circle at 70% 40%,transparent 0 8px,#ffffff40 9px 9.5px,transparent 10px 38px);
  background-size:100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,45px 45px;
  opacity:var(--star-power)!important;mix-blend-mode:screen;animation:v37StarPulse 4.6s ease-in-out infinite alternate;
}
.game-card[data-rarity-tier] .card-info{position:absolute;z-index:7;background:var(--info-panel)!important;border-top:1px solid var(--info-border)!important}
.game-card[data-rarity-tier] .card-rarity,.game-card[data-rarity-tier] .card-no,.game-card[data-rarity-tier] .finish{z-index:7}
.game-card[data-rarity-tier] .card-rarity{
  color:#fff!important;border:1px solid var(--rim-light)!important;
  background:linear-gradient(135deg,color-mix(in srgb,var(--rim-shadow) 88%,#000),#071020f0)!important;
  box-shadow:0 0 12px color-mix(in srgb,var(--rim-light) 55%,transparent)!important;text-shadow:0 1px 5px #000a
}

/* Basic rarities */
.game-card[data-rarity-tier="N"]{
  --rim-light:#7b7f86;--rim-shadow:#3a4148;--rim-hot:#eef0f2;
  --rim-thickness:2px;--edge-opacity:.08;--frame-glow:0 0 0 1px #70778033, inset 0 0 0 1px #ffffff12, 0 9px 18px #0007;--frame-aura:0 0 1px #0000;
  --holo-power:.02;--star-power:0;--grain-power:0;
  --info-panel:linear-gradient(180deg,#0f141b,#0b1016f5);--info-border:#80858d66;
}
.game-card[data-rarity-tier="C"]{
  --rim-light:#a1adb5;--rim-shadow:#54616b;--rim-hot:#ffffff;
  --rim-thickness:2px;--edge-opacity:.18;--frame-aura:0 0 6px #bdd3de33;
  --holo-power:.05;--star-power:.02;--beam-alpha:.06;
  --bg-metal:linear-gradient(170deg,#ffffff08,#ffffff00 40%,#ffffff05 66%,#ffffff00 100%);
  --info-border:#b4c1c866;
}
.game-card[data-rarity-tier="UC"]{
  --rim-light:#59d4b8;--rim-shadow:#1a7b76;--rim-hot:#ebfff7;
  --rim-thickness:2.5px;--edge-opacity:.34;--frame-aura:0 0 12px #5ce6c880;
  --holo-power:.16;--star-power:.12;--beam-alpha:.12;
  --bg-metal:linear-gradient(150deg,#d8fff41e,#ffffff00 36%,#c8fff61a 65%,#ffffff00 100%);
  --info-panel:linear-gradient(180deg,#0a1917,#0b1517f6);--info-border:#59d4b86f;
}
.game-card[data-rarity-tier="R"]{
  --rim-light:#7bc2ff;--rim-shadow:#1f4d92;--rim-hot:#eef8ff;
  --rim-thickness:3px;--edge-opacity:.54;--frame-aura:0 0 18px #69aefaaa, 0 0 35px #3c8cff3b;
  --holo-power:.24;--star-power:.2;--beam-alpha:.22;--beam-2-alpha:.08;
  --bg-metal:repeating-linear-gradient(138deg,#d2efff18 0 14px,#ffffff0a 15px 18px,#0000 19px 40px);
  --info-panel:linear-gradient(180deg,#0a1322,#0c1424f8);--info-border:#8ac6ff8d;
}
.game-card[data-rarity-tier="SR"]{
  --rim-light:#d0a1ff;--rim-shadow:#5d3598;--rim-hot:#fbf4ff;
  --rim-thickness:3px;--edge-opacity:.72;--frame-aura:0 0 24px #b688ff9f, 0 0 48px #8c4dff55;
  --holo-power:.34;--star-power:.36;--beam-alpha:.34;
  --bg-metal:repeating-linear-gradient(132deg,#f4d8ff18 0 12px,#ffffff14 13px 15px,#0000 16px 38px);
  --info-panel:linear-gradient(180deg,#181126,#120f20f8);--info-border:#d8a5ff90;
}
.game-card[data-rarity-tier="SSR"]{
  --rim-light:#ffe39b;--rim-shadow:#9b6b1d;--rim-hot:#fffaf0;
  --rim-thickness:3.2px;--edge-opacity:.86;--frame-aura:0 0 28px #f6d37abf, 0 0 56px #ffb40045;
  --holo-power:.48;--star-power:.58;--beam-alpha:.48;
  --bg-metal:repeating-linear-gradient(128deg,#fff1b91d 0 10px,#ffffff18 11px 13px,#0000 14px 33px);
  --info-panel:linear-gradient(180deg,#251909,#1a130af7);--info-border:#ffe1a08e;
}
.game-card[data-rarity-tier="UR"]{
  --rim-light:#dff6ff;--rim-shadow:#6c89ee;--rim-hot:#ffffff;
  --rim-thickness:3.6px;--edge-opacity:1;--frame-aura:0 0 34px #b7e8ffcf, 0 0 68px #7197ff62;
  --holo-power:.62;--star-power:.74;--beam-alpha:.7;--sweep-speed:6.3s;
  --bg-metal:conic-gradient(from 20deg at 50% 50%,#fff0 0deg,#dff7ff26 64deg,#fff8 95deg,#ead7ff2a 145deg,#fff0 205deg,#f7ffcf22 264deg,#fff7 310deg,#fff0 360deg);
  --info-panel:linear-gradient(180deg,#0d1128,#0a0f1ef8);--info-border:#d8f3ff98;
}
.game-card[data-rarity-tier="R"]::after,.game-card[data-rarity-tier="SR"]::after,.game-card[data-rarity-tier="SSR"]::after,.game-card[data-rarity-tier="UR"]::after{opacity:var(--beam-alpha)}

/* Special finishes */
.game-card[data-finish="Foil"]:not([data-rarity-tier="HR"]) {
  --foil-glow:#c8f7ff;--foil-glow-2:#ffd4f6;--foil-glow-3:#fff6c7;
}
.game-card[data-finish="Foil"]:not([data-rarity-tier="HR"])::before{
  opacity:max(var(--edge-opacity),.74)!important;
}
.game-card[data-finish="Foil"]:not([data-rarity-tier="HR"]) .card-art{
  box-shadow: inset 0 0 0 2px #ffffffc0, inset 0 0 18px #9de5ff90, inset 0 0 32px #ffc4f3a0;
}
.game-card[data-finish="Foil"]:not([data-rarity-tier="HR"]) .card-art::before{
  content:"";position:absolute;inset:0;z-index:4;pointer-events:none;
  background:
    radial-gradient(circle at 18% 14%,#fff 0 1px,transparent 3px),
    radial-gradient(circle at 85% 18%,#fff 0 1.2px,transparent 3px),
    radial-gradient(circle at 22% 82%,#fff 0 1.2px,transparent 3px),
    radial-gradient(circle at 80% 72%,#fff 0 1.2px,transparent 3px),
    repeating-conic-gradient(from 0deg,#ffffff00 0 12deg,#ffffff20 12.5deg 13.5deg,#ffffff00 14deg 24deg,#ffd7f622 24.5deg 25deg,#ffffff00 26deg 36deg,#c9f6ff22 36.5deg 37deg,#ffffff00 38deg 48deg);
  mix-blend-mode:screen;opacity:.58;filter:blur(.4px);animation:v37FoilShimmer 3.3s linear infinite;
}
.game-card[data-finish="Foil"]:not([data-rarity-tier="HR"]) .card-art::after{
  content:"";position:absolute;inset:0;z-index:5;pointer-events:none;
  background:
    linear-gradient(138deg,transparent 0 31%,#ffffff00 37%,#ffffffcc 43%,#c5fcff9b 47%,#f5baf09e 52%,#fff4b287 56%,transparent 61%),
    radial-gradient(circle at 18% 16%,#ffffffea 0 1px,transparent 7px),
    radial-gradient(circle at 83% 22%,#ffffffea 0 1px,transparent 8px),
    radial-gradient(circle at 25% 84%,#ffffffea 0 1px,transparent 7px),
    radial-gradient(circle at 77% 76%,#ffffffea 0 1px,transparent 7px);
  opacity:.92;mix-blend-mode:screen;filter:blur(.1px);animation:v37FoilSweep 4.1s ease-in-out infinite;
}
.game-card[data-finish="Foil"]:not([data-rarity-tier="HR"]) .card-art img{
  filter:brightness(1.1) saturate(1.14)
    drop-shadow(0 0 2px #fff)
    drop-shadow(0 0 8px #d0fbff)
    drop-shadow(0 0 15px #fbc0f5)
    drop-shadow(0 0 22px #fff4bd)
    drop-shadow(0 12px 12px #0009)!important;
}

.game-card[data-rarity-tier="HR"], .game-card[data-hr="true"]{
  --rim-light:#ffe49b;--rim-shadow:#9a5d19;--rim-hot:#fffef7;
  --rim-thickness:4px;--edge-opacity:1;--frame-aura:0 0 40px #ffd36dcf, 0 0 86px #f1b9278a;
  --holo-power:.88;--star-power:.92;--beam-alpha:.86;--sweep-speed:4.6s;
  --bg-metal:
    radial-gradient(circle at 10% 16%,#ffffff8f 0 1px,transparent 2.7px),
    radial-gradient(circle at 84% 24%,#fff0c0a0 0 1.1px,transparent 3px),
    radial-gradient(circle at 22% 86%,#ffd888a8 0 1.1px,transparent 3px),
    radial-gradient(circle at 78% 78%,#fff6cf90 0 1px,transparent 2.7px),
    repeating-linear-gradient(135deg,#ffd86d26 0 8px,#fff8d31f 9px 11px,#0000 12px 25px),
    linear-gradient(140deg,#7e4b12,#d49a1f 30%,#8a581a 58%,#ffdb67 78%,#8e5f1d 100%);
  --info-panel:linear-gradient(180deg,#26170a,#17110bf8);--info-border:#ffe9a1a8;
}
.game-card[data-rarity-tier="HR"]::before,.game-card[data-hr="true"]::before{
  opacity:1!important;animation:v37RimSpin 6s linear infinite;
}
.game-card[data-rarity-tier="HR"]::after,.game-card[data-hr="true"]::after{
  opacity:1!important;
  background:
    linear-gradient(114deg,transparent 34%,#fff3aa00 41%,#fff2a050 45%,#ffffffcb 50%,#ffd88b8b 54%,#fff5c785 58%,transparent 64%),
    linear-gradient(90deg,transparent 6%,#ffffff00 46%,#fffce03c 49%,#fff 50%,#fff0c23c 51%,transparent 94%);
  animation:v37HRSweep 3.6s linear infinite;
}
.game-card[data-rarity-tier="HR"] .card-art,.game-card[data-hr="true"] .card-art{
  background:
    radial-gradient(circle at 18% 14%,#fff6cf 0%,transparent 18%),
    radial-gradient(circle at 82% 80%,#ffd16c 0%,transparent 20%),
    linear-gradient(145deg,#7f4d10 0%,#c48f1c 28%,#88601e 46%,#f2d26e 72%,#91631f 100%)!important;
}
.game-card[data-rarity-tier="HR"] .card-art .holo-scene,.game-card[data-hr="true"] .card-art .holo-scene{
  opacity:.98!important;
  background:
    radial-gradient(circle at 12% 18%,#fffef0 0 1px,transparent 3px),
    radial-gradient(circle at 84% 22%,#fff9d7 0 1px,transparent 3px),
    radial-gradient(circle at 22% 84%,#ffd99a 0 1px,transparent 3px),
    radial-gradient(circle at 78% 72%,#fff1b8 0 1px,transparent 3px),
    repeating-radial-gradient(circle at 40% 40%,#fff7d70f 0 2px,#ffffff00 3px 12px),
    repeating-linear-gradient(132deg,#fff5be2c 0 7px,#0000 8px 18px),
    linear-gradient(135deg,#ffffff14,#ffffff00 40%,#ffffff24 58%,#ffffff00 100%),
    linear-gradient(135deg,#d8aa39,#fff5b2 16%,#a46f18 44%,#ffe287 66%,#8b611f 100%);
  background-size:100% 100%,100% 100%,100% 100%,100% 100%,40px 40px,100% 100%,100% 100%,100% 100%;
  background-blend-mode:screen,screen,screen,screen,screen,soft-light,screen,normal;
  animation:v37HRGlitter 2.8s linear infinite;
}
.game-card[data-rarity-tier="HR"] .card-art .holo-stars,.game-card[data-hr="true"] .card-art .holo-stars{
  opacity:1!important;
  background-image:
    radial-gradient(circle at 12% 12%,#fff 0 1.2px,#fff1c6 2.8px,transparent 7px),
    radial-gradient(circle at 82% 17%,#fff 0 1.2px,#ffe6a8 3px,transparent 8px),
    radial-gradient(circle at 66% 60%,#fff 0 1.1px,#ffd792 2.8px,transparent 7px),
    radial-gradient(circle at 19% 78%,#fff 0 1.4px,#fff0ba 3.4px,transparent 10px),
    radial-gradient(circle at 92% 87%,#fff 0 1.2px,#ffe39a 2.8px,transparent 8px),
    repeating-radial-gradient(circle at 70% 40%,transparent 0 6px,#fff9d04a 7px 7.5px,transparent 8px 24px);
  background-size:100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,30px 30px;
  animation:v37GoldTwinkle 2.4s ease-in-out infinite alternate;
}
.game-card[data-rarity-tier="HR"] .card-art img,.game-card[data-hr="true"] .card-art img{
  filter:brightness(1.1) saturate(1.08) drop-shadow(0 0 6px #fff2b5) drop-shadow(0 0 18px #f2c34c) drop-shadow(0 12px 12px #000a)!important;
}

.finish-preview-screen .finish-header{align-items:center}
.finish-preview-screen .finish-sub{line-height:1.6;max-width:640px}
.finish-preview-screen .finish-legend{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:10px;margin:14px 0 6px}
.finish-preview-screen .finish-legend .legend-item{border:1px solid #384353;background:#101821;padding:10px 12px;border-radius:12px}
.finish-preview-screen .finish-legend b{display:block;font-size:11px;margin-bottom:4px}
.finish-preview-screen .finish-legend small{display:block;color:#9ca7b4;line-height:1.5;font-size:10px}

@keyframes v37RimSpin{to{filter:hue-rotate(18deg)}}
@keyframes v37CardSweep{0%,12%,100%{transform:translateX(-36%) rotate(-6deg);opacity:0}38%{opacity:var(--beam-alpha)}68%{transform:translateX(32%) rotate(-6deg);opacity:0}}
@keyframes v37ArtShift{0%{transform:translate(-8%,-5%) rotate(-5deg)}100%{transform:translate(8%,5%) rotate(8deg)}}
@keyframes v37StarPulse{from{filter:brightness(.7);transform:scale(1)}to{filter:brightness(1.7);transform:scale(1.018)}}
@keyframes v37FoilShimmer{from{transform:rotate(0deg);opacity:.45}to{transform:rotate(360deg);opacity:.68}}
@keyframes v37FoilSweep{0%,100%{transform:translateX(-30%) rotate(-8deg)}52%{transform:translateX(26%) rotate(-8deg)}}
@keyframes v37HRSweep{0%{transform:translateX(-44%) rotate(12deg)}100%{transform:translateX(42%) rotate(12deg)}}
@keyframes v37HRGlitter{from{background-position:0 0,0 0,0 0,0 0,0 0,0 0,0 0,0 0}to{background-position:18px 16px,-12px 14px,16px -10px,-11px -16px,0 0,0 0,0 0,0 0}}
@keyframes v37GoldTwinkle{from{filter:brightness(.9)}to{filter:brightness(1.55)}}
@media (prefers-reduced-motion:reduce){
 .game-card[data-rarity-tier]::before,.game-card[data-rarity-tier]::after,.game-card[data-rarity-tier] .holo-scene,.game-card[data-rarity-tier] .holo-stars,.game-card[data-finish="Foil"] .card-art::before,.game-card[data-finish="Foil"] .card-art::after{animation:none!important}
}
