.kk-login {
  max-width: 360px; margin: 24px auto; padding: 16px;
  margin: 24px auto; padding: 16px;
  background: var(--surface-1); border: 1px solid var(--border-default); border-radius: var(--radius-md);
  color: #27272a;
}
.kk-login h1 { font-size: var(--font-size-md); margin: 0 0 12px; color: var(--text-strong); }
.kk-login form { display: flex; flex-direction: column; gap: 8px; gap: var(--gap-2); }
.kk-login input { width: 100%; }
.kk-login button { background: var(--accent); color: var(--accent-fg); border-color: var(--accent); }
.kk-login .hint { color: var(--text-muted); font-size: var(--font-size-xs); margin-top: 4px; }
.kk-login .error { color: var(--danger); font-size: var(--font-size-sm); margin-top: 4px; padding: 4px; padding: var(--gap-1); border: 1px solid var(--danger); border-radius: var(--radius-sm); background: #fef2f2; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}