:root{--navy:#0b2341;--navy2:#12385f;--gold:#c9a65a;--cream:#f7f1e5;--ink:#10243e;--white:#fff}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink)}body.staff-login-body{min-height:100vh;background:radial-gradient(circle at 82% 18%,rgba(201,166,90,.16),transparent 31%),radial-gradient(circle at 10% 84%,rgba(255,255,255,.08),transparent 28%),linear-gradient(135deg,#071a31 0%,#0b2b4d 52%,#133d63 100%)}.staff-login-body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 0 44%,rgba(255,255,255,.035) 44% 45%,transparent 45% 100%)}.staff-login-shell{min-height:100vh;display:grid;place-items:center;padding:clamp(24px,5vw,64px)}.staff-login-card{width:min(100%,420px);background:linear-gradient(180deg,#fff 0%,#fffdf9 100%);border:1px solid rgba(201,166,90,.35);border-radius:26px;padding:clamp(30px,5vw,44px);box-shadow:0 28px 90px rgba(3,16,31,.38);position:relative;overflow:hidden}.staff-login-card:before{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,var(--gold),#ead39a,var(--gold))}.staff-login-brand{display:block;width:224px;max-width:76%;margin:0 auto 34px}.staff-login-brand img{display:block;width:100%;height:auto}.staff-login-form{display:grid;gap:18px}.staff-login-form label{display:grid;gap:7px;font-weight:750;font-size:.91rem;color:var(--navy)}.staff-login-form input{width:100%;border:1px solid #cdd7e3;border-radius:12px;background:#fbfcfe;padding:14px 15px;font:inherit;color:var(--ink);outline:none;transition:border-color .18s,box-shadow .18s,background .18s}.staff-login-form input:focus{background:#fff;border-color:var(--gold);box-shadow:0 0 0 4px rgba(201,166,90,.16)}.staff-login-form button{border:0;border-radius:12px;background:linear-gradient(135deg,#0b2341,#143f69);color:#fff;padding:14px 18px;font:inherit;font-weight:800;cursor:pointer;box-shadow:0 10px 25px rgba(11,35,65,.18);transition:transform .18s,box-shadow .18s}.staff-login-form button:hover{transform:translateY(-1px);box-shadow:0 13px 30px rgba(11,35,65,.25)}.staff-login-error{margin:0 0 18px;border:1px solid #efc7c7;background:#fff3f3;color:#8e2b2b;padding:12px 14px;border-radius:12px;font-size:.9rem}@media(max-width:520px){.staff-login-shell{padding:18px}.staff-login-card{border-radius:21px;padding:32px 22px}.staff-login-brand{width:204px;margin-bottom:30px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.staff-login-success{margin:0 0 18px;border:1px solid #bcd8c7;background:#f1fbf5;color:#20643b;padding:12px 14px;border-radius:12px;font-size:.9rem}.staff-login-hint{display:block;margin-top:-8px;color:#66788d;font-size:.84rem}.staff-login-resend{margin-top:14px;text-align:center}.staff-login-resend button{border:0;background:transparent;color:var(--navy2);font:inherit;font-weight:750;cursor:pointer;padding:8px 10px;text-decoration:underline;text-decoration-color:rgba(201,166,90,.7);text-underline-offset:3px}
.staff-portal-switch{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:-10px 0 28px;padding:5px;border:1px solid #d5deea;border-radius:14px;background:#f4f7fb}.staff-portal-option{display:flex;align-items:center;justify-content:center;min-height:44px;border-radius:10px;color:var(--navy);font-size:.91rem;font-weight:800;text-decoration:none;transition:background .18s,color .18s,box-shadow .18s,transform .18s}.staff-portal-option:hover{background:#fff;box-shadow:0 5px 16px rgba(11,35,65,.09);transform:translateY(-1px)}.staff-portal-option.is-active{background:linear-gradient(135deg,var(--gold),#e2c77f);color:var(--navy);box-shadow:0 6px 18px rgba(201,166,90,.24)}.staff-portal-option:focus-visible{outline:3px solid rgba(201,166,90,.35);outline-offset:2px}@media(max-width:520px){.staff-portal-switch{margin-top:-6px;margin-bottom:24px}.staff-portal-option{min-height:42px}}

/* WW-REQ-LOGIN-HOVER-001: reciprocal Waves / Matrix portal hover + focus */
.staff-portal-option:not(.is-active):hover,
.staff-portal-option:not(.is-active):focus-visible{
  background:linear-gradient(135deg,var(--gold),#e2c77f);
  color:var(--navy);
  box-shadow:0 6px 18px rgba(201,166,90,.24);
}
.staff-portal-switch:has(.staff-portal-option:not(.is-active):hover) .staff-portal-option.is-active,
.staff-portal-switch:has(.staff-portal-option:not(.is-active):focus-visible) .staff-portal-option.is-active{
  background:transparent;
  color:var(--navy);
  box-shadow:none;
  transform:none;
}
