/* Мобильная адаптация — только html.device-mobile, ПК-версия не затрагивается */

html.device-mobile {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

html.device-mobile body {
  padding-bottom: env(safe-area-inset-bottom);
}

html.device-mobile .app {
  padding: 12px 12px max(12px, env(safe-area-inset-bottom));
}

/* Шапка */
html.device-mobile .header {
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  margin-bottom: 12px;
}

html.device-mobile .header__brand .subtitle {
  display: none;
}

html.device-mobile .header__brand h1 {
  font-size: 1.2rem;
}

html.device-mobile .header__status {
  flex-direction: column;
  align-items: stretch;
  margin-left: 0;
  gap: 8px;
}

html.device-mobile .user-bar {
  flex-wrap: wrap;
  justify-content: center;
  border-radius: var(--radius);
  gap: 8px;
  padding: 10px 12px;
}

html.device-mobile .user-bar__promo {
  flex: 1 1 100%;
  width: 100%;
}

html.device-mobile .user-bar__promo input {
  flex: 1;
  min-width: 0;
}

html.device-mobile #comfy-status {
  align-self: center;
  font-size: 0.72rem;
}

html.device-mobile .header__center {
  order: unset;
  flex-basis: auto;
  padding: 0;
}

html.device-mobile .ai-agent-chats-bar--header {
  flex-direction: column;
  align-items: stretch;
  max-width: none;
}

html.device-mobile .ai-agent-chats-bar--header .ai-agent-chats-bar__field {
  min-width: 0;
  width: 100%;
}

/* Вкладки */
html.device-mobile .app-tabs {
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  gap: 6px;
  margin-bottom: 14px;
  padding-bottom: 2px;
}

html.device-mobile .app-tabs::-webkit-scrollbar {
  display: none;
}

html.device-mobile .app-tab {
  flex-shrink: 0;
  padding: 10px 14px;
  font-size: 0.82rem;
}

/* Очередь */
html.device-mobile .queue-bar {
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  padding: 12px;
  margin-bottom: 14px;
}

html.device-mobile .queue-bar > .queue-stat {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  min-width: 0;
}

html.device-mobile .queue-stat__value {
  font-size: 1.25rem;
}

html.device-mobile .queue-job {
  min-width: 0;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}

html.device-mobile .progress-wrap {
  min-width: 0;
  width: 100%;
}

/* Макет генерации */
html.device-mobile .layout {
  grid-template-columns: 1fr;
  gap: 14px;
}

html.device-mobile .panel--result {
  position: static;
  max-height: none;
  overflow: visible;
}

html.device-mobile .panel--result .panel__section--fill {
  max-height: none;
}

html.device-mobile .panel--controls {
  overflow-x: visible;
}

html.device-mobile .upload-grid {
  grid-template-columns: repeat(2, 1fr);
}

html.device-mobile .params-grid {
  grid-template-columns: 1fr;
}

html.device-mobile .presets-bar {
  flex-direction: column;
  align-items: stretch;
}

html.device-mobile .presets-bar select {
  width: 100%;
  min-width: 0;
}

html.device-mobile .generate-actions {
  flex-direction: column;
  align-items: stretch;
}

html.device-mobile .generate-actions .btn {
  width: 100%;
}

html.device-mobile .lora-slot__fields {
  grid-template-columns: 1fr;
}

/* Результат и история */
html.device-mobile .result-area {
  min-height: 200px;
}

html.device-mobile .history-grid {
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 10px;
}

html.device-mobile .history-toolbar {
  flex-wrap: wrap;
  gap: 8px;
}

/* Системные пресеты */
html.device-mobile .system-presets-tabs,
html.device-mobile .admin-tabs {
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 2px;
}

html.device-mobile .system-presets-tabs::-webkit-scrollbar,
html.device-mobile .admin-tabs::-webkit-scrollbar {
  display: none;
}

html.device-mobile .system-presets-tab,
html.device-mobile .admin-tab {
  flex-shrink: 0;
}

html.device-mobile .system-presets-grid {
  grid-template-columns: 1fr;
}

html.device-mobile .system-presets-hint {
  font-size: 0.85rem;
}

/* AI Agent */
html.device-mobile .panel--deepseek {
  min-height: calc(100dvh - 180px);
  max-height: none;
}

html.device-mobile .deepseek-toolbar {
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  padding: 12px;
}

html.device-mobile .deepseek-toolbar__right {
  align-items: stretch;
}

html.device-mobile .deepseek-input-row {
  flex-wrap: wrap;
}

html.device-mobile .deepseek-form {
  padding: 10px 12px max(12px, env(safe-area-inset-bottom));
}

html.device-mobile .deepseek-msg {
  max-width: 100%;
}

/* Админка */
html.device-mobile .admin-users-grid,
html.device-mobile .promos-grid {
  grid-template-columns: 1fr;
}

html.device-mobile .users-list__row {
  flex-direction: column;
  align-items: stretch;
}

html.device-mobile .preset-categories-list {
  flex-direction: column;
}

html.device-mobile .preset-category-chip {
  width: 100%;
}

/* Модальные окна */
html.device-mobile dialog.modal {
  width: calc(100vw - 20px);
  max-width: calc(100vw - 20px);
  margin: auto;
}

html.device-mobile .prompt-builder-modal .modal__content,
html.device-mobile .system-preset-modal .modal__content {
  min-width: 0;
  width: 100%;
  max-height: calc(100dvh - 1rem);
}

html.device-mobile .system-preset-modal.modal {
  width: calc(100vw - 16px);
  max-width: calc(100vw - 16px);
}

html.device-mobile .system-preset-modal--card-builder .ru-text-canvas-stage,
html.device-mobile .system-preset-modal--card-builder .ru-text-canvas-wrap,
html.device-mobile .system-preset-modal--card-builder .ru-text-canvas-img {
  max-height: min(28vh, 220px);
}

html.device-mobile .visual-options-grid {
  grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
  max-height: 40dvh;
}

/* Кнопки и поля — удобнее для касаний */
html.device-mobile .btn:not(.btn--small) {
  min-height: 44px;
}

html.device-mobile .btn--small {
  min-height: 40px;
}

html.device-mobile input:not([type='checkbox']):not([type='radio']),
html.device-mobile select,
html.device-mobile textarea {
  font-size: 16px;
}

/* Страница входа */
html.device-mobile body.auth-page {
  padding: 16px;
  padding-bottom: max(16px, env(safe-area-inset-bottom));
}

html.device-mobile .ru-text-canvas-panels {
  grid-template-columns: 1fr;
}

html.device-mobile .ru-text-canvas-stage {
  min-height: 180px;
}