@import url("./diary-main.css?v=2026081310");
@import url("./diary-auth-premium.css?v=2026081310");
@import url("./diary-auth-polish.css?v=2026081310");
@import url("./diary-auth-finish.css?v=2026081310");
@import url("./diary-auth-mobile-fix.css?v=2026081310");

/* App download cards: clean columns with platform details inside. */
#authShell .app-downloads-heading p {
  margin-top: .2rem;
}

#authShell .app-download-card,
#authShell .app-download-card[data-platform="android"],
#authShell .app-download-card[data-platform="ios"] {
  min-height: 4rem;
  padding: .72rem .8rem;
  border-width: 1px;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

#authShell .app-download-card[data-platform="android"] {
  border-color: rgba(22, 163, 74, .38);
}

#authShell .app-download-card[data-platform="ios"] {
  border-color: rgba(14, 165, 233, .38);
}

#authShell .app-download-card[data-platform="android"]:hover {
  border-color: rgba(22, 163, 74, .66);
  background: rgba(240, 253, 244, .42);
  transform: translateY(-1px);
}

#authShell .app-download-card[data-platform="ios"] .app-download-icon {
  background: linear-gradient(145deg, #38bdf8, #2563eb);
  box-shadow: 0 .35rem .9rem rgba(37, 99, 235, .2);
}

#authShell .app-download-copy {
  gap: .34rem;
  min-width: 0;
}

#authShell .app-download-copy small {
  width: fit-content;
  max-width: 100%;
  padding: .28rem .42rem;
  white-space: normal;
  line-height: 1.15;
}

html[data-theme]:not([data-theme="light"]) #authShell .app-download-card,
html[data-theme]:not([data-theme="light"]) #authShell .app-download-card[data-platform="android"],
html[data-theme]:not([data-theme="light"]) #authShell .app-download-card[data-platform="ios"] {
  background: transparent;
}

html[data-theme]:not([data-theme="light"]) #authShell .app-download-card[data-platform="android"] {
  border-color: rgba(74, 222, 128, .48);
}

html[data-theme]:not([data-theme="light"]) #authShell .app-download-card[data-platform="ios"] {
  border-color: rgba(56, 189, 248, .5);
}

@media (max-width: 560px) {
  #authShell .app-download-card,
  #authShell .app-download-card[data-platform="android"],
  #authShell .app-download-card[data-platform="ios"] {
    min-height: 3.75rem;
    padding: .62rem .65rem;
  }

  #authShell .app-download-copy small {
    font-size: .59rem;
    letter-spacing: .02em;
  }
}

/* Desktop auth layout must stay readable for longer translations and browser zoom. */
@media (min-width: 900px) {
  #authShell .auth-panel {
    grid-template-rows: auto auto auto auto auto minmax(0, 1fr);
    grid-template-areas:
      "visual tabs"
      "visual demo"
      "heading content"
      "trust content"
      "downloads message"
      "downloads resend";
  }

  #authShell .auth-heading {
    min-width: 0;
  }

  #authShell .auth-heading .hero-title {
    width: 100%;
    max-width: none;
    font-size: clamp(2.3rem, 2.7vw, 3rem);
    line-height: 1.02;
    overflow-wrap: normal;
    word-break: normal;
  }

  html[data-language="de"] #authShell .auth-heading .hero-title {
    font-size: clamp(2.05rem, 2.25vw, 2.45rem);
    letter-spacing: -.045em;
    white-space: nowrap;
  }

  #authShell .auth-trust-mark {
    grid-area: trust;
    align-self: start;
    width: auto;
    max-width: calc(100% - 3.4rem);
    margin-top: .65rem;
  }

  #authShell .auth-panel:has(#loginForm:not(.hidden)) .auth-trust-mark {
    align-self: start;
  }
}

@media (min-width: 900px) and (max-width: 1100px) {
  html[data-language="de"] #authShell .auth-heading .hero-title {
    font-size: clamp(1.55rem, 2.4vw, 2rem);
  }
}

@media (min-width: 900px) and (max-height: 720px) {
  #authShell .auth-heading .hero-title {
    font-size: 2.15rem;
  }

  html[data-language="de"] #authShell .auth-heading .hero-title {
    font-size: 1.95rem;
  }

  #authShell .auth-trust-mark {
    margin-top: .2rem;
    padding-block: .4rem;
  }
}