/* /opt/skynet-portal/app/static/css/login-mobile.css */
/* v0.1.3 — welcome/вспышка синхронизированы с адаптивной точкой прилёта лого */
/* 12.07.2026: планшет 34%, телефон 30% (= warpCY в login-fx.js) */

/* ===== ПЛАНШЕТ И НИЖЕ (≤860px): колонки в стопку ===== */
@media (max-width: 860px) {
  .auth-scene {
    padding-top: 72px;              /* место под фиксированный топбар */
    padding-bottom: 88px;           /* место под бар сцен */
  }
  .auth-shell {
    grid-template-columns: 1fr;
    max-width: 460px;
  }
  .auth-shell::after { display: none; }
  .auth-brand {
    padding: var(--sp-8) var(--sp-8) var(--sp-6);
    text-align: center;
    align-items: center;
  }
  .auth-brand-inner { transform: none; }
  .auth-logo { margin-left: auto; margin-right: auto; }
  .auth-services { justify-content: center; }
  .auth-brand-name { font-size: 2.1rem; }
  .auth-form-panel { padding: var(--sp-8); }
  /* Welcome/вспышка привязаны к точке прилёта лого (warpCY = 34%) */
  .fx-welcome { top: 34%; padding-top: 104px; }
  .fx-flash { background: radial-gradient(circle at 50% 34%, rgba(255,255,255,0.9) 0%, var(--fx-logo-g1) 30%, transparent 62%); }
}

/* ===== ТЕЛЕФОН (≤480px) ===== */
@media (max-width: 480px) {
  .auth-scene {
    padding: 64px var(--sp-3) 80px;
    align-items: flex-start;
  }
  .auth-shell { max-width: 100%; border-radius: var(--radius-xl); }

  /* Компактный топбар — не налезает на карточку */
  .auth-topbar { top: var(--sp-3); right: var(--sp-3); gap: var(--sp-2); }
  .auth-topbar .btn-icon { width: 36px; height: 36px; }
  .auth-topbar .btn-icon svg { width: 18px; height: 18px; }
  .lang-switch summary {
    min-height: 36px;
    padding: var(--sp-1) var(--sp-2);
    font-size: var(--fs-xs);
  }

  /* Бренд-панель компактнее */
  .auth-brand { padding: var(--sp-6) var(--sp-5) var(--sp-4); }
  .auth-logo { width: 80px; height: 80px; margin-bottom: var(--sp-5); }
  .auth-logo-img { width: 56px; height: 56px; }
  .auth-logo-glow { width: 108px; height: 108px; }
  .auth-brand-name { font-size: 1.75rem; letter-spacing: 0.1em; }
  .auth-brand-sub { font-size: var(--fs-xs); letter-spacing: 0.2em; }
  .auth-services { display: none; }
  .auth-form-panel { padding: var(--sp-6) var(--sp-5); }

  /* Бар сцен: одна строка с горизонтальным скроллом чипов */
  .fx-bar {
    bottom: 10px;
    max-width: calc(100vw - 16px);
    padding: 5px 6px;
    gap: 8px;
    flex-wrap: nowrap;
  }
  .fx-chips {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    flex: 1 1 auto;
    min-width: 0;
  }
  .fx-bar-sep { flex-shrink: 0; }
  .fx-chips::-webkit-scrollbar { display: none; }
  .fx-chip { padding: 6px 11px; font-size: 12px; flex-shrink: 0; }
  .fx-dot { width: 18px; height: 18px; flex-shrink: 0; }
  .fx-bar-hint { display: none; }

  /* Welcome/вспышка привязаны к точке прилёта лого (warpCY = 30%) */
  .fx-welcome { top: 30%; padding-top: 96px; gap: 12px; }
  .fx-flash { background: radial-gradient(circle at 50% 30%, rgba(255,255,255,0.9) 0%, var(--fx-logo-g1) 30%, transparent 62%); }
  .fx-welcome-title { font-size: 26px; }
  .fx-fly { width: 80px; height: 80px; }
  .fx-fly img { width: 60px; height: 60px; }
}

/* ===== Ландшафт телефона / низкие экраны ===== */
@media (max-height: 640px) {
  .auth-scene { align-items: flex-start; }
}
@media (max-width: 860px) and (orientation: landscape) and (max-height: 520px) {
  .auth-scene { padding-top: 60px; padding-bottom: 72px; }
  .auth-brand { padding: var(--sp-4) var(--sp-5); }
  .auth-logo { width: 64px; height: 64px; margin-bottom: var(--sp-3); }
  .auth-logo-img { width: 46px; height: 46px; }
  .auth-brand-name { font-size: 1.5rem; }
  .auth-services { display: none; }
  .auth-form-panel { padding: var(--sp-4) var(--sp-5); }
  .login-form { gap: var(--sp-3); }
  .fx-welcome { top: 12%; padding-top: 70px; }
}