.auth-card { width: min(100%, 440px); position: relative; z-index: 2; }
.auth-card .card-content { padding: 38px 34px 32px; }
.auth-header { margin-bottom: 26px; }
.auth-header .eyebrow { margin-bottom: 14px; }
.auth-header h1 { font-size: 27px; font-weight: 700; line-height: 1.15; }
.auth-header h1 span {
  background: linear-gradient(120deg, var(--c-crimson-bright), var(--c-crimson) 70%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.auth-header p { margin-top: 10px; font-size: 13.5px; line-height: 1.55; color: var(--c-text-dim); }
.auth-panel { background: var(--glass-bg-soft); border: 1px solid var(--c-border-soft); border-radius: var(--r-lg); padding: 22px; }
.auth-note { margin-top: 18px; font-size: 11.5px; line-height: 1.6; color: var(--c-text-faint); text-align: center; }
.divider-line { height: 1px; background: linear-gradient(90deg, transparent, var(--c-border-strong), transparent); margin: 22px 0 0; }

/* =========================================================================
   МОБИЛЬНАЯ АДАПТАЦИЯ — страница входа
   ========================================================================= */
@media (max-width: 480px) {
  .auth-card .card-content { padding: 26px 18px 22px; }
  .auth-header h1 { font-size: 22px; }
  .auth-panel { padding: 16px; }

  /* Кнопка показа пароля — увеличенная зона нажатия, не наезжает на текст поля */
  #password { padding-right: 46px; }
  .field-toggle { top: 32px; right: 4px; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 16px; }
}

/* === КНОПКА ПЕРЕКЛЮЧЕНИЯ ТЕМ === */
.theme-switcher-btn {
  position: fixed;
  bottom: 24px;
  right: 24px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--glass-bg-strong);
  border: 1px solid var(--c-border);
  color: var(--c-text);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1100;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(10px);
  transition: all 0.2s var(--ease-out);
}

.theme-switcher-btn:hover {
  transform: translateY(-2px) scale(1.05);
  color: #fff;
  border-color: var(--c-crimson);
  box-shadow: 0 12px 32px rgba(227, 29, 58, 0.3);
}

/* === МЕНЮ ПЕРЕКЛЮЧЕНИЯ ТЕМ === */
.theme-switcher-menu {
  position: fixed;
  bottom: 80px;
  right: 24px;
  width: 300px;
  max-height: 400px;
  border-radius: var(--r-lg);
  background: var(--glass-bg-strong);
  border: 1px solid var(--c-border);
  backdrop-filter: blur(12px);
  z-index: 1100;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
  display: none;
  flex-direction: column;
  overflow: hidden;
}

.theme-switcher-menu.active {
  display: flex;
  animation: slideUpFadeIn 0.3s var(--ease-out);
}

@keyframes slideUpFadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.theme-switcher-header {
  padding: 14px 16px;
  border-bottom: 1px solid var(--c-border-soft);
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: rgba(0, 0, 0, 0.2);
}

.theme-switcher-notice {
  padding: 10px 16px;
  background: rgba(255, 179, 77, 0.1);
  border-bottom: 1px solid rgba(255, 179, 77, 0.2);
  text-align: center;
}

.theme-switcher-content {
  padding: 12px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.theme-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border-radius: var(--r-md);
  background: rgba(0, 0, 0, 0.2);
  border: 1px solid var(--c-border-soft);
  cursor: pointer;
  transition: all 0.2s var(--ease-out);
}

.theme-card:hover {
  background: rgba(255, 255, 255, 0.05);
  border-color: var(--c-crimson);
  transform: translateX(2px);
}

.theme-card.active {
  background: rgba(227, 29, 58, 0.15);
  border-color: var(--c-crimson-bright);
}

.btn-icon {
  background: none;
  border: none;
  color: var(--c-text-dim);
  cursor: pointer;
  padding: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s;
}

.btn-icon:hover {
  color: #fff;
}

/* Адаптивность для мобильных устройств */
@media (max-width: 900px) {
  .theme-switcher-btn {
    bottom: 16px;
    right: 16px;
    width: 44px;
    height: 44px;
  }

  .theme-switcher-menu {
    bottom: 68px;
    right: 16px;
    width: calc(100vw - 32px);
    max-width: 320px;
  }
}

@media (max-width: 420px) {
  .theme-switcher-btn {
    bottom: 12px;
    right: 12px;
    width: 40px;
    height: 40px;
  }

  .theme-switcher-menu {
    bottom: 60px;
    right: 12px;
    left: 12px;
    width: auto;
    max-width: none;
  }
}