/* Кит интерфейса Party2Play — живой интерфейс (Д71): общий чат и чаты окон, звонки, «Окна» на телефоне, вечерний сбор,
   колода «Мой сбор». Подключается после kit.css (токены и кнопки — там), на витрине и в кабинете одинаково. */

/* ---------- Меню для узких экранов ---------- */
.nav-open .chat{display:none}

/* ── Чат (static/js/chat.js): окно в правом нижнем углу на всех страницах, общее с кабинетом ── */
.chat{position:fixed;right:16px;bottom:16px;z-index:60;display:flex;flex-direction:column;align-items:flex-end;gap:8px;font-family:var(--font-body);text-transform:none;letter-spacing:0}
/* Открытый чат — впереди других плавающих окон (ярлыков сбора «Мой сбор»): они уходят за него. */
.chat.is-open{z-index:70}
.chat.is-open .chat__toggle{border-color:var(--accent)}
.chat__toggle{position:relative;display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px;border:1px solid var(--border-strong);border-radius:10px;background:var(--ink-800);color:var(--text-heading);font:inherit;font-weight:600;font-size:15px;cursor:pointer;box-shadow:0 12px 30px -12px #000}
.chat__toggle:hover{border-color:var(--accent)}
.chat__toggle[hidden]{display:none}
/* Новое — на иконке, а не в тексте кнопки: счётчик серый (новое) или красный (тебе ответили), без счётчика — серая точка. */
.chat__ico{position:relative;display:inline-grid;place-items:center}
.chat__ico svg{color:var(--accent)}
.chat__badge{position:absolute;top:-8px;left:10px;min-width:16px;padding:0 4px;border-radius:999px;background:#8a93a6;color:#0d1117;font-size:10px;font-weight:700;line-height:16px;text-align:center;box-shadow:0 0 0 2px var(--ink-800)}
.chat__badge[hidden]{display:none}
.chat__toggle.has-quiet .chat__ico::after{content:"";position:absolute;top:-3px;left:12px;width:8px;height:8px;border-radius:50%;background:#8a93a6;box-shadow:0 0 0 2px var(--ink-800)}
.chat__badge.has-mention{background:#f85149;color:#fff}
.chat__panel{position:relative;display:flex;flex-direction:column;width:400px;height:min(520px,calc(100vh - 160px));border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--ink-900);box-shadow:0 24px 60px -20px #000;overflow:hidden}
.chat__panel[hidden]{display:none}
.chat__head{display:flex;align-items:center;gap:2px;padding:6px;border-bottom:1px solid var(--border-hairline);background:var(--ink-800)}
.chat__tabs{margin-right:auto}
/* каналы — переключатель .seg (Д59), кнопки окна — справа */
.chat__close{flex:0 0 auto;width:28px;height:32px;border:0;border-radius:50%;background:transparent;color:var(--text-muted);font-size:18px;cursor:pointer}
.chat__close:hover{background:rgba(255,255,255,.08);color:var(--text-heading)}
.chat__list{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;overflow-x:hidden;padding:10px 12px;display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:10px}
.chat__empty{margin:0;color:var(--text-muted);font-size:13px}
.chat__msg{min-width:0;display:flex;gap:8px;align-items:flex-start}
.chat__lead{flex:0 0 32px;display:grid;justify-items:center;gap:3px}
.chat__ranks{display:inline-flex;align-items:center;gap:2px;margin-right:-2px}
.chat__ranks img{width:20px;height:20px;object-fit:contain}
.chat__admin.chat__reply{padding:0 4px;color:var(--accent);font-size:16px;font-weight:700;line-height:1;opacity:.55}
.chat__admin.chat__reply:hover,.chat__msg:hover .chat__reply,.chat__reply:focus-visible{opacity:1;color:var(--accent)}
.chat__msg.is-for-me{margin:0 -6px;padding:4px 6px;border-radius:var(--radius-xs);background:rgba(245,184,61,.1)}
.chat__msg.is-flash{background:rgba(255,255,255,.1)}
.chat__mod-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.chat__mod-row span{min-width:0;overflow-wrap:anywhere}
.chat__av{flex:0 0 auto;width:32px;height:32px;border-radius:var(--av-r);object-fit:cover;background:var(--ink-700)}
.chat__body{min-width:0;flex:1 1 auto}
.chat__meta{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.chat__name{padding:0;border:0;background:none;color:var(--text-heading);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.chat__name:hover{text-decoration:underline}
.chat__name.is-plus{color:var(--fx,#f5b83d)}
.chat__msg--mine .chat__name{color:var(--accent)}
.chat__time{color:var(--text-muted);font-size:11px}
.chat__admin{padding:0 2px;border:0;background:none;color:var(--text-muted);font-size:12px;cursor:pointer;opacity:.6}
.chat__admin:hover{opacity:1;color:#f0616d}
.chat__text{word-break:break-word;color:var(--text-body);font-size:14px;line-height:1.4;white-space:pre-wrap;overflow-wrap:anywhere}
.chat__error{margin:0;padding:6px 12px;color:#f85149;font-size:13px}
.chat__error.is-warning{color:#f5b83d}
.chat__status{margin:0;padding:6px 12px;border-top:1px solid var(--border-hairline);color:var(--text-muted);font-size:12px}
.chat__status.is-blocked{color:#f85149}
.chat__status[hidden],.chat__help[hidden]{display:none}
.chat__help{position:absolute;top:53px;left:8px;right:8px;z-index:3;max-height:calc(100% - 70px);overflow-y:auto;display:grid;gap:6px;padding:12px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--ink-800);box-shadow:0 18px 40px -12px #000;color:var(--text-body);font-size:13px;line-height:1.45}
.chat__help p{margin:0}
.chat__help .btn{justify-self:start}
.chat__text a{color:var(--accent)}
.chat__error[hidden],.chat__guest[hidden],.chat__form[hidden]{display:none}
.chat__form{display:flex;gap:8px;align-items:flex-end;padding:8px;border-top:1px solid var(--border-hairline);background:var(--ink-800)}
.chat__input{flex:1 1 auto;min-height:38px;max-height:120px;padding:9px 12px;border:1px solid var(--border-strong);border-radius:var(--radius-xs);background:var(--ink-700);color:var(--text-heading);font:inherit;font-size:14px;resize:none}
.chat__input:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}
.chat__send{flex:0 0 auto;width:40px;height:38px;border:0;border-radius:var(--radius-xs);background:var(--accent);color:var(--text-on-accent,#0c0f16);font-size:16px;cursor:pointer}
.chat__send:disabled{opacity:.5;cursor:wait}
.chat__guest{margin:0;padding:10px 12px;border-top:1px solid var(--border-hairline);color:var(--text-muted);font-size:13px}
.chat__card{position:fixed;z-index:97;font-family:var(--font-body);text-transform:none;letter-spacing:0;box-sizing:border-box;width:min(300px,calc(100vw - 16px));padding:12px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--ink-800);box-shadow:0 18px 40px -16px #000;display:grid;gap:8px}
.chat__card[hidden]{display:none}
.chat__card-head{display:flex;align-items:center;gap:10px;min-width:0}
.chat__card-av{width:40px;height:40px;border-radius:var(--av-r);object-fit:cover}
.chat__card-name{min-width:0;color:var(--text-heading);font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat__card-name.is-plus{color:var(--fx,#f5b83d)}
.chat__chips{display:flex;flex-wrap:wrap;gap:6px}
.chat__chip{display:inline-flex;align-items:center;gap:5px;padding:2px 8px 2px 2px;border-radius:999px;background:rgba(255,255,255,.06);color:var(--text-body);font-size:12px}
.chat__chip img{width:20px;height:20px;border-radius:5px;object-fit:cover}
.chat__achievements{display:flex;flex-wrap:wrap;gap:5px}
.chat__achievements-item{display:inline-flex;align-items:center;gap:4px;padding:1px 8px 1px 2px;border:1px solid var(--border-hairline);border-radius:999px;background:rgba(255,255,255,.04);color:var(--text-body);font-size:11px;font-weight:600;line-height:1.5}
.chat__achievements-item img{width:16px;height:16px;object-fit:contain}
.chat__achievements-item--plus{border-color:rgba(245,184,61,.5)}
.chat__achievements-item--ally{border-color:rgba(253,169,45,.45)}
.chat__card-note{margin:0;color:var(--text-muted);font-size:12px}
.chat__card-actions{display:flex;gap:6px;flex-wrap:wrap}
.chat__card-actions--stack{flex-direction:column}
.chat__card-actions--stack .btn{width:100%}
/* Кнопки карточки — переносятся и делят строку: «Пожаловаться», «Заблокировать», «Звук и голос» не вылезают за край. */
.chat__card-actions .btn{flex:1 1 auto;min-width:0;max-width:100%;white-space:normal;justify-content:center;text-align:center}
@media (max-width:560px){
.chat{right:12px;bottom:12px}
.chat__panel{position:fixed;left:0;right:0;bottom:62px;width:auto;height:min(72vh,calc(100vh - 130px));border-radius:var(--radius-md)}
.chat__toggle{height:40px;padding:0 14px}
}
.chat__close.chat__shield{font-size:20px;color:#f5b83d}
.chat__ally{align-self:center;width:15px;height:15px;flex:0 0 auto}
.chat__ally--big{width:22px;height:22px;margin-left:auto}
/* Входящий звонок из комнаты матча (static/js/calls.js) — поверх любой страницы: справа снизу, на телефоне — сверху во всю ширину. */
.p2p-call{position:fixed;right:20px;bottom:20px;z-index:1000;display:grid;gap:12px;width:min(340px,calc(100vw - 24px));padding:14px;border:1px solid #3fb950;border-radius:16px;background:var(--ink-800,#141a26);box-shadow:0 18px 44px -14px #000,0 0 0 4px rgba(63,185,80,.15);animation:p2p-call-in .25s ease-out,p2p-call-ring 1.4s ease-in-out .25s infinite}
.p2p-call__who{display:flex;gap:12px;align-items:center;min-width:0}
.p2p-call__av{flex:none;width:44px;height:44px;border-radius:var(--av-r)}
.p2p-call__text{display:grid;min-width:0}
.p2p-call__text strong{color:var(--text-heading);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.p2p-call__text small{color:var(--text-muted);font-size:12px}
.p2p-call__actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.p2p-call__btn{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 14px;border:0;border-radius:999px;color:#fff;font:inherit;font-size:14px;font-weight:700;cursor:pointer;text-decoration:none;white-space:nowrap;flex:1 0 auto}
.p2p-call__btn--ok{background:#3fb950}
.p2p-call__btn--end{background:#e5484d}
.p2p-call__link{margin-left:auto;color:var(--text-muted);font-size:13px}
@media(max-width:600px){
.p2p-call{top:12px;bottom:auto;right:12px;left:12px;width:auto}
}
@media(prefers-reduced-motion:reduce){
.p2p-call{animation:none}
}
/* Общее для всех чатов сайта (/js/chat-kit.js, Д54 платформы): ответы, цитаты, упоминания, звук. */
.ck-sound{flex:none;display:inline-grid;place-items:center;width:32px;padding:0;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:rgba(255,255,255,.04);color:var(--text-body);font-size:14px;cursor:pointer}
/* «Человек» — одна сущность во всех окнах (_UserChip платформы, P2PChatKit.userChip): роль, аватар с рамкой, ник её цветом,
   подпись; клик — мини-анкета, в звонке — громкость. Компактный — только аватар со значком роли. */
.uc{display:inline-flex;align-items:center;gap:6px;min-width:0;max-width:100%;padding:2px 8px 2px 2px;border:1px solid transparent;border-radius:999px;background:none;color:var(--text-body);font:inherit;font-size:13px;cursor:pointer;text-align:left}
.uc:hover{background:rgba(255,255,255,.06)}
.uc__av{width:26px;height:26px;border-radius:var(--av-r);object-fit:cover;display:block;flex:none;box-shadow:0 0 0 2px transparent;transition:box-shadow .12s}
.uc .fxw{flex:none}
.uc__role{width:16px;height:16px;object-fit:contain;flex:none}
.uc__name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.uc small{flex:none;color:var(--text-muted);font-size:11px}
.uc--compact{position:relative;padding:2px;gap:0}
.uc--compact .uc__role{position:absolute;left:-3px;bottom:-3px;z-index:1;width:14px;height:14px;padding:1px;border-radius:50%;background:var(--ink-800)}
.uc.in-call .uc__av{box-shadow:0 0 0 2px rgba(63,185,80,.55)}
.uc.is-talking .uc__av{box-shadow:0 0 0 2px #3fb950}
.uc.is-me .uc__name{color:var(--accent)}
.chat__card-vol{display:flex;align-items:center;gap:8px;margin-top:8px;font-size:13px;color:var(--text-body)}
.chat__card-vol input{flex:1 1 0;width:auto;min-width:40px;margin:0;accent-color:var(--accent)}
/* у ползунка своя ширина ~130px — без этого он выталкивал % и 🔇 за край */
.chat__card-vol output{flex:none;min-width:40px;text-align:right;font-variant-numeric:tabular-nums;color:var(--text-heading)}
.chat__card-mute{flex:none;width:32px;height:28px;padding:0;font-size:15px;line-height:1;border:1px solid var(--border-strong);border-radius:8px;background:none;cursor:pointer}
.uc.is-quiet{position:relative}
.uc.is-quiet::after{content:"";position:absolute;left:20px;top:20px;width:10px;height:10px;border-radius:50%;background:#f85149;border:2px solid var(--ink-800)}
/* Кто-то в голосе (body[data-voice-on], group-call.js) — не в голосе тусклые: один портрет — и состав, и «кто в голосе». */
body[data-voice-on] .uc:not(.in-call) .uc__av{opacity:.5}
/* Жалоба с портрета — модальное окно общего вида (dialog.p2p-ask). */
dialog.chat__report-dialog{width:min(420px,calc(100vw - 24px))}
.chat__report{display:grid;gap:10px}
.chat__report b{color:var(--text-heading);font-size:16px}
.chat__report label{display:grid;gap:5px;color:var(--text-muted);font-size:13px}
.chat__report select,.chat__report textarea{width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid var(--border-strong);border-radius:8px;background:var(--ink-700);color:var(--text-heading);font:inherit;font-size:14px}
.chat__report-note,.chat__report-msg{color:var(--text-muted);font-size:12px}
.chat__report-msg{color:var(--text-heading)}
.chat__report-msg:empty{display:none}
.ck-quote{display:block;max-width:100%;margin:2px 0;padding:1px 0 1px 8px;border:0;border-left:2px solid var(--border-strong);background:none;color:var(--text-muted);font:inherit;font-size:12px;text-align:left;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ck-quote b{color:var(--text-body)}
.ck-replying{display:flex;align-items:center;gap:8px;padding:5px 10px;border-top:1px solid var(--border-hairline);color:var(--text-muted);font-size:12px}
.ck-replying[hidden]{display:none}
.ck-replying span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ck-replying button{padding:0 4px;border:0;background:none;color:var(--text-muted);cursor:pointer}
/* Связь чата (chat-kit live): «Загружаю…» / «Переподключаюсь…» над полем ввода, поле тем временем выключено. */
.ck-live{display:flex;align-items:center;gap:8px;padding:6px 12px;border-top:1px solid var(--border-hairline);background:rgba(240,169,92,.1);color:#f0a95c;font-size:12px;font-weight:600}
.ck-live[hidden]{display:none}
/* Упоминание в тексте; меня — ярче. */
.ck-at{color:var(--accent);font-weight:600;cursor:pointer}
/* Ник автора и упоминание — мини-анкета игрока (та же, что в общем чате). */
.ck-name{cursor:pointer}
.ck-name:hover,.ck-at:hover{text-decoration:underline}
.ck-at.is-me{padding:0 3px;border-radius:4px;background:rgba(245,184,61,.2)}
/* Подсказка по «@»: список тех, кого можно упомянуть, над полем ввода. */
.ck-pick{position:absolute;left:8px;right:8px;bottom:calc(100% + 4px);z-index:5;display:grid;max-height:210px;overflow-y:auto;padding:4px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--ink-800);box-shadow:0 12px 30px rgba(0,0,0,.55)}
.ck-pick[hidden]{display:none}
.ck-pick button{padding:6px 10px;border:0;border-radius:var(--radius-xs);background:none;color:var(--text-heading);font:inherit;font-size:13px;text-align:left;cursor:pointer}
.ck-pick button.is-active,.ck-pick button:hover{background:rgba(255,255,255,.08)}
.ck-private{border:1px dashed var(--border-strong)}
/* Ник того, у кого есть рамка (Plus, бустер, союзник), — её цветом (P2PChatKit.nameLook). */
.ck-fx.ck-fx{color:var(--fx,#f5b83d)}
.ck-private a{color:var(--accent)}
/* Прокрутка внутри окон и списков не уходит на страницу позади (телефон: дочитал чат до края — сайт не едет). */
.chat__help,.ck-pick{overscroll-behavior:contain}

/* ---------- Главная (templates/home.html) ----------
   Первый экран с панелью «Сейчас на сайте», новости с закреплённой карточкой, три игры, шаги, разделы. Живые числа — home.js. */
/* Плавающее окно (P2P.windows, Д82): ✕ в правом верхнем углу у всех видов — колода, вечер, общий чат. */
.win-x{position:absolute;top:8px;right:8px;z-index:3;display:grid;place-items:center;width:28px;height:28px;padding:0;border:1px solid var(--border-strong);border-radius:8px;background:var(--ink-900);color:var(--text-muted);font:inherit;font-size:14px;line-height:1;cursor:pointer}
.win-x:hover{color:var(--text-heading);border-color:var(--accent)}
.chat__head{padding-right:42px}
/* Колонка справа (Д82, макет mockups/2026-10-02-timers/decks.html, вариант A): сверху вниз — «⏱ События» (kit/events.js),
   «🗂 Мои окна · по играм» (колоды, _MyGatheringHost), общий чат. Одна ширина у всех — --rail-w; любое окно (колода, событие,
   вечер, общий чат) открывается слева от колонки — она всегда на виду.
   Карточка колонки .rc (P2P.railCard в kit/p2p.js) — одна на таймер события и ярлык окна колоды: значок, тусклый заголовок вида,
   строка этапа с отсчётом, полоса цвета игры слева. Состояния: is-urgent — ждёт действия, is-active — её окно
   открыто, is-mine — «ты записан», has-unread / has-mention — точка нового в чате (пропущенный звонок — красная, как ответ тебе),
   is-ring — звонят (кнопки «Принять / ✖» прямо в карточке), is-voice — в голосе (время разговора, портреты собеседников, 🎙 и 📵).
   Новое событие или окно — новые данные, не разметка. */
:root{--rail-w:200px}
.evr{position:fixed;right:16px;bottom:70px;z-index:66;display:flex;flex-direction:column;gap:6px;width:var(--rail-w);font-family:var(--font-body);text-transform:none;letter-spacing:0}
.evr[hidden]{display:none}
.evr-cap{display:block;padding:0 4px;color:var(--text-muted);font:600 10px/1.4 var(--font-body);letter-spacing:.08em;text-transform:uppercase}
.rc{position:relative;display:grid;grid-template-columns:26px minmax(0,1fr);column-gap:8px;row-gap:1px;align-items:center;min-height:44px;padding:5px 10px 5px 7px;border:1px solid var(--border-strong);border-left:3px solid var(--c);border-radius:12px;background:var(--ink-800);color:var(--text-heading);font:inherit;font-family:var(--font-body);text-align:left;text-transform:none;letter-spacing:0;cursor:pointer;box-shadow:0 8px 22px rgba(0,0,0,.5)}
.rc:hover{border-color:color-mix(in srgb,var(--c) 60%,var(--border-strong));border-left-color:var(--c)}
.rc__ico{grid-row:1 / span 2;display:grid;place-items:center;width:26px;height:26px;border-radius:7px;background:color-mix(in srgb,var(--c) 18%,transparent);font-size:14px}
.rc__ico img{width:22px;height:22px;object-fit:contain;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.rc__ico svg{color:color-mix(in srgb,var(--c) 70%,#fff)}
.rc__title{display:flex;align-items:center;gap:6px;min-width:0;color:var(--text-muted);font-size:11px;font-weight:600;line-height:1.2;white-space:nowrap}
.rc__name{min-width:0;overflow:hidden;text-overflow:ellipsis}
/* Сколько записалось (count): справа от заголовка; новая запись — подпрыгивает (is-bump ставит владелец). */
.rc__count{flex:none;display:inline-flex;align-items:center;gap:3px;margin-left:auto;color:var(--text-heading);font-variant-numeric:tabular-nums}
.rc__count svg{color:var(--text-muted)}
.rc__count.is-bump{animation:rcBump .6s ease-out}
@keyframes rcBump{30%{transform:scale(1.35);color:#3fb950}}
.rc__line{display:flex;align-items:baseline;gap:5px;min-width:0}
/* «Наши друзья» (Д98): третья строка карточки события — пометка, имя первого (+N), маленький логотип; без движения. */
.rc.has-friend .rc__ico{grid-row:1 / span 3}
.rc__friend{grid-column:2;display:flex;align-items:center;gap:5px;min-width:0;color:var(--text-muted);font-size:10.5px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc__friend img{flex:none;height:13px;max-width:34px;object-fit:contain}
.rc__fi{flex:none;width:13px;height:13px;border-radius:3px;background:#5ec8ff}
.rc__fi--telegram{background:#2aabee}.rc__fi--discord{background:#5865f2}.rc__fi--site{background:#8be28b}
.rc__friend em{font-style:normal;color:var(--text-muted)}
.rc__what{min-width:0;color:var(--text-body);font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc__cd{flex:none;margin-left:auto;font:700 15px/1.1 ui-monospace,"Cascadia Mono",Consolas,monospace;color:var(--text-heading);font-variant-numeric:tabular-nums;white-space:nowrap}
.rc__cd:empty{display:none}
.rc__cd.is-soon{color:var(--accent)}
.rc__cd.is-now{color:#f85149;animation:evrBlink 1s ease-in-out infinite}
.rc__cd.is-live{color:#3fb950;animation:evrBlink 1.6s ease-in-out infinite}
.rc.is-urgent{border-color:var(--accent);border-left-color:var(--c);background:color-mix(in srgb,var(--accent) 12%,var(--ink-800))}
.rc.is-urgent .rc__what{color:var(--accent)}
.rc.is-urgent .rc__ico{animation:evrRing 1.6s ease-out infinite}
/* Окно этой карточки открыто — светлая рамка и уголок к окну (слева): не путается с оранжевым «ждёт действия». */
.rc.is-active{border-color:#e6ebf5;border-left-color:var(--c);background:var(--ink-700);box-shadow:0 0 0 2px rgba(230,235,245,.22),0 8px 22px rgba(0,0,0,.5)}
.rc.is-active::before{content:"";position:absolute;left:-10px;top:50%;margin-top:-6px;border:6px solid transparent;border-right-color:#e6ebf5}
.rc.is-mine::after{content:"ты записан";position:absolute;top:-7px;right:8px;padding:0 6px;border-radius:6px;background:var(--ink-600);color:var(--text-heading);font-size:10px;font-weight:600;line-height:14px}
.rc .cl-dot{position:absolute;top:-3px;left:-3px;display:none;width:10px;height:10px;border-radius:50%;background:#8a93a6;box-shadow:0 0 0 2px var(--ink-800)}
.rc.has-unread .cl-dot,.rc.has-mention .cl-dot{display:block}
.rc.has-mention .cl-dot{background:#f85149}
/* Ответ или упоминание на карточке колонки — та же точка, только красная (общий значок «↩» из kit.css — для вкладок и кнопок). */
.rc.has-mention>.cl-dot{width:10px;height:10px;min-width:0;padding:0}
.rc.has-mention>.cl-dot::before{content:none}
/* Звонок в карточке (макет mockups/2026-10-02-call-card, вариант B): окно не всплывает — звонок, ответ и разговор здесь же. */
.rc.is-ring,.rc.is-voice{border-left-color:#3fb950}
.rc.is-ring{border-color:#3fb950;background:color-mix(in srgb,#3fb950 12%,var(--ink-800));animation:rcRing 1.4s ease-out infinite}
.rc.is-ring .rc__what{color:#8ee39c}
.rc.is-ring .rc__ico{animation:evrRing 1.6s ease-out infinite}
.rc.is-voice{border-color:color-mix(in srgb,#3fb950 55%,var(--border-strong))}
.rc.is-voice .rc__ico{background:color-mix(in srgb,#3fb950 20%,transparent)}
.rc.is-ring .rc__ico svg,.rc.is-voice .rc__ico svg{color:#8ee39c}
.rc__cd--voice{font-size:13px;color:#8ee39c}
@keyframes rcRing{0%{box-shadow:0 0 0 0 rgba(63,185,80,.6),0 8px 22px rgba(0,0,0,.5)}100%{box-shadow:0 0 0 12px rgba(63,185,80,0),0 8px 22px rgba(0,0,0,.5)}}
.rc__people{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.rc__av{position:relative;display:grid;place-items:center;width:24px;height:24px;border-radius:var(--av-r,28%);overflow:hidden;background:var(--ink-600);color:var(--text-heading);font-size:11px;font-weight:700;transition:box-shadow .15s}
.rc__av img{width:100%;height:100%;object-fit:cover}
.rc__av.is-talking{box-shadow:0 0 0 2px #3fb950,0 0 10px rgba(63,185,80,.7)}
.rc__av.is-quiet{opacity:.45}
.rc__acts{grid-column:1 / -1;display:flex;gap:6px;margin-top:6px}
.rc__act{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:30px;border:0;border-radius:8px;font:600 13px/1 var(--font-body);cursor:pointer}
.rc__act--ok{background:#3fb950;color:#04110a}
.rc__act--end{background:#f85149;color:#fff}
.rc__act--mic,.rc__act--off,.rc__act--set{background:var(--ink-600);color:var(--text-heading)}
.rc__av[data-rc-who]{cursor:pointer}
.rc__act--off{background:#5a2330}
.rc__act:hover{filter:brightness(1.12)}
/* Колода карточек колонки (P2P.railDeck): сверху выехавшие (важное), под ними стопка — спереди (внизу) главная, остальные за ней,
   каждая выглядывает сверху на 7px (точка нового видна и у них). Раскладывает наведение на стопку (с мышью), увёл курсор — через
   мгновение собирается; на телефоне — нажатие. Наведение на выехавшую карточку стопку не трогает. */
.rd,.rd__outs,.rd__stack{display:flex;flex-direction:column;align-items:stretch;gap:6px}
.rd__outs:empty,.rd__stack:empty{display:none}
.rd__stack .rc{transition:margin-bottom .2s ease,transform .2s ease;transition-delay:0s;transform-origin:top center}
/* Перестановка сложенной стопки — сразу, без анимации (P2P.railDeck.arrange): колода не подпрыгивает. */
.rd__stack.is-instant .rc{transition:none}
.rd__stack.is-stack .rc.is-behind{margin-bottom:calc(1px - var(--rc-h,44px));transform:scale(calc(1 - var(--depth) * .05));transition-delay:.18s}
@media (hover:hover) and (pointer:fine){
.rd__stack.is-stack:hover .rc.is-behind{margin-bottom:0;transform:none;transition-delay:0s}
}
/* Выехала из стопки — снизу, из колоды. */
.rc.is-popping{animation:rcPop .35s cubic-bezier(.2,.9,.3,1.2)}
@keyframes rcPop{from{transform:translateY(calc(var(--rc-h,44px) * .8)) scale(.92);opacity:.4}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.rd__stack .rc,.rc.is-popping{transition:none;animation:none}}
/* Кнопка общего чата — той же ширины, что карточки колонки: колонка ровная. Окно чата — слева от колонки (как окно колоды):
   таймеры и карточки остаются на виду, событие не пропустить. */
@media (min-width:641px){
.chat__toggle{width:var(--rail-w);justify-content:center}
.chat__panel{position:fixed;right:calc(28px + var(--rail-w));bottom:16px;height:min(560px,calc(100vh - 100px))}
}
/* Телефон: кнопка «⏱ 12:47 События» и список таймеров над ней (те же таймеры). */
.evr-fab{position:fixed;right:12px;bottom:12px;z-index:70;display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 12px;border:1px solid var(--border-strong);border-radius:10px;background:var(--ink-800);color:var(--text-heading);font:600 14px/1 var(--font-body);cursor:pointer;box-shadow:0 12px 30px -12px #000}
.evr-fab[hidden]{display:none}
.evr-fab small{color:var(--text-muted);font-size:12px;font-weight:600}
.evr-fab__cd{font:700 15px/1 ui-monospace,"Cascadia Mono",Consolas,monospace;font-variant-numeric:tabular-nums}
.evr-fab__cd.is-soon{color:var(--accent)}
.evr-fab__cd.is-now{color:#f85149}
.evr-fab__cd.is-live{color:#3fb950}
.evr-fab.is-urgent{border-color:var(--accent);animation:evrRing 1.6s ease-out infinite}
.evr-fab.is-open{background:var(--ink-600)}
.evr-sheet{position:fixed;left:10px;right:10px;bottom:64px;z-index:71;display:flex;flex-direction:column;gap:8px;max-height:60vh;overflow-y:auto;padding:10px;border:1px solid var(--border-strong);border-radius:14px;background:var(--ink-800);box-shadow:0 18px 40px -12px #000;font-family:var(--font-body);text-transform:none;letter-spacing:0;animation:lw-pop .16s ease-out}
.evr-sheet[hidden]{display:none}
.evr-sheet .rc__what{font-size:13px}
.evr-sheet .rc__cd{font-size:17px}
.nav-open .evr,.nav-open .evr-fab,.nav-open .evr-sheet{display:none}
@media (prefers-reduced-motion:reduce){
.rc__cd.is-now,.rc__cd.is-live,.rc.is-urgent .rc__ico,.evr-fab.is-urgent,.rc.is-ring,.rc.is-ring .rc__ico{animation:none}
}
@keyframes evrBlink{50%{opacity:.45}}
@keyframes evrRing{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 70%,transparent)}100%{box-shadow:0 0 0 8px transparent}}
/* «На какую игру?» у события в нескольких играх (kit/events.js, choices): слева от таймера (на телефоне — над кнопками). */
.evr-pick{position:fixed;bottom:68px;right:16px;z-index:66;max-width:calc(100vw - 24px);display:grid;gap:6px;min-width:230px;padding:10px;border:1px solid var(--border-strong);border-radius:14px;background:var(--ink-800);box-shadow:0 20px 40px -16px #000;font-family:var(--font-body);text-transform:none;letter-spacing:0}
.evr-pick[hidden]{display:none}
.evr-pick>b{padding:2px 4px;color:var(--text-muted);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.evr-pick button{position:relative;display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--border-hairline);border-radius:10px;background:var(--ink-900);color:var(--text-heading);font:600 14px/1.2 var(--font-body);text-align:left;cursor:pointer}
.evr-pick button:hover{border-color:#7c9cff}
.evr-pick button>span{flex:1}
.evr-pick img{width:28px;height:28px;object-fit:contain}
.evr-pick small{display:block;color:var(--text-muted);font-size:11px;font-weight:600}
.evr-pick small.is-in{color:#3fb950}
.evr-pick small.is-ask{color:#f5c542}
.evr-pick i{width:9px;height:9px;border-radius:50%;background:#8a93a6}
.evr-pick i.is-mention{background:#f85149}
/* Окно события (kit/events.js) — над колодой сборов (.mg, 65): иначе её ярлыки перекрывают окно и перехватывают нажатия. */
.evf-panel{position:fixed;right:16px;bottom:70px;z-index:66;width:min(920px,calc(100vw - 32px));height:min(620px,calc(100vh - 150px));height:min(620px,calc(100dvh - 150px));border:1px solid var(--border-strong);border-radius:16px;overflow:hidden;background:var(--ink-800);box-shadow:0 30px 60px -20px #000}
.evf-panel[hidden]{display:none}
.evf-panel iframe{display:block;width:100%;height:100%;border:0}
.evf-panel iframe[hidden]{display:none}
/* Окно события на компьютере — слева от колонки (таймеры и колоды на виду), как окно колоды. */
@media (min-width:721px){
.evf-panel{right:calc(28px + var(--rail-w));bottom:16px;width:min(920px,calc(100vw - var(--rail-w) - 60px));height:min(640px,calc(100vh - 100px));height:min(640px,calc(100dvh - 100px))}
}
@media (max-width:720px){
.evf-panel{left:0;right:0;bottom:62px;width:auto;height:calc(100vh - var(--nav-h,64px) - 70px);height:calc(100dvh - var(--nav-h,64px) - 70px);border-radius:16px 16px 0 0}
}
.nav-open .evf-panel,.nav-open .evr-pick{display:none}
/* «Окна» на телефоне (launcher.js, Д67, как мессенджер): вместо ярлыков колоды, кнопки общего чата и ярлыка вечера — одна кнопка
   «Окна · N»; список окон на весь экран; открытое окно — на весь экран под полоской «← Окна · название · ✕». Класс lw-on у <html>
   ставит скрипт (узкий экран), без него — всё как на компьютере. */
.lw-fab,.lw-list,.lw-bar{display:none}
.lw-on .lw-fab{position:fixed;right:12px;bottom:12px;z-index:70;display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 16px;border:1px solid var(--border-strong);border-radius:10px;background:var(--ink-800);color:var(--text-heading);font:600 15px/1 var(--font-body);box-shadow:0 12px 30px -12px #000;cursor:pointer}
.lw-on .lw-fab[hidden]{display:none}
.lw-fab .lw-n{min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:rgba(255,255,255,.1);font-size:12px;display:grid;place-items:center}
.lw-fab .lw-urgent{min-width:22px;height:22px;border-radius:11px;background:var(--accent);color:#1b1103;font-size:13px;display:grid;place-items:center}
.lw-fab .lw-urgent[hidden],.lw-fab .lw-dot[hidden]{display:none}
.lw-fab.is-urgent{border-color:var(--accent);animation:lw-wait 1.8s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){
.lw-fab.is-urgent{animation:none}
}
.lw-dot{position:absolute;top:-2px;right:-2px;width:10px;height:10px;border-radius:50%;background:#8a93a6;box-shadow:0 0 0 2px var(--ink-800)}
.lw-dot.is-mention,.lw-fab .lw-dot{background:#f85149}
/* Список — всплывашкой над кнопкой: шириной по самой длинной строке, не выше 60% экрана (дальше — прокрутка). */
.lw-on .lw-list{position:fixed;right:12px;bottom:64px;z-index:72;display:block;width:min(300px,calc(100vw - 24px));border:1px solid var(--border-strong);border-radius:14px;background:var(--ink-800);box-shadow:0 18px 40px -12px #000;overflow:hidden;transform-origin:bottom right;animation:lw-pop .14s ease-out}
.lw-on .lw-list[hidden]{display:none}
.lw-fab.is-open{border-color:var(--accent)}
/* Звонок на телефоне (Д83): кнопка «Окна» пульсирует зелёным, карточка звонка — над ней (поверх открытого окна — у края). */
.lw-fab.is-ring{border-color:#3fb950;animation:rcRing 1.4s ease-out infinite}
.lw-call{display:none}
.lw-on .lw-call{position:fixed;right:12px;bottom:64px;z-index:73;display:block;width:min(260px,calc(100vw - 24px))}
.lw-on .lw-call.is-over{bottom:12px}
.lw-on .lw-call[hidden]{display:none}
.lw-x{width:34px;height:34px;border:1px solid var(--border-strong);border-radius:50%;background:none;color:var(--text-muted);font-size:15px;cursor:pointer}
.lw-rows{display:flex;flex-direction:column;gap:6px;padding:8px;max-height:min(60vh,480px);max-height:min(60dvh,480px);overflow-y:auto;overscroll-behavior:contain}
/* Скрытые строки — подсказки на краях списка: полупрозрачная плашка с затемнением в сторону списка. */
.lw-on .lw-list{position:fixed}
.lw-more{position:absolute;left:0;right:0;z-index:2;display:block;height:30px;padding:0 12px;border:0;color:var(--text-heading);font:600 12px/30px var(--font-body);text-align:center;cursor:pointer}
.lw-more[hidden]{display:none}
.lw-more--up{top:0;background:linear-gradient(var(--ink-800) 55%,transparent);border-radius:14px 14px 0 0}
.lw-more--down{bottom:0;background:linear-gradient(transparent,var(--ink-800) 45%);border-radius:0 0 14px 14px;line-height:36px}
.lw-empty{margin:24px 14px;color:var(--text-muted)}
.lw-on .lw-bar{position:fixed;left:0;right:0;top:0;z-index:71;display:flex;align-items:center;gap:10px;height:48px;padding:0 10px;border-bottom:1px solid var(--border-hairline);background:var(--ink-900)}
.lw-on .lw-bar[hidden]{display:none}
.lw-back{flex:none;border:0;background:none;color:var(--accent);font:600 15px/1 var(--font-body);cursor:pointer;padding:8px 4px}
.lw-title{flex:1;min-width:0;color:var(--text-heading);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Узкий экран: плавающие ярлыки — строками списка; открытое окно — на весь экран под полоской. */
.lw-on .mg__pills,.lw-on .chat__toggle{display:none!important}
/* Контейнер колоды — на весь экран, но сам нажатий не ловит (окно закрыто — страница под ним живая); ловит только окно. */
.lw-on .mg:not([hidden]){left:0!important;right:0!important;top:48px;bottom:0!important;display:block;z-index:66;pointer-events:none}
.lw-on .mg__panel{pointer-events:auto}
.lw-on .mg__panel,.lw-on .mg__panel.has-chat,.lw-on .mg__panel.has-room{width:100%!important;height:100%!important;max-height:none!important;border:0;border-radius:0;box-shadow:none}
.lw-on .chat{right:0;bottom:0;left:0;top:48px;pointer-events:none}
.lw-on .chat__panel{position:fixed;top:48px;left:0;right:0;bottom:0;width:auto;height:auto;border:0;border-radius:0;pointer-events:auto}
.lw-on .evf-panel{top:48px;left:0;right:0;bottom:0;width:auto;height:auto;border:0;border-radius:0}
.lw-on .win-x{display:none}
/* Название окна — в полоске «← Окна»; в шапке окна колоды не повторяем (переключатель «Сбор | Чат» остаётся). */
.lw-on .mg__head strong,.lw-on .mg__logo{display:none!important}
@keyframes lw-wait{0%,100%{box-shadow:0 0 0 0 rgba(253,169,45,.5),0 12px 30px -12px #000}50%{box-shadow:0 0 0 9px rgba(253,169,45,0),0 12px 30px -12px #000}}
@keyframes lw-pop{from{opacity:0;transform:scale(.92) translateY(6px)}to{opacity:1;transform:none}}
/* Выбор устройств этого браузера (P2PChatKit.devicePicker): меню профиля и страница «Звук и голос». */
.ck-dev{display:grid;gap:8px}
.ck-dev label{display:grid;gap:3px;color:var(--text-muted);font-size:12px}
.ck-dev select{width:100%;min-width:0;padding:6px 8px;border:1px solid var(--border-hairline);border-radius:8px;background:var(--ink-900);color:var(--text-heading);font:inherit;font-size:13px}
.ck-dev [data-dev-allow]{justify-self:start}
/* Кнопка звука чатов в разделе «Связь и чаты» (_SoundSettings). */
.ck-snd__btn{display:inline-grid;place-items:center;width:36px;height:32px;border:1px solid var(--border-hairline);border-radius:8px;background:var(--ink-900);color:var(--text-heading);font-size:16px;line-height:1;cursor:pointer}
.ck-snd__btn:hover{border-color:var(--accent)}
/* «Связь и чаты» — раздел аккаунта (/app#sound, _SoundSettings): всё о звуке и голосе на всю систему, компактно. */
.snd{display:grid;gap:12px}
.snd__chat{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--text-heading);font-weight:600}
.snd .ck-dev{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));width:100%}
.snd .ck-dev [data-dev-allow]{grid-column:1/-1}
.snd__tgs{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px}
.snd__tgs label{display:inline-flex;align-items:center;gap:6px;color:var(--text-body);font-size:14px;cursor:pointer}
.snd__tgs input{width:auto;margin:0;accent-color:var(--accent)}
.snd__people{display:grid;gap:6px;width:100%}
.snd__person{display:grid;grid-template-columns:28px minmax(0,150px) minmax(0,1fr) 44px auto;gap:10px;align-items:center}
.snd__person img{width:28px;height:28px;border-radius:var(--av-r)}
.snd__person b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-heading);font-weight:600}
.snd__person input{margin:0;accent-color:var(--accent)}
.snd__person output{text-align:right;font-variant-numeric:tabular-nums;color:var(--text-heading)}
@media (max-width:560px){.snd__person{grid-template-columns:28px minmax(0,1fr) 44px auto}.snd__person input{grid-column:1/-1;grid-row:2}}
/* Закреп чата (chat-kit pins): плашка над лентой, длинное — две строки, нажатие раскрывает. */
.chat__pin{flex:0 0 auto;margin:0 8px 6px;padding:7px 10px;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);border-left-width:3px;border-radius:var(--radius-sm);background:color-mix(in srgb,var(--accent) 7%,transparent);min-width:0}
.chat__pin[hidden]{display:none}
.chat__pin-head{display:flex;align-items:center;gap:8px}
.chat__pin-tag{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-muted);font-size:11.5px;font-weight:600}
.chat__pin-x{flex:0 0 auto;border:0;background:none;color:var(--text-muted);font-size:12px;cursor:pointer}
.chat__pin-x:hover{color:#f0616d}
.chat__pin-text{margin-top:3px;color:var(--text-body);font-size:13px;line-height:1.4;overflow-wrap:anywhere;cursor:pointer;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.chat__pin.is-open .chat__pin-text{display:block;-webkit-line-clamp:unset;max-height:40vh;overflow:auto}