/* Expel Dashboard — signin.css
   The sign-in and "not on the list" pages (hosted mode only; served without a session, so this
   file stands alone). Tokens are app.css part 1 (the prototype's), light + dark. */

:root{
  --plane:#f3f4f1; --surface:#fcfcfb; --ink:#101512; --ink-2:#4d5550; --muted:#7f8781;
  --axis:#c4c8c1; --hair:rgba(16,21,18,.10); --wash:rgba(16,21,18,.045);
  --s1:#2a78d6; --chip:#101512; --chip-ink:#fcfcfb; --note:#fff7e6; --note-edge:#e9c46a;
  --display:"Barlow Condensed","Arial Narrow",system-ui,sans-serif;
  --sans:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --plane:#0d0f0e; --surface:#171a18; --ink:#f2f4f1; --ink-2:#bec4be; --muted:#8a918b;
    --axis:#3a3f3b; --hair:rgba(255,255,255,.10); --wash:rgba(255,255,255,.06);
    --s1:#3987e5; --chip:#f2f4f1; --chip-ink:#101512; --note:#241f12; --note-edge:#7a6428;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --plane:#0d0f0e; --surface:#171a18; --ink:#f2f4f1; --ink-2:#bec4be; --muted:#8a918b;
  --axis:#3a3f3b; --hair:rgba(255,255,255,.10); --wash:rgba(255,255,255,.06);
  --s1:#3987e5; --chip:#f2f4f1; --chip-ink:#101512; --note:#241f12; --note-edge:#7a6428;
}
:root[data-theme="light"]{color-scheme:light}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;min-height:100vh;background:var(--plane);color:var(--ink);font-family:var(--sans);
  font-size:15px;line-height:1.45;padding:clamp(28px,14vh,140px) 16px 48px}
p{margin:0}
[hidden]{display:none!important}

.signin{max-width:440px;margin:0 auto;display:grid;gap:22px}
.signin-head{display:grid;gap:10px}
.eyebrow{font-family:var(--display);font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
h1,h2{font-family:var(--display);margin:0;text-wrap:balance;letter-spacing:.01em;font-weight:700;text-transform:uppercase}
h1{font-size:clamp(34px,9vw,48px);line-height:1}
h2{font-size:24px;letter-spacing:.03em;line-height:1.1}

.card{background:var(--surface);border:1px solid var(--hair);border-radius:10px;padding:20px}
.signin-card{display:grid;gap:14px}
.sub{color:var(--ink-2);font-size:14px}
.email{font-weight:600;overflow-wrap:anywhere}
.signin-note{background:var(--note);border:1px solid var(--note-edge);border-radius:10px;padding:10px 14px;font-size:14px}

/* "Sign in with Google": the app's pressed-chip colours (dark in light mode, light in dark mode),
   Google's four-colour G on a white disc so it reads on both. */
.gbtn{display:flex;align-items:center;justify-content:center;gap:12px;min-height:46px;margin-top:4px;
  padding:10px 18px;border-radius:8px;background:var(--chip);color:var(--chip-ink);
  font:600 15px/1.2 var(--sans);text-decoration:none;cursor:pointer}
.gbtn svg{width:26px;height:26px;flex:none;padding:4px;border-radius:50%;background:#fff}
.gbtn:hover{opacity:.9}
.gbtn:focus-visible{outline:2px solid var(--s1);outline-offset:2px}