:root{--bg:#f5f6f8;--fg:#1c2230;--muted:#5b6472;--line:#dfe3ea;--card:#fff;--brand:#1f3864;--ok:#1e7a4c;--okbg:#e5f5ec;--err:#b3261e;--errbg:#fbeaea;--warn:#8a5a00;--warnbg:#fdf1de}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:var(--bg);color:var(--fg);line-height:1.45;font-size:15px}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
main.wrap{padding-top:22px;padding-bottom:60px}
header.top{background:var(--brand);color:#fff}
.bar{display:flex;align-items:center;gap:18px;min-height:52px;flex-wrap:wrap}
.brand{color:#fff;font-weight:700;text-decoration:none;font-size:18px}
header nav{display:flex;gap:14px;align-items:center;flex:1;flex-wrap:wrap}
header a{color:#dbe6ff;text-decoration:none}header a:hover{color:#fff;text-decoration:underline}
.emp{color:#fff}.sep{opacity:.4}
.who{font-size:13px;opacity:.85}
form.inline{display:inline-flex;gap:8px;align-items:center}
button.link{background:none;border:0;color:#dbe6ff;cursor:pointer;text-decoration:underline;font:inherit}
h1{font-size:24px;margin:0 0 6px}h2{font-size:18px;margin:26px 0 10px}
.sub{color:var(--muted);margin:0 0 18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin:0 0 16px}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.kpi .n{font-size:26px;font-weight:700}.kpi .l{color:var(--muted);font-size:13px}
table{border-collapse:collapse;width:100%;background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden}
th,td{padding:8px 10px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
th{background:#eef1f6;font-size:13px;color:#334}tr:last-child td{border-bottom:0}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
label{display:block;font-weight:600;margin:12px 0 4px}
input[type=text],input[type=email],input[type=password],input[type=search],select,input[type=file]{width:100%;max-width:420px;padding:8px 10px;border:1px solid #bfc6d2;border-radius:6px;font:inherit;background:#fff}
input.code{max-width:160px;letter-spacing:.2em;font-size:20px;text-align:center}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:end}
.row>div{min-width:0}
button,.btn{display:inline-block;background:var(--brand);color:#fff;border:0;border-radius:6px;padding:9px 16px;font:inherit;font-weight:600;cursor:pointer;text-decoration:none}
button.sec,.btn.sec{background:#e8ecf3;color:#1c2230}
button.danger{background:var(--err)}
button:disabled{opacity:.5;cursor:not-allowed}
.flash{padding:10px 14px;border-radius:8px;margin:0 0 16px;border:1px solid}
.flash.ok{background:var(--okbg);border-color:#b7e0c8;color:var(--ok)}
.flash.erro{background:var(--errbg);border-color:#f0c2be;color:var(--err)}
.flash.aviso{background:var(--warnbg);border-color:#efd39b;color:var(--warn)}
.tag{display:inline-block;padding:1px 8px;border-radius:99px;font-size:12px;font-weight:600;background:#e8ecf3}
.tag.ok{background:var(--okbg);color:var(--ok)}.tag.erro{background:var(--errbg);color:var(--err)}.tag.aviso{background:var(--warnbg);color:var(--warn)}
.muted{color:var(--muted)}.small{font-size:13px}
.qr{width:200px;height:200px;image-rendering:pixelated;border:1px solid var(--line)}
code.secret{background:#eef1f6;padding:3px 8px;border-radius:4px;word-break:break-all}
.narrow{max-width:460px;margin:40px auto}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
ul.tight{margin:6px 0;padding-left:20px}
.scroll{overflow-x:auto}
/* dashboard */
h3{font-size:15px;margin:16px 0 8px;color:#334}
.grid.two{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));align-items:start}
td.barcell,th.barcell{width:140px;min-width:100px;vertical-align:middle}
svg.bar{display:block;width:100%;height:12px}
svg.bar .bg{fill:#eef1f6}svg.bar .b{fill:var(--brand)}svg.bar .warn{fill:#c98a00}svg.bar .err{fill:var(--err)}
td.sobe{color:var(--err)}td.desce{color:var(--ok)}
.seletor{margin-bottom:10px}
.seletor select{max-width:260px}
code{background:#eef1f6;padding:1px 5px;border-radius:4px}
.grid{grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr))}
.grid.two{grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr))}
.grid>*{min-width:0}
