/* KEYNEIGHBOR_CROSSWALK_AUTH_THEME */
:root {
  --kn-paper: #f5f3ed;
  --kn-surface: #fffefa;
  --kn-ink: #1d2927;
  --kn-muted: #65736f;
  --kn-line: #d8ddd7;
  --kn-green: #47736b;
  --kn-green-dark: #315a54;
  --kn-blue: #4d6f8d;
  --kn-coral: #b96859;
  --kn-shadow: 0 18px 46px rgba(35, 49, 46, 0.10);
}

html[data-theme="crosswalk"] {
  color-scheme: light;
  background: var(--kn-paper);
}

body.auth-crosswalk {
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 28px 20px 48px !important;
  box-sizing: border-box !important;
  background:
    linear-gradient(90deg, transparent 0 7%, rgba(71,115,107,.045) 7% 7.2%, transparent 7.2% 92.8%, rgba(77,111,141,.045) 92.8% 93%, transparent 93%),
    var(--kn-paper) !important;
  color: var(--kn-ink) !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body.auth-crosswalk *,
body.auth-crosswalk *::before,
body.auth-crosswalk *::after {
  box-sizing: border-box;
  animation: none !important;
  transition: none !important;
}

.kn-auth-brand {
  display: flex !important;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 24px !important;
  align-items: center;
  gap: 12px;
  color: var(--kn-ink) !important;
  font-size: 22px;
  font-weight: 760;
  letter-spacing: -0.035em;
  line-height: 1;
  text-decoration: none !important;
}

.kn-auth-brand img {
  display: block !important;
  width: 64px !important;
  height: 64px !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

body.auth-crosswalk main,
body.auth-crosswalk .auth-shell,
body.auth-crosswalk .auth-container,
body.auth-crosswalk .login-container,
body.auth-crosswalk .signup-container,
body.auth-crosswalk > .container {
  width: min(100%, 480px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

body.auth-crosswalk .auth-card,
body.auth-crosswalk .login-card,
body.auth-crosswalk .signup-card,
body.auth-crosswalk .form-card,
body.auth-crosswalk > form {
  width: min(100%, 480px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 30px !important;
  border: 1px solid var(--kn-line) !important;
  border-radius: 18px !important;
  background: var(--kn-surface) !important;
  box-shadow: var(--kn-shadow) !important;
}

body.auth-crosswalk h1,
body.auth-crosswalk h2 {
  color: var(--kn-ink) !important;
  letter-spacing: -0.035em !important;
}

body.auth-crosswalk p,
body.auth-crosswalk .subtitle,
body.auth-crosswalk .helper,
body.auth-crosswalk .hint {
  color: var(--kn-muted) !important;
}

body.auth-crosswalk label {
  color: var(--kn-ink) !important;
  font-weight: 650 !important;
}

body.auth-crosswalk input,
body.auth-crosswalk select,
body.auth-crosswalk textarea {
  width: 100%;
  min-height: 48px;
  border: 1px solid #cbd3ce !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: var(--kn-ink) !important;
  box-shadow: none !important;
}

body.auth-crosswalk input:focus,
body.auth-crosswalk select:focus,
body.auth-crosswalk textarea:focus {
  border-color: var(--kn-green) !important;
  outline: 3px solid rgba(71,115,107,.16) !important;
  outline-offset: 1px !important;
}

body.auth-crosswalk button,
body.auth-crosswalk input[type="submit"],
body.auth-crosswalk .button,
body.auth-crosswalk .btn-primary {
  min-height: 48px;
  border: 1px solid var(--kn-green-dark) !important;
  border-radius: 10px !important;
  background: var(--kn-green-dark) !important;
  color: #fff !important;
  font-weight: 720 !important;
  box-shadow: none !important;
}

body.auth-crosswalk a {
  color: var(--kn-blue);
}

body.auth-crosswalk .error,
body.auth-crosswalk [role="alert"] {
  color: #87483f !important;
  border-color: #dfbbb4 !important;
  background: #fbefec !important;
}

@media (max-width: 600px) {
  body.auth-crosswalk {
    padding: 20px 14px 34px !important;
  }

  .kn-auth-brand {
    margin-bottom: 18px !important;
    font-size: 20px;
  }

  .kn-auth-brand img {
    width: 58px !important;
    height: 58px !important;
  }

  body.auth-crosswalk .auth-card,
  body.auth-crosswalk .login-card,
  body.auth-crosswalk .signup-card,
  body.auth-crosswalk .form-card,
  body.auth-crosswalk > form {
    padding: 22px 18px !important;
    border-radius: 15px !important;
  }
}

/* KEYNEIGHBOR_AUTH_HOMEPAGE_V4_START */

:root {


  --kn-home-paper: var(--paper, var(--bg, #f5f3ed));
  --kn-home-surface: var(--surface, var(--panel, #fffefa));
  --kn-home-ink: var(--ink, #1d2927);
  --kn-home-muted: var(--ink-soft, var(--muted, #65736f));
  --kn-home-line: var(--border, #d8ddd7);
  --kn-home-accent: var(--accent, #315a54);
}

html[data-theme="crosswalk"] {
--bg:#FFFFFF; --surface:#FFFFFF; --surface-2:#F6F6F8;
    --ink:#1A1A1F; --ink-soft:#63636F; --border:#E7E7EC;
    --accent:#7C3AED; --accent-ink:#FFFFFF; --accent-tint:#EDE3FD;
    --secondary:#E4318C; --secondary-tint:#FBDEEC;
    --font-display:'Bricolage Grotesque'; --font-body:'Work Sans'; --font-mono:'Space Mono';
    --radius:14px;
--bg:#FFFFFF; --surface:#FFFFFF; --surface-2:#F6F6F8;
    --ink:#15161A; --ink-soft:#63666F; --border:#E7E7EC;
    --accent:#FF2E63; --accent-ink:#FFFFFF; --accent-tint:#FFE0E9;
    --secondary:#5B5FEF; --secondary-tint:#E6E6FD;
    --font-display:'Barlow Condensed'; --font-body:'Barlow'; --font-mono:'Space Mono';
    --radius:10px;
content:"+"; width:auto; height:auto; background:none; color:var(--secondary); font-family:var(--font-mono); font-size:14px; line-height:1;

  min-height: 100%;
  color-scheme: light;
  background: var(--kn-home-paper);
}

body.auth-crosswalk {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 30px 18px !important;
  overflow-x: hidden !important;
  background: var(--kn-home-paper) !important;
  color: var(--kn-home-ink) !important;
  font-family:
    var(--font-body),
    Inter,
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif !important;
}

body.auth-crosswalk *,
body.auth-crosswalk *::before,
body.auth-crosswalk *::after {
  box-sizing: border-box;
  animation: none !important;
  transition: none !important;
}

body.auth-crosswalk .kn-auth-legacy-hidden {
  display: none !important;
}

body.auth-crosswalk .kn-auth-path {
  display: block !important;
  position: static !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

body.auth-crosswalk .kn-auth-path::before,
body.auth-crosswalk .kn-auth-path::after {
  display: none !important;
  content: none !important;
}

body.auth-crosswalk .kn-auth-card {
  display: block !important;
  position: static !important;
  width: min(100%, 480px) !important;
  max-width: 480px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 32px !important;
  border: 1px solid var(--kn-home-line) !important;
  border-radius: 18px !important;
  background: var(--kn-home-surface) !important;
  box-shadow: 0 18px 48px rgba(35, 49, 46, 0.10) !important;
  transform: none !important;
}

body.auth-crosswalk .kn-auth-card::before,
body.auth-crosswalk .kn-auth-card::after {
  display: none !important;
  content: none !important;
}

body.auth-crosswalk .kn-auth-card .kn-auth-brand {
  display: flex !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin: 0 0 25px !important;
  padding: 0 !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--kn-home-ink) !important;
  text-decoration: none !important;
}

body.auth-crosswalk .kn-auth-card .kn-auth-brand img {
  display: block !important;
  width: 64px !important;
  height: 64px !important;
  min-width: 64px !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.auth-crosswalk .kn-auth-card h1,
body.auth-crosswalk .kn-auth-card h2 {
  margin-top: 0 !important;
  color: var(--kn-home-ink) !important;
  font-family:
    var(--font-display),
    Inter,
    ui-sans-serif,
    system-ui,
    sans-serif !important;
  letter-spacing: -0.035em !important;
}

body.auth-crosswalk .kn-auth-card p {
  color: var(--kn-home-muted) !important;
}

body.auth-crosswalk .kn-auth-card form {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 23px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.auth-crosswalk .kn-auth-card label {
  color: var(--kn-home-ink) !important;
  font-weight: 650 !important;
}

body.auth-crosswalk .kn-auth-card input,
body.auth-crosswalk .kn-auth-card select,
body.auth-crosswalk .kn-auth-card textarea {
  width: 100% !important;
  min-height: 48px !important;
  border: 1px solid var(--kn-home-line) !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: var(--kn-home-ink) !important;
  box-shadow: none !important;
}

body.auth-crosswalk .kn-auth-card input:focus,
body.auth-crosswalk .kn-auth-card select:focus,
body.auth-crosswalk .kn-auth-card textarea:focus {
  border-color: var(--kn-home-accent) !important;
  outline: 3px solid rgba(71, 115, 107, 0.16) !important;
  outline-offset: 1px !important;
}

body.auth-crosswalk .kn-auth-card button,
body.auth-crosswalk .kn-auth-card input[type="submit"],
body.auth-crosswalk .kn-auth-card .button,
body.auth-crosswalk .kn-auth-card .btn-primary {
  width: 100% !important;
  min-height: 48px !important;
  border: 1px solid var(--kn-home-accent) !important;
  border-radius: 10px !important;
  background: var(--kn-home-accent) !important;
  color: #ffffff !important;
  font-weight: 720 !important;
  box-shadow: none !important;
}

body.auth-crosswalk .kn-auth-card a:not(.kn-auth-brand) {
  color: var(--kn-home-accent) !important;
}

@media (max-width: 600px) {
  body.auth-crosswalk {
    justify-content: flex-start !important;
    padding: 18px 12px 30px !important;
  }

  body.auth-crosswalk .kn-auth-card {
    width: 100% !important;
    padding: 24px 18px !important;
    border-radius: 15px !important;
  }

  body.auth-crosswalk .kn-auth-card .kn-auth-brand img {
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
  }
}

/* KEYNEIGHBOR_AUTH_HOMEPAGE_V4_END */
