:root{
  --bg:#fff; --card:#f5f5f7; --inset:#fff; --ink:#1d1d1f; --dim:#6e6e73; --btn:#1d1d1f; --btn-ink:#fff;
  --sub:#e8e8ed; --bad:#d70015; --ring:rgba(29,29,31,.35);
  --sans:-apple-system,BlinkMacSystemFont,'Golos Text','Segoe UI',system-ui,sans-serif;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#000; --card:#151517; --inset:#1c1c1f; --ink:#f5f5f7; --dim:#86868b; --btn:#f5f5f7; --btn-ink:#000;
    --sub:#2e2e32; --bad:#ff453a; --ring:rgba(245,245,247,.45);
  }
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.4;
  -webkit-font-smoothing:antialiased}
:focus-visible{outline:2px solid var(--ring);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.wrap{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;
  padding:24px 16px calc(24px + env(safe-area-inset-bottom))}
.mark{color:var(--ink);text-decoration:none;font-size:15px;font-weight:500;letter-spacing:-.012em}
.card{width:100%;max-width:460px;padding:14px;background:var(--card);border-radius:26px}
.stack{display:flex;flex-direction:column;gap:10px;margin:0}
.lead{padding:26px 22px 22px}
.lead b{font-size:22px;font-weight:600;letter-spacing:-.025em}
.fld{height:54px;padding:0 20px;border:0;border-radius:16px;background:var(--inset);color:var(--ink);
  font-family:var(--sans);font-size:16px;font-weight:500}
.fld::placeholder{color:var(--dim)}
.btn{height:54px;border:0;border-radius:16px;background:var(--btn);color:var(--btn-ink);font-family:var(--sans);
  font-size:16px;font-weight:500;cursor:pointer}
.btn:hover{opacity:.88}
.btn.ghost{background:var(--sub);color:var(--ink)}
.err-line{padding:0 4px;font-size:14px;color:var(--bad)}
.hint{padding:0 4px;font-size:14px;color:var(--dim)}
@media (max-width:520px){
  .card{padding:12px}
  .fld,.btn{height:56px;border-radius:18px;font-size:17px}
}