:root {
  color-scheme: light;
  --brand-900:#064822; --brand-700:#0b6b35; --brand-600:#158447; --brand-100:#dff4e7; --brand-50:#f0faf4;
  --bg:#f1f4f2; --surface:#fff; --surface-2:#f8faf9; --text:#17231c; --muted:#617168; --border:#d4ddd7;
  --red:#c92a2a; --red-bg:#fff1f1; --amber:#a85d00; --amber-bg:#fff7e6;
  --shadow:0 14px 40px rgba(7,38,20,.11); --radius:14px;
  font-family:"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--text); position:relative; overflow-x:hidden;
  background:linear-gradient(135deg,#053b1d 0%,#086132 50%,#0b7b3e 100%); }
body::before { content:""; position:fixed; width:520px; height:520px; right:-180px; top:-240px; border:90px solid rgba(255,255,255,.055); border-radius:50%; pointer-events:none; }
body::after { content:""; position:fixed; width:360px; height:360px; left:-160px; bottom:-180px; background:rgba(244,198,0,.1); border-radius:50%; pointer-events:none; }
#app { position:relative; z-index:1; }
button, input, select { font:inherit; color:inherit; }
.hub-loading { text-align:center; padding:48px 16px; color:var(--muted); }

.hub-loading { color:#fff; }
.hub-shell { max-width:1000px; margin:min(5vh,40px) auto; background:#fff; border-radius:20px; padding:36px 32px 28px; box-shadow:0 24px 60px rgba(0,0,0,.28); }
.hub-shell.wide { max-width:1180px; }
.hub-head { text-align:center; margin-bottom:22px; }
.hub-head img { height:54px; width:auto; }
.hub-head h1 { margin:14px 0 4px; font-size:1.5rem; }
.hub-head p { margin:0; color:var(--muted); }
.userbar { display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; margin-bottom:22px; font-size:.9rem; color:var(--muted); }
.userbar strong { color:var(--text); }
.hub-top { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:20px; }
.hub-brand { display:flex; align-items:center; gap:12px; margin-right:auto; }
.hub-brand img { height:40px; width:auto; }
.hub-brand strong { font-size:1.15rem; letter-spacing:.04em; }
.hub-brand small { display:block; color:var(--muted); }
.hub-user { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.chip { display:inline-block; padding:3px 10px; border-radius:999px; background:var(--brand-100); color:var(--brand-700); font-size:.8rem; font-weight:600; }

.btn { border:1px solid var(--border); background:var(--surface); border-radius:10px; padding:9px 16px; cursor:pointer; font-weight:600; }
.btn:hover { background:var(--surface-2); }
.btn-primary { background:var(--brand-700); border-color:var(--brand-700); color:#fff; }
.btn-primary:hover { background:var(--brand-600); }
.btn-small { padding:5px 10px; font-size:.85rem; }
.btn[disabled] { opacity:.6; cursor:wait; }

.panel { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); padding:24px; }
.auth-wrap { min-height:100vh; display:grid; place-items:center; padding:16px; }
.auth-card { width:100%; max-width:420px; }
.auth-card .hub-brand { justify-content:center; margin:0 0 18px; flex-direction:column; text-align:center; }
.auth-card .hub-brand img { height:56px; }
.auth-card h1 { margin:0 0 4px; font-size:1.3rem; text-align:center; }
.auth-card p.sub { margin:0 0 18px; color:var(--muted); text-align:center; font-size:.92rem; }
.field { display:block; margin-bottom:14px; }
.field > span { display:block; font-size:.85rem; font-weight:600; margin-bottom:5px; }
.field input, .field select { width:100%; padding:10px 12px; border:1px solid var(--border); border-radius:10px; background:var(--surface-2); }
.field input:focus, .field select:focus, .btn:focus-visible { outline:2px solid var(--brand-600); outline-offset:1px; }
.field small { color:var(--muted); display:block; margin-top:4px; }
.msg { margin-top:12px; padding:10px 12px; border-radius:10px; font-size:.9rem; }
.msg.error { background:var(--red-bg); color:var(--red); }
.msg.info { background:var(--amber-bg); color:var(--amber); }
.msg.ok { background:var(--brand-50); color:var(--brand-700); }

h2.section { margin:0 0 6px; font-size:1.25rem; }
p.lead { margin:0 0 18px; color:var(--muted); }
.unit-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(215px,1fr)); gap:16px; align-items:stretch; }
@media (max-width:720px) { .unit-grid { grid-template-columns:1fr; } .hub-shell { padding:28px 18px 22px; margin:12px; } }
.unit { position:relative; display:flex; flex-direction:column; border:1px solid #d4ddd7; border-top:5px solid var(--accent,var(--brand-700)); border-radius:16px; background:#fff; box-shadow:0 2px 8px rgba(7,38,20,.06); transition:transform .15s, box-shadow .15s, border-color .15s; }
.unit:hover, .unit:focus-within { transform:translateY(-3px); box-shadow:0 14px 30px rgba(7,38,20,.16); border-color:var(--accent,var(--brand-700)); }
.unit.is-selected { background:#f1f8f3; }
.unit.is-selected::after { content:"✓"; position:absolute; right:14px; top:14px; width:24px; height:24px; border-radius:50%; background:var(--brand-700); color:#fff; display:grid; place-items:center; font-size:.85rem; }
.unit-main { all:unset; box-sizing:border-box; cursor:pointer; display:flex; flex-direction:column; gap:6px; padding:20px 18px 16px; flex:1; }
.unit-main:focus-visible { outline:3px solid rgba(244,198,0,.8); outline-offset:2px; border-radius:12px; }
.unit-icon { width:46px; height:46px; border-radius:12px; display:grid; place-items:center; margin-bottom:8px; box-shadow:0 4px 10px rgba(0,0,0,.18); }
.unit .tag { font-size:.7rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--accent,var(--brand-700)); }
.unit strong { font-size:1.18rem; line-height:1.2; }
.unit small { color:var(--muted); line-height:1.4; }
.unit .go { margin-top:auto; padding-top:14px; font-weight:700; color:var(--accent,var(--brand-700)); display:flex; align-items:center; gap:6px; }
.unit .arrow { transition:transform .15s; }
.unit:hover .go .arrow { transform:translateX(4px); }
.unit .sub { all:unset; box-sizing:border-box; cursor:pointer; margin:0 14px 14px; padding:9px 12px; border:1px solid #d4ddd7; border-radius:10px; font-size:.88rem; font-weight:600; color:var(--brand-700); display:flex; justify-content:space-between; align-items:center; }
.unit .sub::before { content:"Abrir"; color:var(--muted); font-weight:500; margin-right:6px; }
.unit .sub span:first-child { margin-right:auto; }
.unit .sub:hover, .unit .sub:focus-visible { border-color:var(--brand-700); background:#f1f8f3; }
.status { margin-top:22px; min-height:48px; padding:12px 16px; border-radius:12px; background:#fff8d6; border:1px solid #ecd770; color:#5a4a00; font-size:.92rem; }
.status.error { background:var(--red-bg); border-color:#f0b4b4; color:var(--red); }
.hub-foot { margin-top:18px; text-align:center; color:var(--muted); font-size:.78rem; }
.empty { text-align:center; padding:32px; color:var(--muted); }

.tabs { display:flex; gap:6px; margin-bottom:18px; border-bottom:1px solid var(--border); }
.tab { border:0; background:none; padding:10px 14px; cursor:pointer; font-weight:600; color:var(--muted); border-bottom:3px solid transparent; }
.tab[aria-selected="true"] { color:var(--brand-700); border-bottom-color:var(--brand-700); }

.table-wrap { overflow-x:auto; }
table.users { width:100%; border-collapse:collapse; font-size:.9rem; min-width:760px; }
table.users th, table.users td { padding:8px 10px; text-align:left; border-bottom:1px solid var(--border); vertical-align:middle; }
table.users th { font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
table.users select, table.users input[type="text"], table.users input[type="password"] { padding:5px 8px; border:1px solid var(--border); border-radius:8px; background:var(--surface-2); max-width:150px; }
.form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; align-items:end; }
.diag-table { width:100%; border-collapse:collapse; margin-top:10px; }
.diag-table td, .diag-table th { padding:7px 10px; border-bottom:1px solid var(--border); text-align:left; }
.ok-dot { color:var(--brand-600); font-weight:700; } .bad-dot { color:var(--red); font-weight:700; }

