/* The sign-in page: the dashboard's enamel and one plate, nothing else. Reachable without a session. */
@font-face {
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url('/fonts/source-sans-latin.woff2') format('woff2');
}
:root { color-scheme: dark; --enamel: #121815; --plate: #182019; --rule: #2a352f; --rule-strong: #3b4841; --ink: #e8eee9; --ink-2: #b0bcb5; --lamp: #7fc9a3; --lamp-hi: #bdf0d4; --fault: #f3a197; --fault-plate: #3a201d; }
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: var(--enamel); }
body { display: grid; place-items: center; min-height: 100dvh; padding: 24px 16px; color: var(--ink); font: 400 0.9375rem/1.45 'Source Sans 3', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif; -webkit-font-smoothing: antialiased; }
::selection { background: #2d5443; color: var(--lamp-hi); }
.gate { width: min(100%, 22rem); display: grid; gap: 16px; padding: 28px 24px 24px; background: var(--plate); border: 1px solid var(--rule); border-radius: 14px; }
.mark { height: 24px; width: auto; filter: invert(1); opacity: 0.92; justify-self: start; }
h1 { margin: 0; font-size: 1.375rem; font-weight: 600; }
form { display: grid; gap: 4px; }
label { color: var(--ink-2); font-size: 0.8125rem; font-weight: 600; }
input { margin-bottom: 12px; min-height: 44px; padding: 0 12px; border: 1px solid var(--rule-strong); border-radius: 8px; background: var(--enamel); color: var(--ink); font: inherit; font-size: 1rem; caret-color: var(--lamp); transition: border-color 150ms ease; }
input:hover { border-color: #56655d; }
input:focus-visible { outline: 2px solid var(--lamp); outline-offset: 1px; border-color: var(--lamp); }
button { margin-top: 4px; min-height: 44px; border: 0; border-radius: 8px; background: var(--lamp); color: #0d1b14; font: inherit; font-weight: 700; cursor: pointer; transition: background-color 150ms ease; }
button:hover { background: var(--lamp-hi); }
button:active { scale: 0.98; }
button:focus-visible { outline: 2px solid var(--lamp-hi); outline-offset: 2px; }
.say { margin: 0; padding: 10px 12px; border: 1px solid #6b3a33; border-radius: 8px; background: var(--fault-plate); color: var(--fault); }