/* MONSTARICA - holographic in-game finish study v36.
   The image is kept legible above thematic color shifts and scene glitter.
   Basic rarity is communicated by the FRAME; illustrations get their own palette.
*/
.game-card[data-rarity-tier]{
 --art-tone-1:#5accb6;--art-tone-2:#a6dfbd;--art-tone-3:#1d4c5d;--art-tone-4:#e5ffd3;
 --rim-light:#73889a;--rim-shadow:#243547;--rim-hot:#f9fafc;
 --rim-power:.12;--rim-op:.25;--rim-flare:7px;--beam-alpha:.16;--holo-power:.10;--star-power:.10;--holo-speed:14s;
 border:2px solid var(--rim-light)!important;
 background:linear-gradient(155deg,var(--rim-light),var(--rim-shadow) 14%,#101621 27%,var(--rim-shadow) 79%,var(--rim-light))!important;
 box-shadow:0 0 0 1px color-mix(in srgb,var(--rim-light) 48%,transparent),inset 0 0 0 1px #ffffff28,0 10px 22px #0008,0 0 var(--rim-flare) color-mix(in srgb,var(--rim-light) 53%,transparent)!important;
 isolation:isolate;position:relative;overflow:hidden;
}
/* Distinct frame materials, all visually readable with artwork out of focus. */
.game-card[data-rarity-tier="N"]{--rim-op:.12;--rim-flare:2px;--beam-alpha:.05;--rim-light:#777c83;--rim-shadow:#293039;--rim-power:.02;--holo-power:.03;--star-power:0}
.game-card[data-rarity-tier="C"]{--rim-op:.22;--rim-flare:4px;--beam-alpha:.08;--rim-light:#9aabb0;--rim-shadow:#46555d;--rim-power:.08;--holo-power:.14;--star-power:.03}
.game-card[data-rarity-tier="UC"]{--rim-op:.40;--rim-flare:8px;--beam-alpha:.18;--rim-light:#6bd2b6;--rim-shadow:#176f73;--rim-power:.2;--holo-power:.26;--star-power:.22}
.game-card[data-rarity-tier="R"]{--rim-op:.55;--rim-flare:13px;--beam-alpha:.30;--rim-light:#8dc6ff;--rim-shadow:#1d4989;--rim-power:.36;--holo-power:.47;--star-power:.48}
.game-card[data-rarity-tier="SR"]{--rim-op:.70;--rim-flare:19px;--beam-alpha:.42;--rim-light:#c6a0ff;--rim-shadow:#53318e;--rim-power:.60;--holo-power:.64;--star-power:.65}
.game-card[data-rarity-tier="SSR"]{--rim-op:.83;--rim-flare:24px;--beam-alpha:.56;--rim-light:#ffe1a0;--rim-shadow:#986a1f;--rim-power:.82;--holo-power:.78;--star-power:.82}
.game-card[data-rarity-tier="UR"]{--rim-op:.97;--rim-flare:30px;--beam-alpha:.72;--rim-light:#e5faff;--rim-shadow:#7390e6;--rim-hot:#fafaff;--rim-power:1;--holo-power:.91;--star-power:.92}
/* HR isn't the normal UR finish; HR covers a denser portion of the entire surface. */
.game-card[data-hr="true"],.game-card[data-rarity-tier="HR"]{--rim-light:#ffe1a1;--rim-shadow:#ff86d7;--rim-power:1.45;--rim-op:1;--rim-flare:38px;--beam-alpha:.88;--holo-power:1;--star-power:1;--holo-speed:7.5s}
.game-card.sp[data-hr="false"]{--rim-light:#fdc7f7;--rim-shadow:#9e5de7;--rim-power:1;--holo-power:.72;--star-power:.86}
/* Animated jewel-metal reflection ring, trapped in a thin CARD EDGE (not opaque over text). */
.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:3px;
 background:conic-gradient(from 50deg,var(--rim-shadow) 0deg,var(--rim-light) 25deg,#fff 38deg,var(--rim-light) 61deg,var(--rim-shadow) 100deg,var(--rim-hot) 134deg,var(--rim-shadow) 171deg,var(--rim-light) 222deg,#fff 247deg,var(--rim-shadow) 300deg,var(--rim-light) 345deg)!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(--rim-op)!important;mix-blend-mode:screen;
 animation:ingameRimRotate 11s linear infinite!important;
}
.game-card[data-rarity-tier]::after{
 content:"";position:absolute;inset:-75%;z-index:5;pointer-events:none;
 background:linear-gradient(112deg,transparent 38%,#ffffff00 44%,#fff8 49%,#fffe 50%,#b2f5ff73 52%,transparent 57%)!important;
 opacity:var(--beam-alpha)!important;animation:ingameGlint 8.8s ease-in-out infinite!important;
 mix-blend-mode:screen;
}
/* Artwork layer stays 100% within card image box. Original transparent artwork on top. */
.game-card[data-rarity-tier] .card-art{
 isolation:isolate;overflow:hidden;
 background:radial-gradient(ellipse at 26% 20%,color-mix(in srgb,var(--art-tone-4) 70%,white) 0%,transparent 36%),radial-gradient(ellipse at 76% 75%,var(--art-tone-1) 0%,transparent 47%),linear-gradient(145deg,var(--art-tone-3) 0%,var(--art-tone-1) 42%,var(--art-tone-2) 66%,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;filter:drop-shadow(0 12px 12px #000b) saturate(1.08) contrast(1.03)!important;pointer-events:none}
.game-card[data-rarity-tier] .card-art .holo-scene{
 position:absolute;inset:-40%;z-index:1;pointer-events:none;
 background:
  conic-gradient(from 10deg at 50% 50%,transparent 0deg,#ffffff40 23deg,transparent 48deg,#fedcff40 81deg,transparent 120deg,#c0faff8c 153deg,transparent 186deg,#f7faac77 224deg,transparent 266deg,#ffffff33 314deg,transparent 360deg),
  repeating-linear-gradient(128deg,transparent 0 18px,#ffffff38 19px 21px,transparent 22px 56px),
  radial-gradient(circle at 35% 35%,#ffffff8a,transparent 20%),
  linear-gradient(35deg,var(--art-tone-1),transparent 40%,var(--art-tone-4) 65%,var(--art-tone-2));
 background-blend-mode:screen,soft-light,screen,overlay;
 opacity:var(--holo-power)!important;
 animation:ingameArtHolo var(--holo-speed) ease-in-out infinite alternate!important;
 mix-blend-mode:screen;
}
.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,#ffffffa8 2px,transparent 4px),
 radial-gradient(circle at 82% 17%,#fff 0 1.5px,#ffffffa8 3px,transparent 7px),
 radial-gradient(circle at 66% 60%,#fff 0 1px,#ffffffb8 2.2px,transparent 5px),
 radial-gradient(circle at 19% 78%,#fff 0 1.7px,#ffffffbc 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,#ffffff45 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;
 animation:ingameStarTwinkle 4.2s ease-in-out infinite alternate!important;
 mix-blend-mode:screen;
}
.game-card[data-rarity-tier] .card-art::before,
.game-card[data-rarity-tier] .card-art::after{display:none!important}
.game-card[data-rarity-tier] .card-info{position:absolute;z-index:7;background:linear-gradient(180deg,#0a1225f1,#090f1bf9)!important;border-top:1px solid var(--rim-light)!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,var(--rim-shadow),#071020ed)!important;box-shadow:0 0 11px color-mix(in srgb,var(--rim-light) 50%,transparent)!important;text-shadow:0 1px 5px #000a}
.game-card[data-rarity-tier="N"] .card-rarity{box-shadow:none!important}
.game-card[data-hr="true"] .card-art::before,.game-card[data-hr="true"] .card-art::after{display:none!important}
.game-card[data-hr="true"] .card-art .holo-stars{
 background-image:radial-gradient(circle,#fff 0 1px,#fff8 1.1px,transparent 3.8px),radial-gradient(circle,#f6dbff 0 1px,#ffb7f0ab 2px,transparent 4px),linear-gradient(138deg,transparent 25%,#ffffff50 50%,transparent 74%);
 background-size:15px 15px,27px 27px,100% 100%;opacity:.93!important;
 animation:ingameGlitterShower 3.6s linear infinite!important;
}
.game-card[data-hr="true"] .card-info{background:linear-gradient(175deg,#281c25ed,#11101cf9)!important}
.game-card[data-finish="Foil"]:not([data-hr="true"]) .card-art{
 outline:3px solid transparent;outline-offset:-5px;
 box-shadow:inset 0 0 0 3px #ffffffb0, inset 0 0 22px #ffb2ffc2;
}
.game-card[data-finish="Foil"]:not([data-hr="true"]) .card-art img{filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 9px #a3f6ff) drop-shadow(0 0 14px #ffabf2) drop-shadow(0 12px 12px #0009)!important}
.game-card[data-finish="SP"] .card-art img{filter:drop-shadow(0 13px 12px #0008) saturate(1.13)!important}
@keyframes ingameRimRotate{to{filter:hue-rotate(35deg)}}
@keyframes ingameGlint{0%,10%,100%{transform:translateX(-28%) rotate(-4deg);opacity:0}42%{opacity:var(--beam-alpha)}70%{transform:translateX(28%) rotate(-4deg);opacity:0}}
@keyframes ingameArtHolo{0%{transform:translate(-8%,-5%) rotate(-5deg)}100%{transform:translate(7%,5%) rotate(9deg)}}
@keyframes ingameStarTwinkle{from{filter:brightness(.65);transform:scale(1)}to{filter:brightness(1.65);transform:scale(1.018)}}
@keyframes ingameGlitterShower{from{background-position:0 0,0 0,0 0}to{background-position:14px 23px,-18px 13px,0 0}}
@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{animation:none!important}}

/* The finish samples sit in the same visual layout as MONSTARICA Cards and Pack. */
.lobby-ui .finish-preview-screen{padding:18px 24px 34px;overflow-y:auto!important}
.finish-preview-screen .finish-header{display:flex;gap:12px;justify-content:space-between;align-items:flex-end;padding-bottom:15px;border-bottom:1px solid #2b3541;flex-wrap:wrap}
.finish-preview-screen .finish-title{font-size:clamp(22px,3vw,31px);font-weight:900;letter-spacing:.03em;margin:4px 0 3px}
.finish-preview-screen .finish-sub{color:#9da8b4;font-size:11px}
.finish-preview-screen .finish-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.finish-preview-screen .finish-tools select{border:1px solid #536274;background:#15202e;color:#f4f5fa;padding:9px 11px;font-size:12px}
.finish-preview-screen .finish-tools button{border:1px solid #465463;background:#121b26;color:#dde9f6;padding:9px 13px;font-size:11px;font-weight:750;cursor:pointer}
.finish-preview-screen .finish-tools button.active{background:#d5dfeb;color:#142338}
.finish-preview-screen .finish-guide{display:flex;justify-content:space-between;align-items:center;margin:17px 0 11px;color:#c4d0de;font-size:12px}
.finish-preview-screen .finish-gallery{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:17px;max-width:1220px;margin:auto;padding-bottom:20px}
.finish-preview-screen .finish-preview-item{border:0;background:none;padding:0;color:#e7eefb;text-align:left;min-width:0;cursor:zoom-in}
.finish-preview-item .game-card{aspect-ratio:.7;width:100%;pointer-events:none;border-radius:9px}
.finish-preview-item .finish-label{padding:8px 3px 2px;display:flex;justify-content:space-between;align-items:center}
.finish-preview-item .finish-label strong{font-size:12px;font-weight:900}
.finish-preview-item .finish-label small{font-size:9px;color:#8695a6}
.finish-preview-screen .finish-pack-demo{border:1px solid #344354;padding:15px 14px 26px;background:radial-gradient(ellipse at 50% 25%,#2a415a,#111b29 68%);max-width:1250px;margin:auto}
.finish-preview-screen .finish-pack-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.finish-preview-screen .finish-pack-cards button{padding:0;border:0;background:none;cursor:zoom-in;color:white}
.finish-preview-screen .finish-pack-cards .game-card{width:100%;pointer-events:none}
.finish-preview-screen.motion-off .game-card::before,.finish-preview-screen.motion-off .game-card::after,.finish-preview-screen.motion-off .holo-scene,.finish-preview-screen.motion-off .holo-stars{animation-play-state:paused!important}
@media(max-width:850px){.finish-preview-screen .finish-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.finish-preview-screen .finish-pack-cards{gap:7px}.lobby-ui .finish-preview-screen{padding:14px 10px 20px}}
@media(max-width:540px){.finish-preview-screen .finish-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.finish-preview-screen .finish-pack-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.finish-preview-screen .finish-pack-cards button:nth-child(4){grid-column:1}.finish-preview-screen .finish-pack-cards button:nth-child(5){grid-column:2}.finish-preview-screen .finish-tools select{max-width:138px}.finish-preview-screen .finish-label small{font-size:8px}}
