.kd-auth-page {
  margin: 0;
  background: var(--kd-canvas, #f5f8fc);
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
  color: var(--kd-ink, #23304a);
}
.kd-auth-wrap,
.kd-auth-wrap * { box-sizing: border-box; }
.kd-auth-wrap {
  width: calc(100% - 48px);
  max-width: 1000px;
  margin: 36px auto 48px;
  display: grid;
  grid-template-columns: minmax(0, 0.84fr) minmax(0, 1.16fr);
  align-items: stretch;
  background: var(--kd-surface,#fff);
  border: 1px solid var(--kd-line, #e0e8f2);
  border-radius: var(--kd-radius, 16px);
  box-shadow: 0 12px 40px #17395b08;
}
.kd-auth-story {
  min-width: 0;
  padding: 32px 28px;
  background: var(--kd-soft, #f1f6ff);
  border-right: 1px solid var(--kd-line, #e0e8f2);
  border-radius: var(--kd-radius, 16px) 0 0 var(--kd-radius, 16px);
}
.kd-auth-story-inner { position: sticky; top: 24px; }
.kd-auth-kicker {
  display: block;
  margin-bottom: 16px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 1px;
  color: var(--kd-text-muted,#64748b);
}
.kd-auth-illustration {
  width: 100%;
  max-width: 280px;
  margin: 18px auto 22px;
  color: var(--kd-light-link,var(--kd-link,var(--kd-brand)));
}
.kd-auth-illustration svg { display: block; width: 100%; height: auto; }
.kd-auth-story h2 {
  margin: 0 0 14px;
  font-size: clamp(26px, 2.5vw, 30px);
  font-weight: 750;
  line-height: 1.3;
  letter-spacing: -0.7px;
}
.kd-auth-story-inner > p {
  margin: 0;
  font-size: 14px;
  line-height: 1.7;
  color: var(--kd-text-muted,#526882);
}
.kd-auth-story ul {
  display: grid;
  gap: 14px;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}
.kd-auth-story li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--kd-text-muted,#526882);
}
.kd-auth-story li .kd-icon {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  color: var(--kd-light-link,var(--kd-link,var(--kd-brand)));
}
.kd-auth-card { min-width: 0; padding: 32px; }
.kd-auth-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--kd-line, #e5ebf4);
}
.kd-auth-tabs a {
  position: relative;
  padding: 0 0 13px;
  font-size: 15px;
  font-weight: 650;
  line-height: 1.5;
  color: var(--kd-text-muted,#64748b);
  text-decoration: none;
}
.kd-auth-tabs a.active { color: var(--kd-light-link,var(--kd-link,var(--kd-brand))); }
.kd-auth-tabs a.active::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 3px;
  border-radius: 3px;
  background: var(--kd-brand);
}
.kd-auth-card h1 {
  margin: 0 0 10px;
  font-size: 28px;
  line-height: 1.3;
  letter-spacing: -0.7px;
  overflow-wrap: anywhere;
}
.kd-auth-card .kd-auth-kicker { margin-bottom: 10px; }
.kd-auth-intro { margin: 0 0 24px; font-size: 14px; line-height: 1.7; color: var(--kd-text-muted,#64748b); }
.kd-auth-form .field,
.kd-auth-field { display: block; margin: 18px 0; font-size: 14px; font-weight: 650; line-height: 1.5; }
.kd-auth-form .caption { display: block; margin-bottom: 8px; }
.kd-auth-form input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.kd-auth-form select {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 48px;
  margin-top: 8px;
  padding: 12px 14px;
  border: 1px solid var(--kd-border,#dce5f0);
  border-radius: 10px;
  outline: none;
  background: var(--kd-surface,#fbfcfe);
  color: var(--kd-link,#23304a);
  font: 400 16px/1.4 system-ui, sans-serif;
}
.kd-auth-form input:focus-visible { border-color: var(--kd-brand); box-shadow: 0 0 0 3px rgba(var(--kd-brand-rgb), .1); }
.kd-auth-password { position: relative; display: block; }
.kd-auth-form .kd-auth-password input { padding-right: 94px; }
.kd-auth-password button {
  position: absolute;
  top: 50%;
  right: 6px;
  min-height: 40px;
  padding: 8px;
  transform: translateY(-50%);
  border: 0;
  background: transparent;
  color: var(--kd-light-link,var(--kd-link,var(--kd-brand)));
  font: 500 13px system-ui, sans-serif;
  cursor: pointer;
}
.kd-auth-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-height: 50px;
  margin-top: 22px;
  padding: 13px 18px;
  border: 0;
  border-radius: 10px;
  background: var(--kd-brand);
  color: #fff !important;
  font: 650 16px/1.5 system-ui, sans-serif;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: filter .15s;
}
.kd-auth-submit:hover { filter: brightness(.94); }
.kd-auth-submit .kd-icon { flex: 0 0 20px; width: 20px; height: 20px; }
.kd-auth-bottom { margin: 22px 0 0; color: var(--kd-text-muted,#64748b); font-size: 14px; line-height: 1.7; text-align: center; }
.kd-auth-bottom a { color: var(--kd-light-link,var(--kd-link,var(--kd-brand))); font-weight: 650; text-decoration: none; }
.kd-auth-back { display: block; margin-top: 16px; color: var(--kd-text-muted,#64748b); font-size: 13px; line-height: 1.7; text-align: center; text-decoration: none; }
.kd-auth-alert { margin: 18px 0; padding: 14px 16px; border-radius: 10px; font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
.kd-auth-alert.error { color: var(--kd-danger-text,#a63a4d); background: var(--kd-surface,#fff1f3); }
.kd-auth-alert.success { color: var(--kd-success-text,#22735c); background: var(--kd-surface-soft,#edf8f3); }
.kd-auth-form .hint,
.kd-auth-form .strength { margin: 8px 0; color: var(--kd-text-muted,#64748b); font-size: 13px; font-weight: 400; line-height: 1.6; overflow-wrap: anywhere; }
.kd-auth-form .types { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.kd-auth-form .type { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 12px 10px; border: 1px solid var(--kd-border,#dce5f0); border-radius: 10px; font-size: 13px; line-height: 1.5; cursor: pointer; }
.kd-auth-form .type:has(input:checked) { border-color: var(--kd-brand); color: var(--kd-light-link,var(--kd-link,var(--kd-brand))); background: var(--kd-soft, #f1f6ff); }
.kd-auth-form input[type=checkbox],
.kd-auth-form input[type=radio] { flex: 0 0 18px; width: 18px; height: 18px; accent-color: var(--kd-brand); }
.kd-auth-form .check { display: flex; align-items: flex-start; gap: 10px; margin: 18px 0; color: var(--kd-text-muted,#526882); font-size: 13px; line-height: 1.7; }
.kd-auth-form .check input { margin-top: 3px; }
.kd-auth-form .business { margin: 20px 0; padding: 18px; border: 1px solid var(--kd-border,#e1e9f5); border-radius: 12px; background: var(--kd-surface,#f8fbff); }
.kd-auth-form .business[hidden] { display: none; }
.kd-auth-form .url { color: var(--kd-light-link,var(--kd-link,var(--kd-brand))); font-size: 13px; font-weight: 400; overflow-wrap: anywhere; }
.kd-auth-form .kd-captcha-row { flex-wrap: wrap; }
.kd-auth-form .kd-captcha-row img { max-width: 100%; height: auto; }
.kd-auth-form .kd-captcha small { font-size: 13px; line-height: 1.6; }
.kd-auth-form .meter { display: flex; gap: 4px; margin-top: 10px; }
.kd-auth-form .meter span { flex: 1; height: 4px; border-radius: 5px; background: var(--kd-surface-soft,#e1e8f2); }
.kd-auth-page a:focus-visible,
.kd-auth-page button:focus-visible { outline: 3px solid var(--kd-border,#a4c6fa); outline-offset: 3px; }
@media (max-width: 1000px) {
  .kd-auth-story { padding: 28px 24px; }
  .kd-auth-card { padding: 28px; }
}
@media (max-width: 860px) {
  .kd-auth-wrap { width: calc(100% - 32px); max-width: 560px; margin: 28px auto 36px; grid-template-columns: minmax(0, 1fr); }
  .kd-auth-story { display: none; }
  .kd-auth-card { padding: 28px; }
}
@media (max-width: 480px) {
  .kd-auth-wrap { width: calc(100% - 24px); margin: 20px auto 28px; }
  .kd-auth-card { padding: 24px 20px; }
  .kd-auth-card h1 { font-size: 25px; }
  .kd-auth-form .business { padding: 14px; }
  .kd-auth-tabs { gap: 22px; }
}
@media (max-width: 360px) {
  .kd-auth-form .types { grid-template-columns: minmax(0, 1fr); }
}
@media (max-height: 740px) {
  .kd-auth-story-inner { position: static; }
}
