/* ============================================================
   BONOS (regalo premium) — bonos.js. Archivo PROPIO: no toca app.css
   (que diverge entre local y producción). Reusa los componentes base
   (.ui-row, .ui-card, .ui-tile, .ui-badge, .ui-chip, .exit-btn, .btn)
   y el chat .conv-* de la Conversación.
   ============================================================ */
.bns-inner{max-width:640px}
.bns-head{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:14px}
.bns-list{display:flex; flex-direction:column; gap:10px}
.bns-card .ui-row__text b, .bns-op .ui-row__text b{display:block; font-size:15px; color:var(--ink)}
.bns-card .ui-row__text small, .bns-op .ui-row__text small{display:block; font-size:12.5px; color:var(--muted); margin-top:2px}
.bns-ic{width:40px; height:40px; border-radius:12px; background:var(--accent-soft); color:var(--accent-2); display:flex; align-items:center; justify-content:center}
.bns-ic svg, .bns-card .ui-row__trail svg, .bns-op .ui-row__trail > svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.bns-q{margin:18px 0 10px}
.bns-op{display:flex; flex-direction:column; gap:4px}
.bns-last{align-self:flex-end; background:none; border:0; padding:2px 6px; font:inherit; font-size:12.5px; color:var(--navy); text-decoration:underline; cursor:pointer}
/* .ui-card no trae padding: cada pantalla pone el suyo (igual que .conv-report-card) */
.ui-card.bns-brief, .ui-card.bns-inf{padding:var(--s-4)}
.bns-brief p{margin:0 0 10px; line-height:1.55}
.bns-brief p:last-child{margin-bottom:0}
.bns-obj{font-weight:600; color:var(--ink)}
.bns-brief-soft{color:var(--muted); font-size:13px}
.bns-actions{display:flex; justify-content:center; margin:18px 0 6px}
.bns-count{font-size:12.5px; color:var(--muted); font-variant-numeric:tabular-nums}
.bns-rot{margin:0 0 6px; font-size:11.5px; font-weight:600; color:var(--muted); letter-spacing:.02em}
.bns-links{display:flex; gap:14px; margin-top:8px}
.bns-link{background:none; border:0; padding:0; font:inherit; font-size:12.5px; color:var(--navy); text-decoration:underline; cursor:pointer}
.bns-chat .conv-bubble .bns-en{margin-top:8px}
.bns-es{margin:6px 0 0; font-size:14px; color:var(--muted); font-style:italic}
.bns-frase{margin:2px 0 0; font-family:var(--serif); font-size:22px; line-height:1.35; color:var(--ink)}
.bns-fecha{margin:6px 0 0; font-size:12.5px; color:var(--muted)}
.bns-inf{margin-top:14px}
.bns-inf > p{margin:0 0 8px; line-height:1.55}
.bns-item{padding:12px 0; border-top:1px solid var(--line)}
.bns-inf .ui-eyebrow + .bns-item, .bns-inf > p + .bns-item{border-top:0}
.bns-item p{margin:0 0 4px; line-height:1.5}
.bns-pq{font-weight:600; color:var(--ink)}
.bns-said{color:var(--muted)}
.bns-nat{color:var(--good-ink)}
.bns-nota{font-size:13.5px; color:var(--muted)}
.bns-say{display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; margin-left:6px; border-radius:50%; border:1px solid var(--line-2); background:var(--surface); color:var(--accent-2); cursor:pointer; vertical-align:middle}
.bns-say svg{width:12px; height:12px; fill:currentColor}
.bns-tag{display:inline-block; margin-left:6px; padding:1px 8px; border-radius:999px; font-size:11.5px; font-weight:600; vertical-align:middle; background:var(--canvas-2); color:var(--muted)}
.bns-tag.ok{background:var(--good-soft); color:var(--good-ink)}
.bns-tag.no{background:var(--rec-soft); color:var(--rec)}
.bns-verdict{text-align:center}
.bns-verdict.ok{border-color:var(--good)}
.bns-verdict.no{border-color:var(--rec)}
.bns-verdict.mid{border-color:var(--accent)}
.bns-v-t{margin:0; font-family:var(--serif); font-size:22px; font-weight:700; color:var(--ink)}
.bns-verdict.ok .bns-v-t{color:var(--good-ink)}
.bns-v-s{margin:4px 0 0; font-size:13.5px; color:var(--muted)}
.bns-ok-list summary{cursor:pointer; font-weight:600}
.bns-ok-list ul{margin:10px 0 0; padding-left:18px; color:var(--muted); line-height:1.6}
.bns-chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:8px}
.bns-chip{border:1px solid var(--accent); background:var(--accent-soft); color:var(--accent-ink); border-radius:999px; padding:4px 12px; font:inherit; font-size:13.5px; cursor:pointer}
.bns-cierre{margin:14px 0 0; text-align:center; color:var(--muted); font-style:italic}