/* Страница входа (auth.php). Токены из design-system.css, фон как у экрана блокировки. */

.au{min-height:calc(100vh / var(--lk-vz, 1));min-height:calc(100dvh / var(--lk-vz, 1));display:flex;align-items:center;justify-content:center;padding:32px 16px calc(32px + env(safe-area-inset-bottom));
  background:
    radial-gradient(1200px 600px at 50% -10%,color-mix(in oklab,var(--accent) 16%,transparent),transparent 70%),
    radial-gradient(900px 500px at 100% 110%,color-mix(in oklab,var(--brass) 14%,transparent),transparent 70%),
    var(--bg)}
.au-main{width:100%;max-width:420px;display:flex;flex-direction:column;align-items:center;gap:22px}

/* ---------- Знак ---------- */
.au-brand{display:flex;align-items:center;gap:12px}
.au-mark{width:48px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:14px;background:var(--accent);color:var(--surface);box-shadow:var(--shadow-2)}
.au-brand__title{font-family:var(--serif);font-size:22px;font-weight:600;line-height:1.1;color:var(--ink)}
.au-brand__sub{font-size:13px;color:var(--ink-2)}

/* ---------- Карточка ---------- */
.au-card{width:100%;display:flex;flex-direction:column;gap:6px;padding:28px 26px 20px;box-shadow:var(--shadow-3)}
.au-title{font-size:22px;line-height:1.25;overflow-wrap:anywhere}
.au-sub{margin:0;font-size:13.5px;color:var(--ink-2)}

.au-note{display:flex;align-items:flex-start;gap:8px;margin:12px 0 0;padding:10px 12px;border-radius:var(--r-m);font-size:13.5px;line-height:1.4;background:var(--fawn);color:var(--ink)}
.au-note iconify-icon{flex:none;margin-top:1px;color:var(--accent)}
.au-note--ok{background:color-mix(in oklab,var(--sage) 16%,var(--surface))}
.au-note--ok iconify-icon{color:var(--sage)}
.au-note--error{background:color-mix(in oklab,var(--terra) 12%,var(--surface))}
.au-note--error iconify-icon{color:var(--terra)}

/* ---------- Поля ---------- */
.au-form{display:flex;flex-direction:column;gap:14px;margin-top:18px}
.au-field{display:flex;flex-direction:column;gap:6px}
.au-label{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--ink-2)}
.au-forgot{font-size:12.5px}
.au-input{display:flex;align-items:center;gap:8px;height:46px;padding:0 6px 0 14px;border:1px solid var(--line);border-radius:var(--r-m);background:var(--bg);transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.au-input>iconify-icon{flex:none;color:var(--ink-2)}
.au-input:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in oklab,var(--accent) 18%,transparent)}
.au-input:focus-within>iconify-icon{color:var(--accent)}
.au-input:has([aria-invalid="true"]){border-color:var(--terra)}
.au-input input{flex:1;min-width:0;height:100%;border:0;background:none;outline:none;font-size:15px;color:var(--ink)}
.au-eye{flex:none;display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:0;border-radius:var(--r-s);background:none;color:var(--ink-2);cursor:pointer;transition:all var(--dur) var(--ease)}
.au-eye:hover{color:var(--ink);background:var(--fawn)}
.au-caps{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--ochre)}
.au-caps[hidden]{display:none}

.au-check{display:flex;align-items:flex-start;gap:10px;font-size:14px;cursor:pointer}
.au-check input{flex:none;width:18px;height:18px;margin:1px 0 0;accent-color:var(--accent)}
.au-check small{display:block;font-size:12px;color:var(--ink-2)}

.au-status:empty{display:none}
.au-error{margin:0;font-size:13px;line-height:1.45;color:var(--terra)}
.au-error a{color:inherit;text-decoration:underline}

.au-submit{height:46px;font-size:15px}
.au-submit:disabled{opacity:.55;cursor:not-allowed}
.au-form.is-sending .au-submit{opacity:.75;pointer-events:none}
.au-form.is-shake .au-input{animation:au-shake .4s var(--ease)}
@keyframes au-shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}

.au-links{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 14px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line);font-size:13.5px;color:var(--ink-2)}
.au-links>a{display:inline-flex;align-items:center;gap:5px}

.au-foot{font-size:12.5px;color:var(--ink-2)}
.au-foot a{color:inherit}

@media (max-width:480px){
  .au{align-items:flex-start;padding-top:max(36px,env(safe-area-inset-top))}
  .au-card{padding:22px 18px 16px}
  .au-input{height:50px}
  .au-input input{font-size:16px}
  .au-links a{min-height:44px;display:inline-flex;align-items:center}
}

@media (prefers-reduced-motion:reduce){
  .au-form.is-shake .au-input{animation:none}
}