/* El caso del Bar Bianco */
.cl-nombres { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; max-width: 760px; margin: 0 auto; }
.cl-turno { text-align: center; padding: var(--space-3) 0; }
.cl-sobre { width: min(320px, 90%); aspect-ratio: 4 / 3; margin: 0 auto var(--space-2); border-radius: 12px; border: 0; cursor: pointer; position: relative; display: block;
  background: linear-gradient(160deg, #e9dcc0, #cdb98f); box-shadow: 0 20px 50px -24px rgba(0,0,0,.9); color: #3a2a17; font: 700 1.1rem var(--font-body); }
.cl-sobre::before { content: ''; position: absolute; inset: 0 0 45% 0; background: linear-gradient(160deg, #dccaa3, #c3ad80); clip-path: polygon(0 0, 100% 0, 50% 100%); border-radius: 12px 12px 0 0; }
.cl-sobre::after { content: ''; position: absolute; left: 50%; top: 48%; width: 46px; height: 46px; margin: -23px 0 0 -23px; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #e3343f, #8e1519); box-shadow: 0 3px 8px rgba(0,0,0,.4); }
.cl-sobre span { position: absolute; left: 0; right: 0; bottom: 14%; }
.cl-ficha { max-width: 640px; margin: 0 auto; padding: 22px 24px; border-radius: 16px; background: #17140f; border: 1px solid #4a3b26; color: #e8dcc3; }
.cl-ficha h3 { color: #f4e7c8; margin: 4px 0 10px; font-size: 1.5rem; }
.cl-ficha dt { font-family: var(--font-mono); font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--luz); margin-top: 12px; }
.cl-ficha dd { margin: 4px 0 0; color: #e8dcc3; }
.cl-ficha.is-culpable { border-color: var(--rojo-vivo); box-shadow: 0 0 40px -12px var(--rojo-vivo); }
.cl-culpable { margin-top: 14px; padding: 10px 12px; border-radius: 10px; background: rgba(210,31,43,.25); color: #ffd1d4; font-weight: 700; }
.cl-ronda { max-width: 680px; margin: 0 auto; }
.cl-reloj { font: 700 clamp(3rem, 2rem + 6vw, 5rem) var(--font-mono); color: var(--tiza); text-align: center; font-variant-numeric: tabular-nums; }
.cl-pistas { display: grid; gap: 10px; margin-top: var(--space-2); }
.cl-pista { padding: 14px 16px; border-radius: 12px; background: var(--surface); border-left: 3px solid var(--luz); color: var(--tiza-2); }
.cl-votos { display: grid; gap: 10px; max-width: 560px; margin: 0 auto; }
.cl-voto { display: grid; grid-template-columns: 1fr 1.4fr; gap: 10px; align-items: center; }
.cl-voto span { color: var(--tiza); }
.cl-revela { text-align: center; }
.cl-revela__n { font: 800 clamp(2rem, 1.4rem + 3vw, 3.2rem) var(--font-body); color: var(--rojo-vivo); margin: 10px 0; animation: cl-golpe .9s var(--ease-snap) both; }
@keyframes cl-golpe { from { opacity: 0; transform: scale(1.6); filter: blur(8px); } to { opacity: 1; transform: none; filter: none; } }
.cl-ranking { list-style: none; padding: 0; max-width: 480px; margin: 12px auto; text-align: left; }
.cl-ranking li { display: flex; justify-content: space-between; padding: 8px 12px; border-bottom: 1px solid var(--line-soft); color: var(--tiza-2); }
.cl-ranking li.is-ok { color: #86efac; }
@media (prefers-reduced-motion: reduce) { .cl-revela__n { animation: none !important; } }
@media print {
  .bb-imprimible .cp-ficha dt { font-family: var(--font-mono); font-size: 8pt; letter-spacing: .14em; text-transform: uppercase; color: #8E1519; margin-top: 4mm; }
  .bb-imprimible .cp-ficha dd { margin: 1mm 0 0; }
  .bb-imprimible .cp-ficha h2 { font-size: 22pt; margin: 2mm 0 4mm; }
  .bb-imprimible .cp-culpable { margin-top: 5mm; padding: 3mm; border: 2px solid #8E1519; font-weight: 700; }
}
.bb-app .cl-ranking { display: block; }