/* ============================================================
   Таплинк v2 «Тише» · прототип 03.11.2026 · лекало Артёма (goldjaxe-taplink-quiet.html, вариант А), слово CEO 03.11
   Одна рамка на странице — консоль MASTER KEY; группы — подложкой и линией между строк; значки Lucide, линия 1.75.
   Скругления — по слову CEO («такие округлые края… более аккуратная»): расходится с почерком «прямые углы»
   (goldjaxe-frontend, composition.md) — заявка дизайнеру на исключение для таплинка.
   Шапка, знак, портрет с кольцом и фон не тронуты (п. 1 слова CEO). Шрифты — только канон:
   кириллица Inter и JetBrains Mono, арабский IBM Plex Sans Arabic. Движение — transform и opacity
   ============================================================ */

:root {
  --q-surface: rgba(18, 17, 15, 0.80);
  --q-hover: rgba(255, 255, 255, 0.045);
  --q-edge: rgba(255, 255, 255, 0.07);
  --q-sep: rgba(255, 255, 255, 0.08);
  --q-text: var(--text-primary, #FFFFFF);
  --q-muted: var(--text-muted, rgba(255, 255, 255, 0.70));
  --q-faint: var(--text-faint, rgba(255, 255, 255, 0.55));
  --q-r: 16px;
  --q-r-s: 12px;
  --q-sheet: #121110;
  --q-bubble: rgba(255, 255, 255, 0.06);
  --q-mine: rgba(235, 197, 84, 0.15);
  --q-mine-text: #F2D47A;
  --q-ok: #32D74B;
  --q-side: 420px;
}
[data-theme="light"] {
  --q-surface: rgba(255, 255, 255, 0.84);
  --q-hover: rgba(26, 26, 26, 0.04);
  --q-edge: rgba(26, 26, 26, 0.07);
  --q-sep: rgba(26, 26, 26, 0.08);
  --q-sheet: #FBFAF7;
  --q-bubble: rgba(26, 26, 26, 0.055);
  --q-mine: rgba(122, 102, 20, 0.12);
  --q-mine-text: #5E4E0E;
  --q-ok: #15803D;
  --q-faint: rgba(26, 26, 26, 0.62); /* бледные подписи светлой темы до нормы AA: 3,3 → 4,8 : 1 (слово CEO 04.11 «Рекомендации, сохрани»); мастер-CSS не трогаем */
}

/* ============================================================
   Панель строк: подложка без рамки, линия между строками, значок слева, шеврон справа
   ============================================================ */
.q-panel { position: relative; margin: 0; padding: 0; overflow: clip; border-radius: var(--q-r); background: var(--q-surface);
  box-shadow: inset 0 0 0 1px var(--q-edge); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.q-row { position: relative; display: flex; align-items: center; gap: 14px; min-height: 66px; padding: 12px 16px; box-sizing: border-box;
  color: var(--q-text); text-decoration: none; text-align: start; -webkit-tap-highlight-color: transparent; transition: background-color 160ms ease; }
.q-row + .q-row::before { content: ''; position: absolute; top: 0; inset-inline: 16px; height: 1px; background: var(--q-sep); }
.q-ico { position: relative; flex: 0 0 28px; display: grid; place-items: center; color: var(--v3-gold); }
.q-ico svg { width: 26px; height: 26px; }
.q-txt { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.q-title { font-family: 'Inter', sans-serif; font-weight: 600; font-size: 16px; line-height: 1.3; color: var(--q-text); }
.q-desc { font-family: 'Inter', sans-serif; font-weight: 400; font-size: 14px; line-height: 1.4; color: var(--q-muted); }
.q-chev { flex: 0 0 auto; display: grid; place-items: center; color: var(--v3-gold); opacity: 0.8; transition: transform 200ms cubic-bezier(0.23, 1, 0.32, 1); }
.q-chev svg, .q-go svg, .vau-arrow svg { display: block; }
html[dir="rtl"] .q-chev svg, html[dir="rtl"] .q-go svg, html[dir="rtl"] .vau-arrow svg, html[dir="rtl"] .vau-console-go svg { transform: scaleX(-1); }
.q-row:focus-visible { outline: 2px solid var(--v3-gold); outline-offset: -3px; border-radius: var(--q-r-s); }
.q-row:active { background: var(--q-hover); }
@media (hover: hover) and (pointer: fine) {
  a.q-row:hover { background: var(--q-hover); }
  a.q-row:hover .q-chev { transform: translateX(2px); }
  html[dir="rtl"] a.q-row:hover .q-chev { transform: translateX(-2px); }
}
html[dir="rtl"] .q-title, html[dir="rtl"] .q-desc { font-family: 'Inter', sans-serif; }
/* латинское имя продукта в строке на арабском — по правому краю вместе с описанием */
html[dir="rtl"] .q-txt > * { text-align: right; }
.q-title, .q-desc { text-wrap: pretty; }
html[dir="rtl"] .q-desc { font-size: 15px; line-height: 1.5; }

/* разделы подряд вместо вкладок: заголовок обычным регистром, над ним воздух больше, чем под ним */
.q-sec { margin: 36px 0 0; }
.q-h { margin: 0 0 12px; padding: 0 4px; font-family: 'Inter', sans-serif; font-weight: 700; font-size: 24px; line-height: 1.15; letter-spacing: -0.01em; color: var(--v3-gold); }
.q-sub { margin: -6px 0 12px; padding: 0 4px; font-family: 'Inter', sans-serif; font-weight: 500; font-size: 15px; line-height: 1.4; color: var(--q-muted); }
[data-theme="light"] .q-h { color: var(--text-primary); }
html[dir="rtl"] .q-h, html[dir="rtl"] .q-sub { font-family: 'Inter', sans-serif; letter-spacing: 0; }

/* «рекомендуем» у L2 и «Скоро» у будущих продуктов */
.q-pill { display: inline-flex; align-items: center; height: 22px; margin-inline-start: 8px; padding: 0 9px; border-radius: 999px; vertical-align: 1px;
  background: var(--v3-fill); color: #0A0A0A; font-family: 'Inter', sans-serif; font-weight: 600; font-size: 12px; line-height: 1; letter-spacing: 0.01em; white-space: nowrap; }
.q-soon { flex: 0 0 auto; display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--q-sep);
  font-family: 'Inter', sans-serif; font-weight: 600; font-size: 12px; line-height: 1; letter-spacing: 0.02em; color: var(--q-muted); white-space: nowrap; }
.q-row.is-soon .q-ico { color: var(--q-faint); }
.q-row.is-soon .q-title { color: var(--q-muted); }
.q-row[hidden] { display: none; } /* «Скоро» спрятаны до выпуска № 2 каталога (слово CEO 04.11): у .q-row свой display, голый hidden его не перебивает */
html[dir="rtl"] .q-pill, html[dir="rtl"] .q-soon { font-family: 'Inter', sans-serif; font-size: 13px; letter-spacing: 0; }

/* Уровни: тонкая золотая линия пути, узлы на ней; L2 — заполненный узел */
.q-path .q-ico svg { display: none; }
.q-path .q-ico::before { content: ''; width: 13px; height: 13px; box-sizing: border-box; border-radius: 50%; border: 1.75px solid var(--v3-gold); background: var(--q-sheet); }
.q-path .q-step.is-rec .q-ico::before { width: 21px; height: 21px; border-width: 1.75px; background: radial-gradient(circle, var(--v3-gold) 0 5.5px, var(--q-sheet) 6.5px); }
.q-path::after { content: ''; position: absolute; z-index: 0; inset-inline-start: 29.5px; top: 33px; bottom: 33px; width: 1.5px; margin-inline-start: -0.75px; background: var(--v3-gold); opacity: 0.5; pointer-events: none; }
.q-path .q-row > * { position: relative; z-index: 1; }

/* ============================================================
   Терминал: подпись MASTER KEY и консоль — единственная рамка на странице
   ============================================================ */
.vau-term.q-term { margin: 0 0 14px; padding: 12px; border: 0; border-radius: var(--q-r); background: var(--q-surface); box-shadow: inset 0 0 0 1px var(--q-edge); }
.q-term .vau-console-label { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; border: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.q-term .vau-console { display: flex; align-items: stretch; height: 48px; margin: 0; padding: 0; border: 1px solid var(--v3-line); border-radius: var(--q-r-s); overflow: hidden;
  background: rgba(0, 0, 0, 0.32); background-image: none; }
[data-theme="light"] .q-term .vau-console { background: rgba(255, 255, 255, 0.78); }
.q-term .vau-console-input { flex: 1 1 auto; min-width: 0; height: auto; margin: 0; padding: 0 12px 0 10px; border: 0; background: transparent; box-shadow: none; outline: none;
  font-family: 'JetBrains Mono', monospace; font-weight: 600; font-size: 16px; letter-spacing: 0.18em; color: var(--q-text); caret-color: var(--v3-gold); }
.q-term .vau-console-input::placeholder { color: var(--q-muted); font-family: 'Inter', sans-serif; font-weight: 500; font-size: 15px; letter-spacing: 0; opacity: 1; }
/* значок ключа в поле: с первого взгляда понятно, что здесь вводят код */
.q-key { flex: 0 0 auto; display: grid; place-items: center; padding-inline-start: 14px; color: var(--v3-gold); }
.q-key svg { width: 20px; height: 20px; }
html[dir="rtl"] .q-term .vau-console-input { padding: 0 10px 0 12px; }
.q-term .vau-console-go { flex: 0 0 52px; display: grid; place-items: center; margin: 0; padding: 0; border: 0; border-inline-start: 1px solid var(--v3-line-soft); border-radius: 0;
  background: transparent; color: var(--v3-gold); cursor: pointer; transition: background-color 160ms ease; }
.q-term .vau-console-go:active { background: rgba(235, 197, 84, 0.12); }
.q-term .vau-console::before, .q-term .vau-console::after { display: none; }
.q-term .vau-console:focus-within { border-color: var(--v3-gold); }
@media (hover: hover) and (pointer: fine) { .q-term .vau-console-go:hover { background: rgba(235, 197, 84, 0.08); } }

/* ============================================================
   «В эфире»: мини-строка — обложка слева, «В эфире» и мысль справа, плюс справа; карточка — обложка со скруглением.
   Слова «манифест» нет (слово CEO 03.11), плюс и «В эфире» остались
   ============================================================ */
.vx-air { margin: 0 0 14px; }
.vx-air .vau-card { border: 0; border-radius: var(--q-r); background: var(--q-surface); box-shadow: inset 0 0 0 1px var(--q-edge); color: var(--q-text); }
.vx-air[data-open="false"] .vau-card { grid-template-columns: 80px minmax(0, 1fr) 36px; grid-template-rows: 36px auto; row-gap: 4px; column-gap: 12px; min-height: 0; padding: 12px; }
/* мысль — под «В эфире» во всю ширину до края, плюс — в углу: две строки и на 358 */
.vx-air[data-open="false"] .vau-card-media img { grid-row: 1 / span 2; align-self: center; }
.vx-air[data-open="false"] .vau-onair { grid-column: 2; grid-row: 1; align-self: center; }
.vx-air[data-open="false"] .vau-card-title { grid-column: 2 / 4; grid-row: 2; align-self: start; }
.vx-air[data-open="false"] .vau-card-media img { width: 80px; height: 68px; border: 0; border-radius: 10px; }
.vx-air .vau-onair { gap: 7px; padding: 6px 10px 6px 8px; border: 0; border-radius: 999px; background: rgba(255, 255, 255, 0.08); -webkit-backdrop-filter: none; backdrop-filter: none;
  font-weight: 700; font-size: 12px; letter-spacing: 0.12em; color: var(--q-text); }
.vx-air[data-open="false"] .vau-onair { padding: 5px 10px 5px 8px; }
[data-theme="light"] .vx-air[data-open="false"] .vau-onair { background: rgba(26, 26, 26, 0.06); }
.vx-air[data-open="false"] .vau-card-title { font-family: 'Inter', sans-serif; font-weight: 700; font-size: 17px; line-height: 1.25; letter-spacing: -0.005em; text-transform: none; text-shadow: none; color: var(--q-text); }
.vx-air .vau-card-title .vau-t2 { display: block; color: var(--v3-gold); }
.vx-air[data-open="false"] .vx-plus { top: 12px; margin-top: 0; }
.vx-plus { width: 36px; height: 36px; margin-top: -18px; inset-inline-end: 12px; border: 1px solid var(--v3-line); border-radius: var(--q-r-s); background: transparent; color: var(--v3-gold); }
.vx-plus::before, .vx-plus::after { width: 14px; height: 1.75px; margin: -0.875px 0 0 -7px; border-radius: 1px; }
.vx-air-tg { color: var(--v3-gold); border-radius: var(--q-r); }
@media (hover: hover) and (pointer: fine) { .vx-air-tg:hover .vx-plus { background: rgba(235, 197, 84, 0.10); } }
/* карточка: обложка, «В эфире» и мысль поверх, ниже «Читать» */
.vx-air[data-open="true"] .vau-card { overflow: hidden; background: #0b0b0d; color: #fff; }
.vx-air[data-open="true"] .vau-onair { background: rgba(8, 8, 10, 0.55); color: #fff; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.vx-air[data-open="true"] .vau-card-title { font-family: 'Inter', sans-serif; font-weight: 700; font-size: clamp(22px, 6.2vw, 27px); line-height: 1.15; letter-spacing: -0.01em; text-transform: none; }
.vx-air[data-open="true"] .vau-card-title .vau-t2 { color: #EBC554; }
.vx-air[data-open="true"] .vx-plus { border-color: rgba(255, 255, 255, 0.32); background: rgba(8, 8, 10, 0.5); color: #fff; }
.vau-card-cta { min-height: 52px; padding: 0 16px; background: transparent; border-top: 1px solid rgba(255, 255, 255, 0.10);
  font-family: 'Inter', sans-serif; font-weight: 600; font-size: 15px; letter-spacing: 0; text-transform: none; color: #EBC554; }
.vau-card-cta::before { display: none; }
html[dir="rtl"] .vau-card-cta, html[dir="rtl"] .vx-air .vau-card-title { font-family: 'Inter', sans-serif; }
@media (hover: hover) { .vx-air .vau-card:hover { box-shadow: inset 0 0 0 1px var(--v3-line); } }
[data-theme="light"] .vx-air[data-open="true"] .vau-card { box-shadow: 0 14px 34px rgba(26, 26, 26, 0.16); }
@media (max-width: 374px) {
  .vx-air[data-open="false"] .vau-card { grid-template-columns: 64px minmax(0, 1fr) 36px; column-gap: 10px; }
  .vx-air[data-open="false"] .vau-card-media img { width: 64px; height: 64px; }
  .vx-air[data-open="false"] .vau-card-title { font-size: 16px; }
}

/* ============================================================
   Док: золотая GOLDJAXE OS и строка GOLDJAXE Terminal — пара висит всегда (слово CEO 24.10).
   Пока не прокрутили, Терминал — первая строка общей панели с Беллой и Журналом
   ============================================================ */
.v3-dock.q-dock { margin: -10px 0 0; padding: 10px 0 0; }
.v3-dock.q-dock::before { bottom: -10px; }
.q-os { position: relative; display: flex; align-items: center; gap: 14px; min-height: 76px; margin: 0 0 12px; padding: 14px 16px; box-sizing: border-box;
  border-radius: 14px; background: var(--v3-fill); color: #0A0A0A; text-decoration: none; box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
  -webkit-tap-highlight-color: transparent; transition: transform 160ms ease, filter 160ms ease; }
.q-os-ico { flex: 0 0 34px; display: grid; place-items: center; color: #0A0A0A; }
.q-os .q-title { font-weight: 700; font-size: 18px; line-height: 1.2; letter-spacing: 0.01em; color: #0A0A0A; }
.q-os .q-desc { font-weight: 500; font-size: 14px; line-height: 1.35; color: rgba(10, 10, 10, 0.74); }
.q-go { flex: 0 0 auto; display: grid; place-items: center; color: #0A0A0A; }
.q-os:active { transform: scale(0.985); }
.q-os:focus-visible { outline: 2px solid var(--v3-gold); outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) { .q-os:hover { filter: brightness(1.04); } }
[data-theme="light"] .q-os { box-shadow: 0 10px 24px rgba(122, 102, 20, 0.16); }
.q-panel-top { border-radius: var(--q-r) var(--q-r) 0 0; box-shadow: inset 1px 0 0 var(--q-edge), inset -1px 0 0 var(--q-edge), inset 0 1px 0 var(--q-edge); }
.q-panel-cont { border-radius: 0 0 var(--q-r) var(--q-r); box-shadow: inset 1px 0 0 var(--q-edge), inset -1px 0 0 var(--q-edge), inset 0 -1px 0 var(--q-edge); }
.q-panel-cont > .q-row:first-child::before { content: ''; position: absolute; top: 0; inset-inline: 16px; height: 1px; background: var(--q-sep); }
.v3-dock.is-stuck .q-panel-top { border-radius: var(--q-r); box-shadow: inset 0 0 0 1px var(--q-edge); }
html.vx-vt #v3-dock { view-transition-name: vx-dock; }

/* «Спросить у Беллы»: точка «на связи» у значка — только когда шлюз отвечает */
.q-on { position: absolute; top: -2px; inset-inline-end: -4px; width: 10px; height: 10px; box-sizing: border-box; border-radius: 50%; border: 2px solid var(--q-sheet); background: var(--q-ok); opacity: 0; transition: opacity 200ms ease; }
html.bx-live .q-on { opacity: 1; }
html.bx-side .vau-bella-door { background: var(--q-hover); }
html.bx-side .vau-bella-door .q-title { color: var(--v3-gold); }

/* ============================================================
   Белла · телефон и планшет — шторка снизу; компьютер — панель справа, страница доступна.
   Закрыть: свайп вниз, крестик, «назад», Esc. Тап мимо шторку не закрывает
   ============================================================ */
dialog.bx { position: fixed; z-index: 60; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; overflow: hidden;
  background: transparent; color: var(--q-text); overscroll-behavior: contain; }
dialog.bx:not([open]) { display: none; }
dialog.bx::backdrop { background: rgba(0, 0, 0, 0.55); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); opacity: 0; transition: opacity 260ms ease; }
[data-theme="light"] dialog.bx::backdrop { background: rgba(20, 18, 12, 0.32); }
dialog.bx[open]::backdrop { opacity: 1; }
dialog.bx.is-closing::backdrop { opacity: 0; transition-duration: 200ms; }
.bx-shell { position: absolute; inset: auto 0 0 0; display: flex; flex-direction: column; height: min(88dvh, 760px); max-height: calc(100dvh - 24px); margin: 0 auto; box-sizing: border-box;
  border-radius: 22px 22px 0 0; background: var(--q-sheet); box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.06); outline: none;
  transform: translateY(0); will-change: transform; touch-action: pan-y; }
[data-theme="light"] .bx-shell { box-shadow: 0 -12px 34px rgba(26, 26, 26, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.8); }
@media (min-width: 640px) { .bx-shell { width: 600px; } }
dialog.bx.is-opening .bx-shell { animation: q-sheet-in 360ms cubic-bezier(0.32, 0.72, 0, 1) both; }
dialog.bx.is-dragging .bx-shell { transition: none; }
dialog.bx.is-closing .bx-shell { animation: none; transition: transform 220ms cubic-bezier(0.32, 0, 0.67, 0); transform: translateY(105%); }
@keyframes q-sheet-in { from { transform: translateY(100%); } }

/* ручка — тянуть вниз */
.q-grab { flex: 0 0 auto; display: grid; place-items: center; height: 22px; cursor: grab; touch-action: none; }
.q-grab span { width: 40px; height: 5px; border-radius: 3px; background: rgba(255, 255, 255, 0.22); }
[data-theme="light"] .q-grab span { background: rgba(26, 26, 26, 0.18); }

/* шапка: портрет в тонком кольце, имя, метка AI-сотрудника всегда, «на связи» — только при живом шлюзе */
.bh { position: relative; flex: 0 0 auto; display: flex; align-items: center; gap: 12px; padding: 2px 10px 14px 18px; touch-action: none; }
html[dir="rtl"] .bh { padding: 2px 18px 14px 10px; }
.bh-who { display: flex; align-items: center; gap: 14px; min-width: 0; flex: 1 1 auto; margin: 0; padding: 0; border: 0; background: none; color: inherit; text-align: start; cursor: zoom-in; -webkit-tap-highlight-color: transparent; }
.bh-who:focus-visible { outline: 2px solid var(--v3-gold); outline-offset: 4px; border-radius: 30px; }
.bh-ava { position: relative; flex: 0 0 auto; width: 56px; height: 56px; border-radius: 50%; padding: 2px; box-sizing: border-box; box-shadow: inset 0 0 0 1.5px var(--v3-gold); }
.bh-ava img { display: block; width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
dialog.bx.is-viewing .bh-ava img { opacity: 0; }
.bh-id { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.bh-name { font-family: 'Inter', sans-serif; font-weight: 700; font-size: 22px; line-height: 1.1; letter-spacing: -0.005em; color: var(--v3-gold); }
.bh-top { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; }
.bh-role { font-family: 'Inter', sans-serif; font-weight: 500; font-size: 14px; line-height: 1.35; color: var(--q-muted); white-space: nowrap; }
/* «на связи» рядом с именем, как в мессенджерах; метка AI-сотрудника — строкой ниже всегда */
.bh-live { display: none; align-items: center; gap: 6px; font-family: 'Inter', sans-serif; font-weight: 600; font-size: 13px; line-height: 1; color: var(--q-ok); }
.bh-live i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
dialog.bx.is-live .bh-live { display: inline-flex; }
html[dir="rtl"] .bh-name, html[dir="rtl"] .bh-role { font-family: 'Inter', sans-serif; }
.bx-x { flex: 0 0 auto; display: grid; place-items: center; width: 44px; height: 44px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--q-text);
  cursor: pointer; -webkit-tap-highlight-color: transparent; transition: background-color 160ms ease; }
.bx-x svg { width: 24px; height: 24px; }
.bx-x:active { background: var(--q-hover); }
.bx-x:focus-visible { outline: 2px solid var(--v3-gold); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .bx-x:hover { background: var(--q-hover); } }

/* переписка: Белла — на мягкой подложке с портретом, посетитель — справа в золотистом тоне; рамок нет */
.bx-log { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 10px; padding: 6px 16px 16px; scroll-padding-bottom: 16px; }
.bx-msg { position: relative; max-width: 82%; padding: 12px 16px; border-radius: 18px; font-family: 'Inter', sans-serif; font-size: 16px; line-height: 1.5; overflow-wrap: anywhere;
  animation: bx-up 260ms cubic-bezier(0.23, 1, 0.32, 1) both; }
.bx-msg.bella { align-self: flex-start; margin-inline-start: 44px; background: var(--q-bubble); color: var(--q-text); border-start-start-radius: 6px; }
.bx-msg.bella::before { content: ''; position: absolute; top: 0; inset-inline-start: -44px; width: 34px; height: 34px; border-radius: 50%;
  background: url('bella-smile-ava-240.jpg') center / cover no-repeat; box-shadow: 0 0 0 1px rgba(235, 197, 84, 0.45); }
.bx-msg.bella + .bx-msg.bella { margin-top: -4px; }
.bx-msg.bella + .bx-msg.bella::before { display: none; }
.bx-msg.team::after { content: attr(data-who); display: block; margin-top: 6px; font-size: 12px; font-weight: 600; color: var(--q-faint); }
.bx-msg.me { align-self: flex-end; background: var(--q-mine); color: var(--q-mine-text); border-end-end-radius: 6px; }
.bx-w { animation: bx-word 260ms ease both; }
.bx-w.is-still { animation: none; }
html[dir="rtl"] .bx-msg { font-family: 'Inter', sans-serif; font-size: 17px; line-height: 1.6; }
.bx-typing { align-self: flex-start; display: inline-flex; gap: 5px; margin-inline-start: 44px; padding: 14px 16px; border-radius: 18px; border-start-start-radius: 6px; background: var(--q-bubble); }
.bx-typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--q-muted); animation: vau-dots 1.2s ease-in-out infinite; }
.bx-typing i:nth-child(2) { animation-delay: 0.15s; }
.bx-typing i:nth-child(3) { animation-delay: 0.3s; }
.bx-note { align-self: center; max-width: 92%; padding: 8px 12px; font-family: 'Inter', sans-serif; font-size: 14px; line-height: 1.45; text-align: center; color: var(--q-muted); }
@keyframes bx-up { from { opacity: 0; transform: translateY(8px); } }
@keyframes bx-word { from { opacity: 0; } }

/* кнопки-ответы: вопрос во всю ширину, «Запросить демо» и «Стать оператором» — парой */
.bx-sugg { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 4px 0 0; }
.bx-sugg button { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; margin: 0; padding: 8px 10px; box-sizing: border-box;
  border: 0; border-radius: 14px; background: var(--q-bubble); box-shadow: inset 0 0 0 1px rgba(235, 197, 84, 0.22); color: var(--v3-gold); cursor: pointer;
  font-family: 'Inter', sans-serif; font-weight: 600; font-size: 14.5px; line-height: 1.25; text-align: center; -webkit-tap-highlight-color: transparent;
  animation: bx-up 260ms cubic-bezier(0.23, 1, 0.32, 1) calc(var(--i, 0) * 60ms) both; transition: background-color 160ms ease, transform 160ms ease; }
.bx-sugg button:first-child:nth-last-child(odd) { grid-column: 1 / -1; }
[data-theme="light"] .bx-sugg button { box-shadow: inset 0 0 0 1px rgba(122, 102, 20, 0.38); }
/* Д4: на телефоне кнопки-ответы столбиком, значок у текста; парой — от 431 px (планшет, панель на компьютере) */
@media (max-width: 430px) { .bx-sugg { grid-template-columns: minmax(0, 1fr); } .bx-sugg button { justify-content: flex-start; padding: 8px 16px; min-height: 50px; text-align: start; } }
.bx-sugg button svg { flex: 0 0 auto; width: 18px; height: 18px; }
.bx-sugg button:active { transform: scale(0.98); background: rgba(235, 197, 84, 0.12); }
.bx-sugg button:focus-visible { outline: 2px solid var(--v3-gold); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .bx-sugg button:hover { background: rgba(235, 197, 84, 0.10); } }
html[dir="rtl"] .bx-sugg button { font-family: 'Inter', sans-serif; font-size: 16px; }

/* продолжить в мессенджере: подпись по центру, две равные кнопки симметрично по центру (слово CEO 03.11) */
.bx-alt { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 6px 0 0; animation: bx-up 260ms cubic-bezier(0.23, 1, 0.32, 1) 120ms both; }
.bx-alt-cap { font-family: 'Inter', sans-serif; font-weight: 500; font-size: 14px; line-height: 1.3; color: var(--q-muted); text-align: center; }
.bx-alt-row { display: grid; grid-template-columns: repeat(2, minmax(0, 148px)); justify-content: center; gap: 10px; width: 100%; }
.bx-alt-row a { display: flex; align-items: center; justify-content: center; gap: 9px; min-height: 48px; padding: 0 14px; box-sizing: border-box; border-radius: 14px;
  box-shadow: inset 0 0 0 1px var(--q-sep); background: transparent; color: var(--q-text); text-decoration: none;
  font-family: 'Inter', sans-serif; font-weight: 600; font-size: 15px; line-height: 1; -webkit-tap-highlight-color: transparent; transition: background-color 160ms ease, transform 160ms ease; }
.bx-alt-row a svg { width: 20px; height: 20px; color: var(--v3-gold); }
.bx-alt-row a:active { transform: scale(0.98); background: var(--q-hover); }
.bx-alt-row a:focus-visible { outline: 2px solid var(--v3-gold); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .bx-alt-row a:hover { background: var(--q-hover); } }
.bx-alt-row a:only-child { grid-column: 1 / -1; justify-self: center; width: 148px; }
html[dir="rtl"] .bx-alt-cap { font-family: 'Inter', sans-serif; font-size: 15px; }

/* поле: под большим пальцем, кнопка отправки — золотой круг; строка согласия — по центру, мелко и спокойно */
.bx-foot { flex: 0 0 auto; padding: 8px 16px calc(12px + env(safe-area-inset-bottom)); }
.bx-form { display: flex; align-items: center; gap: 8px; min-height: 56px; padding: 6px 6px 6px 18px; box-sizing: border-box; border-radius: 28px;
  background: var(--q-bubble); box-shadow: inset 0 0 0 1px var(--q-sep); transition: box-shadow 160ms ease; }
html[dir="rtl"] .bx-form { padding: 6px 18px 6px 6px; }
.bx-form:focus-within { box-shadow: inset 0 0 0 1px var(--v3-line); }
.bx-form input { flex: 1 1 auto; min-width: 0; height: 44px; margin: 0; padding: 0; border: 0; outline: none; background: transparent; color: var(--q-text); caret-color: var(--v3-gold);
  font-family: 'Inter', sans-serif; font-size: 16px; }
.bx-form input::placeholder { color: var(--q-faint); }
html[dir="rtl"] .bx-form input { font-family: 'Inter', sans-serif; }
.bx-form button { flex: 0 0 44px; display: grid; place-items: center; width: 44px; height: 44px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: var(--v3-fill); color: #0A0A0A;
  cursor: pointer; transition: transform 160ms ease, opacity 160ms ease; }
.bx-form button svg { width: 20px; height: 20px; margin-inline-start: -2px; }
html[dir="rtl"] .bx-form button svg { transform: scaleX(-1); margin-inline-start: 0; margin-inline-end: -2px; }
.bx-form button:active { transform: scale(0.94); }
.bx-form button:disabled { opacity: 0.5; cursor: default; }
.bx-form button:focus-visible { outline: 2px solid var(--v3-gold); outline-offset: 2px; }
.bx-consent { max-width: 40ch; margin: 10px auto 0; font-family: 'Inter', sans-serif; font-size: 12px; line-height: 1.5; text-align: center; text-wrap: balance; color: var(--q-faint); }
.bx-consent a { color: var(--q-muted); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: var(--q-sep); transition: color 160ms ease, text-decoration-color 160ms ease; }
.bx-consent a:hover { color: var(--v3-gold); text-decoration-color: currentColor; }
html[dir="rtl"] .bx-consent { font-family: 'Inter', sans-serif; font-size: 13px; line-height: 1.6; max-width: 40ch; }

/* страница под шторкой не прокручивается */
html.bx-lock, html.bx-lock body { overflow: hidden; }

/* компьютер: панель справа, страница не затемняется и сдвигается влево */
@media (min-width: 1024px) {
  dialog.bx { inset: 0 0 0 auto; width: var(--q-side); height: 100%; }
  dialog.bx::backdrop { display: none; }
  .bx-shell { inset: 0; width: auto; height: 100%; max-height: none; border-radius: 0; box-shadow: -1px 0 0 var(--v3-line-soft), -24px 0 48px rgba(0, 0, 0, 0.35); }
  [data-theme="light"] .bx-shell { box-shadow: -1px 0 0 var(--q-sep), -24px 0 48px rgba(26, 26, 26, 0.10); }
  html[dir="rtl"] dialog.bx { inset: 0 auto 0 0; }
  html[dir="rtl"] .bx-shell { box-shadow: 1px 0 0 var(--v3-line-soft), 24px 0 48px rgba(0, 0, 0, 0.35); }
  dialog.bx.is-opening .bx-shell { animation: q-side-in 320ms cubic-bezier(0.32, 0.72, 0, 1) both; }
  html[dir="rtl"] dialog.bx.is-opening .bx-shell { animation-name: q-side-in-rtl; }
  dialog.bx.is-closing .bx-shell { transform: translateX(105%); }
  html[dir="rtl"] dialog.bx.is-closing .bx-shell { transform: translateX(-105%); }
  .q-grab { display: none; }
  .bh { padding: 18px 12px 16px 20px; touch-action: auto; }
  html[dir="rtl"] .bh { padding: 18px 20px 16px 12px; }
  body { transition: padding 320ms cubic-bezier(0.32, 0.72, 0, 1); }
  html.bx-side body { padding-inline-end: var(--q-side); }
  .bx-sugg { grid-template-columns: 1fr 1fr; }
}
@keyframes q-side-in { from { transform: translateX(100%); } }
@keyframes q-side-in-rtl { from { transform: translateX(-100%); } }

/* фото Беллы на весь экран: подпись по центру через translate, а не transform — анимация vau.js больше её не сдвигает (хвост досье §6) */
@media (min-aspect-ratio: 3/4) { .bxv-cap { transform: none; translate: -50% 0; } }
.bxv-top .bx-x { color: #fff; background: rgba(8, 8, 10, 0.45); }
/* «На связи» на фото — только при живом шлюзе (находка нулевых проверок: горело и при live: false) */
dialog.bxv .bxv-live { display: none; }
html.bx-live dialog.bxv .bxv-live { display: inline-flex; }

/* ============================================================
   Меньше движения: шторка и панель — затуханием, без сдвигов
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  dialog.bx.is-opening .bx-shell, html[dir="rtl"] dialog.bx.is-opening .bx-shell { animation: bx-fade 200ms ease both; }
  dialog.bx.is-closing .bx-shell, html[dir="rtl"] dialog.bx.is-closing .bx-shell { transform: none; transition: opacity 160ms ease; opacity: 0; }
  .bx-msg, .bx-sugg button, .bx-alt { animation: bx-fade 200ms ease both; }
  .bx-typing i { animation: none; }
  .q-chev, .q-os, .bx-form button, .bx-sugg button, .bx-alt-row a { transition: none; }
  body { transition: none !important; }
}
@keyframes bx-fade { from { opacity: 0; } }

/* ============================================================
   v2.1 · правки CEO 04.11
   ============================================================ */

/* бегущая строка терминала — зелёным под подписью MASTER KEY: «любой ИИ · ваши правила · ваш контур · методология GOLDJAXE» */
.q-term .vau-status { display: flex; align-items: center; gap: 9px; min-height: 0; margin: 2px 6px 10px; padding: 0; border: 0; background: none; overflow: hidden; white-space: nowrap;
  font-family: 'JetBrains Mono', monospace; font-weight: 700; font-size: 13px; line-height: 1.2; letter-spacing: 0.06em; color: var(--v3-ok); }
.q-term .vau-status .vau-dot-ok { width: 7px; height: 7px; animation: none; box-shadow: none; }
html[dir="rtl"] .q-term .vau-status { letter-spacing: 0; }

/* вкладки «Экосистема · Уровни · B2B» — как в нынешнем таплинке, тихо: подложка, выбранная — светлее и золотом */
.tabs.q-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; margin: 28px 0 12px; padding: 4px; border: 0; border-radius: 14px;
  background: var(--q-surface); box-shadow: inset 0 0 0 1px var(--q-edge); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.q-tabs .tab-btn { min-height: 44px; margin: 0; padding: 0 8px; border: 0; border-radius: 10px; background: transparent; color: var(--q-muted); cursor: pointer;
  font-family: 'JetBrains Mono', monospace; font-weight: 700; font-size: 13px; line-height: 1; letter-spacing: 0.12em; text-transform: uppercase; box-shadow: none;
  transition: background-color 160ms ease, color 160ms ease; -webkit-tap-highlight-color: transparent; }
html[dir="rtl"] .q-tabs .tab-btn { font-family: 'Inter', sans-serif; font-weight: 600; font-size: 15px; letter-spacing: 0; text-transform: none; }
@media (max-width: 374px) { .q-tabs .tab-btn { letter-spacing: 0.08em; padding: 0 4px; } }
.q-tabs .tab-btn::before, .q-tabs .tab-btn::after { display: none; }
.q-tabs .tab-btn.is-active, .q-tabs .tab-btn[aria-selected="true"] { background: rgba(235, 197, 84, 0.12); color: var(--v3-gold); }
[data-theme="light"] .q-tabs .tab-btn.is-active, [data-theme="light"] .q-tabs .tab-btn[aria-selected="true"] { background: rgba(122, 102, 20, 0.10); }
.q-tabs .tab-btn:focus-visible { outline: 2px solid var(--v3-gold); outline-offset: 1px; }
@media (hover: hover) and (pointer: fine) { .q-tabs .tab-btn:not(.is-active):hover { color: var(--q-text); background: var(--q-hover); } }
.q-tabpanel { margin: 0; padding: 0; border: 0; background: none; animation: none; }
.q-tabpanel[hidden] { display: none; }
.q-tabpanel > .q-sub { margin: 4px 4px 10px; }

/* Экосистема «Сначала польза»: домен мелкой подписью под строкой */
.q-dom { margin-top: 1px; font-family: 'JetBrains Mono', monospace; font-weight: 500; font-size: 12px; line-height: 1.3; letter-spacing: 0.02em; color: var(--q-faint); }
html[dir="rtl"] .q-dom { text-align: right; }

/* Связь — визитка: Белла первой, затем WhatsApp · Telegram · канал · почта, «В контакты» и QR */
.q-card { padding: 16px; border-radius: var(--q-r); background: var(--q-surface); box-shadow: inset 0 0 0 1px var(--q-edge); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.q-card-top { display: flex; align-items: center; gap: 12px; padding: 0 2px 14px; }
.q-card-top img { flex: 0 0 auto; width: 44px; height: 44px; object-fit: contain; }
.q-card-id { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
html[dir="rtl"] .q-card-id > * { text-align: right; }
.q-qr-inline { display: none; }
.q-card .q-card-main { margin: 0 -16px; padding-inline: 16px; border-top: 1px solid var(--q-sep); border-bottom: 1px solid var(--q-sep); }
.q-card .q-card-main::before { display: none; }
.q-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 18px 0 0; }
.q-cbtn { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 72px; padding: 12px 4px 11px; border-radius: 14px; box-sizing: border-box;
  box-shadow: inset 0 0 0 1px var(--q-sep); color: var(--q-text); text-decoration: none; text-align: center; font-family: 'Inter', sans-serif; font-weight: 600; font-size: 13px; line-height: 1.15;
  -webkit-tap-highlight-color: transparent; transition: background-color 160ms ease, transform 160ms ease; }
.q-cbtn svg { flex: 0 0 auto; width: 22px; height: 22px; color: var(--v3-gold); }
.q-cbtn:active { transform: scale(0.98); background: var(--q-hover); }
.q-cbtn:focus-visible { outline: 2px solid var(--v3-gold); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { a.q-cbtn:hover { background: var(--q-hover); } }
.q-cbtn.is-soon { color: var(--q-muted); cursor: default; }
.q-cbtn.is-soon svg { color: var(--q-faint); }
.q-cbtn.is-soon { display: flex; }
.q-cbtn small { position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); padding: 3px 8px; border-radius: 999px; white-space: nowrap;
  background: var(--q-sheet); box-shadow: inset 0 0 0 1px var(--q-sep); font-family: 'Inter', sans-serif; font-weight: 600; font-size: 12px; line-height: 1; color: var(--q-muted); }
@media (max-width: 374px) { .q-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 16px; } }
.q-card-save { display: grid; grid-template-columns: minmax(0, 1fr) 52px; gap: 8px; margin: 8px 0 0; }
.q-save { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; border-radius: 14px; background: var(--v3-fill); color: #0A0A0A; text-decoration: none;
  font-family: 'Inter', sans-serif; font-weight: 700; font-size: 15.5px; line-height: 1; -webkit-tap-highlight-color: transparent; transition: transform 160ms ease, filter 160ms ease; }
.q-save svg { width: 22px; height: 22px; }
.q-save:active { transform: scale(0.985); }
.q-save:focus-visible { outline: 2px solid var(--v3-gold); outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) { .q-save:hover { filter: brightness(1.04); } }
.q-qr-btn { display: grid; place-items: center; width: 52px; height: 52px; margin: 0; padding: 0; border: 0; border-radius: 14px; background: transparent; box-shadow: inset 0 0 0 1px var(--v3-line);
  color: var(--v3-gold); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.q-qr-btn:focus-visible { outline: 2px solid var(--v3-gold); outline-offset: 2px; }
html[dir="rtl"] .q-cbtn, html[dir="rtl"] .q-save { font-family: 'Inter', sans-serif; }
/* компьютер: QR виден сразу в углу визитки, кнопка QR не нужна */
@media (min-width: 1024px) and (hover: hover) {
  .q-qr-inline { display: flex; flex-direction: column; align-items: center; gap: 6px; flex: 0 0 auto; margin-inline-start: auto; }
  .q-qr-inline .q-qr-svg { width: 92px; height: 92px; border-radius: 8px; }
  .q-qr-inline > span { font-family: 'Inter', sans-serif; font-size: 12px; line-height: 1.2; color: var(--q-faint); }
  .q-card-save { grid-template-columns: minmax(0, 1fr); }
  .q-qr-btn { display: none; }
}

/* QR на весь экран — показать собеседнику; тёмный модуль на белом, чтобы любая камера прочла */
dialog.q-qrd { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: transparent; color: var(--q-text); }
dialog.q-qrd:not([open]) { display: none; }
dialog.q-qrd::backdrop { background: rgba(0, 0, 0, 0.72); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.q-qrd-box { position: absolute; inset: 0; margin: auto; display: flex; flex-direction: column; align-items: center; gap: 14px; width: min(340px, calc(100% - 32px)); height: fit-content;
  padding: 22px 22px 24px; box-sizing: border-box; border-radius: 22px; background: var(--q-sheet); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5); text-align: center; animation: bx-fade 200ms ease both; }
.q-qrd-box .bx-x { position: absolute; top: 8px; inset-inline-end: 8px; }
.q-qrd-h { margin: 6px 0 0; font-family: 'Space Mono', 'JetBrains Mono', monospace; font-weight: 700; font-size: 22px; letter-spacing: 0.02em; color: var(--v3-gold); }
.q-qrd-code { width: 100%; max-width: 260px; padding: 14px; box-sizing: border-box; border-radius: 16px; background: #fff; }
.q-qrd-code .q-qr-svg { display: block; width: 100%; height: auto; }
.q-qrd-t { margin: 0; max-width: 30ch; font-family: 'Inter', sans-serif; font-size: 15px; line-height: 1.45; color: var(--q-muted); text-wrap: balance; }
.q-qrd-url { margin: 0; font-family: 'JetBrains Mono', monospace; font-size: 13px; letter-spacing: 0.04em; color: var(--q-faint); }

/* каналы: подпись по центру, четыре главные сети и «+4»; раскрыли — все восемь сеткой 4 × 2 */
.q-channels { margin: 36px 4px 10px; text-align: center; font-family: 'Inter', sans-serif; font-weight: 500; font-size: 15px; line-height: 1.4; color: var(--q-muted); }
.social-row.q-social { display: grid; grid-template-columns: repeat(5, 48px); justify-content: center; gap: 8px 14px; margin: 0; flex-wrap: nowrap; }
.q-social .social-btn { width: 48px; min-width: 48px; height: 48px; min-height: 48px; border: 0; border-radius: 50%; background: transparent; color: var(--v3-gold); box-shadow: inset 0 0 0 1px var(--q-sep); }
.q-social .social-btn .social-dot { display: none; }
.q-social .social-btn svg { width: 20px; height: 20px; }
.q-social .q-x { display: none; }
.q-social .q-more { font-family: 'JetBrains Mono', monospace; font-weight: 700; font-size: 13px; letter-spacing: 0.02em; color: var(--q-muted); cursor: pointer; }
.q-social.is-open { grid-template-columns: repeat(4, 48px); }
.q-social.is-open .q-x { display: inline-flex; }
.q-social.is-open .q-more { display: none; }
@media (hover: hover) { .q-social .social-btn:hover { border: 0; background: var(--q-hover); color: var(--v3-gold); box-shadow: inset 0 0 0 1px var(--v3-line); } }
.q-social .social-btn:focus-visible { box-shadow: 0 0 0 2px var(--v3-gold); }

/* подвал — как в нынешнем таплинке: по центру, моноширинным капсом; контраст подписи поднят до AA */
.ls-footer { color: var(--text-muted); }
.ls-footer .ls-footer-legal { justify-content: center; }

/* приглушённое золото (вариант Э2, Артём 28.10) — включается кнопкой на странице сравнения, чтобы попробовать */
html.q-muted:not([data-theme="light"]) .q-ico, html.q-muted:not([data-theme="light"]) .q-cbtn svg, html.q-muted:not([data-theme="light"]) .q-social .social-btn { color: color-mix(in srgb, var(--v3-gold) 58%, #050505); }
html.q-muted:not([data-theme="light"]) .q-chev { color: #68645C; opacity: 1; }
html.q-muted:not([data-theme="light"]) .q-h { color: var(--text-primary); }
html.q-muted:not([data-theme="light"]) a.q-row:hover .q-ico { color: var(--v3-gold); }

/* ============================================================
   «Скоро» во вкладке B2B · вариант C «Свёрнутая строка» · слово CEO 04.11.2026: «вариант С, кому надо, тот раскроет»
   Образец — раздел продуктов главной .org v7 (#os): метка группы моно-капсом и волосяная линия до края,
   у будущих продуктов метка «Скоро» золотом, остальное тише. Пунктир будущих строк .org не взят:
   пунктирные рамки — в списке запрещённых приёмов (goldjaxe-frontend, composition.md)
   ============================================================ */
/* метка группы: одна на группу вместо пяти плашек «Скоро» в строках (composition.md: моно-капс — одна деталь на группу) */
.q-grp { display: flex; align-items: center; gap: 12px; margin: 28px 4px 10px; font-family: 'JetBrains Mono', monospace; font-weight: 500; font-size: 13px;
  line-height: 1.3; letter-spacing: 0.12em; text-transform: uppercase; color: var(--v3-gold); }
.q-grp::after { content: ''; flex: 1 1 auto; min-width: 24px; height: 1px; background: var(--v3-line-soft); }
html[dir="rtl"] .q-grp { font-family: 'Inter', sans-serif; font-weight: 600; font-size: 14px; letter-spacing: 0; text-transform: none; }
/* будущие строки: геометрия прежняя, шеврона нет; значок, имя и описание тише живых; «Скоро» у строки остаётся для чтения с экрана */
.q-later .q-desc { color: var(--q-faint); }
.q-later .q-soon { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; box-shadow: none; }
/* полслоя: живые лежат на подложке и нажимаются, будущие — на подложке вдвое прозрачнее: то, что ещё строится; фон под строками приглушён */
:root { --q-ghost: rgba(18, 17, 15, 0.42); }
[data-theme="light"] { --q-ghost: rgba(255, 255, 255, 0.46); }
.q-later { background: var(--q-ghost); }
/* свёрнутая строка: метка «Скоро · 5» и имена; раскрыли — имена уходят, ниже пять строк; шеврон поворачивается */
.q-fold { margin-top: 20px; }
.q-fold > summary { list-style: none; cursor: pointer; }
.q-fold > summary::-webkit-details-marker { display: none; }
.q-grp-sum { margin: 0; gap: 10px; }
.q-grp-sum::after { display: none; }
.q-n { color: var(--q-muted); }
.q-fold-names { color: var(--q-muted); }
.q-fold-chev svg { transition: transform 200ms cubic-bezier(0.23, 1, 0.32, 1); }
.q-fold[open] .q-fold-chev svg { transform: rotate(180deg); }
.q-fold[open] .q-fold-names { display: none; }
.q-fold[open] > summary { min-height: 52px; }
@media (hover: hover) and (pointer: fine) { .q-fold > summary:hover { background: var(--q-hover); } }
@media (prefers-reduced-motion: reduce) { .q-fold-chev svg { transition: none; } }