/* Burst Pipe player card frames and titles. Shared by the game and the public card page.
   Apply: class="card-frame fr-<style>" style="--c0:..;--c1:..;--c2:.." on the card element. */
.card-frame { background: linear-gradient(145deg, var(--c0, #ffd23f) 0%, var(--c1, #ff8a3d) 55%, var(--c2, #e0473d) 100%) !important; }
.card-frame.fr-pipes { background: linear-gradient(145deg, var(--c0), var(--c1) 50%, var(--c2)) !important; box-shadow: inset 0 0 0 6px var(--c2), inset 0 0 0 10px var(--c0), inset 0 0 0 13px var(--c2), 0 20px 60px rgba(0,0,0,.45) !important; }
.card-frame.fr-hazard { background: repeating-linear-gradient(45deg, var(--c0) 0 20px, var(--c1) 20px 40px) !important; box-shadow: inset 0 0 0 5px var(--c1), 0 20px 60px rgba(0,0,0,.45) !important; }
.card-frame.fr-hazard > div:last-child { background: rgba(255,255,255,.92); border-radius: 14px; padding: 10px 12px; }
.card-frame.fr-neon { background: radial-gradient(circle at 30% 10%, #2a1f45, var(--c2) 70%) !important; color: #fff !important; box-shadow: inset 0 0 0 3px var(--c0), inset 0 0 0 7px var(--c2), inset 0 0 0 9px var(--c1), 0 0 26px color-mix(in srgb, var(--c0) 70%, transparent), 0 20px 60px rgba(0,0,0,.5) !important; }
.card-frame.fr-neon .bp-pcard-kicker, .card-frame.fr-neon .pcard-kicker, .card-frame.fr-neon .pcard-sub { color: var(--c1); opacity: 1; }
.card-frame.fr-ice { background: linear-gradient(160deg, #ffffff 0%, var(--c0) 40%, var(--c1) 100%) !important; box-shadow: inset 0 0 0 5px rgba(255,255,255,.85), inset 0 0 34px rgba(255,255,255,.7), 0 20px 60px rgba(0,0,0,.45) !important; }
.card-frame.fr-gilded { background: linear-gradient(135deg, var(--c2) 0%, var(--c0) 25%, var(--c1) 50%, var(--c0) 75%, var(--c2) 100%) !important; box-shadow: inset 0 0 0 4px var(--c1), inset 0 0 0 9px var(--c2), inset 0 0 0 11px var(--c1), 0 0 30px rgba(255,204,51,.35), 0 24px 70px rgba(0,0,0,.5) !important; }
.card-title { display: inline-block; font: 800 13px Nunito, Inter, system-ui, sans-serif; letter-spacing: 1.5px; text-transform: uppercase; border-radius: 999px; padding: 4px 12px; background: var(--t0, #1d2730); color: var(--t1, #ffe08a); box-shadow: 0 2px 0 rgba(0,0,0,.2); }
/* Swatch used in the closet */
.card-swatch { width: 70px; height: 54px; border-radius: 10px; display: grid; place-items: center; }
.card-swatch i { width: 46px; height: 30px; border-radius: 6px; background: #13283a; display: block; }
.card-frame.fr-hazard.card-swatch i { background: #13283a; }
.card-frame.fr-neon .bp-pcard-stats div, .card-frame.fr-neon .pcard-stats div, .card-frame.fr-neon .pcard-bests { color: #1d2730; }