/* ============================================================
   POKER SESH — Cosmetics: animated borders + nameplate wash
   Pure CSS (rotating conic gradients, transform-only animation).
   Wrapper pattern: <div class="cb cb-{effect}"> around any block.
   ============================================================ */

.cb {
    position: relative;
    border-radius: 13px;
    padding: 2px;
    overflow: hidden;
}

/* Oversized rotating gradient layer behind the content */
.cb::before {
    content: '';
    position: absolute;
    inset: -150%;
    animation: cb-rot 3.2s linear infinite;
}

/* Lift content above the gradient layer */
.cb > * {
    position: relative;
    border-radius: 11px;
}

/* Circular variant (profile popup avatar) */
.cb-round {
    border-radius: 50%;
    padding: 3px;
}
.cb-round > * { border-radius: 50%; }

@keyframes cb-rot {
    to { transform: rotate(360deg); }
}

/* ── Effects ── */

/* Frost — icy, slow and calm (free) */
.cb-frost::before {
    background: conic-gradient(#5ac8fa, #eaf9ff, #a8e6ff, #ffffff, #5ac8fa);
    animation-duration: 7s;
}
.cb-frost { box-shadow: 0 0 10px 1px rgba(90, 200, 250, 0.3); }

/* Voltage — twin purple comets (free) */
.cb-voltage::before {
    background: conic-gradient(
        transparent 0 130deg, #bf5af2 155deg, #ffffff 168deg, #bf5af2 178deg, transparent 185deg,
        transparent 310deg, #bf5af2 335deg, #ffffff 348deg, #bf5af2 358deg, transparent 360deg);
    animation-duration: 1.5s;
}

/* Gold royale — reigning monthly champ */
.cb-gold_royale::before {
    background: conic-gradient(#ffd60a, #8a6d00, #ffd60a, #fff3b0, #ffd60a);
    animation-duration: 3.2s;
}
.cb-gold_royale { box-shadow: 0 0 10px 1px rgba(255, 214, 10, 0.35); }

/* Blue flames — 3+ session win streak */
.cb-blue_flames::before {
    background: conic-gradient(#0a84ff, #64d2ff, #eaf9ff, #0a84ff, #003a8c, #64d2ff, #0a84ff);
    animation-duration: 2s;
}
.cb-blue_flames { animation: cb-flicker 1.7s steps(1) infinite; }
@keyframes cb-flicker {
    0%, 100% { box-shadow: 0 0 12px 1px rgba(10, 132, 255, 0.55); }
    18%      { box-shadow: 0 0 20px 3px rgba(100, 210, 255, 0.75); }
    34%      { box-shadow: 0 0 9px 1px rgba(10, 132, 255, 0.4); }
    52%      { box-shadow: 0 0 24px 4px rgba(100, 210, 255, 0.85); }
    70%      { box-shadow: 0 0 14px 2px rgba(10, 132, 255, 0.6); }
    86%      { box-shadow: 0 0 18px 3px rgba(100, 210, 255, 0.7); }
}

/* Toxic — biggest single-session profit record holder */
.cb-toxic::before {
    background: conic-gradient(#32d74b, #0e3d16, #32d74b, #bdffc9, #32d74b);
    animation-duration: 4s;
}
.cb-toxic { animation: cb-ooze 2.6s ease-in-out infinite; }
@keyframes cb-ooze {
    0%, 100% { box-shadow: 0 0 6px 0 rgba(50, 215, 75, 0.3); }
    50%      { box-shadow: 0 0 18px 3px rgba(50, 215, 75, 0.6); }
}

/* High roller — lifetime profit leader */
.cb-high_roller::before {
    background: conic-gradient(#ff453a, #0e0e0e, #ff453a, #ffffff, #0e0e0e, #ff453a);
    animation-duration: 4.5s;
}
.cb-high_roller { box-shadow: 0 0 10px 1px rgba(255, 69, 58, 0.3); }

/* RGB — earned all four earned borders */
.cb-rgb::before {
    background: conic-gradient(#ff453a, #ff9f0a, #ffd60a, #32d74b, #64d2ff, #0a84ff, #bf5af2, #ff453a);
    animation-duration: 3.5s;
}

/* ── Player profile modal full-card border (leaderboard.html) ──
   The wrapper owns the modal's width so the .cb ring hugs the card;
   radius = modal-content's 20px + the 2px ring. */
.pp-card-wrap { max-width: 700px; width: 90%; }
.pp-card-wrap .modal-content { width: 100%; max-width: 100%; }
.pp-card-wrap.cb { border-radius: 22px; }
.pp-card-wrap.cb > .modal-content { border-radius: 20px; }
@media (max-width: 767px) {
    .pp-card-wrap { width: 95%; }
}
/* ≤600px the modal becomes a position:fixed bottom sheet (leaderboard.html's
   page styles), escaping this wrapper — collapse the wrapper entirely so no
   orphaned ring floats mid-screen, and mark the sheet with a static top edge
   in the effect's signature color instead. */
@media (max-width: 600px) {
    .pp-card-wrap { display: contents; }
    .pp-card-wrap.cb::before { display: none; }
    .pp-card-wrap.cb-frost       > .modal-content { border-top: 2px solid #5ac8fa; }
    .pp-card-wrap.cb-voltage     > .modal-content { border-top: 2px solid #bf5af2; }
    .pp-card-wrap.cb-gold_royale > .modal-content { border-top: 2px solid #ffd60a; }
    .pp-card-wrap.cb-blue_flames > .modal-content { border-top: 2px solid #0a84ff; }
    .pp-card-wrap.cb-toxic       > .modal-content { border-top: 2px solid #32d74b; }
    .pp-card-wrap.cb-high_roller > .modal-content { border-top: 2px solid #ff453a; }
    .pp-card-wrap.cb-rgb         > .modal-content { border-top: 2px solid #ff453a; }
}

/* ── Reduced motion: static gradient ring, no glows pulsing ── */
@media (prefers-reduced-motion: reduce) {
    .cb::before { animation: none; }
    .cb { animation: none !important; }
}