/* fbbadmin -- admin-web shell styles (chore/bwi-web D2).
   System font stack only (CSP font-src 'self'); no inline styles anywhere
   (CSP style-src 'self'). Palette borrowed from the landing tokens. */
:root{
  --bg:#0d1a10;
  --card:#111f14;
  --elevated:#16261a;
  --border:#22382a;
  --text:#e9f2ec;
  --text-2:#9db4a4;
  --green:#00e87a;
  --on-green:#031708;
  --red:#ff6b6b;
  --amber:#f5c542;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
[hidden]{display:none !important}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:15px;line-height:1.45}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;border-bottom:1px solid var(--border);background:var(--card)}
.brand{font-weight:700;letter-spacing:.02em}
.brand b{color:var(--green);font-weight:700}
.who{display:flex;align-items:center;gap:12px;color:var(--text-2);font-size:14px;min-width:0}
#who-email{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#status{min-height:24px;padding:6px 20px;font-size:14px;color:var(--text-2)}
#status.err{color:var(--red)}
#status.ok{color:var(--green)}
main{padding:8px 20px 40px;max-width:1200px;margin:0 auto}
section{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:22px}
section.narrow{max-width:440px}
h1{font-size:20px;margin:0 0 14px}
p{color:var(--text-2);margin:0 0 14px}
label{display:block;margin:0 0 12px;font-size:14px;color:var(--text-2)}
input[type=email],input[type=password],input[type=text]{display:block;width:100%;margin-top:6px;background:var(--elevated);border:1px solid var(--border);border-radius:8px;padding:10px 12px;color:var(--text);font:inherit;outline:none}
input:focus{border-color:var(--green)}
button{font:inherit;font-weight:600;background:var(--elevated);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:8px 14px;cursor:pointer}
button:hover:not(:disabled){border-color:var(--green)}
button:disabled{opacity:.45;cursor:default}
button.primary{background:var(--green);color:var(--on-green);border-color:var(--green)}
#mfa-qr{display:block;width:220px;height:220px;background:#fff;border-radius:8px;padding:8px;margin:0 0 10px}
#mfa-secret{display:block;font-family:var(--mono);font-size:13px;word-break:break-all;background:var(--elevated);border:1px solid var(--border);border-radius:8px;padding:8px 10px;margin:0 0 16px;user-select:all}
.tabs{display:flex;gap:8px;align-items:center;margin:0 0 14px}
.tabs .spacer{flex:1}
.tab.active{border-color:var(--green);color:var(--green)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.chip{font-size:13px;padding:5px 10px;border-radius:999px}
.chip.active{background:var(--green);color:var(--on-green);border-color:var(--green)}
.tablewrap{overflow-x:auto;border:1px solid var(--border);border-radius:10px}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:9px 10px;text-align:left;vertical-align:top;border-bottom:1px solid var(--border)}
th{color:var(--text-2);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.04em;background:var(--elevated);white-space:nowrap}
tr:last-child td{border-bottom:0}
td.mono{font-family:var(--mono);font-size:12px;white-space:nowrap}
td.email{word-break:break-all;min-width:180px}
td.when{white-space:nowrap}
.badge{display:inline-block;font-size:12px;font-weight:600;padding:2px 8px;border-radius:999px;border:1px solid var(--border);color:var(--text-2)}
.badge.new{color:var(--green);border-color:var(--green)}
.badge.invited{color:var(--amber);border-color:var(--amber)}
.badge.joined{color:var(--on-green);background:var(--green);border-color:var(--green)}
.badge.declined{color:var(--red);border-color:var(--red)}
.ts-ok{color:var(--green)}
.ts-failed{color:var(--red);font-weight:600}
.ts-unverified{color:var(--text-2)}
.note-text{display:block;color:var(--text-2);font-size:13px;max-width:260px}
.note-input{margin-top:6px;min-width:180px;padding:6px 8px;font-size:13px}
.actions{display:flex;flex-wrap:wrap;gap:6px;min-width:250px}
.actions button{font-size:12px;padding:5px 9px}
.empty{padding:18px;color:var(--text-2);text-align:center}
@media (max-width:640px){main{padding:8px 10px 30px}section{padding:16px;border-radius:10px}.top{padding:12px 14px}}
