/* Ordinary registration-form styling, deliberately generic: it must not
   resemble any real service's branding. */
:root{--ink:#1a1a1a;--muted:#6b6b6b;--line:#e2e2e2;--accent:#1f6fb2;--error:#c0392b}
*{box-sizing:border-box}
body{margin:0;font:16px/1.55 ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  color:var(--ink);background:#fff}
#app{max-width:30rem;margin:0 auto;padding:3rem 1.25rem 4rem}
h1{font-size:1.5rem;margin:0 0 .5rem}
h2{font-size:1.2rem;margin:0 0 .75rem}
.note{font-size:.9rem;color:var(--muted);margin:0 0 2rem;padding:.75rem .9rem;
  border:1px solid var(--line);border-radius:6px}
.panel[hidden],form[hidden]{display:none}
.row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.field{margin:0 0 1.25rem}
label{display:block;font-weight:600;margin-bottom:.4rem;font-size:.95rem}
input{width:100%;font:inherit;color:inherit;background:#fff;padding:.6rem .7rem;
  border:1px solid var(--line);border-radius:6px}
input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
.hint{font-size:.8rem;color:var(--muted);margin:.35rem 0 0}
.error{color:var(--error);font-size:.9rem;margin:0 0 1rem}
.error[hidden]{display:none}
button{font:inherit;cursor:pointer;border-radius:6px;padding:.7rem 1.5rem;width:100%}
.primary{background:var(--ink);border:1px solid var(--ink);color:#fff}
.primary:hover{background:#333;border-color:#333}
.primary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.footnote{font-size:.8rem;color:var(--muted);margin-top:2.5rem;padding-top:1rem;
  border-top:1px solid var(--line)}
@media (max-width:26rem){.row{grid-template-columns:1fr}}
@media (prefers-color-scheme:dark){
  :root{--ink:#ececec;--muted:#9a9a9a;--line:#3a3a3a;--error:#ef8b7f}
  body{background:#131313}
  input{background:#1c1c1c}
  .primary{background:#ececec;color:#131313;border-color:#ececec}
  .primary:hover{background:#fff;border-color:#fff}
}