:root{
  --roxo:#5B2A86; --rosa:#E91E63; --bg:#f4f1f8; --card:#fff;
  --texto:#2b2340; --suave:#7a7095; --linha:#ece6f3;
  --ok:#2e7d32; --atencao:#e69500; --urgente:#d32f2f;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--texto)}

.topbar{background:linear-gradient(135deg,var(--roxo),var(--rosa));color:#fff;padding:16px 18px;position:sticky;top:0;z-index:10;box-shadow:0 2px 12px rgba(91,42,134,.25)}
.brand{display:flex;align-items:center;gap:12px;max-width:960px;margin:0 auto}
.logo{font-size:2rem}
.topbar h1{font-size:1.25rem;margin:0;line-height:1.1}
.sub{font-size:.8rem;opacity:.85}

.container{max-width:960px;margin:0 auto;padding:16px}

.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:14px}
.stat{background:var(--card);border-radius:14px;padding:14px;text-align:center;box-shadow:0 1px 6px rgba(0,0,0,.05)}
.stat .num{display:block;font-size:1.8rem;font-weight:700;color:var(--roxo)}
.stat.urg .num{color:var(--urgente)}
.stat .lbl{font-size:.74rem;color:var(--suave);text-transform:uppercase;letter-spacing:.04em}

.filtros{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;margin-bottom:14px}
.chip{white-space:nowrap;padding:7px 14px;border-radius:999px;background:#fff;color:var(--roxo);text-decoration:none;font-size:.85rem;font-weight:600;border:1px solid var(--linha)}
.chip.on{background:var(--roxo);color:#fff;border-color:var(--roxo)}

.lista{display:grid;gap:12px}
.card{background:var(--card);border-radius:16px;padding:15px;box-shadow:0 1px 8px rgba(0,0,0,.06);border-left:5px solid var(--linha)}
.card.urgente,.card.vencido{border-left-color:var(--urgente)}
.card.atencao{border-left-color:var(--atencao)}
.card.ok{border-left-color:var(--ok)}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.card-top h2{font-size:1.05rem;margin:0}
.proc{font-family:ui-monospace,"Cascadia Code",monospace;font-size:.82rem;color:var(--suave);margin:2px 0 8px}
.meta{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.meta span{font-size:.78rem;background:#f3eefa;color:var(--roxo);padding:3px 9px;border-radius:8px}
.prazo-row{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.data{display:flex;align-items:center;gap:6px;font-size:.95rem}
.urg{font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:8px}
.urg.urgente,.urg.vencido{background:#fdecea;color:var(--urgente)}
.urg.atencao{background:#fff6e5;color:var(--atencao)}
.urg.ok{background:#eaf5ea;color:var(--ok)}
.badge{font-size:.68rem;text-transform:uppercase;font-weight:700;padding:3px 9px;border-radius:999px;letter-spacing:.03em}
.badge.pendente{background:#fff6e5;color:var(--atencao)}
.badge.lancado{background:#e7f0ff;color:#1565c0}
.badge.concluido{background:#eaf5ea;color:var(--ok)}
.btn{background:var(--roxo);color:#fff;border:none;padding:8px 12px;border-radius:10px;font-size:.82rem;font-weight:600;cursor:pointer}
.btn.ghost{background:#fff;color:var(--roxo);border:1px solid var(--roxo)}
.origem{margin-top:10px;font-size:.78rem;color:var(--suave)}
.demo-aviso{background:#fff6e5;border:1px solid #ffe0a3;color:#8a6d00;padding:10px 12px;border-radius:12px;font-size:.85rem;margin-bottom:14px}
.vazio{text-align:center;color:var(--suave);padding:30px}
.rodape{text-align:center;font-size:.75rem;color:var(--suave);padding:20px}

@media(min-width:640px){
  .stats{grid-template-columns:repeat(4,1fr)}
  .lista{grid-template-columns:repeat(2,1fr)}
  .topbar h1{font-size:1.4rem}
}