/* =====================================================================
   PICA JUMP · Racha diaria (chip del lobby, tarjeta, aviso y anuncio)
   Reutiliza las clases pa-* de alertas.css para la tarjeta.
   ===================================================================== */
.rk-chip {
    flex: none; display: none; align-items: center; gap: calc(5 * var(--u, 1px)); cursor: pointer;
    padding: calc(5 * var(--u, 1px)) calc(12 * var(--u, 1px)); border: 0; border-radius: 99px;
    background: rgba(0, 0, 0, .45); color: #fff;
    font: 800 calc(13 * var(--u, 1px)) 'Montserrat', system-ui, sans-serif;
    -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
.rk-chip.on { display: inline-flex; }
.rk-chip .rk-ico { width: calc(21 * var(--u, 1px)); height: calc(21 * var(--u, 1px)); display: inline-flex; filter: drop-shadow(0 1px 1px rgba(90, 29, 8, .55)); }
.rk-ico svg, .pa-ico svg { width: 100%; height: 100%; display: block; }
.pa-ico { display: inline-flex; width: 1em; height: 1em; }
.rk-chip small { font: 700 calc(10 * var(--u, 1px)) 'Montserrat', sans-serif; opacity: .85; }
.rk-chip:active { transform: scale(.94); }
.rk-chip.rk-hoy { background: linear-gradient(135deg, #ff7a00, #f0390f); box-shadow: 0 0 calc(12 * var(--u, 1px)) rgba(255, 110, 20, .7); }
.rk-chip.rk-riesgo { background: rgba(0, 0, 0, .55); box-shadow: 0 0 0 2px #ffb02e; animation: rk-pulso 1.6s ease-in-out infinite; }
.rk-chip.rk-frio { background: linear-gradient(135deg, #2563eb, #38bdf8); animation: rk-pulso 1.4s ease-in-out infinite; }
.rk-chip.rk-frio .rk-ico { filter: none; }
@keyframes rk-pulso { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.08); } }

/* Datos dentro de la tarjeta */
.rk-grande {
    margin: 0 0 calc(10 * var(--pa-u)); font: 800 calc(64 * var(--pa-u)) / 1 'CatComic', 'Montserrat', sans-serif; color: #fff;
    text-shadow: 0 calc(4 * var(--pa-u)) 0 var(--a2), 0 0 calc(24 * var(--pa-u)) var(--glow);
}
.rk-grande small { display: block; margin-top: calc(4 * var(--pa-u)); font: 800 calc(14 * var(--pa-u)) 'Montserrat', sans-serif; letter-spacing: calc(1 * var(--pa-u)); text-transform: uppercase; text-shadow: none; color: var(--soft); }
.rk-stats { display: grid; grid-template-columns: 1fr 1fr; gap: calc(8 * var(--pa-u)); margin: 0 0 calc(14 * var(--pa-u)); }
.rk-stat { padding: calc(8 * var(--pa-u)); border-radius: calc(12 * var(--pa-u)); background: rgba(255, 255, 255, .1); }
.rk-stat b { display: block; font: 800 calc(22 * var(--pa-u)) / 1.1 'CatComic', 'Montserrat', sans-serif; color: #fff; }
.rk-stat span { display: block; margin-top: 2px; font: 700 calc(10.5 * var(--pa-u)) 'Montserrat', sans-serif; color: var(--soft); }
.rk-nota { margin: calc(10 * var(--pa-u)) 0 0; font: 600 calc(11.5 * var(--pa-u)) / 1.35 'Montserrat', sans-serif; color: var(--soft); opacity: .85; }
.pa-btn[disabled] { opacity: .6; filter: grayscale(.4); }

/* Aviso "¡Racha de N días!" */
.rk-toast {
    position: fixed; z-index: 2500; left: 50%; top: max(env(safe-area-inset-top), 12px);
    transform: translate(-50%, -150%);
    display: flex; align-items: center; gap: 10px; max-width: calc(100vw - 24px); box-sizing: border-box;
    padding: 10px 18px; border-radius: 999px; background: #240804; color: #fff;
    font: 800 15px 'Montserrat', system-ui, sans-serif;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .45), 0 0 0 2px #ff7a00;
    transition: transform .4s cubic-bezier(.2, 1.2, .4, 1);
}
.rk-toast.in { transform: translate(-50%, 0); }
.rk-toast .rk-ico { width: 24px; height: 24px; display: inline-flex; }

/* Aviso de racha congelada (toca para abrir) */
.rk-toast-frio { box-shadow: 0 8px 24px rgba(0, 0, 0, .45), 0 0 0 2px #38bdf8; background: #06223f; }
.rk-toast-frio .rk-ico { filter: none; }

/* Recordatorios push dentro de la tarjeta */
.rk-avisos { margin: calc(12 * var(--pa-u)) 0 0; display: flex; align-items: center; justify-content: center; gap: calc(10 * var(--pa-u)); flex-wrap: wrap; }
.rk-avisos:empty { display: none; }
.rk-avisos .rk-nota { margin: 0; }
.rk-aviso-btn {
    display: inline-flex; align-items: center; gap: calc(8 * var(--pa-u)); cursor: pointer; border: 0; border-radius: 99px;
    padding: calc(8 * var(--pa-u)) calc(14 * var(--pa-u)); background: rgba(255, 255, 255, .14); color: #fff;
    font: 800 calc(12 * var(--pa-u)) 'Montserrat', system-ui, sans-serif; -webkit-tap-highlight-color: transparent;
}
.rk-aviso-btn:active { transform: scale(.96); }
.rk-aviso-btn[disabled] { opacity: .6; }
.rk-aviso-ico { width: calc(16 * var(--pa-u)); height: calc(16 * var(--pa-u)); display: inline-flex; }
.rk-aviso-ico svg { width: 100%; height: 100%; display: block; }
.rk-aviso-ok { font: 700 calc(12 * var(--pa-u)) 'Montserrat', sans-serif; color: var(--soft); }
.rk-aviso-off { border: 0; background: none; cursor: pointer; text-decoration: underline; color: var(--soft); opacity: .8; font: 700 calc(11.5 * var(--pa-u)) 'Montserrat', sans-serif; }

/* Anuncio (modo prueba) */
.rk-ad {
    position: fixed; inset: 0; z-index: 2700; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
    background: #0b0b0f; color: #fff; text-align: center; padding: 24px; box-sizing: border-box;
    font-family: 'Montserrat', system-ui, sans-serif;
}
.rk-ad b { font-size: 20px; }
.rk-ad p { margin: 0; max-width: 300px; font-size: 13px; line-height: 1.4; opacity: .75; }
.rk-ad-num { font: 800 54px/1 'Montserrat', sans-serif; }
.rk-ad button { border: 0; border-radius: 999px; padding: 10px 22px; cursor: pointer; font: 800 14px 'Montserrat', sans-serif; background: #fff; color: #111; }
.rk-ad button.sec { background: none; color: #fff; opacity: .7; text-decoration: underline; padding: 6px; }

@media (prefers-reduced-motion: reduce) { .rk-chip, .rk-toast { animation: none !important; transition: none !important; } }