:root{font-family:Inter,Arial,sans-serif;color:#17212b;background:#f3f6f8}*{box-sizing:border-box}body{margin:0}header{height:64px;background:#101820;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 24px}.brand{display:flex;flex-direction:column;gap:2px}.brand strong{font-size:20px}.brand small{color:#a9b8c4}main{max-width:1220px;margin:28px auto;padding:0 18px}.hidden{display:none!important}.card,.panel{background:#fff;border:1px solid #dce3e8;border-radius:14px;padding:20px;box-shadow:0 2px 10px rgba(15,24,32,.04)}.narrow{max-width:480px;margin:70px auto}.panel{margin-top:14px}h1,h2,h3{margin-top:0}p{line-height:1.45}label{display:block;font-weight:600;font-size:13px;margin:12px 0}input,select,textarea{width:100%;margin-top:6px;padding:11px 12px;border:1px solid #c9d3db;border-radius:9px;background:#fff;color:#17212b;font:inherit}textarea{resize:vertical;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:12px}button{border:0;border-radius:9px;background:#0b6bcb;color:#fff;padding:10px 15px;font-weight:700;cursor:pointer}button:hover{filter:brightness(.96)}button:disabled{background:#aab5bd;cursor:not-allowed}.secondary,.ghost{background:#eaf1f7;color:#19344b}.ghost{background:transparent;color:#fff;border:1px solid #50606d}.statusbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}.badge{padding:7px 10px;border-radius:999px;background:#eef1f3;font-size:12px;font-weight:700}.badge.ok{background:#e3f5eb;color:#176a3a}.badge.no{background:#fdeaea;color:#9b2222}.badge.warn{background:#fff2cf;color:#7a5700}.notice{padding:12px 14px;border-radius:10px;background:#fff2cf;color:#624700;border:1px solid #f0d98f;margin-bottom:12px}nav,.adminTabs{display:flex;gap:8px;flex-wrap:wrap}.tab,.subtab{background:#dfe8ef;color:#23384a}.tab.active,.subtab.active{background:#101820;color:#fff}.titleRow{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}.list,.miniList{margin-top:15px}.row,.mini{border-top:1px solid #e7ecef;padding:13px 0;display:flex;justify-content:space-between;align-items:center;gap:14px}.mini:first-child,.row:first-child{border-top:0}.muted,small{color:#687985}.msg{margin-top:10px;min-height:20px;color:#9b2222}.grid{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(420px,1.4fr);gap:16px}.formGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.wideCard{min-width:0}.resultBox{margin-top:14px;padding:12px;background:#edf7ff;border:1px solid #b8dcf6;border-radius:10px}.resultBox code{display:block;word-break:break-all;background:#101820;color:#fff;padding:10px;border-radius:8px;margin:8px 0}.extActions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.extActions button{padding:7px 9px;font-size:12px}.danger{background:#a82222}.success{background:#25764a}.warning{background:#9c6b00}.extMeta{font-size:12px;color:#687985;margin-top:3px}@media(max-width:800px){.grid,.formGrid{grid-template-columns:1fr}.statusbar,.titleRow,.row,.mini{align-items:stretch;flex-direction:column}.extActions{justify-content:flex-start}}

/* Primeiro acesso / troca obrigatória de senha */
.passwordRules{margin:.5rem 0 1rem;color:#667085;font-size:.9rem}


/* ===== Tema claro/escuro ===== */
:root{
  --bg:#f3f6f8;
  --surface:#ffffff;
  --surface-2:#eef3f7;
  --text:#17212b;
  --muted:#687985;
  --border:#dce3e8;
  --header:#101820;
  --header-text:#ffffff;
  --input-bg:#ffffff;
  --input-border:#c9d3db;
  --tab-bg:#dfe8ef;
  --tab-text:#23384a;
  --shadow:0 2px 10px rgba(15,24,32,.04);
}

html[data-theme="dark"]{
  --bg:#0b1117;
  --surface:#121a22;
  --surface-2:#18232d;
  --text:#edf3f7;
  --muted:#9fb0bd;
  --border:#2b3945;
  --header:#081018;
  --header-text:#ffffff;
  --input-bg:#0f171e;
  --input-border:#394a57;
  --tab-bg:#1d2a35;
  --tab-text:#d7e4ec;
  --shadow:0 2px 14px rgba(0,0,0,.28);
  color-scheme:dark;
}

html{background:var(--bg);min-height:100%;transition:background .2s ease}body{background:var(--bg);color:var(--text);min-height:100vh;transition:background .2s ease,color .2s ease}
header{background:var(--header);color:var(--header-text)}
.card,.panel{background:var(--surface);border-color:var(--border);box-shadow:var(--shadow)}
input,select,textarea{background:var(--input-bg);color:var(--text);border-color:var(--input-border)}
input::placeholder,textarea::placeholder{color:var(--muted)}
.muted,small{color:var(--muted)}
.tab,.subtab{background:var(--tab-bg);color:var(--tab-text)}
.tab.active,.subtab.active{background:var(--header);color:#fff}
.row,.mini{border-top-color:var(--border)}
.badge{background:var(--surface-2);color:var(--text)}
.secondary{background:var(--surface-2);color:var(--text);border:1px solid var(--border)}
.resultBox{background:var(--surface-2);border-color:var(--border)}

.headerActions{display:flex;align-items:center;gap:10px}
.themeToggle{display:inline-flex;align-items:center;gap:8px;background:transparent;color:#fff;border:1px solid #50606d;padding:9px 12px;white-space:nowrap}
.themeToggle:hover{background:rgba(255,255,255,.08)}
#themeIcon{font-size:16px;line-height:1}

html[data-theme="dark"] .notice{background:#3a3015;color:#ffe6a0;border-color:#6e5a20}
html[data-theme="dark"] .badge.ok{background:#143524;color:#7de0a8}
html[data-theme="dark"] .badge.no{background:#3b1c1f;color:#ff9aa2}
html[data-theme="dark"] .badge.warn{background:#3a3015;color:#ffd77a}
html[data-theme="dark"] .msg{color:#ff8d8d}

@media (max-width:620px){
  .themeToggle #themeLabel{display:none}
  .themeToggle{padding:9px 11px}
  header{padding:0 14px}
}

/* Correção: o tema deve ocupar toda a janela, inclusive abaixo do conteúdo */
main,#app{background:transparent}