/* ============================================================================
   BastionVPN — дополнительные страницы сайта в пиксельной системе лендинга р30 / оплаты р11 / входа Г5.
   Подключается ПОСЛЕ chrome_r30.css (шапка, подвал, плиты, кнопки, «Наверх», FAQ — правила лендинга один в один).
   Здесь: шрифты, замена Tiny5 на Press Start 2P, исправление «залипания» меню языка на таче, и макеты страниц:
     .s-short — короткие (возврат, отмена, 404): заголовок над плитой по центру, Горгулья целиком на стене (как вход Г5);
     .s-doc   — документ (политика, оферта, соглашение): шапка-небо, оглавление (липкое слева / сворачиваемое), лист;
     .s-help  — центр помощи: поиск, чипы, аккордеон на кладке (как FAQ лендинга), «Не нашли ответ?».
   Шрифты только Press Start 2P (патч «т», PressStart2P-bv.woff2) и Rubik. Пиксель-арт — целые масштабы, pixelated.
   ========================================================================== */

@font-face { font-family: "Press Start 2P"; src: url("../fonts/pixel/PressStart2P-bv.woff2") format("woff2"); font-display: swap; }
@font-face { font-family: "Rubik"; src: url("../fonts/pixel/Rubik.woff2") format("woff2"); font-weight: 300 900; font-display: swap; }

:root { --f-sign: var(--f-head); --kc: 4; --paper: #FFFFFF; }
@media (max-width: 700px) { :root { --kc: 3; } }
html { -webkit-text-size-adjust: 100%; }
.px { image-rendering: pixelated; }
.skip { position: absolute; left: 16px; top: -60px; z-index: 100; background: #fff; padding: 10px 14px; font-weight: 600; }
.skip:focus { top: 12px; }

/* ── таблички: Press Start 2P вместо Tiny5 (как табличка шага на входе Г5) ── */
.sign, .sign--sm { font: 400 16px/16px var(--f-head); word-spacing: var(--head-ws); padding: 8px 14px 8px 12px; text-shadow: 2px 2px 0 #fff; white-space: nowrap; }
.sign--sm { padding: 7px 11px 7px 11px; }
@media (max-width: 700px) {
  .sign, .sign--sm { font-size: 16px; line-height: 16px; padding: 6px 10px 6px 9px; }
  .sign i { width: 6px; height: 6px; }
}
/* код языка RU/EN в меню — те же пиксели лендинга картинкой 22×16 (как на входе Г5); текст остаётся для чтения с экрана */
.langdd__menu a b, .mlang__menu a b { flex: none; width: 22px; min-width: 22px; height: 16px; font-size: 0; line-height: 0; color: transparent; overflow: hidden;
  background: url("../img/pixel/lang_ru.png") 0 0 / 22px 16px no-repeat; image-rendering: pixelated; }
.langdd__menu a[lang="en"] b, .mlang__menu a[lang="en"] b { background-image: url("../img/pixel/lang_en.png"); }
/* на таче (планшет 701–980 видит десктопное меню языка) подсветка :hover не «залипает» жёлтым после тапа */
@media (hover: none) {
  .langdd__menu a:hover:not(:focus-visible) { background: transparent; box-shadow: none; }
  .langdd__menu a[aria-current="true"]:hover { background: var(--bv-light); }
}
/* текущая страница в подвале */
.tab a[aria-current="page"] { color: var(--bv-deep); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }

/* ── общее: небо, облака, далёкие башни, ссылки, крошки ── */
.s-sky { position: relative; overflow: hidden; background: linear-gradient(180deg, var(--sky-top) 0%, #E9F2FE 55%, var(--sky-bottom) 100%); }
.s-scene { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.s-cloud { position: absolute; left: var(--x); top: var(--y); width: calc(var(--w) * var(--kc)); height: auto; image-rendering: pixelated; }
.s-cloud.far { opacity: 0.75; }
.s-towers { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); display: flex; align-items: flex-end; gap: 90px; width: max-content; opacity: 0.38; }
.s-towers .ft { width: var(--w); height: var(--h); background: #8795B0; box-shadow: inset 0 9px 0 #B4C0D4;
  -webkit-mask: linear-gradient(#000, #000) 0 12px / 100% 100% no-repeat, repeating-linear-gradient(90deg, #000 0 12px, transparent 12px 21px) 0 0 / 100% 12px no-repeat;
          mask: linear-gradient(#000, #000) 0 12px / 100% 100% no-repeat, repeating-linear-gradient(90deg, #000 0 12px, transparent 12px 21px) 0 0 / 100% 12px no-repeat; }
.s-far { display: none; position: absolute; bottom: 0; width: var(--w); height: var(--h); background: #D3DDEB; box-shadow: inset 0 12px 0 #DFE7F2;
  -webkit-mask: linear-gradient(#000, #000) 0 15px / 100% 100% no-repeat, repeating-linear-gradient(90deg, #000 0 15px, transparent 15px 27px) 0 0 / 100% 15px no-repeat;
          mask: linear-gradient(#000, #000) 0 15px / 100% 100% no-repeat, repeating-linear-gradient(90deg, #000 0 15px, transparent 15px 27px) 0 0 / 100% 15px no-repeat; }
.s-far--l1 { --w: 96px; --h: 330px; left: 7%; } .s-far--l2 { --w: 69px; --h: 230px; left: calc(7% + 120px); }
.s-far--r1 { --w: 96px; --h: 300px; right: 9%; } .s-far--r2 { --w: 69px; --h: 210px; right: calc(9% + 126px); }
@media (min-width: 1280px) { .s-far { display: block; } }
@media (max-width: 700px) { .s-towers { gap: 48px; } }

.s-link { color: var(--bv-deep); font-weight: 500; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.s-link:hover { color: var(--bv-navy); text-decoration-thickness: 3px; }
.s-crumbs { margin: 0 0 14px; display: flex; flex-wrap: wrap; gap: 0 8px; justify-content: center; font: 500 15px/22px var(--f-text); color: var(--text-meta); }
.s-crumbs a { color: var(--bv-deep); text-decoration: none; }
.s-crumbs a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.s-crumbs [aria-current] { color: var(--text-body); }

/* заголовок над плитой, как «Вход в кабинет» Г5 и «VPN без тормозов»: первая строка тёмная, остальное синее с пиксельной тенью */
.s-hero { margin: 0 auto 20px; max-width: 11em; font: 400 56px/64px var(--f-head); word-spacing: var(--head-ws); text-align: center; text-wrap: balance;
  color: var(--bv-deep); text-shadow: 4px 4px 0 var(--bv-blue-5); -webkit-font-smoothing: none; }
.s-hero::first-line { color: var(--text-ink); text-shadow: none; }
@media (max-width: 1100px) { .s-hero { font-size: 40px; line-height: 48px; } }
@media (max-width: 700px) { .s-hero { font-size: 32px; line-height: 40px; margin-bottom: 16px; text-shadow: 3px 3px 0 var(--bv-blue-5); } }
@media (max-width: 359px) { .s-hero { font-size: 24px; line-height: 32px; } }

/* ════ КОРОТКИЕ СТРАНИЦЫ (возврат, отмена, 404) — композиция входа Г5 ════ */
:root { --sp-w: 600px; --gk: 4; --g-res: 0px; }
.s-short { position: relative; display: flex; flex-direction: column; min-height: clamp(560px, calc(100svh - var(--toph) - 96px), 720px); }
.s-short .s-scene { bottom: 0; }
.s-stage { position: relative; z-index: 3; flex: 1 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 36px var(--gut) max(40px, var(--g-res)); }
.s-stage .sign { margin-bottom: 18px; }
.s-panel { width: 100%; max-width: var(--sp-w); padding: 32px 40px 36px; box-shadow: 0 6px 0 0 var(--wall-1); }
.s-panel p { margin: 0; font: 400 19px/30px var(--f-text); color: var(--text-body); text-wrap: pretty; }
.s-panel p + p { margin-top: 14px; }
.s-panel .cta { margin-top: 24px; }
.s-code { font-size: 24px !important; line-height: 24px !important; padding: 10px 16px 10px 14px !important; }

/* Горгулья целиком, вне потока: десктоп — стоит на стене слева от плиты (как Г5), узкие — сидит на стене под плитой по центру */
.s-garg { position: absolute; z-index: 4; pointer-events: none; }
.s-garg img { display: block; width: 100%; height: 100%; image-rendering: pixelated; }
.s-garg--d { width: calc(86px * var(--gk)); height: calc(79px * var(--gk)); right: calc(50% + var(--sp-w) / 2 + 24px); bottom: calc(-5px * var(--gk) + 3px); }
.s-garg--m { display: none; width: calc(70px * 2); height: calc(94px * 2); left: 50%; margin-left: -70px; bottom: calc(-38px); }
@media (max-height: 860px), (max-width: 1339px) { :root { --gk: 3; } }
@media (max-width: 1180px) { :root { --gk: 2; } }
@media (max-width: 1060px) {
  :root { --g-res: 150px; }
  .s-garg--d { display: none; }
  .s-garg--m { display: block; }
}
@media (max-width: 700px) {
  .s-short { min-height: clamp(480px, calc(100svh - var(--toph) - 200px), 600px); }
  .s-stage { padding-top: 24px; }
  .s-panel { padding: 20px 18px 22px; box-shadow: 0 4px 0 0 var(--wall-1); }
  .s-panel p { font-size: 17px; line-height: 27px; }
  .s-panel .cta { margin-top: 20px; width: 100%; }
  .s-code { font-size: 16px !important; line-height: 16px !important; }
}

/* ════ ДОКУМЕНТЫ (политика, оферта, соглашение) ════
   Разметка содержимого — та же, что в Django-инклюдах политики (.legal__toc, .legal__section, h2 > .num), поэтому
   прежний EN-инклюд privacy_policy_en.html ложится в этот же макет без правок. */
.s-dochead { padding: 48px 0 0; }
.s-dochead__in { position: relative; z-index: 2; display: grid; justify-items: center; text-align: center; padding-bottom: 40px; }
.s-doctitle { margin: 0; max-width: 24em; font: 400 32px/48px var(--f-head); word-spacing: var(--head-ws); color: var(--text-ink); text-wrap: balance; -webkit-font-smoothing: none; }
.s-docmeta { margin: 22px 0 0; display: inline-block; padding: 7px 12px; background: var(--plate-hi); color: var(--plate-cut); font: 600 13px/18px var(--f-text); letter-spacing: 0.02em;
  box-shadow: 0 -3px 0 0 var(--wall-0), 0 3px 0 0 var(--wall-0), -3px 0 0 0 var(--wall-0), 3px 0 0 0 var(--wall-0), inset 0 -3px 0 0 var(--wall-3); margin-left: 3px; margin-right: 3px; }
.s-dochead .wall { margin-top: 0; }
.s-dochead .s-garg--doc { right: max(var(--gut), calc(50% - 600px)); bottom: calc(12px * var(--k) - 3px); width: calc(70px * 3); height: calc(64px * 3); }
.s-dochead .s-garg--doc img { width: 100%; height: 100%; }
@media (max-width: 1240px) { .s-dochead .s-garg--doc { display: none; } }

.s-docbody { position: relative; background: var(--sky-bottom); padding: 40px 0 88px; }
.legal { --toc-w: 300px; --doc-w: 800px; --pad: 56px; position: relative; width: 100%; max-width: calc(var(--toc-w) + 40px + var(--doc-w) + 2 * var(--gut)); margin: 0 auto; padding: 0 var(--gut);
  display: grid; grid-template-columns: var(--toc-w) minmax(0, var(--doc-w)); column-gap: 40px; row-gap: 0; align-items: start; }
/* лист бумаги: разделы стоят встык и вместе образуют одну плиту (рамка 3 px, тень 6 px — как поле ввода и плиты лендинга) */
.legal > .legal__toc { grid-column: 1; grid-row: 1 / span 60; }
.legal > .legal__section { grid-column: 2; position: relative; z-index: 1; padding: 0 var(--pad); margin: 0 3px; background: var(--paper);
  box-shadow: -3px 0 0 0 var(--wall-0), 3px 0 0 0 var(--wall-0); }
.legal > .legal__section:first-of-type { padding-top: 52px; margin-top: 3px; box-shadow: -3px 0 0 0 var(--wall-0), 3px 0 0 0 var(--wall-0), 0 -3px 0 0 var(--wall-0), -3px -3px 0 0 var(--wall-0), 3px -3px 0 0 var(--wall-0); }
.legal > .legal__section:last-of-type { padding-bottom: 56px; margin-bottom: 9px; box-shadow: -3px 0 0 0 var(--wall-0), 3px 0 0 0 var(--wall-0), 0 3px 0 0 var(--wall-0), -3px 3px 0 0 var(--wall-0), 3px 3px 0 0 var(--wall-0), 0 9px 0 0 var(--wall-1), -3px 9px 0 0 var(--wall-1), 3px 9px 0 0 var(--wall-1); }
.legal > .legal__section:first-of-type:last-of-type { box-shadow: 0 0 0 3px var(--wall-0), 0 9px 0 3px var(--wall-1); }
.legal__section + .legal__section { margin-top: 0; }
.legal__section + .legal__section::before { content: ""; display: block; height: 3px; margin: 40px 0 40px; background: repeating-linear-gradient(90deg, var(--wall-4) 0 12px, transparent 12px 18px); }
.legal__section { scroll-margin-top: calc(var(--toph) + 24px); }
.legal__section h2 { margin: 0 0 22px; display: flex; align-items: flex-start; gap: 18px; font: 400 16px/28px var(--f-head); word-spacing: var(--head-ws); color: var(--text-ink); -webkit-font-smoothing: none; }
.legal__section h2 .num { flex: none; min-width: 52px; height: 40px; margin: 3px; padding: 0 8px; display: grid; place-items: center; background: var(--bv-deep); color: #fff;
  font: 400 16px/16px var(--f-head); text-shadow: 2px 2px 0 var(--bv-navy); box-shadow: 0 0 0 3px var(--bv-navy), inset 0 -3px 0 0 #0F4FB0; }
.legal__section h2 .num + span { padding-top: 9px; text-wrap: balance; }
.legal__section p, .legal__section li { font: 400 18px/30px var(--f-text); color: var(--text-body); max-width: 68ch; text-wrap: pretty; overflow-wrap: anywhere; }
.legal__section p { margin: 0 0 16px; }
.legal__section p:last-child { margin-bottom: 0; }
.legal__section ul, .legal__section ol { margin: 0 0 18px; padding: 0; list-style: none; display: grid; gap: 8px; max-width: 68ch; }
.legal__section ul:last-child { margin-bottom: 0; }
.legal__section ul > li { position: relative; padding-left: 26px; }
.legal__section ul > li::before { content: ""; position: absolute; left: 3px; top: 12px; width: 6px; height: 6px; background: var(--bv-blue); box-shadow: 3px 3px 0 var(--bv-navy); }
.legal__section a { color: var(--bv-deep); font-weight: 500; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.legal__section a:hover { color: var(--bv-navy); }

/* оглавление: каменная плита, на десктопе липкая слева; на узких — над листом, сворачивается (JS) */
.legal__toc { position: sticky; top: calc(var(--toph) + 24px); z-index: 2; margin: 3px; padding: 22px 22px 24px; max-height: calc(100vh - var(--toph) - 48px); overflow: auto;
  border-style: solid; border-width: 0; border-image: url("../img/pixel/plate_stone_9slice.png") 3 fill / calc(3px * var(--kp)) / 0 round; image-rendering: pixelated; box-shadow: 0 6px 0 0 var(--wall-1); }
.legal__toc > * { image-rendering: auto; }
.legal__toc-title { margin: 0 0 14px; display: flex; align-items: center; gap: 10px; font: 400 16px/16px var(--f-head); color: var(--plate-cut); text-shadow: 2px 2px 0 #fff; -webkit-font-smoothing: none; }
.legal__toc-title::before { content: ""; width: 9px; height: 9px; flex: none; background: var(--bv-blue); box-shadow: 3px 3px 0 var(--bv-navy); }
.legal__toc-title .chev { display: none; }
.legal__toc-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 2px; }
.legal__toc-list a { display: flex; gap: 10px; align-items: baseline; padding: 7px 8px 7px 6px; font: 500 15px/21px var(--f-text); color: var(--text-ink); text-decoration: none; }
.legal__toc-list .n { flex: none; min-width: 16px; font: 700 14px/21px var(--f-text); color: var(--bv-deep); }
.legal__toc-list a:hover { color: var(--bv-blue-dark); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.legal__toc-list a.is-cur { background: var(--plate-hi); color: var(--text-ink); box-shadow: inset 3px 0 0 var(--bv-blue), inset 0 -3px 0 0 var(--wall-3); }
@media (hover: none) { .legal__toc-list a:hover { text-decoration: none; } }

/* прогресс чтения — тонкая синяя полоса по нижнему краю шапки */
.s-progress { position: fixed; left: 0; right: 0; top: var(--toph); height: 3px; z-index: 51; transform-origin: 0 50%; transform: scaleX(0); background: var(--bv-blue); pointer-events: none; }

@media (max-width: 1180px) { .legal { --toc-w: 260px; --pad: 44px; column-gap: 28px; } }
@media (max-width: 1099px) {
  .legal { grid-template-columns: minmax(0, 1fr); max-width: calc(var(--doc-w) + 2 * var(--gut)); }
  .legal > .legal__toc { grid-column: 1; grid-row: 1; position: relative; top: 0; max-height: none; margin-bottom: 28px; }
  .legal > .legal__section { grid-column: 1; }
  .legal__toc.is-collapsible .legal__toc-title { cursor: pointer; margin: 0; justify-content: flex-start; }
  .legal__toc.is-collapsible .legal__toc-title .chev { display: grid; margin-left: auto; width: 30px; height: 30px; place-items: center; background: var(--bv-deep); box-shadow: 0 0 0 3px var(--bv-navy); }
  .legal__toc.is-collapsible .legal__toc-title .chev svg { width: 14px; height: 8px; }
  .legal__toc.is-collapsible.is-open .legal__toc-title .chev svg { transform: rotate(180deg); }
  .legal__toc.is-collapsible.is-open .legal__toc-title { margin-bottom: 14px; }
  .legal__toc.is-collapsible:not(.is-open) .legal__toc-list { display: none; }
  .legal__toc { padding: 14px 16px 14px 18px; }
}
@media (max-width: 700px) {
  .s-dochead { padding-top: 28px; }
  .s-dochead__in { padding-bottom: 28px; }
  .s-doctitle { font-size: 24px; line-height: 36px; }
  .s-docbody { padding: 24px 0 64px; }
  .legal { --pad: 18px; }
  .legal > .legal__section:first-of-type { padding-top: 26px; }
  .legal > .legal__section:last-of-type { padding-bottom: 30px; }
  .legal__section + .legal__section::before { margin: 28px 0; }
  .legal__section h2 { gap: 12px; margin-bottom: 16px; font-size: 16px; line-height: 26px; }
  .legal__section h2 .num { min-width: 44px; height: 34px; }
  .legal__section h2 .num + span { padding-top: 7px; }
  .legal__section p, .legal__section li { font-size: 16px; line-height: 26px; }
  .legal__section ul > li { padding-left: 22px; }
  .legal__section ul > li::before { top: 10px; }
  .legal__toc-list a { padding: 9px 6px; font-size: 16px; }
}
@media (max-width: 359px) { .s-doctitle { font-size: 16px; line-height: 28px; } .legal__section h2 { font-size: 16px; } }

/* ════ ЦЕНТР ПОМОЩИ ════ */
.s-helphead { padding: 56px 0 0; }
.s-helphead__in { position: relative; z-index: 2; display: grid; justify-items: center; text-align: center; max-width: 820px; margin: 0 auto; padding-bottom: 48px; }
.s-helphead__in .sign { margin-bottom: 20px; }
.s-h1 { margin: 0 0 18px; font: var(--h1); word-spacing: var(--head-ws); color: var(--text-ink); text-wrap: balance; -webkit-font-smoothing: none; }
.s-lead { margin: 0 0 28px; max-width: 640px; font: var(--t-lead); color: var(--text-body); text-wrap: pretty; }
.s-search { position: relative; display: block; width: 100%; max-width: 640px; margin: 0 3px; }
.s-search__ic { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; color: var(--wall-1); pointer-events: none; }
.s-search input { display: block; width: 100%; height: 60px; margin: 3px 0; padding: 0 60px 0 58px; border: 0; border-radius: 0; background: #fff; -webkit-appearance: none; appearance: none;
  font: 500 18px/1 var(--f-text); color: var(--text-ink); box-shadow: 0 0 0 3px var(--wall-0), inset 0 3px 0 0 #E3E9F2, 0 9px 0 0 var(--wall-1); }
.s-search input::placeholder { color: #6F7A8E; opacity: 1; }
.s-search input:focus { outline: none; box-shadow: 0 0 0 3px var(--bv-blue), 0 0 0 6px var(--bv-blue-5), 0 9px 0 0 var(--wall-1); }
.s-search input::-webkit-search-cancel-button { display: none; }
.s-search__x { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; padding: 0; border: 0; display: grid; place-items: center; cursor: pointer;
  background: var(--plate-hi); color: var(--wall-0); box-shadow: 0 0 0 3px var(--wall-0), inset 0 -3px 0 0 var(--wall-3); }
.s-search__x[hidden] { display: none; }
.s-search__x:hover { background: #fff; color: var(--bv-deep); }
.s-chips { margin: 30px 0 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 10px; }
.s-chips .chip { font-size: 15px; }
.s-chips .chip[aria-pressed="true"] { background: var(--bv-deep); color: #fff; --fc: var(--bv-navy); box-shadow: 0 -3px 0 0 var(--bv-navy), 0 3px 0 0 var(--bv-navy), -3px 0 0 0 var(--bv-navy), 3px 0 0 0 var(--bv-navy), inset 0 -3px 0 0 #0F4FB0; }
.s-chips .chip[aria-pressed="true"]:hover { background: #0F4FB0; }
@media (hover: none) { .s-chips .chip:hover:not([aria-pressed="true"]) { background: var(--plate-hi); } }
/* Горгулья целиком сидит на зубцах (нижний край неба = верх стены): ≥1241 — ×3 справа от поиска;
   уже — ×2 по центру под чипами, как на коротких страницах (под неё оставлено место) */
.s-helphead .s-garg--wave { right: max(var(--gut), calc(50% - 620px)); bottom: -6px; width: calc(66px * 3); height: calc(64px * 3); }
@media (max-width: 1240px) {
  .s-helphead__in { padding-bottom: 156px; }
  .s-helphead .s-garg--wave { right: auto; left: 50%; margin-left: -66px; width: calc(66px * 2); height: calc(64px * 2); bottom: -4px; }
}
@media (max-width: 700px) { .s-helphead__in { padding-bottom: 150px; } }

/* список вопросов строго по оси страницы (как заголовок и поиск), на кладке под зубцами — как FAQ лендинга */
.s-helpwall { padding: 0 0 72px; }
.s-helpwall > .wall { margin-bottom: 40px; }
.s-helpcol { width: 100%; max-width: 920px; margin: 0 auto; display: grid; gap: 16px; }
.s-helplist { display: grid; gap: 16px; }
.s-help .qa summary { font-weight: 500; }
.s-help .qa .ans p { text-wrap: pretty; }
.s-help .qa[hidden] { display: none; }
.s-empty { padding: 32px 32px 34px; display: grid; justify-items: center; gap: 10px; text-align: center; }
.s-empty[hidden] { display: none; }
.s-empty__t { font: 400 16px/24px var(--f-head); word-spacing: var(--head-ws); color: var(--text-ink); -webkit-font-smoothing: none; }
.s-empty__p { margin: 0; max-width: 560px; font: var(--t-body); color: var(--text-body); overflow-wrap: anywhere; }
.s-empty__ic { width: 48px; height: 48px; color: var(--wall-1); }

.s-support { padding: 64px 0 72px; }
.s-support__box { position: relative; z-index: 2; max-width: 900px; margin: 0 auto; padding: 30px 36px 34px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 24px; align-items: center;
  box-shadow: 0 6px 0 0 var(--wall-1); }
.s-support__ic { width: 72px; height: 72px; display: grid; place-items: center; background: var(--bv-deep); box-shadow: 0 0 0 3px var(--bv-navy), inset 0 -4px 0 0 #0F4FB0; margin: 3px; }
.s-support__ic img { width: 42px; height: 34px; }
.s-support h2 { margin: 0 0 8px; font: 400 24px/32px var(--f-head); word-spacing: var(--head-ws); color: var(--text-ink); -webkit-font-smoothing: none; }
.s-support p { margin: 0; font: var(--t-body); color: var(--text-body); }
.s-support .cta img { width: 21px; height: 17px; }
@media (max-width: 900px) {
  .s-support__box { grid-template-columns: auto minmax(0, 1fr); }
  .s-support .cta { grid-column: 1 / -1; width: 100%; }
}
@media (max-width: 700px) {
  .s-helphead { padding-top: 32px; }
  .s-helphead__in { padding-bottom: 150px; }
  .s-lead { margin-bottom: 22px; }
  .s-search input { height: 56px; font-size: 17px; padding-left: 50px; }
  .s-search__ic { left: 16px; }
  .s-chips { margin-top: 26px; gap: 6px 6px; }
  .s-chips .chip { padding: 0 11px; font-size: 14px; }
  .s-support { padding: 44px 0 52px; }
  .s-support__box { padding: 22px 18px 24px; gap: 16px 14px; box-shadow: 0 4px 0 0 var(--wall-1); }
  .s-support__ic { width: 56px; height: 56px; }
  .s-support__ic img { width: 21px; height: 17px; }
  .s-support h2 { font-size: 16px; line-height: 24px; margin-bottom: 6px; }
  .s-empty { padding: 24px 18px; }
}
@media (max-width: 380px) { .s-chips .chip { padding: 0 9px; } }

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* CTA «Написать в поддержку» на узких: как .cta--s лендинга — 16 → 12 px, в одну строку */
@media (max-width: 700px) { .s-support .cta { font-size: 12px; line-height: 12px; white-space: nowrap; padding: 0 12px; } }
/* узкие телефоны: номер раздела над заголовком — длинные слова в Press Start 2P 16 («вознаграждение») иначе не влезают */
@media (max-width: 400px) {
  .legal__section h2 { flex-direction: column; gap: 10px; }
  .legal__section h2 .num + span { padding-top: 0; }
}
/* Горгулья в шапке документа (≥1241) стоит справа на стене — заголовок не заходит под неё: поля с обеих сторон, ось по центру */
@media (min-width: 1241px) { .s-dochead__in { padding-left: 264px; padding-right: 264px; } }
.s-helphead { overflow: visible; }   /* ноги Горгульи заходят на зубцы — не обрезать */
.s-helphead .s-scene { overflow: hidden; }
/* короткие страницы: ноги Горгульи стоят на зубцах подвала — блок не обрезает её снизу (облака режет сама .s-scene) */
.s-short { overflow: visible; }

/* 404 на телефоне: кнопка на всю ширину плиты с равными полями, текст в одну строку по центру (как CTA мобильного лендинга: 16 → 12 px, если не влезает) */
.s-panel .cta { display: flex; width: 100%; justify-content: center; text-align: center; white-space: nowrap; }
@media (max-width: 440px) { .s-panel .cta { padding: 0 8px; } }
@media (max-width: 374px) { .s-panel .cta { font-size: 12px; line-height: 12px; } }

/* ════ С8 · ВОЗВРАТ СРЕДСТВ (форма) — система входа Г5 / С2: заголовок над плитой, Горгулья целиком, эмоция = #rfRoot[data-state] ════ */
.s-refund .s-hero { max-width: 12em; }
.rf-form { margin: 0; }
.rf-label { display: block; margin: 0 0 10px; font: 600 16px/24px var(--f-text); color: var(--text-ink); }
.rf-label b { font-weight: 600; }
.rf-row { display: grid; gap: 14px; }
.rf-input { display: block; width: 100%; height: 60px; margin: 3px 0; padding: 0 18px; border: 0; border-radius: 0; background: #fff; -webkit-appearance: none; appearance: none;
  font: 500 18px/1 var(--f-text); color: var(--text-ink); box-shadow: 0 0 0 3px var(--wall-0), inset 0 3px 0 0 #E3E9F2; }
.rf-input::placeholder { color: #6F7A8E; opacity: 1; }
.rf-input:focus { outline: none; box-shadow: 0 0 0 3px var(--bv-blue), 0 0 0 6px var(--bv-blue-5); }
.s-panel .rf-find { margin-top: 6px; min-height: 60px; }
.rf-find:disabled { cursor: progress; filter: saturate(0.7); }
.rf-help { margin: 12px 0 0 !important; font: 400 15px/22px var(--f-text) !important; color: var(--text-meta) !important; text-align: center; }
.rf-msg { margin-top: 20px; padding: 16px 18px 18px 22px; background: #fff; box-shadow: 0 0 0 3px var(--wall-0), inset 6px 0 0 0 var(--bv-blue); margin-left: 3px; margin-right: 3px;
  font: 400 16px/24px var(--f-text); color: var(--text-body); overflow-wrap: anywhere; }
.rf-msg b { font-weight: 600; color: var(--text-ink); }
.rf-msg .field + .field, .rf-msg b + .field { margin-top: 8px; }
.rf-msg[data-kind="message"], .rf-msg[data-kind="mismatch"] { box-shadow: 0 0 0 3px var(--wall-0), inset 6px 0 0 0 var(--err, #A82020); background: #FFF7F6; }
.rf-msg[data-kind="gift"], .rf-msg[data-kind="refund"] { box-shadow: 0 0 0 3px var(--wall-0), inset 6px 0 0 0 var(--lamp-ok); background: #F3FBF6; }
.rf-msg .content-small { font-size: 15px; line-height: 22px; }
.rf-offer { margin: 14px 3px 0; padding: 14px 16px; gap: 14px; align-items: center; background: #fff; box-shadow: 0 0 0 3px var(--wall-0), 0 6px 0 3px rgba(74, 88, 118, 0.35); }
.rf-offer--gift { box-shadow: 0 0 0 3px var(--wall-0), inset 0 0 0 3px #BDEBD0, 0 6px 0 3px rgba(74, 88, 118, 0.35); }
.rf-offer__ic { flex: none; width: 56px; height: 56px; display: grid; place-items: center; background: var(--plate-hi); box-shadow: 0 0 0 3px var(--wall-0), inset 0 -3px 0 0 var(--wall-3); margin: 3px; }
.rf-offer__tx { flex: 1 1 0; min-width: 0; font: 400 15px/22px var(--f-text); color: var(--text-body); }
.rf-offer__tx b { font: 600 17px/24px var(--f-text); color: var(--text-ink); }
.rf-offer__tx .field + .field { margin-top: 4px; }
.s-panel .rf-offer__btn { flex: none; width: auto; min-height: 48px; margin: 0 0 6px; padding: 0 16px; font-size: 12px; line-height: 12px; }
.rf-support { position: relative; z-index: 3; margin: 22px 0 0; text-align: center; font: 400 15px/24px var(--f-text); color: var(--text-body); }
.rf-support .s-link { overflow-wrap: anywhere; }
/* окна: вход в кабинет, подтверждения */
.rf-dlg { position: fixed; inset: 0; z-index: 70; display: grid; place-items: center; padding: 16px; background: rgba(10, 42, 94, 0.42); overflow-y: auto; }
.rf-dlg[hidden] { display: none; }
.rf-dlg__box { position: relative; width: 100%; max-width: 520px; padding: 30px 32px 30px; display: grid; justify-items: center; gap: 14px; text-align: center; box-shadow: 0 6px 0 0 var(--wall-1); }
.rf-dlg__x { position: absolute; right: 14px; top: 14px; width: 40px; padding: 0; justify-content: center; }
.rf-dlg__ic { display: grid; place-items: center; width: 72px; height: 72px; background: var(--plate-hi); box-shadow: 0 0 0 3px var(--wall-0), inset 0 -3px 0 0 var(--wall-3); margin: 3px; }
.rf-dlg__t { margin: 4px 0 0; font: 400 16px/26px var(--f-head); word-spacing: var(--head-ws); color: var(--text-ink); -webkit-font-smoothing: none; text-wrap: balance; }
.rf-dlg__p, .rf-dlg__q { margin: 0; font: 400 17px/26px var(--f-text); color: var(--text-body); text-wrap: pretty; }
.rf-dlg__q { font-weight: 500; color: var(--text-ink); font-size: 18px; line-height: 28px; }
.rf-steps { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; width: 100%; text-align: left; }
.rf-steps li { display: flex; gap: 12px; align-items: center; padding: 10px 12px; background: var(--plate-hi); box-shadow: 0 0 0 3px var(--wall-3); margin: 3px; font: 500 15px/22px var(--f-text); color: var(--text-ink); }
.rf-steps .n { flex: none; width: 28px; height: 28px; display: grid; place-items: center; background: var(--bv-deep); color: #fff; font: 400 12px/12px var(--f-head); box-shadow: 0 0 0 2px var(--bv-navy); }
.rf-dlg .cta { margin-top: 6px; }
.rf-dlg__btns { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; width: 100%; margin-top: 6px; }
.rf-dlg__btns .cta { min-height: 52px; padding: 0 12px; }
.rf-later { appearance: none; border: 0; background: transparent; padding: 6px 10px; cursor: pointer; font: 600 15px/1 var(--f-text); color: var(--bv-deep); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.rf-later:hover { color: var(--bv-navy); }
/* загрузка (#loadingModal): прозрачный слой блокирует клики, табличка с точками по центру экрана */
.rf-loading { position: fixed; inset: 0; z-index: 80; background: rgba(245, 249, 254, 0.35); cursor: progress; }
.rf-loading__s { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin: 0; }
.bp-dots { display: inline-flex; gap: 6px; }
.bp-dots i { width: 8px; height: 8px; background: var(--bv-blue); animation: rf-blink 900ms steps(1) infinite; }
.bp-dots i:nth-child(2) { animation-delay: 150ms; } .bp-dots i:nth-child(3) { animation-delay: 300ms; }
@keyframes rf-blink { 0%, 100% { opacity: 0.25; } 33% { opacity: 1; } }
/* эмоция Горгульи по состоянию (как на входе Г5) */
.s-refund .g-set .g-i { display: none; }
#rfRoot[data-state="idle"] .g-calm, #rfRoot[data-state="typing"] .g-hm, #rfRoot[data-state="loading"] .g-sleep,
#rfRoot[data-state="error"] .g-oy, #rfRoot[data-state="success"] .g-happy { display: block; }
#rfRoot[data-state="error"] .g-i { animation: rf-hop 360ms steps(3) 1; }
#rfRoot[data-state="success"] .g-i { animation: rf-hop 420ms steps(3) 2; }
@keyframes rf-hop { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@media (max-width: 700px) {
  .rf-label { font-size: 15px; margin-bottom: 8px; }
  .rf-input { height: 54px; font-size: 17px; padding: 0 14px; }
  .s-panel .rf-find { min-height: 56px; }
  .rf-msg { margin-top: 16px; padding: 12px 14px 14px 18px; font-size: 15px; line-height: 22px; }
  .rf-offer { flex-wrap: wrap; padding: 12px; gap: 10px 12px; }
  .rf-offer__ic { width: 48px; height: 48px; }
  .rf-offer__ic svg { width: 33px; height: 33px; }
  .s-panel .rf-offer__btn { flex: 1 1 100%; width: 100%; }
  .rf-dlg__box { padding: 24px 18px 22px; gap: 12px; }
  .rf-dlg__q { font-size: 16px; line-height: 25px; }
  .rf-dlg__p { font-size: 15px; line-height: 23px; }
  .rf-dlg__ic { width: 60px; height: 60px; }
  .rf-dlg__ic svg { transform: scale(0.83); }
  .rf-support { font-size: 14px; line-height: 22px; }
}
@media (max-width: 360px) { .rf-dlg__btns { gap: 10px; } .rf-dlg__btns .cta { font-size: 12px; } }

/* демо-панель — только превью (как на входе Г5) */
.demo { position: fixed; left: 12px; bottom: 12px; z-index: 90; font: 500 13px/1.3 var(--f-text); }
.demo__toggle { appearance: none; border: 0; cursor: pointer; height: 40px; padding: 0 16px; background: var(--bv-deep); color: #fff; font: 700 14px/1 var(--f-text); box-shadow: 0 0 0 3px var(--bv-navy); }
.demo__body { position: absolute; left: 0; bottom: 50px; width: min(380px, calc(100vw - 24px)); max-height: min(70vh, 560px); overflow: auto; padding: 12px; background: #fff; box-shadow: 0 0 0 3px var(--wall-0), 6px 6px 0 3px rgba(10, 42, 94, 0.2); }
.demo__body[hidden] { display: none; }
.demo__h { margin: 4px 0 6px; font: 700 12px/1 var(--f-text); text-transform: uppercase; color: var(--text-meta); }
.demo__row { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 6px; }
.demo__row button { appearance: none; border: 0; cursor: pointer; padding: 5px 8px; background: var(--wall-4); font: 600 12px/1 var(--f-text); color: var(--text-ink); }
.demo__note { margin: 8px 0 0; color: var(--text-meta); font-size: 12px; }
:root:has(#demo) .totop { bottom: calc(16px + 52px + env(safe-area-inset-bottom)); }
/* С8 · заголовок в две строки и ряд «поле + кнопка» на ≥701 — плита ниже, предложения ближе к первому экрану */
.s-refund .s-hero { max-width: 17em; }
@media (min-width: 701px) {
  .s-refund .s-hero { font-size: 48px; line-height: 56px; }
  .rf-row { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .s-panel .rf-find { margin: 3px 0 9px; width: auto; padding: 0 22px; }
  .rf-help { text-align: left; }
}
@media (min-width: 701px) and (max-width: 1100px) { .s-refund .s-hero { font-size: 40px; line-height: 48px; } }
/* С8 · окна на узких и невысоких телефонах: кнопка в одну строку, окно целиком на экране (как длинные ошибки на входе Г5) */
.rf-dlg .cta { white-space: nowrap; padding: 0 12px; }
@media (max-width: 374px) { .rf-dlg .cta { font-size: 12px; line-height: 12px; } }
@media (max-width: 700px) and (max-height: 700px) {
  .rf-dlg { padding: 10px; }
  .rf-dlg__box { gap: 8px; padding: 18px 16px 16px; }
  .rf-dlg__ic { display: none; }
  .rf-dlg__t { margin-top: 0; padding: 0 40px; font-size: 16px; line-height: 24px; }
  .rf-dlg__p { font-size: 14px; line-height: 21px; }
  .rf-steps li { padding: 7px 10px; font-size: 14px; line-height: 20px; }
  .rf-dlg .cta { min-height: 50px; }
  .rf-dlg__x { top: 10px; right: 10px; }
}
/* загрузка: табличка «Загрузка...» (текст живой страницы) по центру экрана поверх лёгкой вуали */
.rf-loading { background: rgba(220, 235, 255, 0.55); }
.rf-loading__s.sign { padding: 16px 22px 16px 20px; gap: 14px; box-shadow: 0 -3px 0 0 var(--wall-0), 0 3px 0 0 var(--wall-0), -3px 0 0 0 var(--wall-0), 3px 0 0 0 var(--wall-0), inset 0 -3px 0 0 var(--wall-3), 0 9px 0 0 var(--wall-1); }

/* ════ С8 · круг 3: загрузка в кнопке, свёрнутое поле, компактное «найдено», предложения в два столбца ════ */
.rf-loading { background: transparent; }                       /* слой только блокирует клики, плиту не перекрывает */
.rf-root .cta.is-busy { cursor: progress; filter: none; gap: 10px; white-space: nowrap; overflow: hidden; }
.rf-root .cta.is-busy .bp-dots i { background: currentColor; }
.rf-root .cta--stone.is-busy .bp-dots i { background: var(--bv-deep); }
.rf-input:disabled { background: #EEF2F8; color: var(--text-meta); -webkit-text-fill-color: var(--text-meta); opacity: 1; }
#rfRoot[data-state="loading"] .rf-help { color: #8A93A6 !important; }
.s-refund .s-stage { padding-bottom: calc(max(40px, var(--g-res)) + var(--g-push, 0px)); }

/* «почта · Изменить» вместо поля, когда подписка найдена и после результата */
.rf-who { display: none; margin: 0; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px 10px 16px; background: #fff;
  box-shadow: 0 0 0 3px var(--wall-0), inset 0 3px 0 0 #E3E9F2; margin: 3px; font: 500 16px/22px var(--f-text); color: var(--text-ink); }
.rf-who__e { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rf-edit { flex: none; appearance: none; border: 0; background: transparent; padding: 6px 4px; cursor: pointer; font: 600 15px/1 var(--f-text); color: var(--bv-deep);
  text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.rf-edit:hover { color: var(--bv-navy); }
#rfRoot:is([data-step="found"], [data-step="gift"], [data-step="refund"]) .rf-form { display: none; }
#rfRoot:is([data-step="found"], [data-step="gift"], [data-step="refund"]) .rf-who { display: flex; }
#rfRoot:is([data-step="found"], [data-step="gift"], [data-step="refund"]) .rf-msg { margin-top: 14px; }

/* предложения: карточка-сетка (значок + заголовок, текст, кнопка внизу); живой скрипт ставит style.display = 'flex' */
.rf-offers { display: grid; gap: 14px; margin-top: 14px; }
.rf-offers:not(:has(.rf-offer[style*="flex"])) { display: none; }
.rf-offer[style*="flex"] { display: grid !important; grid-template-columns: 48px minmax(0, 1fr); grid-template-rows: auto 1fr auto; gap: 10px 12px; align-items: center; margin: 3px; padding: 12px 14px 14px; }
.rf-offer__tx { display: contents; }
.rf-offer__tx .field:first-child { grid-column: 2; grid-row: 1; }
.rf-offer__tx .content-small { grid-column: 1 / -1; grid-row: 2; align-self: start; font: 400 14px/21px var(--f-text); color: var(--text-body); }
.rf-offer__ic { width: 48px; height: 48px; margin: 3px; }
.rf-offer__ic svg { width: 33px; height: 33px; }
.s-panel .rf-offer__btn { grid-column: 1 / -1; grid-row: 3; width: 100%; margin: 0 0 6px; min-height: 48px; padding: 0 12px; align-self: end; }
.rf-offer__tx b { font: 600 16px/22px var(--f-text); }
@media (min-width: 701px) { .rf-offers { grid-template-columns: 1fr 1fr; } }
/* компактная плита «найдено» на десктопе: всё на первом экране вместе с заголовком и Горгульей */
@media (min-width: 701px) {
  #rfRoot[data-step="found"] .rf-msg { padding: 12px 16px 14px 20px; font-size: 14px; line-height: 21px; }
  #rfRoot[data-step="found"] .rf-msg b { font-size: 15px; }
  #rfRoot[data-step="found"] .rf-msg .field + .field, #rfRoot[data-step="found"] .rf-msg b + .field { margin-top: 6px; }
  #rfRoot[data-step="found"] .rf-panel { padding: 22px 24px 24px; }
}
@media (min-width: 701px) and (max-height: 860px) {
  .s-refund .s-stage { padding-top: 16px; }
  .s-refund .s-hero { font-size: 40px; line-height: 48px; margin-bottom: 16px; }
  .s-refund .rf-support { margin-top: 14px; font-size: 14px; line-height: 21px; }
  #rfRoot[data-step="found"] .rf-panel { padding: 18px 22px 20px; }
}
/* круг 3 · десктоп: после «найдено» и в результатах — плотнее по вертикали, чтобы стена с Горгульей оставалась на первом экране */
@media (min-width: 701px) {
  #rfRoot:is([data-step="found"], [data-step="gift"], [data-step="refund"]) .s-stage { padding-top: 14px; padding-bottom: calc(max(14px, var(--g-res)) + var(--g-push, 0px)); }
  #rfRoot:is([data-step="found"], [data-step="gift"], [data-step="refund"]) .s-hero { margin-bottom: 14px; }
  #rfRoot:is([data-step="found"], [data-step="gift"], [data-step="refund"]) .rf-support { margin-top: 12px; font-size: 14px; line-height: 20px; }
  #rfRoot[data-step="found"] .rf-offer[style*="flex"] { gap: 8px 12px; padding: 10px 12px 12px; }
  #rfRoot[data-step="found"] .rf-offer__tx .content-small { font-size: 14px; line-height: 20px; }
}
@media (min-width: 701px) and (max-height: 860px) {
  #rfRoot:is([data-step="found"], [data-step="gift"], [data-step="refund"]) .s-hero { font-size: 32px; line-height: 40px; margin-bottom: 12px; }
  #rfRoot[data-step="found"] .rf-who { padding-top: 6px; padding-bottom: 6px; }
  #rfRoot[data-step="found"] .rf-msg { margin-top: 10px; }
  #rfRoot[data-step="found"] .rf-offers { margin-top: 10px; gap: 12px; }
  #rfRoot[data-step="found"] .s-panel .rf-offer__btn { min-height: 44px; }
}

/* ════ С8 · круг 4 (решение владельца 05.11): предложения вертикально — главное «Два месяца в подарок», под ним спокойный «Полный возврат» ════ */
@media (min-width: 701px) { .rf-offers { grid-template-columns: minmax(0, 1fr); } }
.rf-offer--gift[style*="flex"] { grid-template-columns: 64px minmax(0, 1fr); gap: 12px 16px; padding: 18px 20px 20px; box-shadow: 0 6px 0 0 var(--wall-1); }
.rf-offer--gift.plate { border-image: url("../img/pixel/plate_stone_9slice.png") 3 fill / calc(3px * var(--kp)) / 0 round; background: none; }
.rf-offer--gift .rf-offer__ic { width: 64px; height: 64px; background: #F3FBF6; box-shadow: 0 0 0 3px var(--wall-0), inset 0 -3px 0 0 #BDEBD0; }
.rf-offer--gift .rf-offer__ic svg { width: 44px; height: 44px; }
.rf-offer--gift .rf-offer__tx b { font: 400 16px/24px var(--f-head); word-spacing: var(--head-ws); color: var(--text-ink); -webkit-font-smoothing: none; text-shadow: 2px 2px 0 #fff; }
.rf-offer--gift .rf-offer__tx .content-small { font: 400 16px/24px var(--f-text) !important; color: var(--text-body); }
.s-panel .rf-offer--gift .rf-offer__btn { min-height: 60px; font-size: 16px; line-height: 16px; margin-top: 4px; }
.rf-offer--refund[style*="flex"] { grid-template-columns: 36px minmax(0, 1fr); gap: 8px 12px; padding: 12px 14px 14px; margin-top: 4px; background: rgba(255, 255, 255, 0.55); box-shadow: 0 0 0 3px var(--wall-3); }
.rf-offer--refund .rf-offer__ic { width: 36px; height: 36px; box-shadow: 0 0 0 2px var(--wall-2); background: #fff; }
.rf-offer--refund .rf-offer__ic svg { width: 22px; height: 22px; }
.rf-offer--refund .rf-offer__tx b { font: 600 15px/22px var(--f-text); color: var(--text-body); }
.rf-offer--refund .rf-offer__tx .content-small { font: 400 14px/21px var(--f-text) !important; color: var(--text-meta); }
.s-panel .rf-offer--refund .rf-offer__btn { justify-self: start; width: auto; min-height: 44px; padding: 0 18px; font-size: 12px; line-height: 12px; box-shadow: 0 4px 0 0 var(--wall-1); }
#rfRoot[data-step="found"] .rf-offer--gift[style*="flex"] { padding: 16px 18px 18px; }
@media (max-width: 700px) {
  .rf-offer--gift[style*="flex"] { grid-template-columns: 48px minmax(0, 1fr); padding: 14px 14px 16px; gap: 10px 12px; }
  .rf-offer--gift .rf-offer__ic { width: 48px; height: 48px; }
  .rf-offer--gift .rf-offer__ic svg { width: 33px; height: 33px; }
  .rf-offer--gift .rf-offer__tx b { font-size: 16px; line-height: 22px; }
  .rf-offer--gift .rf-offer__tx .content-small { font-size: 15px !important; line-height: 22px !important; }
  .s-panel .rf-offer--gift .rf-offer__btn { min-height: 56px; }
  .s-panel .rf-offer--refund .rf-offer__btn { width: 100%; justify-self: stretch; }
}
@media (max-width: 374px) { .s-panel .rf-offer--gift .rf-offer__btn { font-size: 12px; line-height: 12px; } }

/* поддержка: кнопками, ненавязчиво — Telegram (каменная плита с самолётиком, как кнопка бота на лендинге) и почта (кнопка-ссылка) */
.rf-support { position: relative; z-index: 3; margin: 22px 0 0; display: grid; justify-items: center; gap: 10px; text-align: center; }
.rf-support__l { margin: 0; font: 400 15px/22px var(--f-text); color: var(--text-meta); }
.rf-support__b { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 14px; }
.rf-tg { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 16px 0 13px; text-decoration: none; color: var(--wall-0);
  font: 600 15px/1 var(--f-text); filter: drop-shadow(0 2px 0 rgba(10, 42, 94, 0.55)); transition: translate 80ms steps(2), filter 80ms steps(2); }
.rf-tg img { width: 21px; height: 17px; }
.rf-tg:focus-visible { outline: 3px solid var(--bv-blue); outline-offset: 4px; }
.rf-tg:active { translate: 0 2px; filter: brightness(0.95); }
@media (hover: hover) and (pointer: fine) { .rf-tg:hover { translate: 0 -2px; filter: brightness(1.06) drop-shadow(0 4px 0 rgba(10, 42, 94, 0.6)); } .rf-tg:hover span { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; } }
.rf-mail { height: 38px; padding: 0 12px; font: 500 14px/1 var(--f-text); color: var(--text-body); --fc: var(--wall-2); }
.rf-mail svg { flex: none; }
@media (max-width: 700px) { .rf-support__b { flex-direction: column; align-items: center; } .rf-support__l { font-size: 14px; } }
.s-refund .rf-support { margin-top: 20px; }

/* «подарок получен» — праздник: две мыши-почтальона Bastion с сердечками, сердечки всплывают (steps, ~1,6 с), Горгулья радуется */
.rf-party { display: none; pointer-events: none; }
#rfRoot[data-step="gift"] .rf-party { display: block; }
.rf-mouse { position: absolute; width: 128px; height: 128px; }
.rf-mouse img { position: absolute; inset: 0; width: 100%; height: 100%; image-rendering: pixelated; }
.rf-mouse .m-b { visibility: hidden; }
.rf-mouse--r { transform: scaleX(-1); }
.rf-heart { position: absolute; width: 21px; height: 18px; image-rendering: pixelated; opacity: 0; }
.rf-heart--1, .rf-heart--3, .rf-heart--5 { width: 27px; height: 24px; }
#rfRoot[data-step="gift"] .rf-mouse { animation: rf-bob 900ms steps(2) 3; }
#rfRoot[data-step="gift"] .rf-mouse--r { animation-name: rf-bob-r; }
#rfRoot[data-step="gift"] .rf-mouse .m-b { animation: rf-flap 300ms steps(1) 9; }
#rfRoot[data-step="gift"] .rf-heart { animation: rf-heart 1600ms steps(8) 2 both; }
.rf-heart--2 { animation-delay: 200ms !important; } .rf-heart--3 { animation-delay: 450ms !important; } .rf-heart--4 { animation-delay: 650ms !important; }
.rf-heart--5 { animation-delay: 850ms !important; } .rf-heart--6 { animation-delay: 1050ms !important; }
@keyframes rf-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes rf-bob-r { 0%, 100% { transform: scaleX(-1) translateY(0); } 50% { transform: scaleX(-1) translateY(-6px); } }
@keyframes rf-flap { 0% { visibility: visible; } 50% { visibility: hidden; } }
@keyframes rf-heart { 0% { opacity: 0; transform: translateY(0); } 12% { opacity: 1; } 75% { opacity: 1; } 100% { opacity: 0; transform: translateY(-48px); } }
/* десктоп: мыши по бокам плиты на высоте сообщения, сердечки над ними */
@media (min-width: 1061px) {
  .rf-party { position: absolute; inset: 0; z-index: 4; }
  .rf-mouse--l { left: -164px; top: 36px; } .rf-mouse--r { right: -164px; top: 36px; }
  .rf-heart--1 { left: -120px; top: 20px; } .rf-heart--2 { left: -70px; top: 44px; } .rf-heart--3 { left: -150px; top: 70px; }
  .rf-heart--4 { right: -110px; top: 18px; } .rf-heart--5 { right: -66px; top: 52px; } .rf-heart--6 { right: -150px; top: 74px; }
}
/* узкие: мыши в строке над сообщением, целиком в плите, текст не перекрывают */
@media (max-width: 1060px) {
  #rfRoot[data-step="gift"] .rf-party { position: relative; height: 104px; margin: 12px 0 -4px; }
  .rf-mouse { width: 128px; height: 128px; top: -10px; }
  .rf-mouse--l { left: 0; } .rf-mouse--r { right: 0; }
  .rf-heart { top: 40px; } .rf-heart--1 { left: 42%; } .rf-heart--2 { left: 52%; top: 64px; } .rf-heart--3 { left: 47%; top: 20px; }
  .rf-heart--4 { left: 38%; top: 66px; } .rf-heart--5 { left: 56%; top: 30px; } .rf-heart--6 { left: 45%; top: 74px; }
}
@media (max-width: 360px) { .rf-mouse { width: 96px; height: 96px; top: 0; } #rfRoot[data-step="gift"] .rf-party { height: 92px; } }
@media (prefers-reduced-motion: reduce) {
  #rfRoot[data-step="gift"] .rf-heart { animation: none !important; opacity: 1; }
  #rfRoot[data-step="gift"] .rf-mouse, #rfRoot[data-step="gift"] .rf-mouse .m-b { animation: none !important; }
}
/* невысокие узкие (320×568): сообщение и «Два месяца в подарок» вместе на одном экране */
@media (max-width: 700px) and (max-height: 700px) {
  #rfRoot[data-step="found"] .rf-msg { padding: 10px 12px 12px 16px; font-size: 14px; line-height: 20px; }
  #rfRoot[data-step="found"] .rf-msg .field + .field, #rfRoot[data-step="found"] .rf-msg b + .field { margin-top: 6px; }
  #rfRoot[data-step="found"] .rf-offers { margin-top: 10px; }
  .rf-offer--gift[style*="flex"] { grid-template-columns: 40px minmax(0, 1fr); padding: 10px 12px 12px; gap: 8px 10px; }
  .rf-offer--gift .rf-offer__ic { width: 40px; height: 40px; }
  .rf-offer--gift .rf-offer__ic svg { width: 28px; height: 28px; }
  .rf-offer--gift .rf-offer__tx .content-small { font-size: 14px !important; line-height: 20px !important; }
  .s-panel .rf-offer--gift .rf-offer__btn { min-height: 48px; }
}
/* десктоп: мыши ×3 — праздничнее, по-прежнему вне плиты */
@media (min-width: 1061px) {
  .rf-mouse { width: 192px; height: 192px; }
  .rf-mouse--l { left: -214px; top: 8px; } .rf-mouse--r { right: -214px; top: 8px; }
  .rf-heart--1 { left: -150px; top: 4px; } .rf-heart--2 { left: -76px; top: 40px; } .rf-heart--3 { left: -196px; top: 52px; }
  .rf-heart--4 { right: -140px; top: 0; } .rf-heart--5 { right: -70px; top: 46px; } .rf-heart--6 { right: -200px; top: 60px; }
}

/* ════ С8 · круг 5: «Вернуться в кабинет», всё в «найдено» по центру ════ */
.rf-back { display: none !important; margin-top: 16px; }
#rfRoot[data-step="refund"] .rf-back, #rfRoot[data-step="gift"] .rf-back { display: flex !important; }
#rfRoot[data-step="gift"] .rf-back { border-image-source: url("../img/pixel/plate_stone_9slice.png"); color: var(--text-ink); text-shadow: 2px 2px 0 #fff; box-shadow: 0 6px 0 0 var(--wall-1); }
#rfRoot[data-step="gift"] .rf-back:active { box-shadow: 0 2px 0 0 var(--wall-1); }
#rfRoot[data-step="found"] .rf-msg { text-align: center; }
.rf-offer[style*="flex"], .rf-offer--gift[style*="flex"], .rf-offer--refund[style*="flex"] { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; }
.rf-offer__tx .field:first-child, .rf-offer__tx .content-small { grid-column: 1; }
.rf-offer__ic { grid-row: 1; }
.rf-offer__tx .field:first-child { grid-row: 2; }
.rf-offer__tx .content-small { grid-row: 3; }
.s-panel .rf-offer__btn { grid-row: 4; grid-column: 1; }
.rf-offer[style*="flex"] { grid-template-rows: auto auto auto auto; }
.s-panel .rf-offer--gift .rf-offer__btn { width: 100%; justify-self: stretch; }
.s-panel .rf-offer--refund .rf-offer__btn { justify-self: center; width: auto; }
@media (max-width: 700px) { .s-panel .rf-offer--refund .rf-offer__btn { width: auto; min-width: 60%; justify-self: center; } }

/* ════ шапка на 320–384 (только site-pixel; лендинг и оплата пока со знаком-башней): полный логотип Н89 ×2, «Кабинет» — в меню ════ */
@media (max-width: 384px) {
  :root:root .top .l89x2 { display: block; }
  :root:root .top .l89tw { display: none; }
  .nav .cab { display: none !important; }
}
/* 320×568: значок подарка прячем (декор), чтобы сообщение и «Два месяца в подарок» помещались вместе */
@media (max-width: 700px) and (max-height: 600px) { #rfRoot[data-step="found"] .rf-offer--gift .rf-offer__ic { display: none; } }