/* Microblog "DIA D" — cobertura ao vivo da 2ª fase OAB.
   Reaproveita tokens e shell (nav/hero/btn/footer) do blog.css. Aqui ficam só
   os componentes da timeline ao vivo + sala de comando. Layout = padrão dashboard (OPS). */

/* ---- barra de status sob o hero ---- */
.live-bar{
  border-bottom:1px solid var(--line-soft);
  background:var(--bg-deep);
  color:var(--cream-text);
}
.live-bar .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px;padding-block:12px}
.live-stat{display:flex;align-items:baseline;gap:8px;font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(236,226,198,.62)}
.live-stat b{font-family:var(--disp);font-size:1.5rem;letter-spacing:.02em;color:var(--gold);line-height:1}
.live-stat.is-live b{color:var(--cream-text)}
.live-flag{display:inline-flex;align-items:center;gap:8px;margin-right:auto;font-family:var(--disp);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--cream-text)}
.live-dot{width:11px;height:11px;border-radius:50%;background:var(--red);box-shadow:0 0 0 0 rgba(182,55,45,.7);animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(214,84,63,.7)}70%{box-shadow:0 0 0 12px rgba(214,84,63,0)}100%{box-shadow:0 0 0 0 rgba(214,84,63,0)}}

/* ---- aviso de prévia (enquanto o monitor não está ligado) ---- */
.demo-banner{
  border:1px solid var(--line);
  background:color-mix(in srgb,var(--gold) 18%,var(--panel));
  padding:12px 16px;margin:0 0 22px;
  display:flex;gap:12px;align-items:center;
  font-size:.95rem;color:var(--ink-soft);line-height:1.4;
}
.demo-banner b{color:var(--ink)}
.demo-banner .tagmono{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--red)}

/* ---- grid de cobertura: timeline + comando ---- */
.cov-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,360px);gap:26px;align-items:start}

/* ---- filtros ---- */
.filters{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:10px 16px;margin-bottom:18px}
.chips-row{display:flex;flex-wrap:wrap;gap:8px;flex:1 1 auto}
.fonte-row{flex:0 0 auto;margin-left:auto}
.chip{
  min-height:34px;display:inline-flex;align-items:center;gap:7px;padding:0 13px;
  border:1px solid var(--line);background:var(--panel);color:var(--ink);
  font-family:var(--disp);font-weight:700;font-size:.82rem;letter-spacing:.05em;text-transform:uppercase;
  cursor:pointer;transition:transform .12s ease,background .12s ease,color .12s ease;
}
.chip:hover{transform:translateY(-1px)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.chip .n{font-family:var(--mono);font-size:.62rem;opacity:.7}
.filters select{
  min-height:34px;padding:0 12px;border:1px solid var(--line);background:var(--panel);color:var(--ink);
  font-family:var(--disp);font-weight:700;font-size:.82rem;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;
}

/* ---- feed / chamadas (timeline ao vivo, com trilho + nós de hora) ---- */
.feed{display:grid;gap:14px;position:relative;padding-left:32px}
.feed::before{content:"";position:absolute;left:10px;top:6px;bottom:6px;width:2px;background:linear-gradient(180deg,var(--gold),var(--line-soft))}
.feed-empty{border:1px dashed var(--line);background:var(--panel);padding:34px 22px;text-align:center;color:var(--ink-soft);margin-left:-12px}
.feed-more{display:block;width:100%;margin-top:4px;padding:15px;text-align:center;border:1px solid var(--line);background:var(--panel-2);color:var(--ink);font-family:var(--disp);font-weight:700;font-size:.92rem;letter-spacing:.05em;text-transform:uppercase;cursor:pointer}
.feed-more:hover{background:color-mix(in srgb,var(--gold) 18%,var(--panel))}
.call{
  position:relative;border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);
  padding:16px 18px;display:grid;gap:11px;
}
.call::before{content:"";position:absolute;left:-28px;top:18px;width:14px;height:14px;border-radius:50%;border:2px solid var(--gold);background:var(--panel);box-shadow:0 0 0 3px var(--bg)}
.call.featured{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),var(--shadow)}
.call.featured::before{background:var(--red);border-color:var(--red);box-shadow:0 0 0 3px var(--bg),0 0 12px var(--red)}
.call.featured .now-flag{display:inline-flex}
.now-flag{display:none;align-items:center;gap:6px;margin-left:auto;font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.now-flag i{width:7px;height:7px;border-radius:50%;background:var(--red);animation:pulse 1.8s infinite}
.call.is-new{animation:flashin .9s ease}
@keyframes flashin{0%{background:color-mix(in srgb,var(--gold) 26%,var(--panel))}100%{background:var(--panel)}}
.call-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.call-time{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.call-time .ago{color:color-mix(in srgb,var(--ink-soft) 70%,transparent)}
.call-badge{
  margin-left:auto;display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border:1px solid var(--line);
  font-family:var(--disp);font-weight:700;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;
}
.badge--aposta{background:var(--red);color:#fff;border-color:#181a12}
.badge--dica{background:var(--gold);color:#17160d;border-color:#181a12}
.badge--sumula{background:var(--olive);color:#fff;border-color:#181a12}
.badge--lei{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.badge--gabarito{background:color-mix(in srgb,var(--gold) 30%,var(--panel));color:var(--ink)}
.badge--urgente{background:var(--red);color:#fff;border-color:#181a12;animation:pulsebadge 1.4s infinite}
.badge--tese{background:color-mix(in srgb,var(--red) 78%,#000);color:#fff;border-color:#181a12}
.badge--pegadinha{background:#7a2016;color:#fff;border-color:#181a12}
.badge--peca{background:var(--olive);color:#fff;border-color:#181a12}
.badge--prazo{background:var(--ink);color:var(--cream);border-color:var(--ink)}
.badge--mnemonico{background:color-mix(in srgb,var(--gold) 55%,var(--panel));color:var(--ink)}
@keyframes pulsebadge{50%{opacity:.55}}
.call-who{display:flex;align-items:center;gap:11px}
.avatar{
  width:38px;height:38px;flex:none;display:grid;place-items:center;border:1px solid var(--line);
  background:var(--gold);color:#16170d;font-family:var(--disp);font-weight:700;font-size:.9rem;line-height:1;
  box-shadow:3px 3px 0 rgba(0,0,0,.2);
}
.avatar--logo{background:#2e3020;padding:0;overflow:hidden}
.avatar--logo img{width:100%;height:100%;display:block;object-fit:cover}
.live-logo{width:24px;height:24px;flex:none;display:block;border:1px solid var(--line-soft);background:#2e3020;object-fit:cover}
.call-who .who-name{font-family:var(--disp);font-weight:700;font-size:1rem;text-transform:uppercase;line-height:1.1}
.call-who .who-sub{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.call-body{font-size:1.04rem;line-height:1.5;color:var(--ink)}
.call-body.clamp{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.call-body.expanded{display:block}
.show-more{margin-top:2px;background:none;border:0;color:var(--red);font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;padding:0}
.show-more:hover{text-decoration:underline}
.call-body q{quotes:"“" "”"}
.call-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;border-top:1px solid var(--line-soft);padding-top:10px;font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.call-foot a{color:var(--red);font-weight:700}
.call-tag{border:1px solid var(--line-soft);padding:2px 7px}
.conf{margin-left:auto;display:inline-flex;align-items:center;gap:6px}
.conf i{width:8px;height:8px;background:var(--olive)}
.conf.media i{background:var(--gold)}
.conf.baixa i{background:var(--ink-soft)}

/* ---- coluna sala de comando ---- */
.command{position:static;display:grid;gap:16px}
.panel{border:1px solid var(--line);background:var(--panel-2);box-shadow:var(--shadow);padding:16px}
.panel > h3{margin:0 0 12px;font-family:var(--disp);font-size:1.15rem;text-transform:uppercase;letter-spacing:.03em;display:flex;align-items:center;gap:8px}
.panel > h3 .pmark{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;color:var(--red)}
.panel > h3 .pmark.off{color:var(--ink-soft)}
.live-row .live-logo{width:26px;height:26px;border-radius:50%;object-fit:cover;border:1px solid var(--line-soft);background:#fff;flex:none}
.lives-list{display:grid;gap:8px}
.live-row{display:flex;align-items:center;gap:10px;padding:7px 9px;border:1px solid var(--line-soft);background:var(--panel)}
.live-row .st{width:9px;height:9px;border-radius:50%;flex:none;background:var(--ink-soft)}
.live-row.on .st{background:#3fae5a;box-shadow:0 0 9px #3fae5a;animation:pulse 1.8s infinite}
.live-row .lv-name{font-family:var(--disp);font-weight:700;font-size:.86rem;text-transform:uppercase;line-height:1}
.live-row .lv-meta{margin-left:auto;font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.placar{display:grid;gap:11px}
.placar-row{display:grid;gap:5px}
.placar-row .pr-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.placar-row .pr-area{font-family:var(--disp);font-weight:700;font-size:.86rem;text-transform:uppercase}
.placar-row .pr-peca{font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.bar{height:9px;border:1px solid var(--line);background:var(--panel);overflow:hidden}
.bar > i{display:block;height:100%;background:var(--gold)}
.poll-opt{display:grid;gap:4px;margin-bottom:9px}
.poll-opt .po-top{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.muted-note{font-size:.82rem;color:var(--ink-soft);line-height:1.4;margin:.4em 0 0}

/* ---- hero compacto da cobertura ---- */
.hero.cov-hero .hero-grid{grid-template-columns:1fr;padding-block:clamp(48px,8vh,84px) clamp(26px,4vh,40px)}
.hero.cov-hero h1{font-size:clamp(2.8rem,9vw,6.2rem)}
.hero.cov-hero h1 span{display:inline;color:var(--gold)}

/* ---- banner "Reunião de véspera" ---- */
.vespera-banner{
  position:relative;overflow:hidden;border:2px solid var(--ink);
  background:linear-gradient(135deg,#15170e,#2b2e1f);color:var(--cream);box-shadow:var(--shadow);
  display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px 26px;
  padding:20px 24px 20px 30px;margin:0 0 26px;
}
.vespera-banner::before{content:"";position:absolute;left:0;top:0;bottom:0;width:10px;background:repeating-linear-gradient(45deg,#0d0d09 0 10px,var(--gold) 10px 20px)}
.vespera-banner .vb-flag{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.vespera-banner .vb-flag i{width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red);animation:pulse 1.8s infinite}
.vespera-banner h3{margin:5px 0 0;font-family:var(--disp);font-weight:700;font-size:clamp(1.5rem,3.6vw,2.6rem);line-height:.95;text-transform:uppercase;color:var(--cream)}
.vespera-banner h3 b{color:var(--gold)}
.vespera-banner .vb-when{font-family:var(--disp);font-weight:700;text-transform:uppercase;line-height:1;text-align:center;white-space:nowrap}
.vespera-banner .vb-when .h{display:block;font-size:clamp(1.5rem,3.4vw,2.4rem);color:var(--gold)}
.vespera-banner .vb-when .l{font-family:var(--mono);font-size:.56rem;letter-spacing:.16em;color:rgba(244,236,212,.7)}
@media (max-width:760px){
  .vespera-banner{grid-template-columns:1fr;gap:12px;text-align:left}
  .vespera-banner .vb-when{text-align:left}
  .vespera-banner .btn{width:100%}
}

@media (max-width:980px){
  .cov-grid{grid-template-columns:1fr}
  .command{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}
  .command .panel.poll{grid-column:1/-1}
}
@media (max-width:620px){
  .command{grid-template-columns:1fr}
  .call-badge{margin-left:0}
  .live-bar .wrap{gap:8px 18px}
}