/* Sign-in and message pages: the same Coast colors and fonts as the map (light-only). */
@import url("https://fonts.googleapis.com/css2?family=Figtree:wght@400;500;600;700;800&family=Poppins:wght@500;600;700&display=swap");
:root{--bg:#F5F7FA;--surface:#FFFFFF;--ink:#1A2E44;--muted:#5F6E80;--line:#E3E8EF;--navy:#0A1F3D;--navy-muted:#A9BCD6;--accent:#EB602A;--bad:#D9464B;--bad-bg:#FBE5E5;color-scheme:light}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:15px;line-height:1.45;min-height:100vh;display:flex;flex-direction:column}
.band{background:var(--navy);color:#fff;padding:28px 16px 32px;text-align:center}
.band small{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:700}
.band h1{margin:4px 0 0;font-family:"Poppins",system-ui,sans-serif;font-size:30px;font-weight:700}
main{flex:1;width:100%;max-width:420px;margin:0 auto;padding:24px 16px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:26px 24px;box-shadow:0 1px 3px rgba(16,34,60,.07)}
h2{margin:0 0 6px;font-family:"Poppins",system-ui,sans-serif;font-size:21px}
p{color:var(--muted);margin:0 0 14px}
label{display:block;font-size:13px;font-weight:600;margin:12px 0 4px}
input{width:100%;font:inherit;border:1px solid var(--line);border-radius:10px;padding:9px 11px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:10px 18px;font:inherit;font-weight:700;text-decoration:none;cursor:pointer}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.wide{width:100%;margin-top:14px}
.error{background:var(--bad-bg);color:var(--bad);border-radius:10px;padding:8px 10px;margin-top:12px;font-size:14px}
.small{font-size:13px;text-align:center;margin:14px 0 0}
a{color:#1E71C0}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* With Microsoft sign-in on, the server adds class="ms" to the body: the Microsoft button leads, the password is a backup. */
.msonly{display:none} body.ms .msonly{display:block} body.ms #form{display:none} body.ms.backup #form{display:block} body.ms.backup #backupLink{display:none}