:root{
  --bg:#f4f6f8; --panel:#ffffff; --ink:#1c2733; --muted:#6b7a89;
  --line:#e2e8ef; --brand:#0a6b6b; --brand-d:#085353;
  --ok:#1d8a4e; --okbg:#e6f5ec; --warn:#b5760a; --warnbg:#fdf3e2;
  --crit:#c0392b; --critbg:#fbeae8; --info:#2f6fb0; --infobg:#e9f1fa;
  --radius:10px; --shadow:0 1px 3px rgba(18,38,58,.08),0 1px 2px rgba(18,38,58,.04);
}
*{box-sizing:border-box}
body{
  margin:0;font-family:"Segoe UI",system-ui,-apple-system,sans-serif;
  background:var(--bg);color:var(--ink);font-size:14px;line-height:1.45;
}
.topbar{
  display:flex;justify-content:space-between;align-items:center;
  background:var(--brand);color:#fff;padding:.7rem 1.2rem;gap:1rem;flex-wrap:wrap;
}
.brand{display:flex;align-items:center;gap:.7rem}
.logo{font-size:1.8rem;line-height:1}
.brand strong{display:block;font-size:1.05rem}
.brand small{display:block;opacity:.85;font-size:.78rem}
.sync-area{display:flex;align-items:center;gap:.6rem;font-size:.82rem}
.btn-sync{
  background:#fff;color:var(--brand-d);border:none;padding:.45rem .9rem;
  border-radius:var(--radius);font-weight:600;cursor:pointer;font-size:.85rem;
}
.btn-sync:hover{background:#eef7f7}
.htmx-indicator{opacity:0;transition:opacity .2s}
.htmx-request .htmx-indicator,.htmx-indicator.htmx-request{opacity:1}
.toast{padding:.35rem .7rem;border-radius:6px;font-size:.8rem}
.toast.ok{background:var(--okbg);color:var(--ok)}
.toast.erro{background:var(--critbg);color:var(--crit)}

.tabs{display:flex;gap:.2rem;background:var(--panel);padding:0 1rem;
  border-bottom:1px solid var(--line);overflow-x:auto}
.tabs a{
  padding:.8rem 1rem;color:var(--muted);text-decoration:none;font-weight:600;
  border-bottom:3px solid transparent;white-space:nowrap;font-size:.9rem;
}
.tabs a:hover{color:var(--ink)}
.tabs a.active{color:var(--brand);border-bottom-color:var(--brand)}

main{max-width:1180px;margin:1.4rem auto;padding:0 1.2rem}
h1{font-size:1.3rem;margin:.2rem 0 1rem}
h2{font-size:1.05rem;margin:1.6rem 0 .7rem;color:var(--brand-d)}
.sub{color:var(--muted);margin:-.5rem 0 1.2rem;font-size:.9rem}

.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-bottom:1.4rem}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:1rem;box-shadow:var(--shadow)}
.kpi .v{font-size:1.9rem;font-weight:700;line-height:1}
.kpi .l{color:var(--muted);font-size:.8rem;margin-top:.3rem;text-transform:uppercase;letter-spacing:.03em}
.kpi.crit .v{color:var(--crit)} .kpi.warn .v{color:var(--warn)}
.kpi.ok .v{color:var(--ok)} .kpi.info .v{color:var(--info)}

.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);overflow:hidden;margin-bottom:1.4rem}
.panel .head{padding:.8rem 1rem;border-bottom:1px solid var(--line);font-weight:700;
  display:flex;justify-content:space-between;align-items:center}

table{width:100%;border-collapse:collapse;font-size:.86rem}
th,td{padding:.55rem .8rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
th{background:#fafbfc;color:var(--muted);font-weight:600;font-size:.74rem;
  text-transform:uppercase;letter-spacing:.03em;position:sticky;top:0}
tbody tr:hover{background:#f8fafb}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}

.tag{display:inline-block;padding:.12rem .5rem;border-radius:20px;font-size:.72rem;font-weight:700}
.tag.lib{background:var(--okbg);color:var(--ok)}
.tag.ind{background:var(--critbg);color:var(--crit)}
.tag.pend{background:var(--warnbg);color:var(--warn)}
.tag.susp{background:#eee;color:#555}
.tag.mdr{background:var(--critbg);color:var(--crit)}
.tag.rest{background:var(--infobg);color:var(--info)}
.dias{font-weight:700}
.dias.alerta{color:var(--crit)} .dias.atencao{color:var(--warn)}

.filtros{display:flex;gap:.7rem;align-items:flex-end;flex-wrap:wrap;
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:.9rem 1rem;margin-bottom:1.2rem;box-shadow:var(--shadow)}
.filtros label{display:block;font-size:.74rem;color:var(--muted);margin-bottom:.2rem;font-weight:600}
.filtros input{padding:.4rem .5rem;border:1px solid var(--line);border-radius:6px;font-size:.85rem}
.filtros button{background:var(--brand);color:#fff;border:none;padding:.45rem 1rem;
  border-radius:6px;font-weight:600;cursor:pointer}
.bar{height:8px;background:var(--brand);border-radius:4px;display:inline-block;vertical-align:middle}
.empty{padding:2rem;text-align:center;color:var(--muted)}
.hint{background:var(--infobg);border-left:3px solid var(--info);padding:.7rem 1rem;
  border-radius:6px;font-size:.84rem;color:#244;margin-bottom:1.2rem}

/* ---------- v2: login, detalhe, formulários ---------- */
.btn-nova{background:#fff;color:var(--brand-d);border:none;padding:.45rem .9rem;
  border-radius:var(--radius);font-weight:700;cursor:pointer;font-size:.85rem;text-decoration:none}
.btn-nova:hover{background:#eef7f7}
.userbox{color:#fff;font-size:.82rem;opacity:.95;margin-left:.4rem}
.userbox a{color:#fff;text-decoration:underline}

.login-wrap{display:flex;justify-content:center;margin-top:3rem}
.login-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:2rem;width:360px;max-width:92vw}
.login-form{display:flex;flex-direction:column;gap:.4rem;margin-top:1rem}
.login-form label{font-size:.78rem;color:var(--muted);font-weight:600;margin-top:.5rem}
.login-form select,.login-form input{padding:.55rem;border:1px solid var(--line);border-radius:6px;font-size:.95rem}
.login-form button{margin-top:1rem;background:var(--brand);color:#fff;border:none;
  padding:.6rem;border-radius:6px;font-weight:700;cursor:pointer;font-size:.95rem}

.back{color:var(--brand);text-decoration:none;font-size:.85rem;font-weight:600}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
@media(max-width:780px){.grid2{grid-template-columns:1fr}}
table.kv th{width:42%;text-transform:none;letter-spacing:0;font-weight:600;color:var(--muted);
  background:transparent;position:static}
table.kv td{font-weight:500}
.rowlink{color:var(--brand);text-decoration:none;font-weight:600}
.rowlink:hover{text-decoration:underline}
.info-tag{background:var(--infobg);color:var(--info)}

.panel.acao{border-left:3px solid var(--brand)}
.form-inline{display:flex;flex-wrap:wrap;gap:.9rem;align-items:flex-end;padding:1rem}
.form-inline>div{display:flex;flex-direction:column}
.form-inline .full{flex:1 1 100%}
.form-inline label{font-size:.74rem;color:var(--muted);font-weight:600;margin-bottom:.2rem}
.form-inline input,.form-inline select,.form-inline textarea{
  padding:.45rem .5rem;border:1px solid var(--line);border-radius:6px;font-size:.9rem;font-family:inherit}
.form-inline button{background:var(--brand);color:#fff;border:none;padding:.5rem 1.1rem;
  border-radius:6px;font-weight:700;cursor:pointer}

.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
@media(max-width:780px){.form-grid{grid-template-columns:1fr}}
.form-grid>div{display:flex;flex-direction:column}
.form-grid .full{grid-column:1 / -1}
.form-grid label{font-size:.78rem;color:var(--muted);font-weight:600;margin-bottom:.25rem}
.form-grid input,.form-grid select{padding:.5rem;border:1px solid var(--line);border-radius:6px;font-size:.92rem}
.form-grid button{background:var(--brand);color:#fff;border:none;padding:.6rem 1.4rem;
  border-radius:6px;font-weight:700;cursor:pointer;font-size:.95rem}