/* The login screen. Loaded in the order web/index.html lists them; the order is the cascade. */
/* login gate */
.login-ov { display:none; position:fixed; inset:0; background:var(--navy); z-index:90; align-items:center; justify-content:center; padding:20px; }
.login-ov.show { display:flex; }
/* Boot gate: index.html starts <body class="booting"> so the signed-in shell (sidebar, pages) never paints before
   /api/auth/me answers. main.js removes the class once it knows whether the visitor is signed in. */
body.booting > *:not(#loginOv) { display:none; }
.login-card { background:#fff; border-radius:16px; padding:30px 28px; width:100%; max-width:360px; box-shadow:0 24px 60px -12px rgba(0,0,0,.5); }
.login-card h2 { margin:0 0 4px; font-size:18px; }
.login-card p { margin:0 0 18px; color:var(--muted); font-size:13px; }
.login-card label { display:block; font-size:12px; font-weight:600; color:var(--muted); margin:12px 0 4px; text-transform:uppercase; letter-spacing:.03em; }
.login-card .btn { width:100%; margin-top:20px; justify-content:center; }
.login-err { color:var(--bad); font-size:13px; margin-top:12px; min-height:1em; }
.sb-user { color:var(--navy-ink); font-size:12.5px; margin-bottom:8px; }
.sb-user b { color:#fff; }
.sb-role { display:inline-block; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:2px 8px; border-radius:999px; background:var(--accent); color:#fff; margin-left:6px; }
.sb-role.analyst { background:#3a4066; }
.logout-btn { background:none; border:1px solid var(--navy-line); color:var(--navy-muted); font:inherit; font-size:12px; padding:6px 12px; border-radius:8px; cursor:pointer; margin-top:8px; width:100%; }
.logout-btn:hover { background:var(--navy-2); color:#fff; }
.admin-only { display:none; }
body.is-admin .admin-only { display:initial; }
body.is-admin .panel.admin-only { display:block; } /* block-level admin panels (id/class panels) must not collapse to inline */