/* The sign-in pages, on the planner's own fonts and tokens (login.html's),
   with the site chrome from css/chrome.css. */
@font-face { font-family: "Urbanist"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("/fonts/urbanist-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Urbanist"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("/fonts/urbanist-latin.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/poppins-400-latin.woff2") format("woff2"); }
:root {
  --surface: #fcfcfb; --plane: #f4f3ef; --ink: #0b0b0b; --ink-2: #52514e; --muted: #898781;
  --border: rgba(11, 11, 11, 0.10); --field: #ffffff; --accent: #0E6BDB; --danger: #c62828;
  --ok: #1b7a3d;
}
@media (prefers-color-scheme: dark) {
  :root:where(:not([data-theme="light"])) {
    --surface: #1a1a19; --plane: #0d0d0d; --ink: #ffffff; --ink-2: #c3c2b7; --muted: #898781;
    --border: rgba(255,255,255,0.10); --field: #232322; --accent: #2293F8; --danger: #FD7970; --ok: #5fc38a;
  }
}
:root[data-theme="dark"] {
  --surface: #1a1a19; --plane: #0d0d0d; --ink: #ffffff; --ink-2: #c3c2b7; --muted: #898781;
  --border: rgba(255,255,255,0.10); --field: #232322; --accent: #2293F8; --danger: #FD7970; --ok: #5fc38a;
}
* { box-sizing: border-box; }
html, body { margin: 0; background: var(--plane); color: var(--ink); }
body { font-family: "Poppins", system-ui, sans-serif; font-size: 15px; line-height: 1.5; min-height: 100vh; }
h1, h2 { font-family: "Urbanist", system-ui, sans-serif; font-weight: 700; margin: 0 0 12px; }
h1 { font-size: 1.6rem; } h2 { font-size: 1.15rem; margin-top: 28px; }
p { margin: 0 0 14px; color: var(--ink-2); }
a { color: var(--accent); }
.inline { display: inline; margin: 0; }
.auth-main { display: flex; justify-content: center; padding: 48px 16px; }
.auth-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 32px; width: 100%; max-width: 520px; }
.auth-card form { margin: 0; }
.auth-card form p { margin: 0 0 14px; color: var(--ink); }
label { display: block; font-size: 0.85rem; font-weight: 500; color: var(--ink-2); margin-bottom: 4px; }
input[type="text"], input[type="password"], input[type="email"], textarea, select {
  width: 100%; height: 40px; padding: 0 12px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--field); color: var(--ink); font: inherit; }
textarea { height: auto; padding: 10px 12px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
input[type="checkbox"] { margin-right: 8px; }
input[type="checkbox"] + label { display: inline; }
input:disabled { color: var(--muted); }
button.site-btn, a.site-btn { margin: 6px 8px 6px 0; }
.auth-link { display: inline-block; margin: 6px 0; font-size: 0.9rem; background: none; border: 0; padding: 0; color: var(--accent); font: inherit; cursor: pointer; text-decoration: underline; }
.errorlist { list-style: none; margin: 0 0 8px; padding: 0; color: var(--danger); font-size: 0.9rem; }
.messages { list-style: none; margin: 0 0 16px; padding: 0; }
.messages li { padding: 10px 12px; border-radius: 6px; background: var(--plane); border: 1px solid var(--border); margin-bottom: 8px; font-size: 0.9rem; }
.messages li.error { border-color: var(--danger); }
.messages li.success { border-color: var(--ok); }
.notice { padding: 12px 14px; border-radius: 6px; border: 1px solid var(--accent); background: var(--plane); margin-bottom: 18px; font-size: 0.95rem; }
hr { border: 0; border-top: 1px solid var(--border); margin: 24px 0; }
img { max-width: 100%; }
.facts { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0 0 8px; }
.facts dt { color: var(--muted); font-size: 0.85rem; } .facts dd { margin: 0; }
table { border-collapse: collapse; width: 100%; font-size: 0.9rem; margin: 0 0 14px; }
th, td { text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--border); vertical-align: top; }
th { color: var(--muted); font-weight: 500; }
span { color: var(--muted); font-size: 0.85rem; }
