/* STASTUC v2.1 local login gate (no Firebase Auth) */
:root{
  --auth-blue:#0b5f98;
  --auth-blue-dark:#073d67;
  --auth-blue-soft:#eaf4fb;
  --auth-border:#9fb7c9;
  --auth-ink:#123248;
  --auth-muted:#5d7281;
  --auth-bg:#eef5fa;
  --auth-danger:#b42318;
  --auth-success:#067647;
}

body.auth-locked{overflow:hidden;background:var(--auth-bg)}
body.auth-locked > .topbar,
body.auth-locked > .shell,
body.auth-locked > .toast{visibility:hidden}

.auth-gate{
  position:fixed; inset:0; z-index:99999;
  display:grid; place-items:center;
  padding:24px;
  background:#e9f2f8;
  color:var(--auth-ink);
  font-family:Arial,Helvetica,sans-serif;
}
.auth-gate.hidden{display:none}
.auth-shell{
  width:min(980px,96vw);
  min-height:560px;
  display:grid;
  grid-template-columns:minmax(300px,.9fr) minmax(360px,1.1fr);
  border:1.5px solid #7ea5bf;
  border-radius:18px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 22px 70px rgba(18,50,72,.18);
}
.auth-brand-panel{
  background:#0a527f;
  color:#fff;
  padding:52px 44px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  border-right:1px solid #0d6a9f;
}
.auth-brand-top{display:flex;align-items:center;gap:18px}
.auth-brand-top img{width:72px;height:72px;object-fit:contain;background:#fff;border-radius:16px;padding:8px;border:1px solid rgba(255,255,255,.45)}
.auth-brand-title{font-size:34px;line-height:1;font-weight:800;letter-spacing:.5px}
.auth-brand-sub{display:block;margin-top:8px;font-size:14px;opacity:.92}
.auth-brand-copy{margin-top:48px}
.auth-brand-copy .eyebrow{display:block;font-size:12px;letter-spacing:1.8px;font-weight:700;opacity:.78;margin-bottom:14px}
.auth-brand-copy h1{font-size:32px;line-height:1.18;margin:0 0 18px;font-weight:800}
.auth-brand-copy p{font-size:15px;line-height:1.7;margin:0;color:#e5f4fd}
.auth-brand-foot{border-top:1px solid rgba(255,255,255,.28);padding-top:20px;font-size:12px;line-height:1.6;color:#d9edf8}
.auth-form-panel{padding:54px 56px;display:flex;align-items:center;background:#fff}
.auth-form-wrap{width:100%;max-width:420px;margin:auto}
.auth-form-wrap h2{margin:0;font-size:30px;color:#0c3f66}
.auth-form-wrap > p{margin:10px 0 28px;color:var(--auth-muted);line-height:1.55}
.auth-field{display:grid;gap:8px;margin-bottom:16px}
.auth-field span{font-size:13px;font-weight:700;color:#24495f}
.auth-field input,.auth-field select{
  width:100%; box-sizing:border-box;
  height:46px; border:1.5px solid #abc0cf; border-radius:9px;
  background:#fff; color:#17384f; padding:0 13px; font:inherit;
  outline:none;
}
.auth-field input:focus,.auth-field select:focus{border-color:#1378b7;box-shadow:0 0 0 3px rgba(19,120,183,.12)}
.auth-password-wrap{position:relative}
.auth-password-wrap input{padding-right:48px}
.auth-password-toggle{position:absolute;right:8px;top:7px;width:34px;height:32px;border:0;background:#eef5fa;border-radius:7px;color:#0b5f98;cursor:pointer;font-size:16px}
.auth-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.auth-btn{height:44px;border-radius:9px;border:1.5px solid #0b5f98;font-weight:700;font-size:14px;cursor:pointer}
.auth-btn.primary{background:#0b5f98;color:#fff}
.auth-btn.primary:hover{background:#084f80}
.auth-btn.secondary{background:#fff;color:#0b5f98}
.auth-btn.secondary:hover{background:#edf6fc}
.auth-message{min-height:22px;margin-top:14px;font-size:13px;font-weight:700}
.auth-message.error{color:var(--auth-danger)}
.auth-message.success{color:var(--auth-success)}
.auth-security-note{margin-top:24px;padding:12px 14px;border:1px solid #c9dbe7;border-radius:9px;background:#f7fbfe;color:#5c7180;font-size:12px;line-height:1.55}

.auth-modal-backdrop{position:fixed;inset:0;z-index:100000;display:grid;place-items:center;background:rgba(8,39,61,.54);padding:20px}
.auth-modal-backdrop.hidden{display:none}
.auth-modal{width:min(520px,96vw);background:#fff;border:1.5px solid #779fba;border-radius:14px;box-shadow:0 24px 80px rgba(0,0,0,.28);overflow:hidden}
.auth-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 22px;border-bottom:1px solid #c6d6e1;background:#f3f8fc}
.auth-modal-head h3{margin:0;color:#0c3f66;font-size:21px}
.auth-modal-head p{margin:6px 0 0;color:#647989;font-size:13px}
.auth-modal-close{border:1px solid #a7bac7;background:#fff;border-radius:7px;width:34px;height:34px;cursor:pointer;color:#335467;font-size:18px}
.auth-modal-body{padding:22px}
.auth-date-grid{display:grid;grid-template-columns:.8fr 1.35fr 1fr;gap:12px}
.auth-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}
.auth-welcome{
  position:fixed; inset:0; z-index:100001; display:grid; place-items:center;
  background:rgba(6,39,63,.78); padding:24px;
}
.auth-welcome.hidden{display:none}
.auth-welcome-card{width:min(460px,92vw);text-align:center;background:#fff;border:2px solid #0b5f98;border-radius:16px;padding:34px 28px;box-shadow:0 22px 70px rgba(0,0,0,.25)}
.auth-welcome-card img{width:74px;height:74px;object-fit:contain;margin-bottom:16px}
.auth-welcome-card h3{margin:0;color:#0b5f98;font-size:28px;text-transform:none}
.auth-welcome-card p{margin:10px 0 22px;color:#5d7281}
.auth-welcome-card button{min-width:150px}

#authLogoutBtn{font-size:16px}

@media (max-width:760px){
  .auth-gate{padding:12px;overflow:auto;place-items:start center}
  .auth-shell{grid-template-columns:1fr;min-height:0;margin:12px 0}
  .auth-brand-panel{padding:26px 24px;gap:24px}
  .auth-brand-copy{margin-top:18px}
  .auth-brand-copy h1{font-size:25px}
  .auth-brand-foot{display:none}
  .auth-form-panel{padding:30px 24px}
  .auth-actions{grid-template-columns:1fr}
  .auth-date-grid{grid-template-columns:1fr}
}