/* R55: stable settings, one integrated preview, and one readable text scale. */
.settings-search { min-width: 0; margin: 0 0 18px; }
.settings-search__label { display: grid; gap: 7px; font-size: 13px; font-weight: 600; color: var(--text-muted); }
.settings-search__input { box-sizing: border-box; width: 100%; min-width: 0; min-height: 46px; padding: 11px 15px; border: 1px solid var(--border); border-radius: 18px; background: var(--surface); color: var(--text); font: inherit; font-size: 16px; }
.settings-search__input::placeholder { color: var(--text-muted); opacity: 1; }
.settings-search__input:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.settings-search__status { margin: 8px 4px 0; min-height: 18px; color: var(--text-muted); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.settings-search__results { list-style: none; margin: 8px 0 0; padding: 5px; border: 1px solid var(--border); border-radius: 18px; background: var(--surface); }
.settings-search__results[hidden] { display: none; }
.settings-search__result { box-sizing: border-box; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 14px; width: 100%; min-height: 46px; padding: 10px 12px; border: 0; border-radius: 13px; background: transparent; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.settings-search__result:hover, .settings-search__result:focus-visible { background: var(--accent-soft); }
.settings-search__result-label { font-size: 14px; line-height: 1.4; overflow-wrap: anywhere; }
.settings-search__result-category { font-size: 12px; color: var(--text-muted); line-height: 1.4; }
.settings-scroll [data-settings-search-target="true"] { outline: 3px solid var(--accent); outline-offset: 4px; scroll-margin-block: 24px; }
.settings-scroll input[data-settings-search-target="true"] + .settings-toggle__track { outline: 3px solid var(--accent); outline-offset: 4px; }
.settings-scroll .bg-tile { min-width: 0; }
.settings-scroll .bg-tile__name { overflow-wrap: anywhere; }
.settings-scroll .bg-tile__custom-icon[hidden] { display: none; }

/* M12 (messenger-max w5): карточка «Уведомления на устройстве» — местные
   классы вместо инлайнов из JS: тема/контраст и фокус держатся токенами,
   состояние разрешения читается тем же масштабом типографики, что и остальные
   подсказки настроек. Стили визуально эквивалентны прежним инлайнам. */
.settings-notify-permission { margin: 0 0 14px; line-height: 1.5; }
.settings-push-device {
  font: inherit;
  min-height: 44px;
  padding: 10px 16px;
  border: 0;
  border-radius: 14px;
  background: var(--accent, #1a56db);
  color: #fff;
  cursor: pointer;
}

.settings-text-sample.settings-chat-preview { box-sizing: border-box; display: flex; flex-direction: column; gap: 10px; position: relative; isolation: isolate; margin: 14px 0 12px; padding: 14px; min-width: 0; border: 1px solid var(--border); border-radius: 22px; background-color: var(--r11-canvas, var(--surface-2)); background-size: cover; background-position: center; overflow: hidden; font-size: var(--message-text-size, 15px); line-height: 1.45; }
.settings-chat-preview__label { align-self: center; position: relative; z-index: 1; padding: 3px 9px; border-radius: 12px; color: var(--text-muted); background: var(--surface); font-size: 11px; line-height: 1.5; }
.settings-chat-preview__message { box-sizing: border-box; display: grid; gap: 2px; position: relative; z-index: 1; max-width: 88%; min-width: 0; padding: 10px 14px 8px; border-radius: 18px 18px 18px 6px; background: var(--bubble-in, var(--surface)); color: var(--text); overflow-wrap: anywhere; font-size: inherit; }
.settings-chat-preview__message--out { align-self: flex-end; border-radius: 18px 18px 6px 18px; background: var(--r11-out, var(--bubble-out)); color: var(--r11-out-text, var(--text)); }
.settings-chat-preview__message time { justify-self: end; color: var(--r11-muted, var(--text-muted)); font-size: 11px; line-height: 1.4; font-variant-numeric: tabular-nums; }
.settings-chat-preview[data-compact="true"] { gap: 5px; }
.settings-chat-preview[data-compact="true"] .settings-chat-preview__message { padding: 6px 10px 4px; }
.settings-text-sample.settings-chat-preview[data-preview-bg="custom"] { background-image: var(--settings-preview-image); }
.settings-chat-preview[data-preview-bg="custom"]::before { content: ''; position: absolute; inset: 0; z-index: 0; background: rgba(248, 250, 252, .5); pointer-events: none; }
.settings-chat-preview[data-preview-bg="custom"][data-preview-theme="dark"]::before { background: rgba(15, 23, 42, .6); }
/* Preset selectors historically match the inactive theme too. A decoded custom
   layer belongs to the panel; keep the message scroller transparent above it. */
html #app #view-chats #messages.has-custom-bg { background-color: transparent !important; background-image: none !important; }

html #app #view-chats #composer-input,
html #app #view-chats #messages .bubble__reply,
html #app #view-chats #messages .bubble__reply .r55-quote__text,
html #app #view-chats .reply-bar__text,
html #app #view-chats #messages .voice-transcript__text { font-size: var(--message-text-size, 15px) !important; line-height: 1.5 !important; min-width: 0; overflow-wrap: anywhere; }
html #app #view-chats #messages .bubble__reply,
html #app #view-chats .reply-bar__text { white-space: normal; overflow-wrap: anywhere; }
html #app #view-chats #messages .bubble__reply .r55-quote__author { font-size: max(13px, calc(var(--message-text-size, 15px) - 1px)); }
/* Avoid iOS focus zoom for the small/normal composer while honoring large text. */
@media (pointer: coarse) {
  html #app #view-chats #composer-input { font-size: max(16px, var(--message-text-size, 15px)) !important; }
}
@media (max-width: 380px) {
  .settings-text-sample.settings-chat-preview { padding: 10px; border-radius: 18px; }
  .settings-chat-preview__message { max-width: 96%; padding-inline: 10px; }
  .settings-search__result { padding: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .settings-search *, .settings-chat-preview * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
html[data-vy-motion="off"] .settings-search *, html[data-vy-motion="off"] .settings-chat-preview * { animation: none !important; transition: none !important; }