/*
 * rm-ui.css — одна система деталей R&M (пакет «Система R&M», 7a–7c, 6.10.2026).
 * Владелец — platform. Подключают пульт и Штаб (frontend-admin), экран,
 * телефоны и кабинеты (frontend-display) и сайт (/rm-ui.css).
 *
 * Файл только ДОБАВЛЯЕТ: переменные --rm-* и классы .rm-*. Чужие элементы он
 * не трогает, поэтому подключение ничего на старых экранах не меняет —
 * экран переходит на систему, когда его вёрстка берёт эти классы.
 *
 * Режим выбирается по месту, не по роли (7a): на вечере — тёмный
 * (<body data-mode="evening">: /helper, пульт, /dj, экран зала, гость на
 * вечере), вне вечера — светлый (Штаб, /cab, кабинет клиента). Витрина
 * сайта — свой бренд R&M, бордовый и розовое золото (<body data-mode="site">).
 * Золото — только главное действие и активное состояние, не фон и не декор.
 * Красный — только деньги «должны» и ошибки. Persona Joy и Full House — свои
 * бренды, живут только на экране зала и в печати.
 *
 * Цвета вне этого файла не заводим: новый оттенок — сюда, переменной.
 *
 * Шрифт Manrope — из /fonts/fonts.css (лежит локально: в клубе бывает без
 * интернета). Фронты его уже подключают; странице сайта — <link> рядом.
 */

/* ---------- 7a · цвета, 7b · шрифт, 7c · размеры ---------- */

:root {
  /* Светлый режим */
  --rm-ink: #1A1A1C;          /* чёрный: шапка, главная кнопка */
  --rm-ink-2: #2E2D2E;        /* плитка на чёрном: карточка «вечер сегодня», кнопки шапки */
  --rm-bg: #efeade;           /* фон страницы */
  --rm-bg-2: #f6f3ec;         /* фон панелей */
  --rm-card: #fff;            /* карточки, блоки */
  --rm-line: #e1d8c4;         /* рамки */
  --rm-line-dash: #cbbf9f;    /* пунктир «пусто» */
  --rm-text: #1A1A1C;
  --rm-text-2: #6f6855;       /* подписи */
  --rm-gold: #C9A44C;         /* акцент */
  --rm-gold-text: #8A6D1F;    /* золото текстом на светлом */
  --rm-on-ink: #F3EFE6;       /* текст на чёрном */
  --rm-gold-on-ink: #E6C877;  /* золото на чёрном */
  --rm-error: #B42318;        /* деньги «должны», ошибки */
  --rm-error-bg: #FBE9E7;
  --rm-ok: #2F5D3F;
  --rm-ok-bg: #EEF1EA;
  --rm-error-line: #F2C4BE;   /* рамка полоски «нет сети» */
  --rm-ok-line: #CFDCCB;
  --rm-off-bg: #E8E2D3;       /* «нельзя» */
  --rm-off-text: #8d8670;
  /* Метка диджея (hot cue, автослова на волне) — голубая, чтобы не сливаться
     с золотыми ВХОД/ВЫХОД. Только для меток музыки, не для кнопок и фона. */
  --rm-cue: #2A9FD6;
  --rm-cue-text: #1C6E94;
  /* Чужие бренды — только кнопки входа «через Телеграм» и «через Яндекс»,
     одинаковые во всех режимах (их фирменные цвета). Больше нигде. */
  --rm-brand-tg: #2AABEE;
  --rm-brand-ya: #FC3F1D;

  /* Кнопки по режиму (деталь 1 / 7) */
  --rm-btn-main-bg: var(--rm-ink);
  --rm-btn-main-fg: var(--rm-gold-on-ink);
  --rm-btn-second-line: var(--rm-ink);
  --rm-btn-second-fg: var(--rm-text);
  --rm-btn-second-width: 1.5px;
  --rm-btn-quiet-line: var(--rm-line);
  --rm-btn-quiet-fg: var(--rm-text-2);
  --rm-switch-bg: var(--rm-card);
  --rm-switch-on-bg: var(--rm-ink);
  --rm-switch-on-fg: var(--rm-gold-on-ink);

  /* 7b · Manrope, 6 размеров; меньше 12 px не бывает */
  --rm-font: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --rm-fs-screen: 32px;   /* главная цифра экрана, 800 */
  --rm-fs-title: 24px;    /* заголовок экрана, 800 */
  --rm-fs-section: 18px;  /* шапка, заголовок блока, 800 */
  --rm-fs-body: 15px;     /* строки, кнопки, 700 */
  --rm-fs-caption: 13px;  /* второй строкой, 500 */
  --rm-fs-label: 12px;    /* метка: заглавные, разрядка .08em, 800 */

  /* 7c · отступы, радиусы, нажимаемое */
  --rm-gap: 14px;         /* между блоками: телефон */
  --rm-r-btn: 10px;
  --rm-r-card: 14px;
  --rm-r-sheet: 22px;
  --rm-tap: 44px;         /* нажимаемое не меньше */
  --rm-tap-lg: 52px;      /* крупная кнопка */
}

@media (min-width: 1024px) {
  :root { --rm-gap: 20px; }  /* компьютер */
}

/* Тёмный режим «на вечере» */
[data-mode="evening"] {
  --rm-ink: #1A1A1C;
  --rm-ink-2: #2E2D2E;
  --rm-bg: #111113;
  --rm-bg-2: #1A1A1C;         /* шапка, панели */
  --rm-card: #1F1F22;
  --rm-line: #2E2E33;
  --rm-line-dash: #3A3A40;
  --rm-text: #F3EFE6;
  --rm-text-2: #A9A496;
  --rm-gold: #C9A44C;
  --rm-gold-text: #E6C877;    /* золото на тёмном */
  --rm-error: #F07A6A;
  --rm-error-bg: rgba(180, 35, 24, .18);
  --rm-ok: #7FD49B;
  --rm-ok-bg: rgba(47, 125, 79, .18);
  --rm-error-line: #6A2A22;
  --rm-ok-line: #2F5D3F;
  --rm-off-bg: #26262A;
  --rm-off-text: #6f6a5e;
  --rm-cue: #5EC8F2;
  --rm-cue-text: #9FDDF6;

  --rm-btn-main-bg: var(--rm-gold);
  --rm-btn-main-fg: var(--rm-ink);
  --rm-btn-second-line: var(--rm-gold);
  --rm-btn-second-fg: var(--rm-gold-text);
  --rm-btn-second-width: 1px;
  --rm-btn-quiet-line: #3A3A40;
  --rm-btn-quiet-fg: #D8D3C6;
  --rm-switch-bg: #26262A;
  --rm-switch-on-bg: var(--rm-gold);
  --rm-switch-on-fg: var(--rm-ink);

  --rm-tap: 52px;             /* на вечере — от 52 px */
  --rm-tap-lg: 56px;
}

/*
 * Витрина сайта: бренд R&M — бордовый и розовое золото. <body data-mode="site">.
 * Эталон — главная (frontend-display/public/site.html, решение 6.10): прямые
 * углы, золото сверху вниз, жирные кнопки. Страницы на site.css (кнопки-
 * «таблетки») подтягиваются к главной по ходу переноса.
 *   rm-btn--main   = .btn--gold  (золото)
 *   rm-btn--second = .btn--wire  (золотая рамка)
 *   rm-btn--quiet  = .btn--ghost (тёмная рамка)
 */
/* Бордовые зоны светлой витрины (Марина 12.10): подвал и блок заявки — в бренде. */
[data-mode="site"], [data-mode="site-light"] :is(footer, #zayavka, #lead) {
  --rm-ink: #140203;           /* тёмные секции */
  --rm-glow: #330b0d;          /* свечение сверху страницы (radial-gradient фона) */
  --rm-ink-2: #2a090b;         /* плитка на тёмном — бордовая заливка сайта */
  --rm-bg: #1a0405;            /* основной фон — бордово-чёрный */
  --rm-bg-2: #2a090b;          /* карточки-заливки, поля */
  --rm-card: #2a090b;
  --rm-line: #43171a;
  --rm-line-dash: #5e2527;
  --rm-text: #F5E8DD;
  --rm-text-2: #CDB0A1;
  --rm-gold: #CF9C76;          /* розовое золото логотипа */
  --rm-gold-text: #ECC29D;
  --rm-on-ink: #F5E8DD;
  --rm-gold-on-ink: #ECC29D;
  --rm-error: #E09A7E;
  --rm-error-bg: rgba(224, 154, 126, .14);
  --rm-error-line: #6a2a22;
  --rm-ok: #8DBA79;
  --rm-ok-bg: rgba(141, 186, 121, .14);
  --rm-ok-line: #3d5a33;
  --rm-off-bg: #34100f;
  --rm-off-text: #A8877E;
  --rm-cue: #5EC8F2;
  --rm-cue-text: #9FDDF6;

  --rm-btn-main-bg: linear-gradient(180deg, #ECC29D 0%, #CF9C76 55%, #9C6A4D 100%);
  --rm-btn-main-fg: #1a0405;
  --rm-btn-second-line: #CF9C76;
  --rm-btn-second-fg: #CF9C76;
  --rm-btn-second-width: 1px;
  --rm-btn-quiet-line: #5e2527;
  --rm-btn-quiet-fg: #F5E8DD;
  --rm-switch-bg: #2a090b;
  --rm-switch-on-bg: linear-gradient(180deg, #ECC29D, #CF9C76);
  --rm-switch-on-fg: #1a0405;

  --rm-font: 'Onest', -apple-system, 'Segoe UI', Roboto, sans-serif;
  --rm-r-btn: 0;
  --rm-r-card: 0;
  --rm-r-sheet: 0;
}
/* Кнопка — ровно как .btn главной: 17px 28px, строка 1.5 (≈ 56–59 px). */
:is([data-mode="site"], [data-mode="site-light"]) .rm-btn { font: 800 15px/1.5 var(--rm-font); padding: 17px 28px; }
:is([data-mode="site"], [data-mode="site-light"]) .rm-btn:active { transform: translateY(1px); }
:is([data-mode="site"], [data-mode="site-light"]) .rm-btn--small { min-height: 36px; padding: 0 12px; font-size: 12px; line-height: 1.2; }
/* Страница витрины: свечение сверху, как у body главной. */
:is([data-mode="site"], [data-mode="site-light"]).rm-page, :is([data-mode="site"], [data-mode="site-light"]) .rm-page {
  background: radial-gradient(120% 70% at 50% 0%, var(--rm-glow) 0%, var(--rm-bg) 55%) fixed, var(--rm-bg);
}
:is([data-mode="site"], [data-mode="site-light"]) .rm-btn--main,
:is([data-mode="site"], [data-mode="site-light"]) .rm-btn--accent { background: var(--rm-btn-main-bg); color: var(--rm-btn-main-fg); border-width: 0; }
:is([data-mode="site"], [data-mode="site-light"]) .rm-btn--main:hover,
:is([data-mode="site"], [data-mode="site-light"]) .rm-btn--accent:hover { background: #ECC29D; filter: none; }
:is([data-mode="site"], [data-mode="site-light"]) .rm-btn--second:hover { background: rgba(207, 156, 118, .14); color: var(--rm-text); }
:is([data-mode="site"], [data-mode="site-light"]) .rm-btn--quiet:hover { border-color: var(--rm-gold); }
:is([data-mode="site"], [data-mode="site-light"]) .rm-switch,
:is([data-mode="site"], [data-mode="site-light"]) .rm-switch > *,
:is([data-mode="site"], [data-mode="site-light"]) .rm-toast,
:is([data-mode="site"], [data-mode="site-light"]) .rm-net,
:is([data-mode="site"], [data-mode="site-light"]) .rm-evhead,
:is([data-mode="site"], [data-mode="site-light"]) .rm-evhead__logo,
:is([data-mode="site"], [data-mode="site-light"]) .rm-stage,
:is([data-mode="site"], [data-mode="site-light"]) .rm-input { border-radius: 0; }
:is([data-mode="site"], [data-mode="site-light"]) .rm-stage { background: transparent; color: var(--rm-text-2); border: 1px solid var(--rm-line); }
:is([data-mode="site"], [data-mode="site-light"]) .rm-stage--lead, :is([data-mode="site"], [data-mode="site-light"]) .rm-stage--today { color: var(--rm-gold); border-color: var(--rm-gold); }
:is([data-mode="site"], [data-mode="site-light"]) .rm-stage--ahead { color: var(--rm-ok); }
:is([data-mode="site"], [data-mode="site-light"]) .rm-stage--due { color: var(--rm-error); }
/* Крупные заголовки и цифры на сайте — Playfair, как h1/h2 витрины. */
:is([data-mode="site"], [data-mode="site-light"]) .rm-t-screen,
:is([data-mode="site"], [data-mode="site-light"]) .rm-t-title { font-family: 'Playfair Display', Georgia, 'Times New Roman', serif; font-weight: 700; }

/*
 * Светлая витрина — единый стиль «Мост с Ромой» (Марина 12.10, холст
 * «R&M единый стиль», ряд Б): <body data-mode="site-light">. Песочный фон,
 * белые шапка и карточки, бордовый #6E1A26 — кнопки, выделенное слово
 * заголовка, eyebrow и плашки; золото #A8834F — только декор (линии, ✦),
 * не для текста. Заголовки — антиква (--rm-font-disp), текст — Manrope.
 * Ручные КП /kp-*.html остаются в режиме site. Логотип, подвал и блок
 * заявки (footer, #zayavka, #lead) — бордовые, как на прежней витрине.
 *   rm-btn--main   = бордовая заливка, белый текст
 *   rm-btn--second = бордовая обводка 1.5px
 *   rm-btn--quiet  = тоже бордовая обводка (вторая кнопка макета)
 */
[data-mode="site-light"] {
  --rm-ink: #FFFFFF;           /* выделенные секции — белые на песке */
  --rm-glow: #F4EFE7;          /* свечения сверху нет */
  --rm-ink-2: #FFFFFF;
  --rm-bg: #F4EFE7;            /* основной фон — песок */
  --rm-bg-2: #FFFFFF;          /* карточки, поля */
  --rm-card: #FFFFFF;
  --rm-line: #E8E1D6;
  --rm-line-dash: #D9CFC0;
  --rm-text: #24211E;
  --rm-text-2: #4A443D;
  --rm-gold: #6E1A26;          /* акцент — бордовый */
  --rm-gold-text: #561420;
  --rm-deco: #A8834F;          /* золото — только линии и ✦ */
  --rm-on-ink: #24211E;
  --rm-gold-on-ink: #561420;
  --rm-error: #B4483A;
  --rm-error-bg: rgba(180, 72, 58, .08);
  --rm-error-line: #E3B4AA;
  --rm-ok: #4F7A3E;
  --rm-ok-bg: rgba(79, 122, 62, .08);
  --rm-ok-line: #B9CFAE;
  --rm-off-bg: #EDE6DA;
  --rm-off-text: #6F675C;
  --rm-cue: #2F7FA6;
  --rm-cue-text: #2F7FA6;

  --rm-btn-main-bg: #6E1A26;
  --rm-btn-main-fg: #FFFFFF;
  --rm-btn-second-line: #6E1A26;
  --rm-btn-second-fg: #6E1A26;
  --rm-btn-second-width: 1.5px;
  --rm-btn-quiet-line: #6E1A26;     /* вторая кнопка — бордовая обводка 1.5px */
  --rm-btn-quiet-fg: #6E1A26;
  --rm-switch-bg: #FFFFFF;
  --rm-switch-on-bg: #6E1A26;
  --rm-switch-on-fg: #FFFFFF;

  --rm-font: 'Manrope', -apple-system, 'Segoe UI', Roboto, sans-serif;
  /* Шрифт заголовков витрины — одна правка здесь; сам шрифт подключают страницы. */
  --rm-font-disp: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --rm-photo-shadow: 0 10px 30px rgba(36, 33, 30, .14);
  --rm-r-btn: 6px;
  --rm-r-card: 0;
  --rm-r-sheet: 0;
}
[data-mode="site-light"] .rm-btn { border-radius: 6px; min-height: 56px; }
[data-mode="site-light"] .rm-btn--small { min-height: 36px; }
[data-mode="site-light"] .rm-btn--quiet { border-width: 1.5px; }
[data-mode="site-light"] .rm-btn--quiet:hover { background: rgba(110, 26, 38, .06); }
[data-mode="site-light"] .rm-btn--main:hover,
[data-mode="site-light"] .rm-btn--accent:hover { background: #561420; }
[data-mode="site-light"] .rm-btn--second:hover { background: rgba(110, 26, 38, .06); color: var(--rm-text); }
[data-mode="site-light"] .rm-t-screen,
[data-mode="site-light"] .rm-t-title { font-family: var(--rm-font-disp); font-weight: 700; }
/* В бордовых зонах кнопки — как на бордовой витрине. */
[data-mode="site-light"] :is(footer, #zayavka, #lead) .rm-btn--main:hover,
[data-mode="site-light"] :is(footer, #zayavka, #lead) .rm-btn--accent:hover { background: #ECC29D; }
[data-mode="site-light"] :is(footer, #zayavka, #lead) .rm-btn--second:hover { background: rgba(207, 156, 118, .14); color: var(--rm-text); }

/* ---------- Основа страницы и текст ---------- */

/* Страница на системе: <body class="rm-page"> (и data-mode="evening" на вечере). */
.rm-page {
  margin: 0;
  font-family: var(--rm-font);
  font-size: var(--rm-fs-body);
  background: var(--rm-bg);
  color: var(--rm-text);
  -webkit-font-smoothing: antialiased;
}

.rm-t-screen  { font: 800 var(--rm-fs-screen)/1.15 var(--rm-font); }
.rm-t-title   { font: 800 var(--rm-fs-title)/1.2 var(--rm-font); }
.rm-t-section { font: 800 var(--rm-fs-section)/1.25 var(--rm-font); }
.rm-t-body    { font: 700 var(--rm-fs-body)/1.35 var(--rm-font); }
.rm-t-caption { font: 500 var(--rm-fs-caption)/1.4 var(--rm-font); color: var(--rm-text-2); }
.rm-t-label   { font: 800 var(--rm-fs-label)/1.3 var(--rm-font); text-transform: uppercase; letter-spacing: .08em; }
/* Деньги и счёт — цифры одной ширины, столбцы не прыгают. */
.rm-money     { font-variant-numeric: tabular-nums; white-space: nowrap; }
.rm-money--due { color: var(--rm-error); }

/* Стопка блоков с системным отступом (14 / 20). */
.rm-stack { display: flex; flex-direction: column; gap: var(--rm-gap); }

/* Карточка-блок. */
.rm-card {
  background: var(--rm-card);
  border: 1px solid var(--rm-line);
  border-radius: var(--rm-r-card);
  padding: var(--rm-gap);
}

/* ---------- 1 / 7 · Кнопки ---------- */

.rm-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: var(--rm-tap);
  padding: 0 18px;
  border-radius: var(--rm-r-btn);
  border: 1px solid transparent;
  background: transparent;
  color: var(--rm-text);
  font: 800 14px/1.2 var(--rm-font);
  text-decoration: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: filter .12s, transform .06s;
}
.rm-btn:active { transform: scale(.98); }
.rm-btn:focus-visible { outline: 2px solid var(--rm-gold); outline-offset: 2px; }
[data-mode="evening"] .rm-btn { padding: 0 20px; border-radius: 12px; font-size: var(--rm-fs-body); }
.rm-btn--lg { min-height: var(--rm-tap-lg); }
.rm-btn--wide { width: 100%; }

.rm-btn--main   { background: var(--rm-btn-main-bg); color: var(--rm-btn-main-fg); }
.rm-btn--accent { background: var(--rm-gold); color: var(--rm-ink); }
.rm-btn--second { border: var(--rm-btn-second-width) solid var(--rm-btn-second-line); color: var(--rm-btn-second-fg); }
.rm-btn--quiet  { border-color: var(--rm-btn-quiet-line); color: var(--rm-btn-quiet-fg); font-weight: 700; }
.rm-btn--main:hover, .rm-btn--accent:hover { filter: brightness(1.06); }
.rm-btn:disabled, .rm-btn--off {
  background: var(--rm-off-bg); color: var(--rm-off-text); border-color: transparent;
  cursor: not-allowed; transform: none; filter: none;
}
/* Маленькая кнопка внутри строки (деталь 3) — нажимаемая зона всё равно 44. */
.rm-btn--small { min-height: 36px; padding: 0 10px; border-radius: 9px; font-size: var(--rm-fs-label); position: relative; }
.rm-btn--small::after { content: ''; position: absolute; inset: -4px; }

/* ---------- 2 · Этап / статус ---------- */

.rm-stage {
  display: inline-flex; align-items: center;
  height: 24px; padding: 0 9px; border-radius: 6px;
  font: 800 var(--rm-fs-label)/1 var(--rm-font);
  white-space: nowrap;
  background: #EFEDE8; color: #6f6855;           /* закрыт — по умолчанию */
}
.rm-stage--lead   { background: #F4EEDD; color: #8A6D1F; }   /* заявка */
.rm-stage--ahead  { background: #EEF1EA; color: #2F5D3F; }   /* впереди */
.rm-stage--today  { background: #1A1A1C; color: #E6C877; }   /* сегодня */
.rm-stage--due    { background: #FBE9E7; color: #B42318; }   /* рассчитаться */
.rm-stage--closed { background: #EFEDE8; color: #6f6855; }   /* закрыт */

/* ---------- 3 · Строка списка с действием ---------- */

.rm-list {
  background: var(--rm-card);
  border: 1px solid var(--rm-line);
  border-radius: var(--rm-r-card);
  padding: 0 14px;
}
.rm-row {
  display: flex; align-items: center; gap: 10px;
  min-height: var(--rm-tap);
  padding: 12px 0;
}
.rm-row + .rm-row { border-top: 1px solid var(--rm-line); }
.rm-row__main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.rm-row__title { font: 700 14px/1.3 var(--rm-font); overflow: hidden; text-overflow: ellipsis; }
.rm-row__sub { font: 500 var(--rm-fs-label)/1.35 var(--rm-font); color: var(--rm-text-2); }
.rm-row__sum { font: 800 14px/1.2 var(--rm-font); font-variant-numeric: tabular-nums; white-space: nowrap; }
.rm-row__sum--due { color: var(--rm-error); }

/* ---------- 4 · Переключатель ---------- */

.rm-switch {
  display: grid; grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column;
  gap: 3px; padding: 3px;
  border-radius: 12px;
  background: var(--rm-switch-bg);
  border: 1px solid var(--rm-line);
}
[data-mode="evening"] .rm-switch { border-color: transparent; }
.rm-switch > * {
  min-height: 36px; padding: 0 10px;
  border: 0; border-radius: 9px; background: transparent; color: var(--rm-text);
  font: 700 var(--rm-fs-caption)/1.2 var(--rm-font);
  display: grid; place-items: center; cursor: pointer;
}
.rm-switch > .is-on, .rm-switch > [aria-pressed="true"], .rm-switch > [aria-selected="true"] {
  background: var(--rm-switch-on-bg); color: var(--rm-switch-on-fg); font-weight: 800;
}

/* ---------- 5 · Плашка «не сохранилось» (вместо alert) ---------- */

.rm-toast {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; border-radius: 12px;
  background: var(--rm-ink); color: var(--rm-on-ink);
  font: 500 14px/1.35 var(--rm-font);
  max-width: 420px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .22);
}
.rm-toast__text { flex: 1; }
.rm-toast__action {
  border: 0; background: none; padding: 0 2px; min-height: var(--rm-tap);
  color: var(--rm-gold-on-ink); font: 800 14px var(--rm-font); cursor: pointer;
}
/* Плашки, которые показывает rmToast(): внизу по центру, над нижней панелью. */
.rm-toasts {
  position: fixed; left: 0; right: 0; bottom: calc(16px + env(safe-area-inset-bottom));
  z-index: 10000; display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 0 16px; pointer-events: none;
}
.rm-toasts > .rm-toast { pointer-events: auto; width: 100%; animation: rm-rise .18s ease-out; }
body:has(.rm-tabbar) .rm-toasts { bottom: calc(72px + env(safe-area-inset-bottom)); }

/* ---------- 6 · Пусто ---------- */

.rm-empty {
  padding: 20px; border-radius: var(--rm-r-card);
  border: 1.5px dashed var(--rm-line-dash);
  display: flex; flex-direction: column; gap: 6px; align-items: flex-start;
}
.rm-empty__title { font: 800 var(--rm-fs-body)/1.3 var(--rm-font); }
.rm-empty__text { font: 500 var(--rm-fs-caption)/1.4 var(--rm-font); color: var(--rm-text-2); }

/* ---------- 8 · Шапка вечера + переключатель «Вечер · Кабинет» ---------- */

.rm-evhead {
  display: flex; align-items: center; gap: 10px;
  padding: 12px; border-radius: 12px;
  background: var(--rm-bg-2); border: 1px solid var(--rm-line);
}
.rm-evhead__logo {
  width: 36px; height: 36px; flex: none; border-radius: 9px;
  background: var(--rm-gold); color: var(--rm-ink);
  display: grid; place-items: center; font: 800 12px var(--rm-font);
}
.rm-evhead__main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.rm-evhead__title { font: 800 14px/1.3 var(--rm-font); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rm-evhead__sub { font: 500 var(--rm-fs-label)/1.3 var(--rm-font); color: var(--rm-text-2); }
.rm-evhead .rm-switch { padding: 2px; gap: 2px; border-radius: 9px; }
.rm-evhead .rm-switch > * { min-height: 32px; padding: 0 9px; border-radius: 7px; font-size: var(--rm-fs-label); }

/* ---------- 9 · Нет сети (одна полоска везде) ---------- */

.rm-net {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-radius: 12px;
  font: 500 var(--rm-fs-caption)/1.35 var(--rm-font);
}
.rm-net__dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: currentColor; }
.rm-net__title { font: 800 14px var(--rm-font); }
.rm-net__text { flex: 1; color: var(--rm-text-2); }
.rm-net--off { color: var(--rm-error); background: var(--rm-error-bg); border: 1px solid var(--rm-error-line); }
.rm-net--on  { color: var(--rm-ok); background: var(--rm-ok-bg); border: 1px solid var(--rm-ok-line); }

/* ---------- 10 · Карточка-запрос (ответить) ---------- */

.rm-ask {
  display: flex; flex-direction: column; gap: 10px;
  padding: 14px; border-radius: var(--rm-r-card);
  background: var(--rm-card); border: 1.5px solid var(--rm-gold);
}
.rm-ask__title { font: 800 var(--rm-fs-body)/1.35 var(--rm-font); }
.rm-ask__text { font: 500 var(--rm-fs-caption)/1.4 var(--rm-font); color: var(--rm-text-2); }
.rm-ask__actions { display: flex; gap: 8px; }
.rm-ask__actions > .rm-btn { flex: 1; }

/* ---------- 11 · Шторка снизу (вместо confirm) ---------- */

.rm-sheet-backdrop {
  position: fixed; inset: 0; z-index: 9990;
  background: rgba(17, 17, 19, .45);
  display: flex; align-items: flex-end; justify-content: center;
  animation: rm-fade .15s ease-out;
}
.rm-sheet {
  width: 100%; max-width: 560px; max-height: 88vh; overflow: auto;
  background: var(--rm-bg-2); color: var(--rm-text);
  border-radius: var(--rm-r-sheet) var(--rm-r-sheet) 0 0;
  border: 1px solid var(--rm-line); border-bottom: 0;
  padding: 10px 16px calc(16px + env(safe-area-inset-bottom));
  display: flex; flex-direction: column; gap: 8px;
  animation: rm-rise .2s ease-out;
}
.rm-sheet__handle { align-self: center; width: 40px; height: 4px; border-radius: 2px; background: var(--rm-line-dash); margin-bottom: 4px; }
.rm-sheet__title { font: 800 var(--rm-fs-body)/1.3 var(--rm-font); }
.rm-sheet__text { font: 500 var(--rm-fs-caption)/1.45 var(--rm-font); color: var(--rm-text-2); white-space: pre-line; }
.rm-sheet__actions { display: flex; gap: 8px; margin-top: 8px; }
.rm-sheet__actions > .rm-btn { flex: 1; }
@media (min-width: 1024px) {
  .rm-sheet-backdrop { align-items: center; }
  .rm-sheet { border-radius: var(--rm-r-sheet); border-bottom: 1px solid var(--rm-line); }
}

/* Поле ввода (шторка «назовите…», формы) — та же высота, что у кнопок. */
.rm-input {
  width: 100%; box-sizing: border-box;
  min-height: var(--rm-tap); padding: 0 12px;
  border-radius: var(--rm-r-btn); border: 1px solid var(--rm-line);
  background: var(--rm-card); color: var(--rm-text);
  font: 500 16px/1.3 var(--rm-font);   /* 16 — иначе iOS увеличивает страницу */
}
.rm-input:focus { outline: 2px solid var(--rm-gold); outline-offset: 0; border-color: transparent; }

/* ---------- 12 · Нижняя панель ---------- */

.rm-tabbar {
  position: sticky; bottom: 0; z-index: 50;
  display: grid; grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column;
  min-height: 56px; padding-bottom: env(safe-area-inset-bottom);
  background: var(--rm-bg-2); border-top: 1px solid var(--rm-line);
}
.rm-tabbar > * {
  min-height: 56px; border: 0; background: none;
  display: grid; place-items: center; align-content: center; gap: 2px;
  font: 500 var(--rm-fs-label)/1.2 var(--rm-font); color: var(--rm-text-2);
  text-decoration: none; cursor: pointer;
}
.rm-tabbar > .is-on, .rm-tabbar > [aria-current="page"], .rm-tabbar > [aria-selected="true"] {
  color: var(--rm-gold-text); font-weight: 800;
}

@keyframes rm-rise { from { transform: translateY(12px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes rm-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .rm-sheet, .rm-sheet-backdrop, .rm-toasts > .rm-toast { animation: none; }
}
