/* ВМСКПР — современный слой оформления для телефонов.
   Действует только при ширине до 760px и только когда на <html> стоит класс "mm"
   (его ставит modern.js; на странице прохождения теста /take/ файл не подключается вовсе).
   Чтобы отключить: убрать строки sub_filter из настроек nginx и перезагрузить nginx. */

#mmBar { display: none; }

@media (max-width: 760px) {
  html.mm body { background: #f2f4f8 !important; -webkit-font-smoothing: antialiased; }

  /* шапка: полупрозрачное «стекло» вместо сплошной плашки */
  html.mm .topbar {
    background: rgba(255, 255, 255, .82) !important;
    -webkit-backdrop-filter: saturate(1.7) blur(18px); backdrop-filter: saturate(1.7) blur(18px);
    border-radius: 0 !important; box-shadow: 0 1px 0 rgba(15, 23, 42, .07) !important;
  }
  html.mm .topbar .menu-toggle { border-radius: 14px !important; }

  /* место под нижнюю панель */
  html.mm main { padding-bottom: calc(104px + env(safe-area-inset-bottom)) !important; }

  /* заголовки */
  html.mm main h1 { font-size: 25px !important; font-weight: 800 !important; letter-spacing: -.02em; line-height: 1.18 !important; }
  html.mm main h2 { letter-spacing: -.01em; }

  /* карточки: больше скругление, мягкая тень, без рамок */
  html.mm main .card,
  html.mm main tr.v790-row,
  html.mm main .mini {
    border: 0 !important; border-radius: 20px !important;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 8px 24px rgba(16, 24, 40, .06) !important;
  }

  /* поля ввода: крупные, 16px чтобы iPhone не приближал экран */
  html.mm main input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]):not([type=color]),
  html.mm main select,
  html.mm main textarea {
    min-height: 48px; font-size: 16px !important;
    border: 1px solid #e2e8f0 !important; border-radius: 14px !important; background-color: #f8fafc;
    transition: border-color .15s, box-shadow .15s, background-color .15s;
  }
  html.mm main input:focus, html.mm main select:focus, html.mm main textarea:focus {
    outline: 0 !important; background-color: #fff;
    border-color: var(--p, #1665d8) !important; box-shadow: 0 0 0 4px rgba(22, 101, 216, .14) !important;
  }

  /* кнопки и метки */
  html.mm main .btn, html.mm main button { border-radius: 14px !important; }
  html.mm main .icon-danger { border-radius: 50% !important; }
  html.mm main .pill, html.mm main .v790-pill { border-radius: 999px !important; }
  html.mm main .btn:active, html.mm main button:active, html.mm #mmBar a:active, html.mm #mmBar button:active { transform: scale(.97); }

  /* нижняя панель быстрых разделов */
  html.mm #mmBar {
    display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 2px;
    position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 40;
    padding: 6px; border-radius: 24px;
    background: rgba(255, 255, 255, .86);
    -webkit-backdrop-filter: saturate(1.8) blur(20px); backdrop-filter: saturate(1.8) blur(20px);
    box-shadow: 0 12px 32px rgba(16, 24, 40, .18), 0 0 0 1px rgba(15, 23, 42, .05);
    transition: transform .2s ease, opacity .2s ease;
  }
  html.mm #mmBar.mm-hide { transform: translateY(140%); opacity: 0; pointer-events: none; }
  html.mm #mmBar a, html.mm #mmBar button {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    min-width: 0; min-height: 50px; margin: 0; padding: 6px 0; border: 0; border-radius: 18px;
    background: none; box-shadow: none; color: #64748b; text-decoration: none;
    font-family: inherit; font-size: 10px; font-weight: 600; line-height: 1.15; letter-spacing: -.01em;
    -webkit-tap-highlight-color: transparent; cursor: pointer; transition: transform .1s;
  }
  html.mm #mmBar svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  /* подпись: до двух строк, длинное слово обрезается многоточием */
  html.mm #mmBar .mm-t { max-width: 100%; overflow: hidden; text-align: center; text-overflow: ellipsis;
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

  /* кнопка чата поддержки и окно архива не должны прятаться под панелью */
  html.mm .v196-help-fab { bottom: calc(96px + env(safe-area-inset-bottom)) !important; }
  html.mm main iframe[src="/arhiv/"] { height: calc(100vh - 190px) !important; height: calc(100dvh - 190px) !important; min-height: 0 !important; }
  html.mm #mmBar .mm-on { color: var(--p, #1665d8); background: rgba(22, 101, 216, .10); }

  @media (prefers-reduced-motion: reduce) {
    html.mm #mmBar, html.mm #mmBar a, html.mm #mmBar button { transition: none; }
  }
}
