:root { --bg:#f5f7fb; --card:#fff; --text:#1d2433; --muted:#6b7487; --line:#e3e7ef; --brand:#2563eb; --ok:#2f9e6e; --bad:#d9534f; --warn:#e0a100; }
@media (prefers-color-scheme: dark) { :root { --bg:#12151c; --card:#1b2029; --text:#e6e9ef; --muted:#9aa3b5; --line:#2b3240; } }
* { box-sizing: border-box; }
body { margin:0; font:15px/1.5 system-ui, -apple-system, Segoe UI, sans-serif; background:var(--bg); color:var(--text); }
a { color:var(--brand); text-decoration:none; }
.top { display:flex; justify-content:space-between; align-items:center; padding:12px 24px; background:var(--card); border-bottom:1px solid var(--line); flex-wrap:wrap; gap:8px; }
.top nav { display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
.brand { font-weight:700; color:var(--text); }
main { max-width:1200px; margin:0 auto; padding:24px 16px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:20px; margin-bottom:20px; overflow-x:auto; }
.card.narrow { max-width:420px; margin:40px auto; }
.card-head { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; }
.kpis { display:grid; grid-template-columns:repeat(auto-fill, minmax(160px, 1fr)); gap:12px; margin-bottom:20px; }
.kpi { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:14px; display:flex; flex-direction:column; }
.kpi span, .kpi small { color:var(--muted); font-size:13px; }
.kpi strong { font-size:24px; }
.two-col { display:grid; grid-template-columns:1fr 1.4fr; gap:20px; }
@media (max-width: 900px) { .two-col { grid-template-columns:1fr; } }
.table { width:100%; border-collapse:collapse; }
.table th, .table td { text-align:left; padding:8px; border-bottom:1px solid var(--line); vertical-align:top; }
.table th { color:var(--muted); font-weight:600; font-size:13px; }
.muted { color:var(--muted); } .small { font-size:13px; } .error { color:var(--bad); }
.btn { display:inline-block; padding:7px 14px; border:1px solid var(--line); border-radius:7px; background:var(--card); color:var(--text); cursor:pointer; font:inherit; }
.btn.primary { background:var(--brand); border-color:var(--brand); color:#fff; }
button.link { background:none; border:0; color:var(--brand); cursor:pointer; font:inherit; padding:0; }
form.inline { display:inline; }
.actions { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.row { display:flex; gap:8px; }
.pill { display:inline-block; padding:1px 9px; border-radius:99px; font-size:12px; background:var(--line); }
.pill.active, .pill.ready, .pill.inbox { background:#d8f3e6; color:#17603f; }
.pill.paused, .pill.warming { background:#fdf0cc; color:#7a5a00; }
.pill.error, .pill.disconnected, .pill.spam, .pill.missing { background:#fbdcdb; color:#8c1d1a; }
.score { width:42px; text-align:center; font-weight:700; border-radius:6px; padding:2px 0;
  background: color-mix(in srgb, var(--ok) calc(var(--v) * 1%), var(--bad)); color:#fff; }
.flash { padding:10px 14px; border-radius:8px; margin-bottom:14px; background:var(--line); }
.flash.success { background:#d8f3e6; color:#17603f; } .flash.error { background:#fbdcdb; color:#8c1d1a; }
.checks { list-style:none; padding:0; } .checks li::before { margin-right:6px; }
.checks li.ok::before { content:"✔"; color:var(--ok); } .checks li.bad::before { content:"✘"; color:var(--bad); }
.grid-form { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:14px 20px; }
.grid-form .field { display:flex; flex-direction:column; gap:4px; } .grid-form .full { grid-column:1/-1; }
.grid-form input, .grid-form select { padding:7px; border:1px solid var(--line); border-radius:6px; background:var(--card); color:var(--text); font:inherit; }
.grid-form ul { list-style:none; padding:0; margin:0; display:flex; gap:10px; flex-wrap:wrap; }
.has-error input { border-color:var(--bad); }
.htmx-indicator { display:none; } .htmx-request .htmx-indicator, .htmx-request.htmx-indicator { display:inline; }
.pools { padding-left:18px; }
.pill.ai, .pill.replied, .pill.completed { background:#dbe6fd; color:#1d3f8f; }
.pill.sent, .pill.draft, .pill.pending, .pill.template { background:var(--line); }
.pill.bounced, .pill.failed, .pill.unsubscribed, .pill.suppressed { background:#fbdcdb; color:#8c1d1a; }
.pill.in_progress, .pill.active_seq { background:#d8f3e6; color:#17603f; }
pre.mail-body { white-space:pre-wrap; font:13px/1.45 system-ui, sans-serif; background:var(--bg); padding:10px; border-radius:6px; max-width:560px; }
.grid-form textarea { padding:7px; border:1px solid var(--line); border-radius:6px; background:var(--card); color:var(--text); font:inherit; min-height:140px; }
.step { border:1px solid var(--line); border-radius:8px; padding:14px; margin-bottom:12px; }
.warn-box { background:#fdf0cc; color:#7a5a00; padding:10px 14px; border-radius:8px; margin:10px 0; }
.grid-form .field.actions { flex-direction:row; }
