:root{
  --azul:#0147FF; --azul-d:#0036c4; --bg:#F6F8FF; --tinta:#04070F;
  --card:#fff; --linha:#e7ecf7; --suave:#6b7793; --ok:#11a86b; --erro:#e23a4e;
  --sombra:0 10px 30px rgba(4,7,15,.06);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--tinta);-webkit-font-smoothing:antialiased}
a{color:var(--azul);text-decoration:none}
button{font-family:inherit;cursor:pointer}

/* ---- Login ---- */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px;
  background:radial-gradient(1200px 600px at 50% -10%,#e8efff 0%,var(--bg) 55%)}
.login-card{background:var(--card);border:1px solid var(--linha);border-radius:20px;box-shadow:var(--sombra);
  width:100%;max-width:380px;padding:36px 30px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.02em;font-size:20px}
.brand .dot{width:13px;height:13px;border-radius:50%;background:var(--azul);box-shadow:0 0 0 4px rgba(1,71,255,.15)}
.login-card h1{font-size:18px;margin:22px 0 4px}
.login-card p.sub{color:var(--suave);font-size:13px;margin-bottom:22px}
label{display:block;font-size:12.5px;font-weight:600;color:var(--suave);margin:14px 0 6px}
input[type=text],input[type=password],input[type=number],select{
  width:100%;padding:12px 14px;border:1px solid var(--linha);border-radius:11px;font-size:14px;background:#fbfcff;outline:none;transition:.15s}
input:focus,select:focus{border-color:var(--azul);box-shadow:0 0 0 3px rgba(1,71,255,.12);background:#fff}
.btn{background:var(--azul);color:#fff;border:none;padding:12px 18px;border-radius:11px;font-weight:700;font-size:14px;width:100%;transition:.15s}
.btn:hover{background:var(--azul-d)}
.btn.sm{width:auto;padding:9px 14px;font-size:13px}
.btn.ghost{background:#eef2fe;color:var(--azul)}
.btn.ghost:hover{background:#e2e9ff}
.btn.danger{background:#fdecee;color:var(--erro)}
.btn.danger:hover{background:#fbd9de}
.msg{font-size:13px;margin-top:14px;padding:10px 12px;border-radius:10px;display:none}
.msg.show{display:block}
.msg.err{background:#fdecee;color:var(--erro)}
.msg.ok{background:#e7f7ef;color:var(--ok)}

/* ---- App ---- */
.topbar{background:var(--card);border-bottom:1px solid var(--linha);position:sticky;top:0;z-index:10}
.topbar .in{max-width:980px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;gap:16px}
.topbar .who{margin-left:auto;color:var(--suave);font-size:13px;display:flex;align-items:center;gap:12px}
.tabs{max-width:980px;margin:0 auto;padding:0 20px;display:flex;gap:6px;border-bottom:1px solid var(--linha)}
.tab{padding:13px 14px;font-size:14px;font-weight:600;color:var(--suave);border:none;background:none;border-bottom:2px solid transparent;margin-bottom:-1px}
.tab.active{color:var(--azul);border-bottom-color:var(--azul)}
.wrap{max-width:980px;margin:0 auto;padding:24px 20px 60px}
.card{background:var(--card);border:1px solid var(--linha);border-radius:16px;box-shadow:var(--sombra);padding:22px;margin-bottom:18px}
.card h2{font-size:15px;margin-bottom:4px}
.card .hint{color:var(--suave);font-size:13px;margin-bottom:16px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}
.stat{background:#fbfcff;border:1px solid var(--linha);border-radius:13px;padding:16px}
.stat .n{font-size:24px;font-weight:800;letter-spacing:-.02em}
.stat .l{font-size:12px;color:var(--suave);margin-top:2px}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;padding:5px 10px;border-radius:999px}
.pill.on{background:#e7f7ef;color:var(--ok)} .pill.off{background:#fdecee;color:var(--erro)}
.pill .d{width:7px;height:7px;border-radius:50%;background:currentColor}
.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:14px;flex-wrap:wrap}
.toolbar input[type=text]{flex:1;min-width:180px}
.glist{max-height:52vh;overflow:auto;border:1px solid var(--linha);border-radius:12px}
.grow{display:flex;align-items:center;gap:12px;padding:11px 14px;border-bottom:1px solid var(--linha)}
.grow:last-child{border-bottom:none}
.grow:hover{background:#fbfcff}
.grow input[type=checkbox]{width:18px;height:18px;accent-color:var(--azul);flex:none}
.grow .gn{font-size:14px;font-weight:500}
.grow.is-resumo{opacity:.55}
.grow .tag{font-size:11px;color:var(--azul);background:#eef2fe;padding:2px 8px;border-radius:6px;margin-left:auto}
.row{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.row .fld{flex:1;min-width:140px}
.switch{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;cursor:pointer}
.switch input{width:42px;height:24px;appearance:none;background:#d4dcf0;border-radius:999px;position:relative;transition:.2s;flex:none}
.switch input:checked{background:var(--azul)}
.switch input::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.2s}
.switch input:checked::after{left:21px}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:11px 12px;font-size:13.5px;border-bottom:1px solid var(--linha)}
th{color:var(--suave);font-size:12px;font-weight:600}
.muted{color:var(--suave);font-size:12.5px}
.count-bar{display:flex;align-items:center;gap:10px;margin-top:14px}
.spin{display:inline-block;padding:30px;text-align:center;color:var(--suave);width:100%}