/* "Enquanto você estava fora" — ver resumo.js. Tokens do index.html; peças do kit s-* (secoes.css). */

.rs-overlay { align-items:center; }
/* Título, período e "Entendi" sempre à vista; só a lista do meio rola. */
.card.rs-card {
  width:min(600px, 100%); max-height:min(calc(100dvh - 32px), 860px); padding:20px 20px 16px;
  display:flex; flex-direction:column; gap:16px; overflow:hidden;
  background:
    radial-gradient(120% 60% at 0% 0%, rgba(56,189,248,.12), transparent 60%),
    radial-gradient(80% 50% at 100% 0%, rgba(124,92,255,.10), transparent 60%),
    var(--vidro-denso);
}
.rs-cab { display:flex; align-items:flex-start; gap:12px; }
.rs-cab-txt { flex:1; min-width:0; }
.rs-cab h2 { margin:0; font-size:19px; font-weight:700; letter-spacing:.1px; }
.rs-cab p { margin:4px 0 0; color:var(--muted); font-size:13px; }
.rs-periodo { display:flex; gap:6px; flex-wrap:wrap; margin-top:-6px; }

.rs-corpo {
  display:flex; flex-direction:column; gap:18px; flex:0 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain;
  margin:0 -20px; padding:0 20px 2px;
}
.rs-cab, .rs-periodo, .rs-pe { flex:none; }

/* o tempo do Claude */
.rs-tempo {
  display:flex; flex-direction:column; gap:12px; padding:14px 16px; border-radius:14px;
  background:var(--vidro-leve); border:1px solid var(--vidro-brd); box-shadow:var(--vidro-topo);
}
.rs-tempo-cab { display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.rs-tempo-num {
  font-size:30px; font-weight:750; letter-spacing:-.5px; line-height:1;
  background:linear-gradient(90deg, var(--accent), #7c5cff 70%, var(--ok)); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.rs-tempo-leg { color:var(--muted); font-size:13px; }
.rs-barras { display:flex; flex-direction:column; gap:4px; }
.rs-barra {
  display:grid; grid-template-columns:minmax(0, 9em) minmax(0, 1fr) auto; align-items:center; gap:10px;
  padding:5px 6px; margin:0 -6px; border:none; border-radius:8px; background:none; color:var(--text); font:inherit; cursor:pointer; text-align:left;
}
.rs-barra:hover:not(:disabled) { background:rgba(255,255,255,.04); }
.rs-barra:disabled { cursor:default; }
.rs-barra-nome { font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rs-barra-trilho { height:7px; border-radius:99px; background:rgba(255,255,255,.07); overflow:hidden; }
.rs-barra-trilho i { display:block; height:100%; border-radius:99px; background:linear-gradient(90deg, rgba(56,189,248,.65), var(--accent)); }
.rs-barra-val { font-size:12px; color:var(--muted); min-width:4.5em; text-align:right; }

/* seções */
.rs-sec { display:flex; flex-direction:column; gap:6px; }
.rs-sec h3 {
  margin:0 0 2px; display:flex; align-items:center; gap:8px;
  font-size:10.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--muted);
}
.rs-conta { font-variant-numeric:tabular-nums; opacity:.75; }
.rs-lista { display:flex; flex-direction:column; gap:2px; }
.rs-item {
  display:flex; align-items:center; gap:11px; width:100%; min-width:0; padding:8px 10px; border-radius:11px; text-align:left;
  border:1px solid transparent; background:none; color:var(--text); font:inherit; cursor:pointer;
}
button.rs-item:hover { background:var(--vidro-leve); border-color:var(--vidro-brd); }
.rs-item:focus-visible, .rs-barra:focus-visible, .rs-mais:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
.rs-estatico { cursor:default; }
.rs-esp { background:rgba(245,181,68,.05); border-color:rgba(245,181,68,.18); }
button.rs-esp:hover { border-color:rgba(245,181,68,.45); }
.rs-ic {
  flex:none; width:26px; height:26px; display:grid; place-items:center; border-radius:8px;
  font-size:12.5px; font-weight:700; color:var(--muted); background:rgba(255,255,255,.05);
}
.rs-ic.ok { color:var(--ok); background:rgba(45,212,167,.12); }
.rs-ic.warn { color:var(--warn); background:rgba(245,181,68,.14); }
.rs-ic.err { color:var(--err); background:rgba(248,113,113,.12); }
.rs-ic.ac { color:var(--accent); background:rgba(56,189,248,.12); }
.rs-ic.rev { color:var(--warn); background:rgba(245,181,68,.10); }
.rs-txt { flex:1; min-width:0; display:flex; flex-direction:column; gap:1px; }
.rs-txt b { font-size:13.5px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rs-txt small { font-size:12px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rs-auto { color:var(--accent); font-weight:700; }
.rs-ir { flex:none; font-size:12px; font-weight:650; color:var(--warn); }
.rs-mais { align-self:flex-start; border:none; background:none; color:var(--accent); font:inherit; font-size:12.5px; font-weight:600; cursor:pointer; padding:4px 10px; border-radius:6px; }

.rs-chips { display:flex; flex-wrap:wrap; gap:6px; }
button.rs-vivo { padding:5px 11px; font-size:12.5px; gap:7px; }
.rs-pulso { width:7px; height:7px; border-radius:50%; background:var(--accent); animation:rs-pulso 1.8s ease-in-out infinite; }
@keyframes rs-pulso { 50% { opacity:.25; } }
.rs-nada { padding:24px 10px; }

.rs-pe { display:flex; align-items:center; gap:10px; padding-top:4px; border-top:1px solid rgba(255,255,255,.06); padding-top:12px; }
.rs-pe .s-btn { min-width:110px; }

@media (max-width:860px) {
  .rs-overlay { padding:10px; }
  .card.rs-card { padding:16px 14px 14px; max-height:calc(100dvh - 20px); }
  .rs-corpo { margin:0 -14px; padding:0 14px 2px; }
  .rs-tempo-num { font-size:26px; }
  .rs-barra { grid-template-columns:minmax(0, 7em) minmax(0, 1fr) auto; }
  .rs-pe .s-dica { display:none; }
}
@media (prefers-reduced-motion: reduce) { .rs-pulso { animation:none; } }
