@import url('./onboarding.css');
@import url('./champion130.css');
@import url('./item87.css');
@import url('./inspection.css');
@import url('./equipment-finish.css');

.tcg {
    --tcg-gold: #d7a84e;
    --tcg-muted: #a4a29f;
    width: min(1480px, calc(100% - 48px));
    max-width: none;
    height: calc(100% - 64px);
    max-height: none;
    margin: auto;
    padding: 0;
    border: 1px solid #544531;
    border-radius: 16px;
    color: #f1eee8;
    background: radial-gradient(ellipse at 50% 38%, #26201b70, transparent 60%), #0c0e12f5;
    box-shadow: 0 30px 100px #000b;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    color-scheme: dark;
}
.tcg::backdrop { background: #020408af; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }
.tcg *, .tcg *::before, .tcg *::after { box-sizing: border-box; }
.tcg [hidden] { display: none !important; }
.tcg button, .tcg input, .tcg select { font: inherit; }
.tcg button, .tcg a, .tcg summary, .tcg select { -webkit-tap-highlight-color: transparent; }
.tcg button { cursor: pointer; }
.tcg button:disabled { cursor: wait; opacity: .6; }
.tcg :focus-visible { outline: 2px solid #f1d899; outline-offset: 5px; }
.tcg-shell { padding: 0 38px; }
.tcg-nav { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 76px; border-bottom: 1px solid #ffffff12; }
.tcg-wordmark { color: #eee; font-size: 15px; font-weight: 800; letter-spacing: -1px; white-space: nowrap; }
.tcg-wordmark { display: flex; align-items: center; }
.tcg-wordmark > img { width: 190px; height: auto; }
.tcg-wordmark > span { color: var(--tcg-gold); }
.tcg-wordmark small { margin-left: 9px; padding-left: 12px; border-left: 1px solid #ffffff30; color: #98938a; font-size: 10px; letter-spacing: 3px; }
.tcg-tabs { display: flex; align-self: stretch; gap: 30px; }
.tcg-tabs a { display: grid; align-items: center; color: #9c9c9f; font-size: 12px; border-bottom: 2px solid transparent; transition: color .2s; }
.tcg-tabs a:hover, .tcg-tabs a[aria-current] { color: #e4c17a; border-bottom-color: #d7a84e; }
.tcg-close { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 0; background: none; color: var(--text-color); font-size: 44px !important; font-weight: 400; line-height: 1; }
.tcg-close:hover { color: var(--primary-color); }
.tcg-heading { text-align: center; padding: 38px 0 0; }
.tcg-eyebrow { color: #bc995b; font-size: 9px; font-weight: 600; letter-spacing: 2.8px; line-height: 1.6; }
.tcg-eyebrow > span { color: #656566; margin-left: 16px; }
.tcg-heading h1 { font-size: clamp(26px, 3.2vw, 42px); line-height: 1.2; font-weight: 600; letter-spacing: -1.8px; margin: 12px 0; }
.tcg-heading > p:last-child { color: var(--tcg-muted); font-size: 12px; line-height: 1.7; }
.tcg-stage { position: relative; display: grid; place-items: center; min-height: 460px; padding: 42px 4px 20px; isolation: isolate; }
.tcg-orbit { position: absolute; width: 480px; max-width: 85%; aspect-ratio: 1; border: 1px solid #be975315; border-radius: 50%; pointer-events: none; z-index: -1; background: radial-gradient(circle, #d7a84e0c, transparent 68%); }
.tcg-orbit::before, .tcg-orbit::after { content: ''; position: absolute; inset: 26px; border: 1px solid #be97530c; border-radius: 50%; }
.tcg-orbit::after { inset: 55px; }
.tcg-pack-wrap { display: grid; justify-items: center; gap: 28px; grid-area: 1 / 1; perspective: 1100px; }
.tcg-pack {
    --pack-accent: #d7a84e;
    display: block; position: relative; width: 222px; height: 322px; padding: 0; border: 0; border-radius: 3px;
    color: var(--pack-accent); background: transparent; text-align: center;
    filter: drop-shadow(0 24px 30px #0009); transform: rotate(-5deg); transition: transform .4s, filter .4s;
    animation: tcg-float 5s ease-in-out infinite;
}
.tcg-pack:hover { transform: rotate(0deg) translateY(-8px) scale(1.035); filter: drop-shadow(0 18px 30px #d7a84e28); animation-play-state: paused; }
.tcg-pack-content { display: flex; position: absolute; inset: 25px 0 0; align-items: center; flex-direction: column; padding: 22px 20px 19px; border: 1px solid #8d7147; background: repeating-linear-gradient(120deg, #ffffff03 0 1px, transparent 1px 8px), linear-gradient(115deg, #16191d 10%, #32302a 35%, #101216 70%, #282722); overflow: hidden; }
.tcg-pack-content::before { content: ''; position: absolute; inset: 8px; border: 1px solid #d7a84e35; pointer-events: none; }
.tcg-pack-content::after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 9px; background: repeating-linear-gradient(90deg, #111 0 2px, #625239 2px 3px); }
.tcg-pack-tear { position: absolute; inset: 0 0 auto; height: 26px; display: flex; align-items: center; justify-content: space-between; padding: 0 13px; border: 1px solid #8d7147; border-bottom: 1px dashed #d7a84e90; background: repeating-linear-gradient(90deg, #24231f 0 2px, #454033 2px 3px); transform-origin: 100% 100%; }
.tcg-pack-tear > span { font-size: 6px; letter-spacing: 3px; }
.tcg-pack-edition { font-size: 7px; letter-spacing: 2px; }
.tcg-seal { position: relative; display: grid; place-items: center; width: 79px; height: 79px; border: 1px solid currentColor; transform: rotate(45deg); margin: 23px 0 24px; font-size: 48px; font-family: Georgia, serif; line-height: 1; }
.tcg-seal::before { content: ''; position: absolute; inset: 5px; border: 1px solid currentColor; opacity: .3; }
.tcg-seal > span { position: absolute; right: -8px; bottom: -8px; font-size: 17px; background: #232320; }
.tcg-pack-brand { font-size: 18px; letter-spacing: 4px; line-height: 1; }
.tcg-pack-brand strong { display: block; font-size: 23px; font-weight: 800; letter-spacing: 2px; margin-top: 4px; color: #ede6d8; }
.tcg-pack-rule { width: 24px; height: 1px; background: currentColor; margin: 15px 0 11px; opacity: .5; }
.tcg-pack-caption { font-size: 7px; letter-spacing: 2px; line-height: 1.8; }
.tcg-pack-bottom { display: flex; justify-content: space-between; align-items: center; width: 100%; margin-top: auto; font-size: 6px; letter-spacing: 2px; }
.tcg-pack-bottom b { font-weight: 400; color: #dfd6c1; }
.tcg-pack-hint { font-size: 10px; color: #b4a58b; letter-spacing: 1px; }
.tcg-pack[data-wrapper="prism"] { --pack-accent: #a7ecea; }
.tcg-pack[data-wrapper="prism"] .tcg-pack-content { border-color: #86b5c0; background: repeating-linear-gradient(120deg, #fff1 0 1px, transparent 1px 9px), linear-gradient(130deg, #15262b, #38304b, #1b3c3c, #1a1c27); }
.tcg-pack[data-wrapper="prism"] .tcg-pack-tear { border-color: #86b5c0; background: #25343f; }
.tcg-pack[data-wrapper="ember"] { --pack-accent: #efa284; }
.tcg-pack[data-wrapper="ember"] .tcg-pack-content { background: repeating-linear-gradient(120deg, #fff1 0 1px, transparent 1px 9px), linear-gradient(130deg, #1e1013, #582c24, #211217); }
.tcg-stage[data-phase="opening"] .tcg-pack { animation: tcg-pack-charge .55s ease-in forwards; }
.tcg-stage[data-phase="opening"] .tcg-pack-tear { animation: tcg-tear .65s .3s ease-in forwards; }
.tcg-stage[data-phase="opening"] .tcg-pack-content { animation: tcg-wrapper-out .5s .65s ease-in forwards; }
.tcg-stage[data-phase="opening"] .tcg-pack-hint { opacity: 0; }
.tcg-stage[data-phase="dealt"] .tcg-pack-wrap { display: none; }
.tcg-hand { grid-area: 1 / 1; display: none; width: 100%; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; align-items: center; }
.tcg-stage[data-phase="dealt"] .tcg-hand { display: grid; }
.tcg-stage[data-phase="dealt"] .tcg-card-slot { animation: tcg-deal .65s calc(var(--slot) * 90ms) cubic-bezier(.16, 1, .3, 1) both; }
.tcg-card-slot { min-width: 0; position: relative; perspective: 1100px; }
.tcg-reveal-particles { position:absolute; inset:0; z-index:12; pointer-events:none; }
.tcg-reveal-particles i { position:absolute; display:block; border-radius:1px; box-shadow:0 0 4px #d9d6fa88; opacity:0; }
.tcg-reveal-embers i { box-shadow:0 0 5px #ff632aaa; }
.tcg-foil-reveal-sweep{position:absolute;inset:-40% -60%;z-index:9;pointer-events:none;opacity:0;mix-blend-mode:screen;background:linear-gradient(112deg,transparent 30%,#83dffb55 39%,#bd87ec99 43%,#ffa0dccc 47%,#ffdf8cbb 50%,#a7ecd4aa 53%,#86cfff77 57%,transparent 66%)}
@media (prefers-reduced-motion:reduce) { .tcg-reveal-particles { display:none; } }
/* A cropped front of this pack's saved rarest pull, under the existing tear.
   Move the artwork upward enough to hint at its subject, never its nameplate. */
.tcg-pack-peek{position:absolute;inset:12px 12px 18px;overflow:hidden;border-radius:7px;background:#101216;pointer-events:none}
.tcg-pack-peek>.tcg-card-slot{position:absolute;width:260px;left:-36px;top:-58px;perspective:none}
.tcg-pack-peek[data-kind="item"]>.tcg-card-slot,.tcg-pack-peek[data-kind="augment"]>.tcg-card-slot{top:-90px}
.tcg-pack-peek .tcg-card{pointer-events:none;filter:none!important;transform:none!important}
.tcg-pack-peek .tcg-card-meta,.tcg-pack-peek .tcg-card-back,.tcg-pack-peek .tcg-aura{display:none!important}
.tcg-pack-peek .tcg-card-rotor{transform:none!important;transition:none}
.tcg-card {
    --tone: #b8c9d6; --tone-rgb: 184, 201, 214; --deep: #29333f;
    --rx: 0deg; --ry: 0deg; --light: .65; --shine-angle: 112deg;
    --foil-x: 34%; --foil-y: 22%; --reflection: .17;
    position: relative; display: block; padding: 0; width: 100%; aspect-ratio: 63 / 88;
    background: transparent; border: none; color: #f9f4e8; border-radius: 12px;
    transform: rotateX(var(--rx)) rotateY(var(--ry)); transform-style: preserve-3d;
    transition: transform .15s ease-out, filter .25s;
    text-align: left; isolation: auto;
}
/* flattenThumbnails (flat-thumbnail.js): a static thumbnail draws flat instead of as hundreds of 3D
   layers, and is its own compositor layer, rastered once. Otherwise every scroll or hover frame
   repaints and re-layers every thumbnail's dozens of masked, filtered and clipped parts. */
.tcg-card[data-flat="true"] *{transform-style:flat!important;perspective:none!important;backface-visibility:visible!important;will-change:auto!important}
.tcg-card[data-flat="true"]{transform-style:flat!important;will-change:transform!important}
.tcg-card[data-flat="true"] .tcg-card-rotor{transform:none!important}
.tcg-card[data-flat="true"] .tcg-champion130{transform:scale(var(--champion-scale,1))!important}
/* Direct manipulation: avoid restarting a rasterized transform transition on
   every pointer update. The child rotor still owns the animated card flip. */
.tcg[data-mode="viewer"] #tcg-inspected-card .tcg-card { transition: none; }
/* Pack cards follow the pointer directly too. Restore the normal short return
   transition on pointer leave; the child rotor keeps its independent flip. */
.tcg[data-mode="pack"] .tcg-hand .tcg-card:hover { transition: none; }
.tcg-card[data-tier="gold"] { --tone: #e8be69; --tone-rgb: 232, 190, 105; --deep: #4b3720; }
.tcg-card[data-tier="prismatic"] { --tone: #a9ebe9; --tone-rgb: 169, 235, 233; --deep: #28334d; }
.tcg-card[data-tier="secret"] { --tone: #ef6846; --tone-rgb: 239, 104, 70; --deep: #21171c; }
.tcg-card:hover, .tcg-card:focus-visible { filter: drop-shadow(0 6px 15px rgba(var(--tone-rgb), .23)); z-index: 2; }
.tcg-card[data-tier="prismatic"]:hover { filter: drop-shadow(-5px 0 12px #66eecc40) drop-shadow(5px 0 12px #ba86ff40); }
.tcg-card[data-tier="secret"]:hover { filter: drop-shadow(0 0 23px #ffb56865); }
.tcg-card-rotor { position: absolute; inset: 0; transform-style: preserve-3d; transform: rotateY(180deg); transition: transform .8s cubic-bezier(.2, .7, .2, 1); }
.tcg-card.is-revealed .tcg-card-rotor { transform: rotateY(0deg); }
.tcg-card-front, .tcg-card-back { position: absolute; inset: 0; border-radius: 12px; backface-visibility: hidden; -webkit-backface-visibility: hidden; overflow: hidden; }
.tcg-card-front { display: flex; flex-direction: column; padding: 8px; border: 1px solid var(--tone); background: #212328; box-shadow: inset 0 0 0 3px #0009, inset 0 0 0 4px rgba(var(--tone-rgb), .25); transform: translateZ(.1px); }
.tcg-card-front::before { content: ''; position: absolute; inset: 6px; border: 1px solid rgba(var(--tone-rgb), .32); border-radius: 6px; z-index: 3; pointer-events: none; }
.tcg-card-topline { position: relative; display: flex; justify-content: space-between; align-items: center; min-height: 25px; padding: 3px 6px 8px; color: var(--tone); font-size: clamp(6px, .7vw, 9px); font-weight: 600; letter-spacing: 1.6px; text-transform: uppercase; z-index: 4; }
.tcg-card-gem { font-size: 12px; letter-spacing: -4px; padding-right: 4px; }
.tcg-card-art { position: relative; display: grid; place-items: center; flex: 1; min-height: 0; margin: 0 2px; border: 1px solid rgba(var(--tone-rgb), .3); overflow: hidden; border-radius: 4px; background: radial-gradient(ellipse, rgba(var(--tone-rgb), .13), transparent 70%), #0e1219; }
.tcg-card-art::before { content: ''; position: absolute; width: 72%; aspect-ratio: 1; border: 1px solid rgba(var(--tone-rgb), .23); transform: rotate(45deg); }
.tcg-card-art img { position: relative; display: block; width: 64px; height: 64px; object-fit: contain; border-radius: 2px; box-shadow: 0 0 0 5px #14161a, 0 0 0 6px rgba(var(--tone-rgb), .6), 0 10px 20px #0007; }
.tcg-card[data-kind="champion"]:not(.tcg-full-art) .tcg-card-art img { width: min(72%, 112px); height: auto; aspect-ratio: 1; border-radius: 3px; }
.tcg-card-info { position: relative; z-index: 4; padding: 13px 6px 5px; }
.tcg-card-name { display: block; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(13px, 1.5vw, 20px); font-weight: 400; line-height: 1.1; letter-spacing: -.4px; }
.tcg-card-subtitle { display: block; font-size: clamp(6px, .65vw, 9px); color: #c4bbb2; line-height: 1.5; margin-top: 7px; min-height: 2.8em; }
.tcg-card-bottom { display: flex; justify-content: space-between; border-top: 1px solid rgba(var(--tone-rgb), .22); padding-top: 8px; margin-top: 8px; color: var(--tone); font-size: clamp(6px, .58vw, 8px); letter-spacing: 1px; text-transform: uppercase; }
.tcg-card[data-tier="prismatic"] .tcg-card-front { background: #1d252c; border-color: #b7d6df; box-shadow: inset 0 0 0 3px #11151b, inset 0 0 0 4px #a1b2de80; }
.tcg-card[data-tier="secret"] .tcg-card-front { background: repeating-linear-gradient(125deg, #ffebc305 0 1px, transparent 1px 7px), #281c20; }
.tcg-full-art .tcg-card-art { position: absolute; inset: 5px; border: 0; margin: 0; }
.tcg-full-art .tcg-card-art::before { display: none; }
.tcg-full-art .tcg-card-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(#0009, transparent 23%, transparent 40%, #080b12cf 72%, #080b12 100%); }
.tcg-full-art .tcg-card-art img { width: 100%; height: 100%; object-fit: cover; object-position: center 25%; filter: none; }
.tcg-full-art .tcg-card-info { margin-top: auto; }
.tcg-full-art .tcg-card-topline { text-shadow: 0 1px 5px #000; }
.tcg-card-finish, .tcg-card-glare { position: absolute; inset: 5px; border-radius: 7px; pointer-events: none; z-index: 5; }
.tcg-card-glare { background: linear-gradient(var(--shine-angle), transparent 30%, #fff4 49%, transparent 68%); background-size: 250% 250%; background-position: var(--foil-x) var(--foil-y); mix-blend-mode: screen; opacity: 0; }
.tcg-card-finish { opacity: 0; }
.tcg-card.is-foil .tcg-card-finish {
    opacity: calc(var(--light) * (.28 + var(--reflection) * .65)); mix-blend-mode: screen;
    background-image: repeating-linear-gradient(var(--shine-angle), #ee509960 0%, #facd6960 11%, #8bd68860 22%, #47cdd460 33%, #7c7bef60 44%, #ec82c560 55%, #ee509960 66%);
    background-size: 260% 260%; background-position: var(--foil-x) var(--foil-y);
}
.tcg-card.is-foil .tcg-card-glare { opacity: calc(var(--light) * var(--reflection) * .45); }
.tcg-card[data-tier="secret"] .tcg-card-art::before { border: 1px solid #ffd89980; box-shadow: 0 0 0 10px #efa28206, 0 0 0 11px #efa28222, 0 0 35px #f3965630; }
.tcg-card-sparks { position: absolute; inset: 8px; pointer-events: none; z-index: 6; overflow: hidden; }
.tcg-card-sparks i { position: absolute; left: calc(12% + var(--spark) * 13%); top: calc(14% + var(--spark) * 11%); width: 3px; height: 3px; background: #fff6d7; box-shadow: 0 0 5px #ffeba1; border-radius: 50%; opacity: 0; }
.tcg-card.is-revealed:is(.is-foil, [data-tier="secret"]) .tcg-card-sparks i { animation: tcg-spark 3.8s calc(var(--spark) * -.63s) infinite; }
.tcg-card.is-revealed.just-revealed { animation: none; }
.tcg-card-back { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 10px; padding: 22px; transform: rotateY(180deg); color: #b39a6b; border: 1px solid #aa8a55; background: repeating-linear-gradient(45deg, #d7a84e06 0 1px, transparent 1px 10px), repeating-linear-gradient(-45deg, #d7a84e06 0 1px, transparent 1px 10px), radial-gradient(ellipse at 50% 35%, #393a35, #10151c 70%); box-shadow: inset 0 0 0 4px #11161b, inset 0 0 0 5px #8d73464d; }
.tcg-card-back::before, .tcg-card-back::after { content: ''; position: absolute; inset: 12px; border: 1px solid #a1824a42; border-radius: 40% 0; pointer-events: none; }
.tcg-card-back::after { inset: 20px; border-radius: 0 40%; }
.tcg-card-back .tcg-seal { width: 44%; height: auto; aspect-ratio: 1; margin: 13px 0 21px; font-size: clamp(22px, 4vw, 60px); }
.tcg-back-brand { font-size: clamp(10px, 1.1vw, 17px); letter-spacing: 2px; text-align: center; z-index: 1; }
.tcg-back-brand strong { display: block; color: #e9e0d0; font-weight: 800; }
.tcg-back-edition { font-size: clamp(5px, .5vw, 7px); letter-spacing: 2px; text-align: center; z-index: 1; }
.tcg-card[data-back="gilded"] .tcg-card-back { color: #ead3a2; background: repeating-linear-gradient(45deg, #efdb9e10 0 1px, transparent 1px 7px), radial-gradient(ellipse at 40% 20%, #8b7144, #3e352a 50%, #1c2027); }
.tcg-card[data-style="gallery"] .tcg-card-front { padding: 11px; border-radius: 8px; background: #14171d; box-shadow: inset 0 0 0 3px #111, inset 0 0 0 4px rgba(var(--tone-rgb), .5); }
.tcg-card[data-style="gallery"] .tcg-card-name { font-family: inherit; font-weight: 600; font-size: clamp(12px, 1.3vw, 18px); letter-spacing: -.5px; }
.tcg-card[data-style="gallery"] .tcg-card-front::before { display: none; }
.tcg-card[data-style="gallery"] .tcg-card-art { border: 0; background-color: #101219; }
.tcg-card[data-style="gallery"] .tcg-card-art::before { border-radius: 50%; }
.tcg-card[data-style="gallery"].tcg-full-art .tcg-card-art { inset: 0; }
.tcg-card[data-style="arcade"] .tcg-card-front { border-radius: 4px; border: 3px solid var(--tone); padding: 6px; background: repeating-linear-gradient(135deg, #ffffff06 0 4px, transparent 4px 10px), var(--deep); }
.tcg-card[data-style="arcade"] .tcg-card-name { font-family: inherit; font-size: clamp(12px, 1.4vw, 19px); font-weight: 800; text-transform: uppercase; font-style: italic; }
.tcg-card[data-style="arcade"] .tcg-card-art { border-radius: 0; }
.tcg-card[data-style="arcade"] .tcg-card-art::before { border-width: 5px; }
.tcg-card[data-style="arcade"] .tcg-card-bottom { border-top-width: 2px; }
.tcg-card-meta { display: flex; justify-content: space-between; align-items: center; gap: 6px; padding: 13px 2px 0; color: #85858c; font-size: 9px; letter-spacing: 1px; text-transform: uppercase; }
.tcg-card-meta a { display: grid; place-items: center; width: 25px; height: 25px; color: #d8c29b; border: 1px solid #ffffff20; border-radius: 50%; font-size: 14px; }
.tcg-pack-actions { min-height: 67px; display: flex; align-items: center; justify-content: space-between; gap: 20px; max-width: 820px; margin: 0 auto; }
.tcg-pack-actions > p { color: #ada99f; font-size: 11px; }
.tcg-pack-actions > div { display: flex; gap: 10px; }
.tcg-button { border: 1px solid #ffffff28; border-radius: 5px; background: #ffffff05; color: #d8d3c9; padding: 11px 16px; font-size: 11px !important; font-weight: 600 !important; line-height: 1.4; cursor: pointer; }
.tcg-button:hover { border-color: #bb9b61; background: #d7a84e12; }
.tcg-button-primary { color: #171510; background: #d7b274; border-color: #d7b274; }
.tcg-button-primary:hover { color: #fff; }
.tcg-button > span { margin-left: 16px; }
.tcg-odds-strip { display: flex; justify-content: center; flex-wrap: wrap; gap: 24px; padding: 24px 0; margin-top: 12px; border-top: 1px solid #ffffff12; }
.tcg-odds-strip > span { color: #99979c; font-size: 9px; }
.tcg-odds-strip b { color: #e3e0d8; font-weight: 400; margin-left: 9px; }
.tcg-dot { display: inline-block; width: 5px; height: 5px; margin-right: 7px; transform: rotate(45deg); background: #b8c9d6; }
.tcg-dot[data-tier="gold"] { background: #e8be69; }
.tcg-dot[data-tier="prismatic"] { background: linear-gradient(45deg, #a9ebe9, #daaeff); }
.tcg-dot[data-tier="secret"] { background: #efa282; }
.tcg-settings { max-width: 820px; margin: 0 auto 28px; padding: 14px 0; border-top: 1px solid #ffffff0e; color: #b0aaa0; font-size: 11px; }
.tcg-settings summary { cursor: pointer; }
.tcg-settings summary span { float: right; color: #707177; font-size: 10px; }
.tcg-fields { display: flex; gap: 12px; padding: 20px 0 12px; }
.tcg label { display: flex; flex-direction: column; gap: 9px; color: #bdb7aa; font-size: 11px; }
.tcg input[type="number"], .tcg select { min-width: 0; width: 100%; border: 1px solid #ffffff24; border-radius: 4px; background: #17191e; color: #e2ddd5; padding: 10px; }
.tcg-settings p { font-size: 10px; color: #8d8b87; line-height: 1.7; margin: 8px 0 16px; }
.tcg-footer { display: flex; justify-content: space-between; gap: 12px; padding: 21px 0; border-top: 1px solid #ffffff10; font-size: 8px; letter-spacing: 1.5px; color: #6f7076; }
.tcg-error { color: #ffb8ad; border: 1px solid #ba7669; padding: 14px; margin: 20px 0; font-size: 12px; }
.tcg-lab-toolbar { display: flex; justify-content: space-between; align-items: end; gap: 25px; margin: 34px 0 10px; }
.tcg-lab-toolbar label { width: 220px; }
.tcg-lab-toolbar p, .tcg-materials p:not(.tcg-eyebrow) { color: #8f8d88; font-size: 11px; line-height: 1.8; }
.tcg-style-row { display: grid; grid-template-columns: 190px 1fr; gap: 28px; padding: 34px 0; border-bottom: 1px solid #ffffff12; }
.tcg-style-intro { padding-top: 16px; }
.tcg-style-intro h2, .tcg-materials h2 { font-family: Georgia, serif; font-weight: 400; font-size: 25px; margin: 10px 0 12px; }
.tcg-style-intro p:not(.tcg-eyebrow) { font-size: 11px; color: #95918b; line-height: 1.8; }
.tcg-style-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.tcg-materials { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; padding: 45px 0; }
#tcg-back-options, #tcg-pack-options { display: flex; gap: 22px; align-items: start; margin-top: 28px; }
.tcg-material-option { flex: 1; min-width: 0; max-width: 170px; text-align: center; }
.tcg-material-option > .tcg-button { margin-top: 18px; width: 100%; font-size: 9px !important; padding: 10px 5px; }
.tcg-material-option .tcg-pack { width: 100%; height: auto; aspect-ratio: 222 / 322; animation: none; transform: none; pointer-events: none; }
.tcg-material-option .tcg-pack-content { padding: 15px 8px; }
.tcg-material-option .tcg-pack .tcg-seal { width: 48px; height: 48px; font-size: 30px; margin: 12px 0 17px; }
.tcg-material-option .tcg-pack-edition { font-size: 5px; letter-spacing: 1px; }
.tcg-material-option .tcg-pack-brand { font-size: 10px; letter-spacing: 3px; }
.tcg-material-option .tcg-pack-brand strong { font-size: 15px; }
.tcg-material-option .tcg-pack-caption { font-size: 5px; letter-spacing: 1px; }
.tcg-material-option .tcg-pack-rule { margin: 9px 0; }
.tcg-material-option .tcg-pack-bottom { font-size: 5px; letter-spacing: 1px; }
.tcg-viewer-layout { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(240px, .7fr); gap: 80px; max-width: 1000px; margin: 25px auto 45px; }
.tcg-inspection-stage { position: relative; display: grid; justify-items: center; align-content: center; min-height: 600px; isolation: isolate; perspective: 1600px; }
.tcg-inspection-stage .tcg-orbit { align-self: center; }
#tcg-inspected-card { width: min(320px, 85%); perspective: 1400px; }
#tcg-inspected-card .tcg-card { touch-action: manipulation; cursor: grab; }
/* Holding a card turns it: no iOS callout or text selection on long presses. */
@media (pointer: coarse) { .tcg-card { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; } }
#tcg-inspected-card .tcg-card:active { cursor: grabbing; }
#tcg-inspected-card .tcg-card-name { font-size: 28px; }
#tcg-inspected-card .tcg-card-topline { font-size: 10px; padding-top: 9px; }
#tcg-inspected-card .tcg-card-info { padding: 20px 14px 14px; }
#tcg-inspected-card .tcg-card-subtitle { font-size: 11px; }
#tcg-inspected-card .tcg-card-bottom { font-size: 9px; padding-top: 14px; }
.tcg-inspection-stage > p { font-size: 10px; color: #807e7c; margin-top: 35px; }
.tcg-viewer-controls { display: flex; flex-direction: column; justify-content: center; gap: 20px; }
.tcg-viewer-controls h2 { font-family: Georgia, serif; font-size: 34px; font-weight: 400; line-height: 1.1; }
.tcg-viewer-controls .tcg-check { flex-direction: row; align-items: center; gap: 10px; }
.tcg input[type="checkbox"], .tcg input[type="range"] { accent-color: #d7a84e; }
.tcg input[type="range"] { width: 100%; }
.tcg-viewer-buttons { display: flex; gap: 10px; }
.tcg-viewer-controls > p:not(.tcg-eyebrow) { font-size: 11px; line-height: 1.8; color: #aaa399; }
.tcg-viewer-controls > .tcg-viewer-note { border-top: 1px solid #ffffff18; padding-top: 16px; color: #777780 !important; font-size: 10px !important; }
@keyframes tcg-float { 0%, 100% { transform: translateY(0) rotate(-5deg); } 50% { transform: translateY(-9px) rotate(-3deg); } }
@keyframes tcg-tear { to { transform: translate(70px, -130px) rotate(35deg); opacity: 0; } }
@keyframes tcg-wrapper-out { to { transform: translateY(90px) scale(.8); opacity: 0; } }
@keyframes tcg-deal { from { opacity: 0; transform: translate(calc((2 - var(--slot)) * 90px), 65px) rotate(calc((var(--slot) - 2) * 10deg)) scale(.65); } to { opacity: 1; transform: none; } }
@keyframes tcg-spark { 0%, 100% { opacity: 0; transform: translateY(6px) scale(.4); } 40% { opacity: .9; transform: translateY(-5px) scale(1); } 75% { opacity: 0; transform: translateY(-13px) scale(.3); } }
@keyframes tcg-reveal-glow { 45% { filter: drop-shadow(0 0 25px rgba(var(--tone-rgb), .7)); } }
@media (max-width: 1050px) {
    .tcg-shell { padding: 0 24px; }
    .tcg-hand { gap: 12px; }
    .tcg-style-row { grid-template-columns: 1fr; gap: 20px; }
    .tcg-style-intro { max-width: 550px; }
    .tcg-style-cards { gap: 18px; }
    .tcg-viewer-layout { gap: 35px; }
    .tcg-card-name { font-size: 16px; }
    .tcg-card-subtitle { font-size: 8px; }
    .tcg-card-topline, .tcg-card-bottom { font-size: 7px; letter-spacing: .8px; }
}
@media (max-width: 760px) {
    .tcg { width: calc(100% - 16px); height: calc(100% - 16px); border-radius: 10px; }
    .tcg-shell { padding: 0 16px; }
    .tcg-nav { flex-wrap: wrap; gap: 0; padding-top: 16px; }
    .tcg-wordmark { flex: 1; }
    .tcg-close { order: 1; }
    .tcg-tabs { order: 2; width: 100%; justify-content: center; gap: 30px; height: 52px; }
    .tcg-tabs a { font-size: 11px; }
    .tcg-heading { padding-top: 28px; }
    .tcg-heading h1 { letter-spacing: -1px; }
    .tcg-stage { min-height: 430px; padding-top: 30px; }
    .tcg-stage[data-phase="dealt"] { min-height: 0; }
    .tcg-hand { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 14px; max-width: 460px; }
    .tcg-hand .tcg-card-slot:last-child { grid-column: 1 / -1; width: calc(50% - 7px); justify-self: center; }
    .tcg-card-name, .tcg-card[data-style="gallery"] .tcg-card-name, .tcg-card[data-style="arcade"] .tcg-card-name { font-size: 16px; }
    .tcg-card-info { padding: 10px 5px 4px; }
    .tcg-card-topline { font-size: 7px; min-height: 23px; }
    .tcg-card-subtitle { font-size: 8px; margin-top: 5px; }
    .tcg-card-bottom { font-size: 6px; padding-top: 6px; margin-top: 5px; }
    .tcg-pack-actions { flex-direction: column; padding: 15px 0; gap: 14px; }
    .tcg-odds-strip { gap: 14px; padding: 20px 0; }
    .tcg-settings summary span { float: none; display: block; padding: 8px 0; }
    .tcg-fields { flex-wrap: wrap; }
    .tcg-fields label { width: calc(33.33% - 8px); }
    .tcg-footer { font-size: 6px; letter-spacing: 1px; }
    .tcg-lab-toolbar { align-items: start; flex-direction: column; gap: 15px; }
    .tcg-style-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 25px 16px; }
    .tcg-materials { grid-template-columns: 1fr; gap: 40px; }
    #tcg-pack-options { gap: 10px; }
    .tcg-material-option .tcg-pack .tcg-seal { width: 35px; height: 35px; font-size: 22px; margin: 9px 0 11px; }
    .tcg-material-option .tcg-pack-content { padding: 10px 6px; }
    .tcg-material-option .tcg-pack-edition, .tcg-material-option .tcg-pack-caption { font-size: 4px; }
    .tcg-material-option .tcg-pack-brand { font-size: 8px; letter-spacing: 2px; }
    .tcg-material-option .tcg-pack-brand strong { font-size: 11px; }
    .tcg-material-option .tcg-pack-tear > span { font-size: 4px; letter-spacing: 1px; }
    .tcg-viewer-layout { grid-template-columns: 1fr; gap: 15px; margin-top: 15px; }
    .tcg-inspection-stage { min-height: 510px; }
    #tcg-inspected-card { width: min(285px, 80%); }
    .tcg-inspection-stage > p { font-size: 8px; }
    .tcg-viewer-controls { padding: 0 10px 20px; }
}
@media (prefers-reduced-motion: reduce) {
    .tcg *, .tcg *::before, .tcg *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* The pack is part of the page: no framed panel or lab navigation. */
.tcg-experience { position: fixed; inset: 0; z-index: 2147483000; width: 100%; height: 100%; margin: 0; border: 0; border-radius: 0; background: #030405c7; box-shadow: none; overflow: auto; }
.tcg-experience .tcg-shell { display: flex; flex-direction: column; min-height: 100%; width: 100%; padding: 16px 24px; }
/* Card glows (the enlarged card's back aura is ~190% of its width) must not widen the page into a sideways scroll. */
.tcg-experience .tcg-shell { overflow-x: clip; }
.tcg-experience .tcg-close { position: fixed; right: 20px; top: 14px; z-index: 5; }
/* Corner controls on every TCG surface (hub, pack opening, roll): one look.
   All are SVG icons centred in a 44px box, so they share one centre line regardless
   of fonts. The X matches the old Beaufort × (24px across, ~3px strokes); the back
   arrow and sound icon are sized and weighted to it. */
:is(.tcg-experience .tcg-close, .tcg-surface .tcg-surface-close, .tcg-rewards .reward-close) { display: grid; place-items: center; box-sizing: border-box; padding: 0; line-height: 0; }
:is(.tcg-experience .tcg-close, .tcg-surface .tcg-surface-close, .tcg-rewards .reward-close) svg { width: 41px; height: 41px; stroke-width: 1.75; }
:is(.tcg-surface .tcg-surface-back, .tcg .tcg-hub-back, .tcg-rewards .reward-back) { width: 44px; height: 44px; }
:is(.tcg-surface .tcg-surface-back, .tcg .tcg-hub-back, .tcg-rewards .reward-back) svg { width: 44px; height: 44px; stroke-width: 1.7; }
.tcg-sound-button { position: fixed; top: 14px; right: 70px; z-index: 5; display: grid; place-items: center; box-sizing: border-box; width: 44px; height: 44px; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: var(--text-color); cursor: pointer; }
.tcg-sound-button:hover { color: var(--secondary-color); }
.tcg-sound-button:focus-visible { outline: 2px solid var(--secondary-color); outline-offset: 4px; }
.tcg-sound-button svg { width: 30px; height: 30px; stroke-width: 2.4; }
@media (max-width: 700px) {
    .tcg-sound-button { right: 62px; top: 12px; }
    :is(.tcg-surface .tcg-surface-back, .tcg .tcg-hub-back, .tcg-rewards .reward-back) { left: 10px; top: 12px; }
}
.tcg.tcg-experience .tcg-hub-back { position:fixed;left:14px;top:14px;padding:0;width:44px;height:44px;border:0;background:none;display:grid;place-items:center;color:var(--text-color);transition:transform .2s ease;z-index:5; }
.tcg.tcg-experience .tcg-hub-back[hidden] { display:none; }
.tcg.tcg-experience .tcg-hub-back:hover { transform:translateX(-2px);color:var(--secondary-color); }
@media (max-width: 700px) { .tcg.tcg-experience .tcg-hub-back { left: 10px; top: 12px; } }
.tcg-experience .tcg-heading { padding: 0; }
.tcg-experience .tcg-heading h1 { font-family: BeauMed, sans-serif; font-size: clamp(24px, 3vw, 34px); font-weight: 400; letter-spacing: 1px; color: var(--primary-color); margin: 6px 44px 10px; text-transform: uppercase; }
.tcg-experience .tcg-heading-action { font: inherit; color: inherit; text-transform: inherit; letter-spacing: inherit; background: none; border: 0; padding: 0 0 4px; border-bottom: 1px solid transparent; }
.tcg-experience .tcg-heading-action:hover { border-bottom-color: var(--primary-color); }
.tcg-experience .tcg-stage { flex: 1; min-height: 0; padding: 16px 0; }
.tcg-experience .tcg-pack-wrap { padding: 50px 0; }
.tcg-experience .tcg-hand { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 26px 36px; max-width: 760px; margin: auto; }
.tcg-experience .tcg-hand .tcg-card-slot { grid-column: span 2; width: 100%; }
.tcg-experience .tcg-hand .tcg-card-slot:nth-child(4) { grid-column: 2 / span 2; }
.tcg-experience .tcg-hand .tcg-card-slot:nth-child(5) { grid-column: 4 / span 2; }
.tcg-experience .tcg-card-meta { visibility: hidden; height: 0; padding: 0; overflow: hidden; }
.tcg-experience .tcg-pack-actions { width: 100%; min-height: 45px; padding: 0; flex-direction: column; gap: 6px; }
.tcg-experience .tcg-pack-actions > p:empty { display: none; }
.tcg-experience .tcg-pack-actions .tcg-button { padding: 8px 15px; }
:is(.tcg-experience,.tcg-rewards) .tcg-pack-actions a,.tcg-experience .tcg-pack-actions .tcg-button { font-family: BeauMed, sans-serif; font-size: 18px !important; font-weight: 400 !important; letter-spacing: .5px; color: var(--primary-color); background: none; border: 1px solid transparent; border-radius: 0; box-shadow: none; text-transform: none; }
:is(.tcg-experience,.tcg-rewards) .tcg-pack-actions a:hover,.tcg-experience .tcg-pack-actions .tcg-button:hover { border-color: var(--primary-color); color: var(--primary-color); background: var(--semi-transparent-bg); }
:is(.tcg-experience,.tcg-rewards) .tcg-pack-actions a { color: var(--primary-color); text-decoration: none; padding: 8px 4px; }
:is(.tcg-experience,.tcg-rewards) .tcg-pack-actions a:hover { color: var(--text-color); }
.tcg-experience .tcg-reveal-slot {display:grid;flex:none;justify-items:center;}
/* Keep the final hand layout even before Reveal all appears and between actions.
   The inert spacer shares the buttons' geometry without exposing a hidden button. */
.tcg-experience .tcg-reveal-slot::before {content:"\00a0";visibility:hidden;}
.tcg-experience .tcg-reveal-slot > .tcg-reveal-action,
.tcg-experience .tcg-reveal-slot::before {grid-area:1/1;margin:18px auto 24px;padding:14px 32px;border:1px solid transparent;font:400 22px/1.4 BeauMed,sans-serif;}
.tcg-experience #tcg-new-pack,
.tcg-experience #tcg-continue,
.tcg-experience #tcg-reveal-all {display:block;flex:none;align-self:center;min-width:220px;margin:18px auto 24px;padding:14px 32px;font:400 22px/1.4 BeauMed,sans-serif;letter-spacing:.5px;text-transform:none;color:var(--primary-color);background:#171719c9;border:1px solid #ffffff28;border-radius:0;box-shadow:inset 0 1px 0 #ffffff08;cursor:pointer;transition:background .18s,border-color .18s;}
.tcg-experience #tcg-new-pack[hidden],
.tcg-experience #tcg-continue[hidden],
.tcg-experience #tcg-reveal-all[hidden] {display:none;}
.tcg-experience #tcg-new-pack:is(:hover,:focus-visible),
.tcg-experience #tcg-continue:is(:hover,:focus-visible),
.tcg-experience #tcg-reveal-all:is(:hover,:focus-visible) {background:#222224;border-color:var(--primary-color);}
.tcg-experience #tcg-new-pack:focus-visible,
.tcg-experience #tcg-continue:focus-visible,
.tcg-experience #tcg-reveal-all:focus-visible {outline:2px solid var(--primary-color);outline-offset:4px;}
.tcg-experience .tcg-card-name { font-size: clamp(14px, 1.5vw, 20px); }
.tcg-experience .tcg-error { position: relative; margin: 10px auto; }
.tcg-button-primary { background: #a64b44; border-color: #c76359; color: white; }
.tcg-heading h1, .tcg-style-intro h2, .tcg-lab-section h2, .tcg-viewer-controls h2 { font-family: BeauMed, Georgia, serif; }
.tcg-heading > p:last-child { max-width: 520px; margin-left: auto; margin-right: auto; }
.tcg-brand-image, .tcg-pack-logo { display: block; width: 100%; height: auto; object-fit: contain; }
.tcg-pack { width: 245px; height: 350px; color: #d7a84e; }
.tcg-pack-content { justify-content: center; gap: 24px; background: repeating-linear-gradient(125deg, #ffffff03 0 1px, transparent 1px 7px), linear-gradient(110deg, #171719, #303030 45%, #171719 65%); border-color: #9a664b; padding: 30px 20px 20px; }
.tcg-pack-content::before { border-color: #a64b4470; border-width: 1px 4px; }
.tcg-pack-content .tcg-brand-image, .tcg-pack-logo { position: relative; width: 100%; }
.tcg-pack-emblem { position: relative; display: grid; place-items: center; width: 105px; height: 105px; border: 1px solid #a64b4480; border-radius: 50%; box-shadow: 0 0 0 8px #a64b440d, 0 0 0 9px #d7a84e25; }
.tcg-pack-emblem img { width: 80px; height: 80px; object-fit: contain; }
.tcg-pack-caption { position: relative; font-family: HeyComic, sans-serif; color: #c96d60; font-size: 13px; letter-spacing: 1px; }
.tcg-pack-bottom { margin-top: 0; position: absolute; bottom: 20px; left: 20px; right: 20px; width: auto; font-size: 8px; }
.tcg-pack-tear { border-color: #9b7852; color: #ead8b0; }
.tcg-pack-hint { transition: opacity .2s; }
.is-ready .tcg-pack-hint { opacity: 0; }
.is-ready:hover .tcg-pack-hint, .is-ready:focus-within .tcg-pack-hint { opacity: 1; }
.tcg-stage[data-phase="opening"] .tcg-pack { animation: tcg-pack-charge .55s ease-in forwards; }
@keyframes tcg-pack-charge { 0% { transform: rotate(-5deg); } 30% { transform: rotate(3deg) scale(1.03); } 70% { transform: rotate(-3deg) scale(1.06); } 100% { transform: rotate(0deg) scale(1.08); } }
.tcg-burst { position: absolute; left: 50%; top: 45%; width: 1px; height: 1px; pointer-events: none; }
.tcg-burst i { position: absolute; width: 3px; height: 12px; background: #d7a84e; opacity: 0; transform: rotate(calc(var(--burst) * 22.5deg)); }
.tcg-burst i:nth-child(3n) { background: #a64b44; height: 7px; width: 5px; }
.tcg-stage[data-phase="opening"] .tcg-burst i { animation: tcg-seal-sparks .7s .52s ease-out both; }
@keyframes tcg-seal-sparks { 10% { opacity: .9; } to { opacity: 0; transform: rotate(calc(var(--burst) * 22.5deg)) translateY(calc(-100px - var(--burst) * 6px)) scale(.2); } }

/* Sharp, native-sized icons sit in their own mount; full portraits keep the frame. */
.tcg-card-art { margin: 2px; border: 1px solid rgba(var(--tone-rgb), .2); background: #15171c; }
.tcg-card-art::before { width: 76%; border-width: 1px; border-radius: 8px; transform: none; aspect-ratio: 1; box-shadow: 0 0 0 7px rgba(var(--tone-rgb), .025); }
.tcg-card[data-kind="augment"] .tcg-card-art img { box-shadow: none; background: transparent; }
.tcg-card[data-kind="augment"] .tcg-card-art::before { transform: rotate(45deg); width: 61%; border-radius: 4px; }
.tcg-full-art .tcg-card-art img { box-shadow: none; border-radius: 0; }
.tcg-card[data-tier="silver"] .tcg-card-front { border-color: #7f8994; }
.tcg-card[data-tier="silver"] .tcg-card-front::before { border-color: #b8c9d620; }
.tcg-card[data-tier="silver"]:hover { filter: none; }
.tcg-card[data-tier="gold"]:hover, .tcg-card[data-tier="prismatic"]:hover, .tcg-card[data-tier="secret"]:hover { filter: drop-shadow(0 0 4px rgba(var(--tone-rgb), .18)); }
.tcg-card-sparks i { width: 2px; height: 2px; background: #ffda57; box-shadow: 0 0 3px #ffca4f; border-radius: 0; }
.tcg-card-sparks i:nth-child(4n) { width: 5px; height: 5px; background: #ffedac; clip-path: polygon(50% 0, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0 50%, 40% 40%); }
.tcg-card.is-revealed:is(.is-foil, [data-tier="secret"]) .tcg-card-sparks i { animation: tcg-foil-glint 3.2s calc(var(--spark) * -.31s) infinite; }
@keyframes tcg-foil-glint { 0%, 100% { opacity: .08; transform: scale(.4); } 45% { opacity: 1; transform: scale(1.2); } 65% { opacity: .15; transform: scale(.6); } }
.tcg-aura { --particle: #bdced9; position: absolute; inset: -12px -8px 0; pointer-events: none; opacity: 0; transition: opacity .2s; }
.tcg-aura[data-tier="gold"] { --particle: #e5b544; }
.tcg-aura[data-tier="prismatic"] { --particle: #a8e7ef; }
.tcg-aura[data-tier="secret"] { --particle: #f38b5e; }
.tcg-card-slot:hover .tcg-aura, .tcg-card-slot:focus-within .tcg-aura { opacity: 1; }
.tcg-aura[data-tier="secret"] { opacity: .8; }
.tcg-aura i { position: absolute; left: var(--mx); top: var(--my); width: 3px; height: 3px; border: 1px solid var(--particle); opacity: 0; }
.tcg-card-slot:hover .tcg-aura i, .tcg-card-slot:focus-within .tcg-aura i, .tcg-aura[data-tier="secret"] i { animation: tcg-edge-mote 2.3s calc(var(--mote) * -.19s) infinite; }
.tcg-aura[data-tier="silver"] i:nth-child(n+5) { display: none; }
.tcg-aura[data-tier="prismatic"] i:nth-child(3n) { border-color: #c7a6ed; width: 5px; height: 5px; }
.tcg-aura[data-tier="secret"] i { border-width: 0; background: #f8b258; width: 2px; height: 7px; }
.tcg-aura[data-tier="gold"] i:nth-child(3n) { background: #ecc562; }
@keyframes tcg-edge-mote { 0% { opacity: 0; transform: translateY(8px) rotate(0); } 30% { opacity: .9; } 100% { opacity: 0; transform: translateY(-23px) rotate(110deg); } }

/* Branded backs: shared artwork, deliberately different compositions. */
.tcg-card-back { gap: 0; border-color: #805d40; color: #d7a84e; background: #202124; box-shadow: inset 0 0 0 5px #111, inset 0 0 0 6px #a64b4480; }
.tcg-card-back::before { inset: 14px; border-radius: 3px; border-color: #a64b4460; }
.tcg-card-back::after { inset: 22px; border-radius: 2px; border-color: #d7a84e24; }
.tcg-back-pattern { position: absolute; inset: 7px; background: repeating-linear-gradient(45deg, #d7a84e08 0 1px, transparent 1px 16px), repeating-linear-gradient(-45deg, #a64b440c 0 1px, transparent 1px 16px); }
.tcg-card-back .tcg-brand-image { position: absolute; left: 10%; top: 47%; width: 80%; z-index: 3; }
.tcg-back-emblem { display: none; position: absolute; left: 25%; top: 31%; width: 50%; aspect-ratio: 1; z-index: 2; }
.tcg-back-emblem img { width: min(100%, 88px); height: auto; display: block; margin: auto; }
.tcg-back-code { position: absolute; bottom: 29px; font-family: BeauMed, Georgia, serif; font-size: 10px; letter-spacing: 3px; z-index: 2; }
.tcg-back-orbit { position: absolute; left: -10%; top: 39%; width: 120%; height: 23%; background: #8e393126; transform: rotate(-20deg); border-top: 1px solid #a64b4460; border-bottom: 1px solid #a64b4460; }
.tcg-card[data-back="gilded"] .tcg-card-back { background: #331b19; color: #dfb56b; box-shadow: inset 0 0 0 5px #1b1412, inset 0 0 0 8px #8a6740; }
.tcg-card[data-back="gilded"] .tcg-card-back::before { inset: 17px; border: 2px solid #b2925760; border-radius: 45% 45% 10px 10px; }
.tcg-card[data-back="gilded"] .tcg-back-emblem { display: grid; place-items: center; border: 1px solid #d7a84e; border-radius: 50%; top: 27%; box-shadow: 0 0 0 7px #d7a84e20, 0 0 0 9px #d7a84e50; }
.tcg-card[data-back="gilded"] .tcg-brand-image { top: 68%; width: 68%; left: 16%; }
.tcg-card[data-back="gilded"] .tcg-back-orbit { left: 34%; top: 6%; width: 32%; height: 85%; transform: none; border: 1px solid #d7a84e30; background: #d7a84e06; }
.tcg-card[data-back="banner"] .tcg-card-back { background: #18181a; border: 2px solid #a64b44; border-radius: 4px; }
.tcg-card[data-back="banner"] .tcg-back-pattern { background: repeating-linear-gradient(130deg, transparent 0 25px, #ffffff08 25px 32px); }
.tcg-card[data-back="banner"] .tcg-back-orbit { top: 15%; left: 19%; width: 65%; height: 70%; transform: rotate(15deg); background: #863c36; border: 3px solid #b66451; clip-path: polygon(0 0, 100% 0, 100% 100%, 51% 88%, 0 100%); }
.tcg-card[data-back="banner"] .tcg-brand-image { top: 44%; transform: rotate(-12deg); width: 91%; left: 4.5%; padding: 9px 4px; background: #151515; }
.tcg-card[data-back="banner"] .tcg-card-back::before, .tcg-card[data-back="banner"] .tcg-card-back::after { border: 0; }
.tcg-card[data-back="runes"] .tcg-card-back { background: #112124; border-color: #92b1a8; }
.tcg-card[data-back="runes"] .tcg-back-pattern { background: repeating-linear-gradient(0deg, transparent 0 31px, #94b1a716 31px 32px), repeating-linear-gradient(90deg, transparent 0 31px, #94b1a716 31px 32px); }
.tcg-card[data-back="runes"] .tcg-back-orbit { width: 58%; height: auto; aspect-ratio: 1; left: 21%; top: 25%; transform: rotate(45deg); border: 2px solid #d7a84e80; background: #121b1d; box-shadow: 0 0 0 10px #759c9810, 0 0 0 11px #759c9850; }
.tcg-card[data-back="runes"] .tcg-back-emblem { display: grid; place-items: center; top: 28%; }
.tcg-card[data-back="runes"] .tcg-brand-image { top: 72%; width: 70%; left: 15%; }
.tcg-card[data-back="constellation"] .tcg-card-back { background: #101722; border-color: #837c98; }
.tcg-card[data-back="constellation"] .tcg-back-pattern { background: radial-gradient(circle, #d7a84e80 0 1px, transparent 1.6px) 3px 7px / 31px 41px, radial-gradient(circle, #ae95c480 0 1px, transparent 1.5px) 17px 19px / 47px 67px; }
.tcg-card[data-back="constellation"] .tcg-back-orbit { left: 8%; top: 14%; width: 84%; height: 72%; border-radius: 50%; transform: rotate(30deg); background: transparent; border: 1px solid #d7a84e50; }
.tcg-card[data-back="constellation"] .tcg-back-orbit::after { content: ''; position: absolute; inset: 15px -10px; border: 1px solid #b191cb60; border-radius: 50%; transform: rotate(70deg); }
.tcg-card[data-back="constellation"] .tcg-brand-image { padding: 10px 0; background: #101722; top: 44%; }

/* Additional front treatments and rarity systems are selectable in the lab. */
.tcg-card-gem > span { display: none; }
[data-rarity="diamonds"] .tcg-rarity-diamonds { display: inline; }
[data-rarity="bars"] .tcg-rarity-bars { display: flex; gap: 3px; }
.tcg-rarity-bars i { width: 4px; height: 13px; transform: skew(-20deg); background: currentColor; }
[data-rarity="seal"] .tcg-rarity-seal { display: grid; place-items: center; width: 23px; height: 23px; border: 1px solid currentColor; border-radius: 50%; font-family: BeauMed, serif; font-size: 12px; letter-spacing: 0; }
[data-rarity="star"] .tcg-rarity-star { display: inline; font-size: 24px; line-height: 1; letter-spacing: 0; }
.tcg-card[data-style="arcade"] .tcg-card-name { font-family: HeyComic, sans-serif; font-weight: 400; font-style: normal; color: var(--tone); }
.tcg-card[data-style="runic"] .tcg-card-front { border-radius: 0; border: 1px solid #88a29e; background: #112023; box-shadow: inset 0 0 0 5px #122c2f, inset 0 0 0 6px #77958e60; }
.tcg-card[data-style="runic"] .tcg-card-art { background: repeating-linear-gradient(0deg, transparent 0 19px, #a4c4ae0a 19px 20px), #101d20; border-radius: 0; border: 0; }
.tcg-card[data-style="runic"] .tcg-card-name { font-family: BeauMed, Georgia, serif; color: #d5dcc9; }
.tcg-card[data-style="runic"] .tcg-card-topline { font-family: monospace; }
.tcg-card[data-style="runic"] .tcg-card-art::before { border: 1px dashed #91bab470; box-shadow: none; }
.tcg-card[data-style="archive"] .tcg-card-front { color: #2e2720; background: #d8c8a9; border: 1px solid #ad9672; border-radius: 3px; box-shadow: inset 0 0 0 5px #eadabe; }
.tcg-card[data-style="archive"] .tcg-card-art { background: #bdae92; border: 1px solid #5c4d3660; border-radius: 0; }
.tcg-card[data-style="archive"] .tcg-card-topline, .tcg-card[data-style="archive"] .tcg-card-bottom { color: #713b31; border-color: #57473555; }
.tcg-card[data-style="archive"] .tcg-card-subtitle { color: #65594b; }
.tcg-card[data-style="archive"] .tcg-card-gem { color: #91453b; }
.tcg-card[data-style="archive"] .tcg-card-front::before { border-color: #58412d40; }
.tcg-card[data-style="archive"].tcg-full-art .tcg-card-art { inset: 33px 12px 115px; }
.tcg-card[data-style="archive"].tcg-full-art .tcg-card-art::after { background: none; }
.tcg-card[data-style="cinematic"] .tcg-card-front { border: 0; padding: 8px; background: #111; border-radius: 16px; box-shadow: none; }
.tcg-card[data-style="cinematic"] .tcg-card-front::before { display: none; }
.tcg-card[data-style="cinematic"] .tcg-card-art { border: 0; background: #151416; }
.tcg-card[data-style="cinematic"].tcg-full-art .tcg-card-art { inset: 0; }
.tcg-card[data-style="cinematic"] .tcg-card-name { font-family: BeauMed, serif; font-size: 25px; }
.tcg-card[data-style="cinematic"] .tcg-card-topline { padding: 6px 8px; }
.tcg-card[data-style="cinematic"] .tcg-card-bottom { border: 0; }
.tcg-card[data-style="cinematic"] .tcg-card-art::before { border-radius: 50%; border: 1px solid #a64b4470; }
.tcg-style-cards { grid-template-columns: repeat(3, minmax(0, 240px)); justify-content: space-evenly; gap: 26px; }
.tcg-lab-section { padding: 38px 0; border-top: 1px solid #ffffff15; }
.tcg-lab-section h2 { font-size: 27px; font-weight: 400; margin: 8px 0 25px; }
#tcg-back-options { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 24px; }
.tcg-material-option { max-width: none; }
.tcg-material-option h3, .tcg-rarity-option h3 { font-family: BeauMed, serif; font-size: 22px; font-weight: 400; margin: 16px 0 8px; }
.tcg-material-option > p { color: #95918b; font-size: 10px; line-height: 1.6; min-height: 3.2em; }
.tcg-material-option .tcg-button { margin-top: 14px; }
#tcg-pack-options { max-width: 700px; gap: 40px; }
#tcg-pack-options .tcg-pack { aspect-ratio: 245 / 350; height: auto; width: 100%; animation: none; transform: none; pointer-events: none; }
#tcg-pack-options .tcg-pack-content { gap: 20px; padding: 20px 14px; }
#tcg-pack-options .tcg-pack-emblem { width: 70px; height: 70px; }
#tcg-pack-options .tcg-pack-emblem img { width: 58px; height: 58px; }
#tcg-pack-options .tcg-pack-caption { font-size: 10px; }
#tcg-rarity-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.tcg-rarity-option { border: 1px solid #ffffff16; padding: 10px 22px 22px; background: #1b1b1c; }
.tcg-rarity-samples { display: flex; justify-content: space-between; gap: 10px; margin: 25px 0; }
.tcg-rarity-samples > span { display: flex; flex-direction: column; align-items: center; gap: 8px; color: #bdc6d1; }
.tcg-rarity-samples > span[data-tier="gold"] { color: #d7a84e; }
.tcg-rarity-samples > span[data-tier="prismatic"] { color: #b5dbdf; }
.tcg-rarity-samples > span[data-tier="secret"] { color: #dd997b; }
.tcg-rarity-samples b { display: grid; place-items: center; height: 32px; font-family: BeauMed, serif; font-size: 18px; }
.tcg-rarity-samples small { font-size: 8px; text-transform: capitalize; }
.tcg-rarity-samples[data-rarity="seal"] b { width: 32px; border: 1px solid currentColor; border-radius: 50%; }
.tcg-rarity-samples[data-rarity="star"] b { font-size: 32px; }
@media (min-width: 761px) {
    /* Two rows of cards fit the height left after the heading and Reveal all (collection.css spaces the pile). */
    .tcg-experience .tcg-hand { max-width: min(880px, calc((100vh - 160px) * 1.025)); gap: 22px 36px; }
    .tcg-experience .tcg-card-info { padding-top: 10px; }
    .tcg-experience .tcg-card-subtitle { min-height: 1.6em; }
}
@media (max-width: 1050px) {
    #tcg-back-options { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .tcg-experience { width: 100%; height: 100%; border-radius: 0; }
    .tcg-experience .tcg-shell { padding: 18px 12px; }
    .tcg-experience .tcg-close { right: 12px; top: 12px; }
    .tcg-experience .tcg-heading h1 { font-size: 22px; }
    .tcg-experience .tcg-hand { max-width: 480px; gap: 24px 12px; }
    .tcg-experience .tcg-hand .tcg-card-slot:last-child { justify-self: auto; }
    .tcg-experience .tcg-card-name { font-size: 12px; }
    .tcg-experience .tcg-card-subtitle { display: none; }
    .tcg-experience .tcg-card-topline { font-size: 5px; letter-spacing: .2px; min-height: 17px; padding: 1px 1px 4px; }
    .tcg-experience .tcg-card-info { padding: 7px 2px 2px; }
    .tcg-experience .tcg-card-bottom { font-size: 5px; letter-spacing: 0; }
    .tcg-experience .tcg-card-gem { font-size: 8px; }
    .tcg-experience .tcg-card-art img { max-width: 70%; height: auto; aspect-ratio: 1; }
    .tcg-experience .tcg-full-art .tcg-card-art img { max-width: none; aspect-ratio: auto; height: 100%; }
    .tcg-experience .tcg-card-back { padding: 5px; }
    .tcg-experience .tcg-card-back::before { inset: 8px; }
    .tcg-experience .tcg-card-back::after { inset: 12px; }
    .tcg-experience .tcg-back-code { bottom: 17px; font-size: 7px; }
    .tcg-style-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 16px; }
    #tcg-back-options { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 16px; }
    #tcg-rarity-options { grid-template-columns: 1fr; }
    #tcg-pack-options { gap: 14px; }
    #tcg-pack-options .tcg-pack-emblem { width: 40px; height: 40px; }
    #tcg-pack-options .tcg-pack-emblem img { width: 35px; height: 35px; }
    #tcg-pack-options .tcg-pack-content { gap: 10px; padding: 13px 8px; }
    #tcg-pack-options .tcg-pack-caption { font-size: 5px; }
    #tcg-pack-options .tcg-pack-bottom { left: 9px; right: 9px; bottom: 15px; font-size: 5px; }
    .tcg-card[data-style="archive"].tcg-full-art .tcg-card-art { inset: 30px 10px 100px; }
    .tcg-wordmark > img { width: 185px; }
    .is-ready .tcg-pack-hint { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
    .tcg *, .tcg *::before, .tcg *::after { animation: none !important; transition: none !important; }
    .tcg-aura i { opacity: .4; }
}
.tcg-card-slot .tcg-card-sparks i, .tcg-card-slot .tcg-aura i { animation-play-state: paused !important; }
.tcg-card-slot.is-in-view .tcg-card-sparks i, .tcg-card-slot.is-in-view .tcg-aura i { animation-play-state: running !important; }

/* Explicit review picks, 2026-09-14. Component names are scoped to their original designs. */
.bp-stage{width:100%;height:440px;display:grid;place-items:center;overflow:hidden;color:#d7a84e}.bp-stage *,.bp-stage *:before,.bp-stage *:after{box-sizing:border-box}.bp-stage .bp-pack.tilt{position:relative;width:246px;height:350px;isolation:isolate;transform:none!important;translate:none!important;rotate:none!important;scale:none!important;animation:none!important;filter:drop-shadow(2px 2px 1px #000b) drop-shadow(11px 17px 12px #0009)}.bp-stage .bp-card{position:absolute;inset:24px 12px 18px;border:1px solid #b79a61;border-radius:7px;background:#101216;overflow:hidden}.bp-stage .bp-card img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 20%}.bp-stage .bp-card:after{content:'';position:absolute;inset:0;border:3px solid #15161a;border-radius:6px;background:linear-gradient(#0006,transparent 24%)}.bp-stage .bp-shell{position:absolute;inset:0;overflow:hidden;border:1px solid #625a4e;isolation:isolate;clip-path:polygon(0 0,164px 0,164px 23px,178px 26px,184px 25px,194px 31px,204px 32px,211px 36px,223px 37px,232px 42px,246px 45px,246px 350px,0 350px);background:radial-gradient(ellipse 88px 210px at 27% 36%,#41403b77,transparent 98%),linear-gradient(90deg,#0a0b0d,#636058 1%,#1d1e20 2.3%,#343431 4%,#121315 7%,#29292a 15%,#202123 43%,#121315 80%,#292929 92%,#3c3934 96%,#0b0c0e 99%);box-shadow:inset 0 1px #d5c8af50,inset 0 -1px #000,inset -4px 0 7px #0008}.bp-stage .bp-crimp{position:absolute;left:0;right:0;top:0;height:20px;background:linear-gradient(180deg,#e8d8b42b,#0004 16%,transparent 43%,#c1b59c14 56%,#0009 93%),repeating-linear-gradient(90deg,#131415 0 1px,#45423b 1px 2px,#877d69 2px 2.6px,#34332f 2.6px 4px,#101113 4px 5px);border-bottom:1px solid #08090a;box-shadow:0 1px #a0957c44,inset 0 1px #c1b29755}.bp-stage .bp-bottom{top:auto;bottom:0;transform:rotate(180deg)}.bp-stage .bp-instruction{position:absolute;left:18px;top:29px;color:#b8a789;font:7px Arial,sans-serif;letter-spacing:1.9px;text-shadow:0 1px #000}.bp-stage .bp-seams{position:absolute;inset:48px 8px 27px;border-left:1px solid #a64b4433;border-right:1px solid #a64b4422;box-shadow:-1px 0 #0005,1px 0 #0007}.bp-stage .bp-wrinkles{position:absolute;inset:21px 5px;overflow:hidden}.bp-stage .bp-wrinkles:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 104px 14px at 49% 0,#000c,transparent 95%),radial-gradient(ellipse 96px 15px at 53% 100%,#000c,transparent 96%)}.bp-stage .bp-wrinkles i{position:absolute;width:69px;height:19px;border-radius:50%;border-top:1px solid #c1b7a14a;box-shadow:0 -2px 2px #0008,inset 0 2px 2px #e4d8b70a;background:radial-gradient(ellipse at 50% 0,#0005,transparent 67%)}.bp-stage .bp-wrinkles i:nth-child(1){left:-18px;top:19px;transform:rotate(43deg)}.bp-stage .bp-wrinkles i:nth-child(2){left:13px;top:-7px;width:31px;height:62px;transform:rotate(-17deg);opacity:.6}.bp-stage .bp-wrinkles i:nth-child(3){right:-20px;top:36px;transform:rotate(-39deg);opacity:.5}.bp-stage .bp-wrinkles i:nth-child(4){left:-20px;bottom:25px;transform:rotate(-34deg);opacity:.8}.bp-stage .bp-wrinkles i:nth-child(5){right:-14px;bottom:15px;width:79px;transform:rotate(27deg);opacity:.7}.bp-stage .bp-wrinkles i:nth-child(6){right:19px;bottom:-14px;width:32px;height:58px;transform:rotate(16deg);opacity:.5}.bp-stage .bp-logo{position:absolute;left:19px;top:109px;width:206px;height:auto;display:block;filter:grayscale(1) brightness(.3) drop-shadow(-.65px -.8px 0 #050608) drop-shadow(.6px .9px 0 #afa58b72)}.bp-stage .bp-emblem{position:absolute;left:90px;top:183px;width:64px;height:64px;object-fit:contain;display:block;filter:grayscale(1) brightness(.36) drop-shadow(-.7px -.8px 0 #050608) drop-shadow(.65px 1px 0 #aca38c66)}.bp-stage .bp-footer{position:absolute;left:22px;right:22px;bottom:37px;display:flex;align-items:center;justify-content:space-between;font:9px monospace;letter-spacing:1px;color:#a69b85;text-shadow:0 1px #08090b}.bp-stage .bp-barcode{width:48px;height:18px;background:repeating-linear-gradient(90deg,#b5a48588 0 2px,transparent 2px 3px,#b5a48588 3px 4px,transparent 4px 7px,#b5a48588 7px 10px,transparent 10px 12px)}.bp-stage .bp-texture{position:absolute;inset:20px 0;pointer-events:none;background:repeating-linear-gradient(87deg,#ece2ce09 0 .6px,transparent .6px 3px),repeating-linear-gradient(0deg,#0003 0 .7px,transparent .7px 5px),radial-gradient(ellipse,#ffffff09 0 .5px,transparent .85px) 1px 0/3px 4px;opacity:.65}.bp-stage .bp-varnish{position:absolute;inset:20px 4px;pointer-events:none;background:radial-gradient(ellipse 19px 130px at 8% 32%,#d4c4a41b,transparent 100%),radial-gradient(ellipse 76px 165px at 34% 34%,#e8d9bc14,transparent 100%),linear-gradient(90deg,transparent 42%,#0002 76%,transparent 93%,#0005 97%);box-shadow:inset 1px 0 #ece1c827,inset -1px 0 #0009;border-radius:12px}.bp-stage .bp-varnish:after{content:'';position:absolute;left:11px;top:86px;width:215px;height:18px;border-radius:50%;transform:rotate(-3deg);background:radial-gradient(ellipse,#0002,transparent 73%);border-bottom:1px solid #bfb7a00a}.bp-stage .bp-tab,.bp-stage .bp-tab-shadow{position:absolute;right:0;top:0;width:82px;height:45px;clip-path:polygon(0 0,100% 0,100% 100%,68px 42px,59px 37px,47px 36px,40px 32px,30px 31px,20px 25px,14px 26px,0 23px);transform-origin:0 23px}.bp-stage .bp-tab{z-index:3;background:repeating-linear-gradient(87deg,#e6d9bd06 0 1px,transparent 1px 3px),linear-gradient(105deg,#292a29,#3b3934 39%,#161719 76%,#3d3932 95%,#141516);border-top:1px solid #877b65;border-right:1px solid #5c564a;transition:transform .75s cubic-bezier(.2,.75,.2,1)}.bp-stage .bp-tab-shadow{z-index:2;background:#000;opacity:0;transition:transform .75s,opacity .75s}.bp-stage .bp-notch{position:absolute;right:-1px;top:25px;width:5px;height:8px;background:#08090c;clip-path:polygon(100% 0,0 50%,100% 100%)}.bp-stage .bp-curl{position:absolute;right:-1px;top:18px;width:37px;height:29px;clip-path:polygon(100% 0,100% 100%,0 100%,41% 64%);background:linear-gradient(122deg,#101114 14%,#5d584d 36%,#c5b596 49%,#918168 57%,#393a38 76%,#121315 96%);opacity:0;transform:scaleX(.2) skewY(-9deg);transform-origin:100% 100%;transition:transform .75s,opacity .75s}.bp-stage .bp-curl:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,#ffffff0b 0 1px,transparent 1px 3px)}.bp-stage .bp-pack:hover .bp-tab{transform:translateY(-1px) rotate(-13deg)}.bp-stage .bp-pack:hover .bp-tab-shadow{transform:translate(3px,5px) rotate(-7deg);opacity:.8}.bp-stage .bp-pack:hover .bp-curl{transform:scaleX(1) skewY(-9deg);opacity:1}@media(prefers-reduced-motion:reduce){.bp-stage *{transition:none!important;animation:none!important}}
.as-satin-stage{width:100%;height:100%;display:grid;place-items:center;perspective:1100px}.as-satin-stage *,.as-satin-stage *::before,.as-satin-stage *::after{box-sizing:border-box}.as-satin-stage .as-satin-card{position:relative;isolation:isolate;width:266px;max-width:calc(100% - 48px);aspect-ratio:63/88;border:1px solid #76654f;border-right-color:#37322e;border-bottom-color:#292728;border-radius:14px;background:linear-gradient(135deg,#4a4338,#242328 29%,#131419 70%,#34312e);box-shadow:1px 3px 0 #08090c,2px 4px 0 #38332c,0 18px 27px #0009,inset 1px 1px 0 #c9b28624,inset -1px -1px 0 #000a;overflow:hidden}.as-satin-stage .as-satin-face{position:absolute;inset:8px;border:1px solid #8c674955;border-top-color:#08090d;border-left-color:#08090d;border-radius:7px;background:radial-gradient(ellipse at 18% 4%,#323132 0,transparent 57%),#191a20;box-shadow:0 -1px 0 #bfa77522,0 1px 0 #cabd9724,inset 2px 3px 5px #0006}.as-satin-stage .as-satin-face::before{content:'';position:absolute;inset:7px;border:1px solid #a64b445c;border-radius:3px;box-shadow:0 1px 0 #0007,inset 0 1px 0 #ffffff05}.as-satin-stage .as-satin-face::after{content:'';position:absolute;inset:14px;border:1px solid #d7a84e1c;border-radius:2px}.as-satin-stage .as-satin-ribbon{position:absolute;left:23px;right:23px;top:29%;height:41%;overflow:hidden}.as-satin-stage .as-satin-ribbon::before{content:'';position:absolute;width:140%;height:74px;left:-20%;top:35px;transform:rotate(-20deg);border-top:1px solid #a64b445c;border-bottom:1px solid #a64b4440;background:linear-gradient(180deg,#a64b4412,#a64b442c 47%,#a64b4411);box-shadow:0 1px 0 #0004,inset 0 1px 0 #e8997a06}.as-satin-stage .as-satin-emblem{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);display:block;width:88px;height:88px;object-fit:contain;filter:drop-shadow(0 1px 1px #0008)}.as-satin-stage .as-satin-texture{position:absolute;inset:9px;border-radius:6px;pointer-events:none;background:repeating-linear-gradient(0deg,#ffffff05 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,#0000000c 0 1px,transparent 1px 5px);opacity:.65}.as-satin-stage .as-satin-top,.as-satin-stage .as-satin-bottom{position:absolute;left:0;right:0;text-align:center;font-family:BeauMed,Georgia,serif;font-size:10px;letter-spacing:3px;color:#b29b76;text-shadow:0 1px 0 #08090c}.as-satin-stage .as-satin-top{top:37px}.as-satin-stage .as-satin-bottom{bottom:34px;color:#8e8374;font-size:9px}.as-satin-stage .as-satin-light{position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(ellipse at 0 0,#edddba21,transparent 60%);opacity:calc(.15 + var(--review-light,.5)*.65)}.as-satin-stage .as-satin-card::after{content:'';position:absolute;inset:0;border:1px solid transparent;border-top-color:#dcc18b66;border-left-color:#b8a08026;border-radius:inherit;pointer-events:none;opacity:calc(.2 + var(--review-light,.5)*.7)}
.review-marker{--ink:#92979e;position:relative;display:inline-flex;align-items:center;justify-content:flex-end;gap:3px;width:70px;height:30px;padding:0 5px;box-sizing:border-box;vertical-align:middle;isolation:isolate}.review-marker i{position:relative;display:block;width:9px;height:9px;flex:0 0 9px;transform:rotate(45deg);background:var(--ink);box-shadow:inset 1px 1px 0 #ffffff24,inset -1px -1px 0 #00000035}.review-marker i:after{content:'';position:absolute;left:0;top:0;width:100%;height:1px;background:#f6dc9c;opacity:calc(var(--review-light,.65) * .45)}.review-marker.silver i:after{background:#c6c9cb}.review-marker.gold{--ink:#d7a84e}.review-marker.prismatic{--ink:#ac80bc}.review-marker.prismatic i:first-child{--ink:#72b69b}.review-marker.prismatic i:last-child{--ink:#d3a465}.review-marker.secret{--ink:#a64b44}.review-marker.secret i{box-shadow:inset 1px 1px 0 #d7a84e99,inset -1px -1px 0 #642e2a}.review-marker.secret i:last-child{--ink:#bd6652}
.review-foil.liquid-spectrum{position:absolute;inset:0;z-index:6;overflow:hidden;border-radius:inherit;pointer-events:none;isolation:isolate}.liquid-spectrum .ls-film,.liquid-spectrum .ls-lustre,.liquid-spectrum .ls-particles{position:absolute;inset:0;border-radius:inherit;pointer-events:none}.liquid-spectrum .ls-film{background:radial-gradient(ellipse at 17% 28%,#ec477d 0%,#e89031 12%,#d7bb37 21%,#4cc78e 30%,#35a9c8 39%,#7961d8 48%,#b651b2 57%,transparent 72%);background-size:185% 170%;background-position:var(--shine-x,35%) var(--shine-y,20%);mix-blend-mode:screen;opacity:clamp(.13,calc(.09 + var(--review-light,.35)*.29),.38);-webkit-mask-image:linear-gradient(90deg,#000 0%,#000b 22%,#0003 46%,#0008 73%,#000 100%);mask-image:linear-gradient(90deg,#000 0%,#000b 22%,#0003 46%,#0008 73%,#000 100%);transition:opacity .25s}.liquid-spectrum .ls-lustre{background:repeating-radial-gradient(ellipse at 0% 12%,transparent 0 32px,#e5ba6840 33px,transparent 34px 48px,#b469bd30 49px,transparent 50px 72px);background-size:155% 145%;background-position:var(--shine-x,35%) var(--shine-y,20%);mix-blend-mode:screen;opacity:clamp(.12,calc(.12 + var(--review-light,.35)*.28),.4);-webkit-mask-image:linear-gradient(90deg,#000,transparent 45%,transparent 63%,#000);mask-image:linear-gradient(90deg,#000,transparent 45%,transparent 63%,#000)}.liquid-spectrum .ls-particles{opacity:clamp(.6,calc(.58 + var(--review-light,.35)*.35),.93);transition:opacity .25s}.liquid-spectrum .ls-particles i{position:absolute;left:var(--x);top:var(--y);width:2px;height:3px;background:#e7b951;box-shadow:0 0 3px #d7a84e75;opacity:0;animation:ls-rise 4.2s var(--d) linear infinite}.liquid-spectrum .ls-particles i:nth-child(3n){width:8px;height:12px;background:linear-gradient(135deg,#a97626 12%,#ffe5a1 44%,#d7a84e 60%,#b7812b 85%);clip-path:polygon(50% 0,60% 39%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 39%);box-shadow:none;animation-name:ls-gold-rise;animation-duration:4.8s}.liquid-spectrum .ls-particles i:nth-child(4n){width:2px;height:2px;animation-duration:3.6s}.liquid-spectrum .ls-particles i:nth-child(5n){background:#e4bf70}.tcg-card:hover .liquid-spectrum .ls-film{opacity:clamp(.2,calc(.17 + var(--review-light,.35)*.32),.47)}.tcg-card:hover .liquid-spectrum .ls-particles{opacity:.96}@keyframes ls-rise{0%{opacity:0;transform:translate3d(0,12px,0) scale(.5)}18%{opacity:.75}55%{opacity:.85}100%{opacity:0;transform:translate3d(4px,-48px,0) scale(.4)}}@keyframes ls-gold-rise{0%{opacity:0;transform:translate3d(0,12px,0) scale(.35) rotate(-8deg)}22%{opacity:.55}40%{opacity:1;transform:translate3d(2px,-13px,0) scale(1) rotate(0deg)}61%{opacity:.55}100%{opacity:0;transform:translate3d(5px,-48px,0) scale(.3) rotate(12deg)}}@media(prefers-reduced-motion:reduce){.liquid-spectrum .ls-particles i{animation:none;opacity:.4}.liquid-spectrum .ls-film,.liquid-spectrum .ls-particles{transition:none}}
/* Adapt the selected components to the pack/card hosts, preserving the existing flips. */
.tcg-stage[data-ready="false"] .tcg-pack,.tcg-stage[data-ready="false"] .tcg-hand,[data-art-ready="false"]{visibility:hidden!important}
.tcg-stage[data-ready="false"] *,[data-art-ready="false"] *{animation-play-state:paused!important}
/* While the pack is prepared (preparePack), its place shows the TCG loading circle (collection.css). */
.tcg-stage[aria-busy="true"][data-ready="false"]::before{content:'';position:absolute;left:50%;top:50%;margin:-21px 0 0 -21px;z-index:1;pointer-events:none}
.tcg-pack.tcg-reviewed-pack,.tcg-pack.tcg-reviewed-pack:hover{width:246px;height:350px;transform:none;animation:none;filter:none;opacity:1}
.tcg-reviewed-pack .bp-stage{height:350px;overflow:visible;text-align:left}
.tcg-reviewed-pack .bp-emblem{left:79px;top:167px;width:88px;height:88px}
.tcg-reviewed-pack .bp-logo{filter:grayscale(.65) brightness(.78) drop-shadow(0 1px 0 #000);left:24px;width:198px}
.tcg-reviewed-pack .bp-card img{width:64px;height:64px;object-fit:contain;position:absolute;left:50%;top:45%;transform:translate(-50%,-50%)}
.tcg-reviewed-pack .bp-tab,.tcg-reviewed-pack .bp-tab-shadow{pointer-events:none}
.tcg-reviewed-pack:focus-visible .bp-tab{transform:translateY(-2px) rotate(-12deg)}
.tcg-reviewed-pack .bp-stage .bp-shell{clip-path:polygon(0 0,142px 0,142px 27px,158px 30px,165px 29px,176px 36px,188px 38px,199px 44px,214px 44px,226px 51px,246px 55px,246px 350px,0 350px)}
.tcg-reviewed-pack .bp-stage .bp-tab,.tcg-reviewed-pack .bp-stage .bp-tab-shadow{width:104px;height:55px;clip-path:polygon(0 0,100% 0,100% 100%,84px 51px,72px 44px,57px 44px,46px 38px,34px 36px,23px 29px,16px 30px,0 27px);transform-origin:0 27px}
.tcg-reviewed-pack .bp-stage .bp-card{inset:16px 8px 18px}
.tcg-reviewed-pack .bp-stage .bp-curl{top:27px;width:27px;height:24px}
.tcg-stage[data-phase="opening"] .tcg-reviewed-pack{animation:none}
.tcg-stage[data-phase="opening"] .bp-tab{animation:tcg-reviewed-tear .65s ease-in forwards}
.tcg-stage[data-phase="opening"] .bp-shell{animation:tcg-wrapper-out .5s .6s ease-in forwards}
.tcg-stage[data-phase="opening"] .bp-card,.tcg-stage[data-phase="opening"] .tcg-pack-peek{animation:tcg-wrapper-out .35s .8s ease-in forwards}
.tcg-stage[data-phase="opening"] .bp-tab-shadow{display:none}
@keyframes tcg-reviewed-tear{to{transform:translate(80px,-150px) rotate(35deg);opacity:0}}
.tcg .tcg-reviewed .tcg-card-back,.demo-stage .tcg-reviewed .tcg-card-back{padding:0!important;border:0;box-shadow:none;background:transparent}
.tcg-reviewed .tcg-card-back::before,.tcg-reviewed .tcg-card-back::after{display:none}
.tcg-reviewed .as-satin-card{width:100%;height:100%;max-width:none;aspect-ratio:auto;border-radius:12px;transform:none}
.tcg-reviewed .as-satin-emblem{width:36%;height:auto;aspect-ratio:1}
.tcg-reviewed .as-satin-top{top:10%;font-size:8px}
.tcg-reviewed .tcg-card-info{text-align:left}
.tcg-reviewed .tcg-card-gem{visibility:hidden}
.tcg-reviewed-rarity{position:absolute;top:7px;right:9px;z-index:4;pointer-events:none;transform-origin:top right}
.tcg-reviewed-rarity .review-marker{display:none}
.tcg-reviewed-rarity[data-tier="silver"] .silver,.tcg-reviewed-rarity[data-tier="gold"] .gold,.tcg-reviewed-rarity[data-tier="prismatic"] .prismatic,.tcg-reviewed-rarity[data-tier="secret"] .secret{display:inline-flex}
.tcg-reviewed:not(.tcg-full-art):not([data-kind="champion"]) .tcg-card-front{background:linear-gradient(180deg,#23242a,#191a20 78%);box-shadow:inset 1px 1px 0 #e2c48724,inset -2px -2px 0 #090a0e}
.tcg-reviewed:not(.tcg-full-art):not([data-kind="champion"]) .tcg-card-front::before{display:none}
.tcg-reviewed:not(.tcg-full-art):not([data-kind="champion"]) .tcg-card-art{background:none;border:0}
.tcg-reviewed:not(.tcg-full-art):not([data-kind="champion"]) .tcg-card-art::before{display:none}
.tcg-reviewed[data-kind="augment"] .tcg-card-art img,.tcg-reviewed[data-card="item-443054"] .tcg-card-art img{width:min(128px,85%);max-width:85%;height:auto;max-height:100%;aspect-ratio:1;object-fit:contain}
.tcg-reviewed[data-kind="augment"] .tcg-card-art img{box-shadow:none}
.tcg-reviewed .tcg-card-finish,.tcg-reviewed .tcg-card-glare,.tcg-reviewed .tcg-card-sparks{display:none}
.tcg-reviewed .review-foil{display:none}
.tcg-reviewed.is-foil .review-foil{display:block}
.tcg-card-slot .ls-particles i{animation-play-state:paused!important}
.tcg-card-slot.is-in-view .tcg-reviewed.is-revealed .ls-particles i{animation-play-state:running!important}
@media(max-width:760px){.tcg-experience .tcg-reviewed-rarity{transform:scale(.65);top:3px;right:3px}.tcg-reviewed .as-satin-face{inset:5px}.tcg-reviewed .as-satin-face::before{inset:4px}.tcg-reviewed .as-satin-face::after{inset:8px}}
@media(prefers-reduced-motion:reduce){.tcg-stage[data-phase="opening"] .bp-tab,.tcg-stage[data-phase="opening"] .bp-shell,.tcg-stage[data-phase="opening"] .bp-card,.tcg-stage[data-phase="opening"] .tcg-pack-peek{animation:none}.tcg-reviewed .ls-particles i{animation:none!important}}

/* Approved card back 52/J5. The complete composition scales as one 63:88 image. */
.tcg-card[data-back="arena52"] .tcg-card-back {
    display:block;padding:0;border:0;background:transparent;box-shadow:none;
    border-radius:4.667% / 3.341%;overflow:visible;
}
.tcg-card[data-back="arena52"] .tcg-card-back::before,
.tcg-card[data-back="arena52"] .tcg-card-back::after {display:none}
.tcg-arena-back {position:absolute;inset:0;display:block;pointer-events:none;isolation:isolate}
.tcg-arena-back>.tcg-arena-back__still,
.tcg-arena-back>.tcg-arena-back__motion {
    position:absolute;inset:0;display:block;width:100%;height:100%;margin:0;
    border:0;border-radius:0;padding:0;object-fit:contain;object-position:center;
}
.tcg-arena-back__motion {--tcg-back-cloth:none;--tcg-back-layer:auto;background:none center / contain no-repeat}
.tcg-arena-back__motion::after {content:"";position:absolute;inset:0;background:var(--tcg-back-cloth) center / contain no-repeat;will-change:var(--tcg-back-layer)}
html[data-tcg-back-motion-ready="true"][data-tcg-back-hidden="false"][data-tcg-back-reduced="false"] .tcg-arena-back[data-in-view="true"]>.tcg-arena-back__motion {
    background-image:url('assets/arena-back-52-layer-base.svg');
    --tcg-back-cloth:url('assets/arena-back-52-layer-banners.svg');
    --tcg-back-layer:transform;
}
/* A face-up, offscreen or hidden card never needs the animated image. */
html[data-tcg-back-hidden="true"] .tcg-arena-back>.tcg-arena-back__motion,
.tcg-card.is-revealed .tcg-arena-back>.tcg-arena-back__motion,
.tcg-guide-card.is-flipped .tcg-arena-back>.tcg-arena-back__motion,
[data-art-ready="false"] .tcg-arena-back>.tcg-arena-back__motion,
[data-ready="false"] .tcg-arena-back>.tcg-arena-back__motion,
[hidden] .tcg-arena-back>.tcg-arena-back__motion {background-image:none!important;--tcg-back-cloth:none!important;--tcg-back-layer:auto!important}
/* All visible face-down banners move, with no hover requirement. The engraving
   is a separate static image. Composite the cloth independently so its repaint
   cannot invalidate the detailed engraving underneath. Release that layer with
   the visibility/motion gates above; there is no per-card JS frame loop. */
/* The wrapper's covered card uses the same artwork, with no hidden animation. */
.bp-stage .bp-card.bp-card--arena {border:0;background:transparent;box-shadow:none;bottom:auto;aspect-ratio:63 / 88}
.bp-stage .bp-card.bp-card--arena::after {display:none}
.bp-stage .bp-card.bp-card--arena .tcg-arena-back__still {inset:0;width:100%;height:100%;margin:0;transform:none;object-fit:contain;object-position:center}
.bp-stage .bp-card .tcg-arena-back__motion {display:none}
#tcg-back-options {grid-template-columns:minmax(0,240px)}
/* The corona shares the faces' rotor, including its flip and reveal impulse.
   Its hollow centre must never remain behind as a stationary rectangle. */
.tcg-card .tcg-back-aura {
    position:absolute;display:block;left:-45.454545%;top:50%;
    width:190.909091%;height:auto;aspect-ratio:420 / 507.3016;max-width:none;margin:0;padding:0;
    border:0;background:transparent;pointer-events:none;
    transform:translateY(-50%);opacity:0;
    backface-visibility:visible;-webkit-backface-visibility:visible;
}
.tcg-card .tcg-back-aura[hidden] {display:none}
/* A filter on the 3D parent flattens the rotor and adds a second, offset aura. */
.tcg-card[data-back-glow="corona-dust"],
.tcg-card[data-back-glow="corona-dust"]:hover,
.tcg-card[data-back-glow="corona-dust"]:focus-visible {filter:none}
@media(prefers-reduced-motion:reduce) {
    .tcg-arena-back>.tcg-arena-back__motion {background-image:none!important;--tcg-back-cloth:none!important;--tcg-back-layer:auto!important}
}
.tcg-card-slot:not(.is-in-view) .fc-rolling .dust i { animation-play-state: paused; }

/* Exact saved A/B #17; only host layering is added below. Each star's left, top and animation-delay are inline values
   (reviewed.js) rather than var(--x)/var(--y)/var(--d), so the 36 stars restyle cheaply while tilt variables change. */
.review-foil.fc-rolling{position:absolute;inset:0;overflow:hidden;pointer-events:none;background:transparent;--energy:clamp(0,var(--review-light,.21151),1);--sx:var(--shine-x,34%);--sy:var(--shine-y,22%);--dx:calc((var(--sx) - 34%) * 2.2);--dy:calc((var(--sy) - 22%) * 1.8);-webkit-mask-image:linear-gradient(#0004,#000a 10%,#000 22%,#000 58%,#000b 65%,#0004 74%,#0001 84%,#0001);mask-image:linear-gradient(#0004,#000a 10%,#000 22%,#000 58%,#000b 65%,#0004 74%,#0001 84%,#0001)}
.fc-rolling .surface,.fc-rolling .film,.fc-rolling .detail,.fc-rolling .reflection,.fc-rolling .dust{position:absolute;inset:0;pointer-events:none}
.fc-rolling .surface{-webkit-mask-image:radial-gradient(ellipse 28% 24% at 49% 35%,#0002 0%,#0002 35%,#0007 72%,#000 100%);mask-image:radial-gradient(ellipse 28% 24% at 49% 35%,#0002 0%,#0002 35%,#0007 72%,#000 100%)}
.fc-rolling .film{mix-blend-mode:screen;opacity:calc(.28 + var(--energy) * .16)}
.fc-rolling .detail{mix-blend-mode:screen;opacity:calc(.22 + var(--energy) * .32)}
.fc-rolling .reflection{mix-blend-mode:screen;opacity:calc(.18 + var(--energy) * .48)}
.fc-rolling .film,.fc-rolling .detail,.fc-rolling .reflection{background-repeat:no-repeat;transition:opacity .12s linear}
.fc-rolling .dust{opacity:calc(.64 + var(--energy) * .3);-webkit-mask-image:radial-gradient(ellipse 28% 24% at 49% 35%,#0002 20%,#000 100%);mask-image:radial-gradient(ellipse 28% 24% at 49% 35%,#0002 20%,#000 100%)}
.fc-rolling .dust i{position:absolute;width:2px;height:3px;background:#edbe65;box-shadow:0 0 3px #eab44b60;opacity:0;animation:fc-rolling-rise 4.5s linear infinite}
.fc-rolling .dust i:nth-child(3n){width:7px;height:11px;background:linear-gradient(130deg,#a46d25 8%,#ffe5a1 41%,#edbc58 58%,#b98635 87%);clip-path:polygon(50% 0,60% 39%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 39%);box-shadow:none;animation-duration:5.1s}
.fc-rolling .dust i:nth-child(4n){width:2px;height:2px;animation-duration:3.9s}
@keyframes fc-rolling-rise{0%{opacity:0;transform:translate3d(0,13px,0) scale(.4) rotate(-10deg)}18%{opacity:.8}41%{opacity:1;transform:translate3d(2px,-17px,0) scale(1) rotate(0deg)}65%{opacity:.7}100%{opacity:0;transform:translate3d(5px,-54px,0) scale(.3) rotate(12deg)}}
@media(prefers-reduced-motion:reduce){.fc-rolling .dust i{animation:none;opacity:.48;transform:none}.fc-rolling .film,.fc-rolling .detail,.fc-rolling .reflection{transition:none}}

/* Original molten-lacquer film and paired curved lustre, with separate spectral floor and amplified angular travel. The fixed ml-catch patch is absent. */
.fc-rolling .film{background-image:radial-gradient(ellipse at 12% 21%,#f868a8 0%,#f5a046 13%,#e9d655 23%,#59daa5 33%,#4ebddf 43%,#8271e8 53%,#d770ca 63%,#f868a8 82%,#e9d655 100%);background-size:185% 165%;background-position:var(--sx) var(--sy)}
.fc-rolling .detail{background-image:radial-gradient(ellipse 55% 80% at -8% 15%,transparent 46%,#f18baf80 49%,#ffc876d0 51%,#e6e367 53%,#79dfaf 55%,#5cbaea90 57%,transparent 61%),radial-gradient(ellipse 65% 65% at 104% 45%,transparent 48%,#b982ef90 50%,#7a98ef 52%,#64e5d8 54%,#edcf7db0 56%,transparent 61%);background-size:135% 140%;background-position:calc(34% + (var(--sx) - 34%) * 2.5) calc(22% + (var(--sy) - 22%) * 2.5)}
.fc-rolling .reflection{background-image:radial-gradient(ellipse 90% 94% at calc(-7% + var(--dx) * .75) calc(28% + var(--dy)),transparent 40%,#f5b16c24 44%,#ffd991a0 48%,#ffe8a7d9 51%,#d7ead89c 55%,#87d7dc35 59%,transparent 65%),radial-gradient(ellipse 72% 96% at calc(106% - var(--dx) * .7) calc(56% - var(--dy) * .8),transparent 40%,#8dc5e22b 46%,#c0e2cba0 51%,#f2d89999 54%,transparent 62%)}
.tcg-champion130 .review-foil.fc-rolling{z-index:6;border-radius:inherit}
/* Keep #17's surface fade separate: it must not hide stars at the foot of the card. */
.review-foil.fc-rolling{-webkit-mask-image:none;mask-image:none}
.fc-rolling .foil-surface-mask{position:absolute;inset:0;pointer-events:none;-webkit-mask-image:linear-gradient(#0004,#000a 10%,#000 22%,#000 58%,#000b 65%,#0004 74%,#0001 84%,#0001);mask-image:linear-gradient(#0004,#000a 10%,#000 22%,#000 58%,#000b 65%,#0004 74%,#0001 84%,#0001)}
/* Fuller rainbow stars, including the bottom-left; no rectangular particles. */
.fc-rolling .dust{opacity:calc(.8 + var(--energy) * .2);-webkit-mask-image:none;mask-image:none}
.fc-rolling .dust i:nth-child(n){width:6px;height:9px;background:linear-gradient(145deg,#ff438f 12%,#ffc447 32%,#80edb3 48%,#59cfff 65%,#bb73ff 84%);clip-path:polygon(50% 0,60% 39%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 39%);box-shadow:none}
.fc-rolling .dust i:nth-child(3n){width:8px;height:12px}
.fc-rolling .dust i:nth-child(4n){width:5px;height:7px}

/* Opened-pack inspection reuses decoded cards and their native hover/foil lighting. */
.tcg-experience .tcg-stage .tcg-hand.has-inspected>.tcg-card-slot{animation:none!important;transform:none;opacity:1}
.tcg-experience .tcg-stage .tcg-hand.is-inspecting{width:min(600px,90vw);max-width:none;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 14px;align-items:center}
.tcg-experience .tcg-stage .tcg-hand.is-inspecting>.tcg-card-slot{grid-row:2;grid-column:var(--inspect-column);width:min(100%,92px);justify-self:center}
/* Wider screens: the enlarged card gets the height left after the heading, the four small cards and the button
   (about 375px), so short windows such as the League client's ~934x709 iframe do not scroll. */
.tcg-experience .tcg-stage .tcg-hand.is-inspecting>.tcg-card-slot.is-selected{grid-row:1;grid-column:1/-1;width:min(350px,max(180px,calc((100vh - 375px)*.715)),72vw);z-index:4}
/* Phones: the enlarged card, the four small cards, Reveal all and the pile's reserved space
   (about 550px besides the card) fit the visible height, so the view does not scroll. */
@media(max-width:560px){.tcg-experience .tcg-stage .tcg-hand.is-inspecting>.tcg-card-slot.is-selected{width:min(72vw,max(180px,calc((100vh - 555px)*.715)));width:min(72vw,max(180px,calc((100dvh - 555px)*.715)))}}
.tcg-experience .tcg-hand.is-inspecting .tcg-card-meta{display:none}
.tcg-experience .tcg-hand.is-inspecting .is-selected .tcg-card{cursor:zoom-out;touch-action:manipulation}
.tcg-experience .tcg-hand .tcg-card.is-revealed{cursor:zoom-in}
.tcg-experience .tcg-pack-odds{position:absolute;top:calc(100% + 54px);left:50%;transform:translateX(-50%);z-index:10}
.tcg-experience .tcg-pack-odds[hidden]{display:none}
.tcg-experience .tcg-pack-odds-trigger{position:relative;display:flex;align-items:center;justify-content:center;min-width:64px;min-height:44px;padding:5px 8px;border:0;border-radius:0;background:none;color:#b9b5ad;cursor:help}
.tcg-experience .tcg-pack-odds-trigger svg{width:52px;height:33px}
.tcg-experience .tcg-pack-odds-trigger.is-adjusted::after{content:"+";position:absolute;top:-3px;right:-3px;font:400 20px/1 BeauMed,sans-serif;pointer-events:none}
@media(max-height:650px){.tcg-experience .tcg-pack-odds{top:calc(100% + 30px)}}
.tcg-experience .tcg-pack-odds-trigger:hover{color:var(--text-color)}
.tcg-experience .tcg-pack-odds-trigger.is-adjusted{color:#f1d16a}
.tcg-experience .tcg-pack-odds-trigger:focus-visible{outline:1px solid #d1d1d1;outline-offset:3px}
.tcg-experience .tcg-pack-odds-tip{position:absolute;bottom:calc(100% + 10px - var(--tcg-odds-shift,0px));top:auto;left:50%;width:min(380px,calc(100vw - 42px));max-height:none;overflow:visible;box-sizing:border-box;white-space:normal;text-align:left;transform:translateX(-50%);font:13px/1.5 Montserrat,sans-serif;background:#1e1e1ef5;border:1px solid var(--secondary-color);border-radius:0;pointer-events:none}
.tcg-experience .tcg-pack-odds-tip.visible{transform:translateX(-50%);pointer-events:auto}
.tcg-pack-odds::before{content:"";position:absolute;bottom:100%;left:0;right:0;height:12px}
.tcg-pack-odds-tip p{margin:0 0 10px}.tcg-pack-odds-tip p:last-child{margin-bottom:0}
.tcg-pack-odds-tip strong,.tcg-pack-odds-tip span{display:block}.tcg-pack-odds-tip strong{color:var(--text-color)}
.tcg-pack-odds-tip .tcg-odds-more{display:inline-block;margin:6px 0 0;padding:0;border:0;background:none;color:var(--text-color);font:600 13px/1.5 Montserrat,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.tcg-pack-odds-tip .tcg-odds-more:hover{color:#fff}
.tcg-pack-odds-tip .tcg-odds-more:focus-visible{outline:1px solid #d1d1d1;outline-offset:3px}
/* Full boosted list for match packs, opened from the odds tooltip. */
.tcg-odds-dialog{position:fixed;inset:0;margin:auto;box-sizing:border-box;width:min(760px,calc(100% - 32px));height:fit-content;max-height:85vh;max-height:85dvh;overflow:auto;padding:22px 22px 18px;background:rgba(26,26,26,.98);border:2px solid rgba(255,255,255,.1);border-radius:8px;color:var(--text-color);box-shadow:0 16px 50px rgba(0,0,0,.6);font:13px/1.5 Montserrat,sans-serif}
.tcg-odds-dialog::backdrop{background:rgba(0,0,0,.75)}
.tcg-odds-dialog{scrollbar-width:thin;scrollbar-color:var(--secondary-color) var(--semi-transparent-bg)}
.tcg-odds-dialog::-webkit-scrollbar{width:6px;height:6px}
.tcg-odds-dialog::-webkit-scrollbar-track{background:var(--semi-transparent-bg)}
.tcg-odds-dialog::-webkit-scrollbar-thumb{background:var(--secondary-color);border-radius:3px}
.tcg-odds-dialog h2{margin:0 0 4px;font-size:18px;letter-spacing:.5px}
.tcg-odds-dialog p{margin:12px 0 0}
.tcg-odds-dialog strong,.tcg-odds-dialog span{display:block}.tcg-odds-dialog strong{color:var(--text-color)}
.tcg-odds-dialog .tcg-odds-boost{margin:14px 0 0}
.tcg-odds-dialog .tcg-odds-kind{margin:8px 0 3px;font-size:12px;font-weight:600;color:#b9b5ad}
.tcg-odds-dialog .tcg-odds-card-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px 16px;list-style:none;margin:0;padding:0}
.tcg-odds-dialog .tcg-odds-card-list li{min-width:0;margin:0;padding:0;overflow-wrap:anywhere}
.tcg-odds-dialog-actions{display:flex;justify-content:flex-end;margin-top:20px}
.tcg-odds-dialog-actions button{border:1px solid var(--border-color);border-radius:4px;padding:9px 15px;color:var(--text-color);background:var(--semi-transparent-bg);font:600 13px Montserrat,sans-serif;cursor:pointer}
@media(max-width:600px){.tcg-odds-dialog .tcg-odds-card-list{grid-template-columns:repeat(2,minmax(0,1fr))}.tcg-odds-dialog{padding:18px 14px}}