/* Card artwork stays self-contained: app icon rules must never recolour suits. */
.deck-card { flex:0 0 auto; background:transparent !important; border:0 !important; overflow:hidden; isolation:isolate; box-shadow:0 2px 1px #0005,0 5px 12px #0004; }
.deck-card > .deck-svg, .chip-art > .chip-art-svg { display:block; width:100%; height:100%; max-width:none; fill:none; stroke:none; overflow:hidden; }
.card-face.deck-card { width:58px; height:auto; aspect-ratio:25/36; border-radius:6px; }
.skin-card.deck-card { width:58px; height:auto; aspect-ratio:25/36; border-radius:6px; }
.skin-card.deck-card.tiny { width:39px; height:auto; border-radius:4px; }
.skin-card.deck-card.big { width:98px; height:auto; border-radius:9px; }
.skin-card.deck-card.mini { width:25px; height:auto; border-radius:3px; }
.case-item .skin-card.deck-card { width:60px; height:auto; }
.bj-hand { gap:6px; }
.bj-lobby-hero .bj-cards { min-height:124px; align-items:center; }
.bj-lobby-hero .card-face.deck-card { width:72px; }
.bj-lobby-hero .card-face.deck-card:first-child { transform:rotate(-8deg) translateY(5px); }
.bj-lobby-hero .card-face.deck-card:last-child { transform:rotate(8deg) translateY(5px); }

.chip-skin-card.chip-art { background:none; box-shadow:none; }
.chip-skin-card.chip-art::after { content:none; }
.chip-skin-card.chip-art { width:64px; height:64px; filter:drop-shadow(0 4px 3px #0005); }
.chip-skin-card.chip-art.tiny { width:40px; height:40px; }
.chip-skin-card.chip-art.big { width:126px; height:126px; }
.chip-skin-card.chip-art.preview { width:68px; height:68px; }
.case-item .chip-skin-card.chip-art { width:64px; height:64px; }
.rl-chip.chip-art-token,.rl-chip-btn.chip-art-button { background:none; border:0; padding:0; }
.rl-chip.chip-art-token::after,.rl-chip-btn.chip-art-button::after { content:none; }
.chip-art-token > svg,.chip-art-button > svg { display:block; width:100%; height:100%; fill:none; stroke:none; }

.collection-hero { --collection-accent:#bca678; padding:18px; margin:0 0 16px; border:1px solid color-mix(in srgb,var(--collection-accent) 36%,transparent); border-radius:18px; color:var(--fg); background:radial-gradient(ellipse at 50% 38%,color-mix(in srgb,var(--collection-accent) 13%,transparent),transparent 70%),var(--card); }
.collection-eyebrow { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:10px; font-weight:700; letter-spacing:1.4px; color:var(--fg-2); }
.collection-eyebrow span { font-variant-numeric:tabular-nums; letter-spacing:.5px; }
.collection-stage { display:flex; align-items:center; justify-content:center; min-height:190px; padding:18px 0 12px; }
.collection-fan { position:relative; width:220px; height:160px; }
.collection-fan .deck-card { position:absolute; top:3px; left:62px; width:96px; height:auto; box-shadow:0 8px 14px #0005; }
.collection-fan .deck-card:nth-child(1) { transform:translate(-51px,10px) rotate(-15deg); }
.collection-fan .deck-card:nth-child(2) { transform:translate(45px,10px) rotate(15deg); }
.collection-fan .deck-card:nth-child(3) { transform:translateY(-1px); }
.collection-current { display:flex; align-items:center; justify-content:space-between; gap:12px; border-top:1px solid var(--line); padding-top:14px; }
.collection-current > div { min-width:0; }
.collection-current span { color:var(--fg-2); font-size:11px; }
.collection-current h3 { margin:3px 0 0; font-size:19px; line-height:1.2; color:var(--fg); }
.collection-inspect { display:inline-flex; align-items:center; justify-content:center; gap:8px; flex:0 0 auto; min-height:44px; padding:0 12px; border:1px solid var(--line); border-radius:10px; background:var(--card-2); color:var(--fg); font-family:inherit; font-size:12px; font-weight:600; line-height:1.2; cursor:pointer; }
.collection-inspect:active { background:var(--line); }
.collection-card { padding-top:5px; }
.collection-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:16px 14px 8px; }
.collection-heading h3 { margin:0; font-size:17px; font-weight:700; }
.collection-heading > span { color:var(--fg-2); font-size:12px; font-variant-numeric:tabular-nums; }
.collection-help { margin:0 14px 16px; font-size:12px; line-height:1.5; color:var(--fg-2); }
.collection-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:0 12px 14px; }
button.collection-item { min-width:0; padding:12px 5px 9px; gap:7px; color:var(--fg); font:inherit; cursor:pointer; border-radius:12px; border:1px solid var(--line); background:var(--card-2); transition:transform 180ms ease,border-color 180ms ease,background 180ms ease; }
button.collection-item.locked { opacity:1; filter:none; }
button.collection-item.is-on { border-color:var(--green); background:color-mix(in srgb,var(--green) 7%,var(--card)); }
.collection-item .skin-name { font-size:12px; line-height:1.25; min-height:30px; display:grid; align-items:center; }
.collection-item .skin-rar { font-size:10px; line-height:1.25; }
.collection-item .deck-card { width:clamp(53px,16vw,74px); }
.collection-item .chip-art { width:72px; height:72px; margin:10px 0; }
.collection-status { font-size:10px; line-height:1.4; color:var(--fg-2); }
.collection-item.is-on .collection-status { color:var(--green); font-weight:600; }
.collection-item:focus-visible,.collection-inspect:focus-visible,.collection-dialog button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
@media(hover:hover) { .collection-item:hover { border-color:var(--collection-accent); transform:translateY(-2px); } }

.collection-dialog { box-sizing:border-box; position:fixed; inset:0; width:calc(100% - 28px); max-width:430px; max-height:calc(100dvh - 36px); overflow-y:auto; padding:26px 20px 20px; border:1px solid var(--line); border-radius:22px; background:var(--card); color:var(--fg); box-shadow:0 24px 90px #0008; }
.collection-dialog::backdrop { background:#050911ce; backdrop-filter:blur(5px); }
.collection-dialog[open] { animation:collection-reveal 180ms ease-out; }
.collection-close { position:absolute; right:8px; top:7px; width:44px; height:44px; border:0; border-radius:50%; background:transparent; color:var(--fg-2); font-size:29px; cursor:pointer; }
.collection-dialog > .collection-eyebrow { padding-right:34px; }
.collection-dialog h2 { margin:10px 0 8px; font-size:26px; line-height:1.1; letter-spacing:-.5px; padding-right:15px; }
.collection-dialog > p { margin:0 0 14px; font-size:13px; color:var(--fg-2); line-height:1.5; }
.collection-detail-art { display:flex; align-items:center; justify-content:center; gap:22px; min-height:206px; padding:20px 8px 16px; border-radius:14px; background:radial-gradient(ellipse at 50% 46%,color-mix(in srgb,var(--collection-accent) 15%,transparent),transparent 70%),#080d1217; }
.collection-detail-art .deck-card { width:clamp(96px,29vw,132px); height:auto; }
.collection-detail-art > div > span { display:block; margin-top:12px; font-size:11px; text-align:center; color:var(--fg-2); }
.collection-detail-art > .chip-art.big,#skin-viewer-chip > .chip-art.big { width:178px; height:178px; }
.collection-ranks { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; margin:14px 0; }
.collection-ranks button { min-height:44px; padding:0; color:var(--fg); background:var(--card-2); border:1px solid var(--line); border-radius:9px; font-size:16px; cursor:pointer; }
.collection-ranks button[aria-pressed="true"] { background:var(--accent); border-color:var(--accent); color:#16171c; }
.collection-availability { margin:12px 0 0; color:var(--fg-2); font-size:12px; line-height:1.5; }
.collection-cosmetic { display:block; margin-top:14px; text-align:center; font-size:11px; color:var(--fg-2); }
.deck-card.is-torn { overflow:visible; box-shadow:none; filter:drop-shadow(0 3px 2px #0006); }
.deck-rank { font-style:normal; text-transform:none; writing-mode:horizontal-tb; text-anchor:middle; font-variant-numeric:lining-nums tabular-nums; dominant-baseline:central; }
/* Cards keep ink above foil; chips put the foil OVER the engraved denomination.
   Small case strips stay still; detailed/active previews and game pieces shine. */
.art-foil { pointer-events:none; }
.foil-sweep { transform:translateX(-65px); }
.foil-colour { transform:translateX(35px); }
:is(.collection-detail-art,.collection-fan,.collection-stage,.bj-hand,.bj-cards,.rl-chip-picker,.game-cube,.is-art-visible) .foil-sweep,
.collection-item:is(:hover,:focus-visible) .foil-sweep { animation:material-sweep var(--foil-time,6.2s) ease-in-out infinite; }
:is(.collection-detail-art,.collection-fan,.collection-stage,.bj-hand,.bj-cards,.rl-chip-picker,.game-cube,.is-art-visible) .foil-colour,
.collection-item:is(:hover,:focus-visible) .foil-colour { animation:var(--foil-motion,material-colour) var(--foil-time,8s) ease-in-out infinite alternate; }
.foil-aurora { --foil-time:8s; --foil-motion:material-aurora; }
.foil-corona { --foil-time:7s; --foil-motion:material-corona; }
.foil-prism { --foil-time:5.4s; }
@keyframes material-aurora { from { transform:translate(-28px,-12px) rotate(-8deg); opacity:.35; } to { transform:translate(30px,15px) rotate(10deg); opacity:1; } }
@keyframes material-corona { from { transform:translate(-10px,8px) rotate(-20deg); opacity:.35; } to { transform:translate(14px,-12px) rotate(20deg); opacity:.85; } }
@keyframes material-sweep { 0%,12% { transform:translateX(-65px); opacity:0; } 22% { opacity:1; } 60% { transform:translateX(142px); opacity:1; } 68%,100% { transform:translateX(142px); opacity:0; } }
@keyframes material-colour { from { transform:translateX(-35px); opacity:.35; } to { transform:translateX(65px); opacity:1; } }

/* Equal-sized game cubes: raised rim, bevelled foot and independent captions. */
.game-grid.game-cubes { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 12px; padding:4px 2px 12px; }
.game-cubes .game-cube { --cube-edge:#1c6955; --cube-light:#9edcca; grid-column:auto; width:100%; aspect-ratio:1; min-width:0; min-height:0; display:flex; flex-direction:column; border-radius:22px; border:1px solid color-mix(in srgb,var(--cube-light) 42%,transparent); overflow:hidden; cursor:pointer; touch-action:manipulation; isolation:isolate; background:linear-gradient(145deg,var(--bg1),var(--bg2)); box-shadow:0 6px 0 var(--cube-edge),0 9px 0 #03090e,0 12px 20px #0004,inset 0 1px 1px #ffffff46; transition:transform 180ms ease,box-shadow 180ms ease; }
.game-cubes .game-cube::before { inset:5px; border-radius:17px; border:1px solid color-mix(in srgb,var(--cube-light) 18%,transparent); background:radial-gradient(ellipse at 48% 8%,color-mix(in srgb,var(--cube-light) 20%,transparent),transparent 72%); pointer-events:none; }
.game-cubes .game-cube::after { inset:0; background:linear-gradient(115deg,#fff0 30%,#ffffff08 31%,#fff0 64%); mask:none; -webkit-mask:none; opacity:1; pointer-events:none; }
.game-cube .game-art,.game-cube:first-child .game-art { position:relative; inset:auto; display:grid; place-items:center; width:100%; flex:1; min-height:0; padding:4px 8px 0; box-sizing:border-box; }
.game-cube .game-object { position:relative; display:block; width:100%; height:100%; max-height:164px; fill:none; stroke:none; filter:none; }
.game-cube .game-art > *:not(.game-glow) { filter:none; }
.game-cube .game-cap { position:relative; inset:auto; flex:0 0 auto; min-height:62px; box-sizing:border-box; padding:8px 11px 14px; gap:4px; background:linear-gradient(180deg,transparent,#0002); z-index:1; }
.game-cube .game-cap b,.game-cube:first-child .game-cap b { font-size:15px; line-height:1.18; letter-spacing:-.3px; color:#f7f7f5; text-shadow:0 1px 2px #0005; }
.game-cube .game-cap span,.game-cube:first-child .game-cap span { font-size:11px; line-height:1.3; color:#e5ebf0; opacity:.82; }
.game-cubes .is-bj { --bg1:#174d3e; --bg2:#092d27; --cube-edge:#113d32; --cube-light:#b4e9ca; }
.game-cubes .is-rr { --bg1:#39475c; --bg2:#18273c; --cube-edge:#202c40; --cube-light:#bed3ef; }
.game-cubes .is-auc { --bg1:#58412e; --bg2:#30221d; --cube-edge:#39291e; --cube-light:#f8dc9e; }
.game-cubes .is-rl { --bg1:#663b43; --bg2:#351e2b; --cube-edge:#3c202c; --cube-light:#edb6bb; }
.game-cubes .game-cube:active { transform:translateY(4px); box-shadow:0 2px 0 var(--cube-edge),0 4px 0 #03090e,0 7px 12px #0004,inset 0 1px 1px #ffffff46; }
.game-cubes .game-cube:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
@media(hover:hover) { .game-cubes .game-cube:hover { transform:translateY(-2px); box-shadow:0 8px 0 var(--cube-edge),0 11px 0 #03090e,0 15px 25px #0005,inset 0 1px 1px #ffffff46; } .game-cubes .game-cube:active { transform:translateY(4px); } }
@media(max-width:350px) { .game-cubes .game-cube { border-radius:18px; } .game-cube .game-cap b,.game-cube:first-child .game-cap b { font-size:13px; letter-spacing:-.35px; } .game-cube .game-cap { min-height:58px; padding:6px 8px 12px; } .game-cube .game-cap span,.game-cube:first-child .game-cap span { font-size:10px; } .game-cube .game-art { padding-left:4px; padding-right:4px; } }
@keyframes collection-reveal { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }

.reward-object { display:block; width:100%; height:100%; fill:none; stroke:none; }
.passbar.pass-entry { display:grid; grid-template-columns:62px minmax(0,1fr); align-items:center; gap:14px; padding:16px; border-color:#aa925845; background:radial-gradient(ellipse at 5% 50%,#ddbb6220,transparent 60%),linear-gradient(120deg,#27251c,#17191e); box-shadow:inset 0 1px #ecd49424,0 4px 12px #0002; transition:border-color 180ms,background 180ms; }
.pass-entry-art { display:block; width:62px; height:86px; transform:rotate(-9deg); }
.pass-entry-body { display:block; min-width:0; }
.pass-entry-kicker { display:block; color:#c6b881; font-size:9px; font-weight:700; letter-spacing:1.3px; margin-bottom:7px; }
.pass-entry .passbar-top { display:block; }
.pass-entry .passbar-name { display:block; color:#f0e5c6; font-size:14px; line-height:1.3; }
.pass-entry .passbar-left { display:block; color:#bebaa9; font-size:11px; margin-top:4px; }
.pass-entry .passbar-mid { margin:11px 0 8px; }
.pass-entry .passbar-lvl { font-size:20px; color:#fff3ca; }
.pass-entry .passbar-bar i { background:linear-gradient(90deg,#a98c45,#eddba0); }
.pass-entry .passbar-sub { font-size:11px; line-height:1.4; color:#c5c4bc; }
.pass-entry-link { display:flex; justify-content:space-between; align-items:center; margin-top:10px; color:#f4dc9c; font-size:12px; font-weight:600; }
.pass-entry-link > span { font-size:20px; }
.passbar.pass-entry.is-ready { border-color:#e3cb79; }
.pass-entry:active { background:#2c291e; }
.pass-entry:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.btn.case-open-button,.btn.pass-unlock { --reward-light:#a6deca; --reward-edge:#548f80; position:relative; display:flex; align-items:center; gap:12px; width:100%; min-height:80px; padding:8px 15px 8px 10px; border-radius:15px; border:1px solid var(--reward-edge); background:linear-gradient(120deg,#243b36,#162724); color:var(--reward-light); text-align:left; box-shadow:inset 0 1px #ffffff23,0 3px 0 #07130e; transition:transform 160ms,filter 160ms; }
.case-open-button[data-case-tier="25"] { --reward-light:#c5e2ff; --reward-edge:#5d80a6; background:linear-gradient(120deg,#2a3b52,#162538); }
.case-open-button[data-case-tier="50"],.btn.pass-unlock { --reward-light:#f3e0b2; --reward-edge:#9e824a; background:linear-gradient(120deg,#4d4027,#2a241d); }
.case-open-button[data-case-tier="100"] { --reward-light:#e7d4ff; --reward-edge:#9775bd; background:linear-gradient(120deg,#413351,#262136); }
.reward-button-art { display:block; flex:0 0 55px; width:55px; height:55px; }
.reward-button-copy { display:flex; flex-direction:column; gap:5px; min-width:0; flex:1; }
.reward-button-copy b { color:inherit; font-size:15px; line-height:1.25; font-weight:650; }
.reward-button-copy small { color:inherit; font-size:13px; line-height:1.3; opacity:.83; }
.reward-button-arrow { flex:0 0 auto; font-size:24px; line-height:1; font-weight:400; }
.btn.case-open-button:active,.btn.pass-unlock:active { transform:translateY(2px); box-shadow:inset 0 1px #ffffff23; }
.btn.case-open-button:disabled { opacity:.5; box-shadow:none; cursor:default; }
.btn.case-open-button:focus-visible,.btn.pass-unlock:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
@media(max-width:350px) { .passbar.pass-entry { grid-template-columns:48px minmax(0,1fr); gap:10px; padding:13px; } .pass-entry-art { width:48px; height:70px; } .reward-button-art { width:44px; height:44px; flex-basis:44px; } .btn.case-open-button,.btn.pass-unlock { gap:9px; } .reward-button-copy b { font-size:14px; } }
@media(prefers-reduced-motion:reduce) { .passbar.pass-entry,.btn.case-open-button,.btn.pass-unlock { transition:none; } }
@media(max-width:350px) { .collection-current { align-items:flex-start; flex-direction:column; gap:10px; } .collection-inspect { width:100%; } .collection-grid { gap:6px; padding:0 8px 12px; } .collection-item .skin-rar { font-size:9px; } .collection-dialog { padding:24px 16px 16px; } .collection-detail-art { gap:14px; } }
@media(prefers-reduced-motion:reduce) { .collection-dialog[open],.card-face.deck-card.is-new { animation:none; } .collection-item,.game-cubes .game-cube { transition:none; } .premium-art .foil-sweep,.premium-art .foil-colour { animation:none!important; } .premium-art .foil-colour { transform:translateX(35px); opacity:.5; } }