/* Гостевой режим (js/guest.js, 01.10): карточка входа без регистрации, строка над
   партией и окно «История только начинается». Всё из токенов темы (--surface,
   --gold, --text…), поэтому одинаково живёт в любой из 13 тем. Окно строится на
   базе dialog.avatar-gen (avatargen.css) — та же подложка и затемнение. */
.igra-guest-entry { border-color: color-mix(in srgb, var(--gold) 55%, var(--border)); }
.igra-guest-title { margin: 0 0 8px; }
.igra-guest-entry .igra-hint { color: var(--text-2); }

.igra-guest-note { margin-bottom: 16px; border-color: color-mix(in srgb, var(--gold) 55%, var(--border)); }
.igra-guest-note .igra-hint { margin: 0; color: var(--text); }

.igra-guest-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  margin: 0 0 14px; padding: 8px 8px 8px 14px; border-radius: 999px;
  background: color-mix(in srgb, var(--bg) 82%, transparent);
  border: 1px solid color-mix(in srgb, var(--gold) 55%, var(--border));
  color: var(--text); font-size: .9rem;
}
.igra-guest-bar[hidden] { display: none; }
.igra-guest-home { flex: none; display: grid; place-items: center; width: 32px; height: 32px; margin-left: -6px; border-radius: 50%;
  color: var(--text-2); text-decoration: none; font-size: 1.1rem; line-height: 1; }
.igra-guest-home:hover, .igra-guest-home:focus-visible { color: var(--text); background: color-mix(in srgb, var(--gold) 14%, transparent); outline: none; }
.igra-guest-bar-text { flex: 1 1 auto; min-width: 0; }
.igra-guest-bar-short { display: none; }
@media (max-width: 520px) {
  #guestBar.igra-guest-bar { flex-wrap: nowrap; gap: 6px; padding: 5px 5px 5px 12px; font-size: .86rem; }
  #guestBar .igra-guest-bar-long { display: none; }
  #guestBar .igra-guest-bar-text::before { display: none; }
  #guestBar .igra-guest-bar-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  #guestBar .igra-guest-bar-short { display: inline; }
  #guestBar #guestBarBtn { flex: none; padding: 8px 12px; font-size: .84rem; }
}
.igra-guest-bar-text::before {
  content: ''; display: inline-block; width: 7px; height: 7px; margin-right: 9px;
  background: var(--gold); transform: rotate(45deg); vertical-align: 1px;
}

/* В гостевой партии нет выбора модели, картинок хода и «Заново»: ход стоит один из пяти. Список партий и меню у гостя
   те же, что у вошедшего (23.10), а «←» на сайт в полосе не нужен: рядом шапка и меню игры. */
body.is-guest .igra-turn-image,
body.is-guest #redoTurnBtn { display: none; }
.igra-guest-home { display: none; }
.igra-topbar-login { margin-left: 6px; white-space: nowrap; }

/* Мягкая карточка входа (guest.js showLoginOffer): что откроется после входа, Яндекс/VK, почта, «Позже» */
dialog.guest-offer { max-width: min(480px, calc(100vw - 32px)); padding: 24px 22px 16px; text-align: left; }
.guest-offer-title { margin: 0 0 8px; font-family: var(--font-display, inherit); font-size: 1.35rem; line-height: 1.25; }
.guest-offer-text { margin: 0 0 14px; line-height: 1.5; color: var(--text); }
.guest-offer-actions { flex-wrap: wrap; gap: 8px; }
.guest-offer-actions .btn { margin-top: 0; }
/* белая кнопка Яндекса на светлой карточке (pink_kingdom) сливалась с фоном: тонкий край цветом текста */
dialog.guest-offer .btn-yandex, .guest-banner-oauth .btn-yandex { border: 1px solid color-mix(in srgb, currentColor 35%, transparent); }
.guest-offer-later { justify-content: flex-end; margin-top: 6px; }
.guest-banner-oauth { flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 10px; }
.guest-banner-oauth .btn { flex: 1 1 150px; justify-content: center; }

dialog.guest-wall { text-align: center; padding: 30px 26px 24px; }
.guest-wall-ornament {
  position: relative; height: 18px; margin: 0 auto 14px; width: min(220px, 70%);
  background: linear-gradient(90deg, transparent, var(--gold) 30%, var(--gold) 70%, transparent) center / 100% 1px no-repeat;
}
.guest-wall-ornament::after {
  content: ''; position: absolute; left: 50%; top: 50%; width: 11px; height: 11px;
  transform: translate(-50%, -50%) rotate(45deg); background: var(--gold);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--gold) 22%, transparent);
}
.guest-wall-title { margin: 0 0 12px; font-size: 1.55rem; line-height: 1.2; font-family: var(--font-display, inherit); }
.guest-wall-lead { margin: 0 auto 10px; max-width: 36ch; font-size: 1.12rem; line-height: 1.5; color: var(--text); }
dialog.guest-wall .guest-wall-sub { margin: 0 0 16px; }
dialog.guest-wall .tv-field-check { text-align: left; margin: 0 0 6px; }
dialog.guest-wall .avatar-gen-actions { justify-content: center; margin-top: 18px; }
dialog.guest-wall #guestWallGo { min-width: 220px; }
@media (max-width: 480px) {
  dialog.guest-wall { padding: 24px 18px 18px; }
  .guest-wall-title { font-size: 1.35rem; }
  dialog.guest-wall #guestWallGo { width: 100%; }
}
.igra-guest-entry .igra-row { margin-top: 16px; }

/* --- Вход и регистрация раздельно (09.10): вкладки над формой, согласие строкой под кнопками --- */
.igra-auth-tabs { display: flex; gap: 4px; padding: 4px; margin: 0 0 16px; width: fit-content; max-width: 100%;
  /* Цвета темы, но парой «текст на фоне страницы» (её контраст темы уже держат): дорожка чуть темнее/светлее фона, выбранная
     вкладка — обратная плашка (фон текстом, текст фоном). Раньше брали --text-2 и «золото»: у pink_kingdom дорожка выходила
     тёмной с тёмно-розовым текстом (1,8:1), у dark_purple «золото» фиолетовое и тёмный текст терялся (2,7:1). */
  border: 1px solid var(--border); border-radius: 999px; background: color-mix(in srgb, var(--bg) 86%, var(--text)); }
.igra-auth-tab { appearance: none; border: 0; background: transparent; color: var(--text); font: inherit; font-weight: 600;
  padding: 9px 18px; border-radius: 999px; cursor: pointer; min-height: 40px; }
.igra-auth-tab[aria-selected="true"] { background: var(--text); color: var(--bg); }
.igra-auth-tab:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.igra-auth-title { margin-bottom: 14px; }
.igra-auth-note { margin: 0 0 14px; padding: 10px 14px; border-radius: 12px; border: 1px solid var(--gold);
  background: color-mix(in srgb, var(--gold) 12%, transparent); color: var(--text); }
.igra-auth-consent { margin: 12px 0 0; font-size: .9rem; line-height: 1.5; }
.igra-auth-consent a { color: var(--gold-t, var(--gold)); text-decoration: underline; text-underline-offset: 3px; }
.igra-auth-switch { margin: 14px 0 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; }
.igra-auth-switch-btn { font-weight: 600; }
#screen-auth > .igra-age-note { margin-top: 22px; }

/* --- Режим партии SFW / NSFW (content.js): та же «таблетка» ступеней, что у сюжета и подачи --- */
.pt-content { margin: 0 0 18px; }
.igra-content-switch { max-width: 320px; }
/* Читаемость обеих половинок (13.10, владелец: «неактивная NSFW сливается с фоном»). Общая «таблетка» ступеней красит
   выбранную ступень --gold с белым текстом (на янтарном и розовом контраст < 4.5) и оставляет невыбранную прозрачной.
   Здесь цвета свои, непрозрачные: невыбранная — плотная плашка из --bg с примесью --text (текст --text: контраст темы),
   выбранная — сплошная заливка с белым текстом и галочкой (SFW зелёная, NSFW красная). Мерено по всем 13 темам в
   tests/igra/content_kontrast.test.mjs. Блокировку («войдите», «у персонажа режим по карточке») показывает пунктирная
   рамка и замок, а не opacity: прозрачность роняла контраст ниже порога. */
.igra-content-step {
  --cs-off: color-mix(in srgb, var(--bg) 84%, var(--text));
  background: var(--cs-off); color: var(--text); border: 1px solid color-mix(in srgb, var(--text) 45%, var(--bg)); font-weight: 600;
}
.igra-plot.igra-content-switch .igra-content-step { /* ряд, а не столбец: на телефоне общая «таблетка» (igra.css, <=520) ставит подпись столбиком и уводила галочку под слово */
  flex: 1 1 auto; min-width: 0; display: inline-flex; flex-direction: row; align-items: center; justify-content: center; gap: 0; white-space: normal; text-align: center; line-height: 1.2; min-height: 44px; height: auto; padding: 8px 14px; /* 20.10: подпись «Без откровенных сцен» шире кнопки: ширина по содержимому, перенос слов */
}
.igra-content-step:hover, .igra-content-step:focus-visible { border-color: var(--text); color: var(--text); }
.igra-content-step:focus-visible { outline: 2px solid var(--gold-2); outline-offset: 2px; }
.igra-content-step[aria-checked="true"] { color: #fff; font-weight: 800; border-width: 2px; box-shadow: 0 0 0 2px color-mix(in srgb, var(--bg) 60%, transparent); }
.igra-content-step[aria-checked="true"]::before { content: '\2713\00a0'; }
.igra-content-step[data-content="sfw"][aria-checked="true"] { background: #1b6b45; border-color: #4fd08e; }
.igra-content-step[data-content="nsfw"][aria-checked="true"] { background: #9b2c3a; border-color: #ff8a98; }
.igra-content-step.is-locked { cursor: not-allowed; border-style: dashed; }
.igra-content-step.is-locked:not([aria-checked="true"])::after { content: '\00a0\1F512'; font-size: .85em; }
.igra-content-step.is-locked[aria-checked="true"] { cursor: default; }
.igra-model-item.is-content-locked { opacity: .62; }
.igra-model-item.is-content-locked .igra-model-note { color: var(--text-2); }

/* --- «Показывать ответ целиком» и «↓ к концу» (reading.js) --- */
.igra-reading-row { display: flex; align-items: center; gap: 10px; }
/* «Мастер пишет…» вместо «подбирает слова» (одна надпись, не две) */
.igra-turn-assistant.is-whole .igra-typing::after { content: none; }
.igra-writing { display: inline-block; margin-left: 8px; font: italic .86rem/1 var(--pt-prose, inherit); color: color-mix(in srgb, currentColor 84%, transparent); /* цвет самого пузыря (пергамент светлый, у тёмных тем светлый): не токен --text-2 другой темы */ vertical-align: middle; }
.igra-to-end { position: fixed; left: 50%; transform: translateX(-50%); bottom: 96px; z-index: 30;
  width: 48px; height: 48px; padding: 0; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg, #0b0a12) 90%, transparent); color: var(--text); cursor: pointer;
  box-shadow: 0 6px 18px rgba(0,0,0,.35); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.igra-to-end[hidden] { display: none; }
.igra-to-end:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

/* --- Баннер «пробные ходы кончились» (07.10, владелец: «крупно и красочно») -------------
   Своя тёмная палитра, а не токены темы: поверх картинки и в любой из 13 тем (есть и светлые)
   текст обязан читаться одинаково. Контраст пар по фону #17100b мерен в отчёте
   F:\Android\otchet\gost_konec_1007\itog.md (все ≥4.5:1). */
dialog.guest-banner {
  --gb-bg: #17100b; --gb-text: #f7ecdc; --gb-text-2: #e9d6bd; --gb-accent: #ffb35c; --gb-link: #ffc98f;
  width: min(680px, calc(100vw - 24px)); max-height: calc(100dvh - 24px);
  padding: 0; overflow-x: hidden; overflow-y: auto; text-align: center;
  color: var(--gb-text);
  background: radial-gradient(120% 70% at 50% 0%, #3a1d0a 0%, var(--gb-bg) 62%), var(--gb-bg);
  border: 1px solid rgba(255, 179, 92, .55); border-radius: 22px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .6), 0 0 60px rgba(255, 140, 40, .28), 0 30px 90px rgba(0, 0, 0, .7);
}
/* Светлые темы (pink_kingdom и др.) красят .igra-card своим градиентом поверх нашего тёмного фона, и светлый текст баннера
   (заголовок, «Позже») пропадал на светлой подложке: контраст 1,1:1. Селектор с html[data-theme] перебивает тему. */
html[data-theme] dialog.guest-banner { background: radial-gradient(120% 70% at 50% 0%, #3a1d0a 0%, var(--gb-bg) 62%), var(--gb-bg); color: var(--gb-text); }
dialog.guest-banner::backdrop { background: rgba(8, 5, 3, .74); backdrop-filter: blur(5px); }
dialog.guest-banner[open] { animation: gb-in .42s cubic-bezier(.2, .9, .3, 1.15) both; }
@keyframes gb-in { from { opacity: 0; transform: translateY(18px) scale(.96); } to { opacity: 1; transform: none; } }

.guest-banner-head { position: relative; }
.guest-banner-art { display: block; }
.guest-banner-art img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
/* Низ картинки растворяется в фоне окна: текст ниже не стоит на пёстром */
.guest-banner-head::after {
  content: ''; position: absolute; inset: auto 0 0 0; height: 46%;
  background: linear-gradient(180deg, transparent, var(--gb-bg) 92%); pointer-events: none;
}
.guest-banner-sparks { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 1; }
.guest-banner-sparks::before, .guest-banner-sparks::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -10%; height: 120%;
  background-image:
    radial-gradient(2px 2px at 12% 80%, #ffd28a, transparent), radial-gradient(2px 2px at 28% 64%, #ffb35c, transparent),
    radial-gradient(3px 3px at 46% 88%, #ffe0a8, transparent), radial-gradient(2px 2px at 63% 72%, #ffb35c, transparent),
    radial-gradient(2px 2px at 78% 90%, #ffd28a, transparent), radial-gradient(3px 3px at 90% 60%, #ffc98f, transparent);
  animation: gb-sparks 7s linear infinite; opacity: .85;
}
.guest-banner-sparks::after { animation-duration: 11s; animation-delay: -4s; left: 7%; opacity: .6; }
@keyframes gb-sparks { from { transform: translateY(0); opacity: 0; } 15% { opacity: .9; } to { transform: translateY(-38%); opacity: 0; } }

/* Медаль подарка: чернильница из той же серии и крупное число на нижнем краю картинки */
.guest-banner-medal {
  /* left/right 0 + margin auto, а не left 50% + translate: при left 50% ширина «по содержимому»
     упиралась в половину окна, и на телефоне слово «ходов» вылезало за край медали */
  position: absolute; z-index: 2; left: 0; right: 0; bottom: -34px; width: max-content; margin: 0 auto;
  display: flex; align-items: center; gap: 10px; padding: 6px 22px 6px 6px; border-radius: 999px;
  background: linear-gradient(180deg, #2c1708, #170d06);
  border: 1px solid rgba(255, 179, 92, .8);
  box-shadow: 0 0 0 4px rgba(255, 150, 50, .14), 0 0 34px rgba(255, 150, 50, .5), 0 10px 26px rgba(0, 0, 0, .55);
  white-space: nowrap;
}
.guest-banner-medal img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px rgba(255, 179, 92, .6); }
.guest-banner-num {
  font-family: var(--font-display, Georgia, serif); font-size: 2.6rem; font-weight: 800; line-height: 1;
  color: #ffd08a; text-shadow: 0 0 18px rgba(255, 150, 50, .75), 0 2px 0 #5a2a06;
}
.guest-banner-unit { font-size: 1.05rem; font-weight: 700; color: var(--gb-text); letter-spacing: .02em; }
@media (prefers-reduced-motion: no-preference) {
  .guest-banner-medal { animation: gb-glow 2.8s ease-in-out infinite; }
}
@keyframes gb-glow {
  50% { box-shadow: 0 0 0 6px rgba(255, 150, 50, .2), 0 0 52px rgba(255, 150, 50, .75), 0 10px 26px rgba(0, 0, 0, .55); }
}

.guest-banner-body { position: relative; padding: 50px 34px 26px; }
.guest-banner-head:not(:has(.guest-banner-medal)) + .guest-banner-body { padding-top: 8px; }
.guest-banner-kicker {
  margin: 0 0 6px; font-size: .82rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gb-accent);
}
dialog.guest-banner .guest-banner-title {
  margin: 0 0 12px; font-size: clamp(1.6rem, 4.4vw, 2.25rem); line-height: 1.15; color: var(--gb-text); text-wrap: balance;
  text-shadow: 0 2px 18px rgba(255, 140, 40, .35);
}
dialog.guest-banner .guest-banner-lead { margin: 0 auto 18px; max-width: 40ch; font-size: 1.08rem; line-height: 1.5; color: var(--gb-text-2); text-wrap: pretty; }
dialog.guest-banner .guest-wall-sub { color: var(--gb-text-2); margin: -6px auto 16px; max-width: 44ch; }
dialog.guest-banner .tv-field-check {
  text-align: left; margin: 0 auto 4px; max-width: 470px; padding: 10px 12px; border-radius: 12px;
  background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 179, 92, .28);
  color: var(--gb-text-2); font-size: .9rem; line-height: 1.4;
}
dialog.guest-banner .tv-field-check label, dialog.guest-banner .tv-field-check span { color: var(--gb-text-2); }
dialog.guest-banner .tv-field-check a { color: var(--gb-link); }
dialog.guest-banner .tv-field-check input { accent-color: var(--gb-accent); }
dialog.guest-banner .igra-error { color: #ffb4a8; margin-top: 8px; }
dialog.guest-banner .guest-banner-actions {
  display: flex; flex-direction: column; align-items: center; gap: 6px; margin-top: 18px;
}
dialog.guest-banner #guestWallGo {
  min-width: min(340px, 100%); min-height: 54px; padding: 14px 28px; border: 0; border-radius: 999px;
  font-size: 1.12rem; font-weight: 800; letter-spacing: .01em; color: #1d1006;
  background: linear-gradient(180deg, #ffd08a 0%, #ffb35c 45%, #f08a2c 100%);
  box-shadow: 0 0 0 1px rgba(255, 220, 160, .5) inset, 0 8px 26px rgba(240, 120, 30, .45);
  transition: transform .15s ease, box-shadow .15s ease;
}
dialog.guest-banner #guestWallGo:hover { transform: translateY(-1px); box-shadow: 0 0 0 1px rgba(255, 220, 160, .6) inset, 0 12px 34px rgba(240, 120, 30, .6); }
dialog.guest-banner #guestWallGo:focus-visible { outline: 2px solid rgba(255, 224, 168, .75); outline-offset: 3px; }
/* #guestWall в селекторе: темы (themes.css) красят .btn-ghost своим фоном, и на телефоне под «Позже» лежало тёмное пятно */
#guestWall.guest-banner .guest-banner-later, #guestWall.guest-banner .guest-banner-later:hover, #guestWall.guest-banner .guest-banner-later:active {
  min-height: 44px; padding: 10px 22px; color: var(--gb-text-2); background: transparent; border: 0; box-shadow: none;
  -webkit-backdrop-filter: none; backdrop-filter: none; /* размытие подложки у .btn рисовало пятно под ссылкой */
  text-decoration: underline; text-underline-offset: 3px; font-size: .98rem;
}
#guestWall.guest-banner .guest-banner-later:hover, #guestWall.guest-banner .guest-banner-later:focus-visible { color: var(--gb-text); }
@media (prefers-reduced-motion: reduce) {
  dialog.guest-banner[open], .guest-banner-sparks::before, .guest-banner-sparks::after { animation: none; }
}

/* ПК с невысоким экраном (1366×768): картинка ниже, чтобы окно не прокручивалось */
@media (min-width: 561px) and (max-height: 860px) {
  .guest-banner-art img { aspect-ratio: 16 / 7; object-position: 50% 60%; }
}

/* Телефон: картинка ниже (обрезка по центру), отступы меньше, окно целиком в экране 360×640 */
@media (max-width: 560px) {
  dialog.guest-banner { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); border-radius: 18px; }
  .guest-banner-art img { aspect-ratio: 16 / 8; object-position: 50% 62%; }
  .guest-banner-medal { bottom: -28px; padding: 4px 18px 4px 4px; gap: 8px; }
  .guest-banner-medal img { width: 52px; height: 52px; }
  .guest-banner-num { font-size: 2.1rem; }
  .guest-banner-unit { font-size: .95rem; }
  .guest-banner-body { padding: 38px 16px 10px; }
  .guest-banner-kicker { font-size: .74rem; }
  dialog.guest-banner .guest-banner-title { font-size: 1.5rem; margin-bottom: 8px; }
  dialog.guest-banner .guest-banner-lead { font-size: .98rem; margin-bottom: 12px; }
  dialog.guest-banner .tv-field-check { font-size: .84rem; padding: 8px 10px; }
  dialog.guest-banner .guest-banner-actions { margin-top: 12px; gap: 2px; }
  dialog.guest-banner #guestWallGo { width: 100%; min-height: 50px; font-size: 1.05rem; }
}

/* --- Кнопки-ответы гостю над полем ввода (план «Второй ход», 08.10; app.js renderGuestReplies) ------------
   Полоса ввода прилипает к низу экрана, и кнопки в ней видны сразу после ответа мастера, без прокрутки.
   Компактнее кнопок первого экрана (.gost-choice): на телефоне 360×640 три кнопки и поле занимают меньше
   трети экрана, остальное — текст мастера. Длинный вариант — в две строки, не шире колонки. */
.guest-replies {
  display: flex; flex-direction: column; gap: 6px; margin: 0 -6px 8px; padding: 6px; border-radius: 20px;
  /* Подложка: без неё текст ответа просвечивал в щелях между кнопками (стенд 09.10, снимок a3_390) */
  background: color-mix(in srgb, var(--bg) 86%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  box-shadow: 0 -10px 18px -6px color-mix(in srgb, var(--bg) 80%, transparent);
  animation: guest-replies-in .25s ease-out both;
}
.guest-replies[hidden] { display: none; }
@keyframes guest-replies-in { from { opacity: 0; transform: translateY(6px); } }
.guest-reply {
  display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px; padding: 7px 8px 7px 14px;
  text-align: left; cursor: pointer; color: var(--text); font: 500 .94rem/1.3 var(--pt-ui, var(--font-body));
  border-radius: 14px; border: 1px solid color-mix(in srgb, var(--gold) 42%, var(--border-strong));
  background: linear-gradient(170deg, color-mix(in srgb, var(--gold) 10%, var(--surface-2, var(--bg))), color-mix(in srgb, var(--bg) 88%, transparent));
  box-shadow: 0 1px 2px rgba(0,0,0,.3), inset 0 1px 0 var(--pt-edge, rgba(255,255,255,.08));
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  transition: border-color .15s ease, transform .15s ease, background .15s ease;
}
.guest-reply-t {
  flex: 1; min-width: 0; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;
}
.guest-reply-t .ch-act { font-style: italic; opacity: .85; }
.guest-reply svg {
  flex: none; box-sizing: content-box; padding: 5px; border-radius: 50%; color: var(--on-gold, #1a1206);
  background: linear-gradient(140deg, var(--gold-2), var(--gold));
}
.guest-reply:hover, .guest-reply:focus-visible { border-color: var(--gold); outline: none; transform: translateY(-1px); }
.guest-reply:active { transform: translateY(0); }
@media (max-width: 560px) {
  .guest-replies { gap: 5px; margin-bottom: 6px; padding: 5px; }
  .guest-reply { min-height: 38px; padding: 6px 6px 6px 12px; font-size: .9rem; }
}
@media (prefers-reduced-motion: reduce) { .guest-replies { animation: none; } .guest-reply { transition: none; } }
dialog.guest-offer { position: relative; width: min(440px, calc(100vw - 32px)); padding: 28px; border: 1px solid var(--border-strong); border-radius: 18px; }
.guest-offer-close { position: absolute; right: 16px; top: 14px; width: 34px; height: 34px; border: 0; border-radius: 50%; background: var(--surface-2); color: var(--text); font-size: 1.3rem; cursor: pointer; }
.guest-offer-title { padding-right: 40px; font-size: 1.3rem; }
.guest-offer-text { margin-bottom: 18px; color: var(--text-2); }
.guest-offer-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.guest-offer-actions .btn { width: 100%; min-height: 48px; justify-content: center; }
.guest-offer-actions .guest-offer-mail { grid-column: 1 / -1; }
.guest-oauth-icon { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 5px; font: 800 12px Arial, sans-serif; }
.guest-oauth-icon.is-yandex { background: #fc3f1d; color: #fff; }
.guest-oauth-icon.is-vk { background: #fff; color: #07f; font-size: 9px; }
.guest-offer .igra-auth-consent { font-size: .78rem; line-height: 1.5; margin: 16px 0 0; }
.guest-offer-later { margin-top: 12px; }
@media (max-width: 380px) { dialog.guest-offer { padding: 22px 18px; } .guest-offer-actions { grid-template-columns: 1fr; } .guest-offer-actions .guest-offer-mail { grid-column: auto; } }
.guest-offer-actions .guest-oauth { flex-direction: row-reverse; }