/* rankin.party presentation layer. Application behavior stays upstream. */
:root {
  --rankin-theme-version: 2;
  --primary-h: 174deg;
  --primary-s: 39%;
  --primary-l: 26%;
  --primary: #295e59;
  --primary-invert: #fff;
  --link: #295e59;
  --logo-text-color: #243c39;
}
html.dark { --logo-text-color: #e1ebe8; --link: #9dccc2; }
body, button, input, textarea, select, .title, .subtitle, .navbar, .menu {
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.no-auth-wrapper {
  background: #f7f4ec !important;
  padding: clamp(1.5rem, 5vh, 4rem) 1.25rem !important;
  min-height: 100dvh;
}
.no-auth-wrapper > .logo { width: 230px; height: auto; margin: 0 0 2rem; }
.no-auth-wrapper .logo svg { max-inline-size: 230px; max-block-size: 48px; }
.noauth-container { border-radius: 24px !important; overflow: hidden; box-shadow: 0 16px 64px #243c3910 !important; border: 1px solid #e4e7de; }
.noauth-container .image {
  background: radial-gradient(ellipse at 12% 14%, #d6dfbc 0%, transparent 52%), radial-gradient(ellipse at 90% 85%, #72a298 0%, transparent 60%), #295e59 !important;
  padding: 3rem;
}
.noauth-container .image::before { background: none !important; }
.noauth-container .image-title { font-family: Inter, system-ui, sans-serif; font-weight: 550; letter-spacing: -.04em; font-size: 3rem; line-height: 1.05; max-width: 7ch; }
.noauth-container .content { padding: 2.75rem; }
.no-auth-wrapper .api-url-info { display: none; }
.noauth-container .input { border-radius: 10px; min-height: 44px; box-shadow: none; }
.noauth-container .button { border-radius: 10px; }
.noauth-container .legal-links { text-align: start; font-size: .75rem; margin-top: 1.5rem; }
.noauth-container .legal-links a { color: var(--grey-400); }
.offline { background: #295e59 !important; }
@media (max-width: 768px) {
  .no-auth-wrapper { padding: 2rem 1rem !important; }
  .noauth-container { min-block-size: auto; }
  .noauth-container .content { padding: 1.75rem; }
}
html.dark .no-auth-wrapper { background: #172623 !important; }
html.dark .noauth-container { border-color: #344640; }

.show-tasks .llama-cool { width: 96px; height: 96px; opacity: .85; }
.logo-link svg.logo { width: 168px; height: auto; }