:root { color-scheme: light dark; --navy:#0A192F; --gold:#B89968; --cream:#F4ECD8; }
* { box-sizing: border-box; }
body { margin:0; min-height:100vh; display:grid; place-items:center;
  background:var(--navy); color:var(--cream);
  font:16px/1.5 ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; }
main { width:min(420px, 92vw); padding:32px 28px; }
h1 { margin:0; font-size:28px; letter-spacing:.01em; }
.sub { margin:2px 0 28px; color:var(--gold); font-size:14px; letter-spacing:.14em; text-transform:uppercase; }
button { width:100%; padding:13px 16px; border:0; border-radius:8px; cursor:pointer;
  background:var(--gold); color:var(--navy); font-size:16px; font-weight:600; }
button:disabled { opacity:.55; cursor:default; }
label { display:block; margin:14px 0 4px; font-size:13px; color:var(--gold); }
input { width:100%; padding:10px 12px; border-radius:8px; border:1px solid #2a3a55;
  background:#0d2038; color:var(--cream); font-size:15px; }
.hint { font-size:13px; opacity:.65; margin:10px 0 0; }
details { margin-top:28px; border-top:1px solid #22314a; padding-top:16px; }
summary { cursor:pointer; font-size:14px; color:var(--gold); }
#enrol-btn { margin-top:18px; }
#msg { margin-top:20px; min-height:22px; font-size:14px; }
#msg.err { color:#ff9d9d; }
#msg.ok { color:#9ee6b4; }