/* Гражданство · PF — стили, перенесённые из тренажёров (Александр/Екатерина) для раздела PF в Bairro Vivo.
   Переменные цвета общие с Bairro Vivo. */
.lesson-top { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.lesson-progress { flex: 1; height: 10px; border-radius: 5px; background: var(--linha); overflow: hidden; }
.lesson-progress i { display: block; height: 100%; background: var(--turquesa); border-radius: 5px; transition: width 0.3s ease; }
.mic-btn {
  width: 84px; height: 84px; border-radius: 50%;
  background: var(--coral); color: #fff; font-size: 2rem;
  display: flex; align-items: center; justify-content: center;
  margin: 14px auto 6px;
  box-shadow: var(--sombra);
}
.mic-btn.rec { animation: recpulse 1s infinite; }
.dlg-log { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.dlg-msg { display: flex; gap: 10px; align-items: flex-end; }
.dlg-msg .avatar { width: 40px; height: 40px; flex: none; border-radius: 50%; overflow: hidden; background: var(--verde-suave); }
.dlg-msg .txt {
  background: var(--cartao); border: 1px solid var(--linha);
  border-radius: var(--r-md); border-bottom-left-radius: 4px;
  padding: 10px 14px; max-width: 82%;
}
.dlg-msg.me { flex-direction: row-reverse; }
.dlg-msg.me .txt {
  background: var(--verde); color: #fff; border-color: var(--verde);
  border-bottom-left-radius: var(--r-md); border-bottom-right-radius: 4px;
}
.dlg-msg .ru { font-size: 0.8rem; opacity: 0.75; margin-top: 3px; }
.char-holder svg, .stat-tile .char, .avatar .char {
  animation: char-idle 3.6s ease-in-out infinite;
  transform-origin: 50% 88%;
}
.center { text-align: center; }
.row-between { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 8px 0; }
.chip-row, .filter-row { display: flex; gap: 6px; flex-wrap: wrap; margin: 8px 0; }
.filter-row { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
.filter-row.wrap { flex-wrap: wrap; }
.filter-row .chip, .chip-row .chip { white-space: nowrap; }
.steps { list-style: none; display: flex; flex-direction: column; gap: 10px; }
.steps li { padding-left: 2px; }
.goal-row { display: flex; align-items: center; gap: 14px; }
.ring { --p: 0; width: 64px; height: 64px; flex: none; border-radius: 50%;
  background: conic-gradient(var(--sol) calc(var(--p) * 1%), rgba(255,255,255,.25) 0);
  display: grid; place-items: center; }
.ring span { width: 50px; height: 50px; border-radius: 50%; background: rgba(15,38,31,.75); color: #fff;
  display: grid; place-items: center; font-weight: 800; font-size: .85rem; }
.ring.green { background: conic-gradient(var(--turquesa) calc(var(--p) * 1%), var(--linha) 0); }
.ring.green span { background: var(--cartao); color: var(--texto); }
.skill-bar.wide { width: 100%; margin-top: 8px; }
.sticky-save { position: sticky; bottom: 0; padding: 12px 0 calc(8px + var(--sab)); background: linear-gradient(transparent, var(--fundo) 30%); margin-top: 10px; }
.word-row .wr-ru { display: block; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.toggle-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--linha); }
.toggle-row:last-child { border-bottom: 0; }
.toggle-row input { width: 22px; height: 22px; accent-color: var(--verde); flex: none; }
.seg { display: flex; gap: 6px; flex-wrap: wrap; }
.seg button { flex: 1; min-height: 42px; border: 2px solid var(--linha); background: var(--cartao); border-radius: var(--r-sm); font-weight: 700; font-size: .88rem; padding: 6px 8px; }
.seg button.on { border-color: var(--turquesa); background: var(--verde-suave); color: var(--verde-txt); }
.seg { margin: 6px 0 12px; }
.fld { display: block; font-size: .85rem; color: var(--texto-2); margin-top: 10px; }
.fld .type-input { margin-top: 4px; color: var(--texto); font-size: 1rem; }
.ws-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.intro-pt { font-size: 1.7rem; font-weight: 800; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; color: var(--verde-txt); }
.intro-ru { font-size: 1.15rem; margin-top: 2px; }
.intro-ex { display: flex; gap: 10px; align-items: center; margin-top: 12px; background: var(--verde-suave); padding: 10px; border-radius: var(--r-md); }
.audio-btn.sm { width: 36px; height: 36px; font-size: 1rem; }
.ex-area.ex-in { animation: screen-in .2s ease; }
.pfx [hidden] { display: none !important; }   /* иначе display:flex у .ex-sentence/.chip показывает скрытое */
.ex-sentence { font-size: 1.3rem; font-weight: 700; line-height: 1.4; margin: 10px 0 6px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.ex-sentence mark { background: var(--sol-suave); color: inherit; border-radius: 4px; padding: 0 3px; }
.ex-area .btn-primary { margin-top: 4px; }
.sess-meta { text-align: center; font-weight: 700; color: var(--texto-2); font-size: .9rem; }
.diff-line { font-size: 1.2rem; font-weight: 700; letter-spacing: .03em; word-break: break-word; }
.diff-line.big { font-size: 1.15rem; letter-spacing: 0; line-height: 1.6; }
.w-ok { background: var(--verde-suave); color: var(--verde-txt); border-radius: 5px; padding: 0 3px; }
.w-miss { background: var(--coral-suave); color: var(--pfx-red); border-radius: 5px; padding: 0 3px; text-decoration: underline wavy; }
.result h1 { margin-top: 10px; }
.big-emoji { font-size: 3rem; }
.dlg-msg .avatar { display: grid; place-items: center; font-size: 1.4rem; }
.msg-tools { display: flex; gap: 10px; margin-top: 4px; }
.msg-tools button { font-size: .8rem; color: var(--verde-txt); font-weight: 700; }
.fix-note { align-self: flex-end; max-width: 85%; background: var(--sol-suave); border-radius: var(--r-md); padding: 8px 12px; font-size: .9rem; }
.chat-input { position: sticky; bottom: calc(66px + var(--sab)); background: var(--fundo); padding: 8px 0; display: flex; flex-direction: column; gap: 8px; }
body:not(.with-tabs) .chat-input { bottom: var(--sab); }
.typing .txt { color: var(--texto-2); }
.warn-card { background: var(--sol-suave); border-color: var(--sol); }
.warn-card p { margin-top: 6px; }
.pron-box { margin-top: 10px; }
.pron-res { margin-top: 12px; padding: 14px; border-radius: var(--r-md); background: var(--cartao); border: 1px solid var(--linha); }
.pron-res.ok, .judge.pass { border-color: var(--turquesa); }
.pron-res.close, .judge.weak { border-color: var(--sol); }
.pron-res.wrong, .judge.fail { border-color: var(--coral); }
.pron-top { display: flex; gap: 12px; align-items: center; margin-bottom: 10px; }
.pron-score { min-width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: 1.15rem; background: var(--verde-suave); color: var(--verde-txt); }
/* цвета балла и слов — токены с тёмной версией (были жёсткие #b0402f/#8a6a10: в тёмной теме 2,4:1) */
.fail .pron-score, .wrong .pron-score { background: var(--coral-suave); color: var(--pfx-red); }
.weak .pron-score, .close .pron-score { background: var(--sol-suave); color: var(--pfx-amber); }
.w-ok { color: var(--verde-txt); }
.w-warn { color: var(--pfx-amber); text-decoration: underline dotted; }
.w-bad { color: var(--pfx-red); font-weight: 700; text-decoration: underline; }
.w-miss { color: var(--texto-2); text-decoration: line-through; }
.pron-word { display: flex; gap: 10px; align-items: flex-start; margin-top: 8px; }
.pron-tips { margin: 8px 0 0 18px; }
.agent-row { display: flex; gap: 12px; align-items: flex-start; margin: 10px 0; }
.avatar.big { font-size: 2.6rem; line-height: 1; }
.err-line { padding: 6px 0; border-bottom: 1px dashed var(--linha); }
.better { margin-top: 10px; padding: 10px; border-radius: var(--r-sm); background: var(--verde-suave); }
.better .row-between { gap: 8px; }
.blur { filter: blur(5px); user-select: none; }
.judge { margin-top: 12px; }
@keyframes screen-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
@keyframes recpulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(239, 116, 101, 0.55); }
  50% { box-shadow: 0 0 0 16px rgba(239, 116, 101, 0); }
}
@keyframes char-idle {
  0%, 100% { transform: none; }
  50% { transform: translateY(-1.5px) scaleY(1.015); }
}

/* уровень 1: дата, план, документы, шпаргалка */
.pfx .date-card { display: block; width: 100%; text-align: left; font: inherit; color: inherit; cursor: pointer; border: 2px dashed var(--turquesa); }
.pfx .doc-row a { display: inline-block; margin-top: 4px; color: var(--verde-txt); }
.pfx .print-sheet h1 { font-size: 1.3rem; }
.pfx .ps-row { padding: 8px 0; border-bottom: 1px solid var(--linha); break-inside: avoid; }
.pfx .ps-q { font-weight: 700; font-size: .95rem; }
.pfx .ps-a { margin-top: 2px; }
.pfx .ps-ru { font-size: .85rem; }
@media print {
  #tabbar, .no-print, .toast, .modal-back { display: none !important; }
  body, .screen { background: #fff !important; color: #000 !important; padding: 0 !important; }
  .pfx .print-sheet { font-size: 11pt; }
  .pfx .muted { color: #555 !important; }
}

/* уровень 2: график готовности (из тренажёров) */
.skill-bar.wide { width: 100%; margin-top: 8px; }
.bars { position: relative; display: flex; align-items: flex-end; gap: 4px; height: 150px; padding-bottom: 18px; margin-top: 10px; }
.bar-col { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; position: relative; }
.bar-col i { display: block; width: 100%; max-width: 18px; background: var(--ceu); border-radius: 4px 4px 0 0; min-height: 2px; max-height: 82%; }
.bar-col i.hit { background: var(--turquesa); }
.bar-col span { position: absolute; bottom: -18px; font-size: .65rem; color: var(--texto-2); }
.goal-line { position: absolute; left: 0; right: 0; border-top: 2px dashed var(--sol); }
.goal-line span { position: absolute; right: 0; top: -18px; font-size: .65rem; color: #8a6a10; font-weight: 700; }
.hist-row { display: flex; justify-content: space-between; gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--linha); }
.hist-row:last-child { border-bottom: 0; }

/* главы: путь, узлы, точки уроков, сборка ответа, праздник */
.pfx .ch-path { display: flex; flex-direction: column; gap: 10px; margin: 14px 0; }
.pfx .ch-node { display: flex; gap: 12px; align-items: center; width: 100%; text-align: left; font: inherit; color: inherit; cursor: pointer;
  background: var(--cartao); border: 2px solid var(--linha); border-radius: var(--r-md); padding: 12px; box-shadow: var(--sombra); }
.pfx .ch-node.open { border-color: var(--turquesa); }
.pfx .ch-node.done { background: var(--verde-suave); border-color: var(--verde-suave); }
.pfx .ch-node.locked { border-style: dashed; }
.pfx .ch-node.locked .ch-ico, .pfx .ch-node.locked .ch-dots { opacity: .55; }
.pfx .ch-node .grow { display: flex; flex-direction: column; gap: 4px; }
.pfx .ch-ico { font-size: 1.8rem; width: 44px; text-align: center; }
.pfx .ch-dots { display: flex; gap: 4px; }
.pfx .ch-dots i { width: 18px; height: 6px; border-radius: 3px; background: var(--linha); }
.pfx .ch-dots i.on { background: var(--turquesa); }
.pfx .build-line { min-height: 48px; border-bottom: 2px dashed var(--linha); padding: 6px 0; margin: 8px 0 12px; }
.pfx .answer.right { border-color: var(--turquesa); background: var(--verde-suave); }
.pfx .answer.wrong { border-color: var(--coral); background: var(--coral-suave); }
.pfx .nudge { background: var(--sol-suave); border-color: var(--sol); }
.pfx .nudge p + p { margin-top: 4px; }
.pfx .cta-sub { display: block; font-size: .8rem; font-weight: 600; opacity: .85; margin-top: 2px; }
body.pf-party::after { content: "🎉 🇧🇷 🎊 ⭐ 🎉 🇧🇷 🎊 ⭐"; position: fixed; left: 0; right: 0; top: -40px; text-align: center; font-size: 2rem;
  animation: pfparty 2.4s ease-in forwards; pointer-events: none; z-index: 99; letter-spacing: 10px; }
@keyframes pfparty { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(105vh) rotate(8deg); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { body.pf-party::after { animation: none; display: none; } }

/* картинки раздела: офицер-аватар, баннеры, празднование */
.pfx .agent-img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; object-position: 50% 20%; flex: none; border: 2px solid var(--linha); background: var(--cartao); }
.pfx .agent-img.sm { width: 40px; height: 40px; }
.pfx .agent-img.lg { width: 120px; height: 120px; margin: 0 auto 8px; display: block; }
.pfx .dlg-msg .agent-img.sm { align-self: flex-start; }
.pfx .pf-banner { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--r-lg); margin: 8px 0 12px; box-shadow: var(--sombra); }
.pfx .pf-celebra { display: block; width: min(260px, 70vw); aspect-ratio: 1; object-fit: cover; border-radius: 50%; margin: 6px auto 10px; box-shadow: var(--sombra); }
.pfx .topic-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); gap: 10px; }
.pfx .topic-grid > * { min-width: 0; }
@media (max-width: 340px) { .pfx .topic-grid { grid-template-columns: 1fr; } }
.pfx .pron-right { background: var(--verde-suave); border-radius: var(--r-sm); padding: 8px 10px; margin-bottom: 10px; }

/* адаптация под узкие экраны (тест 320–430px): ряды кнопок переносятся, текст рядом с аватаром сжимается, длинные чипы переносят слова */
.pfx .btn-row { flex-wrap: wrap; }
.pfx .btn-row .btn { flex: 1 1 auto; min-width: 0; white-space: normal; }
.pfx .agent-row .grow, .pfx .row-between > *, .pfx .dlg-msg .txt { min-width: 0; }
.pfx .ex-sentence, .pfx .dlg-msg .txt, .pfx .better b { overflow-wrap: anywhere; }
.pfx .chip-row .chip { white-space: normal; text-align: left; max-width: 100%; }
@media (max-width: 360px) {
  .pfx .btn-row .btn { padding-left: 10px; padding-right: 10px; font-size: .92rem; }
  .pfx .ch-ico { width: 34px; font-size: 1.5rem; }
}

.pfx .big-cta { flex-direction: column; text-align: center; }
/* нижняя панель Bairro Vivo с 6 вкладками на самых узких экранах */
@media (max-width: 359px) {
  #tabbar .tab-btn { font-size: .62rem; letter-spacing: -0.01em; padding-left: 0; padding-right: 0; min-width: 0; }
  #tabbar .tab-btn .ico { font-size: 1.15rem; }
  /* при крупном тексте подпись в 1/6 ширины не помещалась («Практика» 58 px при 53) — значок крупный, подпись мельче */
  :root[data-textsize="large"] #tabbar .tab-btn, :root[data-textsize="xlarge"] #tabbar .tab-btn { font-size: 11px; }
}

/* фразы: строки, текущая при «слушать все», лучшая оценка */
.pfx .phr-row { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid var(--linha); }
.pfx .phr-row:last-child { border-bottom: 0; }
.pfx .phr-row .grow { cursor: pointer; flex: 1; min-width: 0; }
.pfx .phr-row.now { background: var(--verde-suave); border-radius: var(--r-sm); }
.pfx .audio-btn.good { background: var(--verde-suave); color: var(--verde-txt); font-weight: 700; font-size: .85rem; }
.pfx .quick.topic .ch-dots { margin: 4px 0 2px; }
.pfx .chip-row .chip { display: inline-block; }

/* цель дня и скоростной раунд */
.pfx .goal-card { display: block; width: 100%; text-align: left; font: inherit; color: inherit; cursor: pointer; }
.pfx .goal-card .skill-bar { margin-top: 8px; }
.pfx .speed-pic { font-size: clamp(5rem, 28vw, 8rem); text-align: center; line-height: 1.1; margin: 10px 0; }
.pfx .speed-timer { height: 8px; border-radius: 4px; background: var(--linha); overflow: hidden; margin: 6px 0 14px; }
.pfx .speed-timer i { display: block; height: 100%; background: var(--turquesa); transition: width .1s linear; }
/* заголовки уровней на карте глав */
.pfx .lv-head { margin: 18px 0 6px; padding: 10px 12px; border-radius: var(--r-md); background: var(--verde-suave); }
.pfx .lv-head.locked { background: var(--cartao); border: 1px dashed var(--linha); }

/* задания дня */
.pfx .quest-row { display: flex; gap: 10px; align-items: center; padding: 6px 0; }
.pfx .quest-row .grow { flex: 1; min-width: 0; }
.pfx .quests .skill-bar { margin-top: 4px; }

/* лендинг: демо строгости, возможности PF, FAQ */
.strict-demo .demo-pairs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
/* перенос — по словам: .card переносит где угодно (overflow-wrap:anywhere), и на 390 px «pau» рвалось на «pa / u» */
.strict-demo .demo-pairs .btn { min-width: 0; overflow-wrap: normal; }
.faq details { padding: 10px 0; border-bottom: 1px solid var(--linha); }
.faq details:last-child { border-bottom: 0; }
.faq summary { cursor: pointer; }
.faq details p { margin-top: 6px; }
.pf-feats .num { font-size: 1.4rem; }

.pfx .tutor-card { display: flex; gap: 12px; align-items: center; width: 100%; text-align: left; font: inherit; color: inherit; cursor: pointer; border: 2px solid var(--sol); }
.pfx .tutor-card .ico { font-size: 1.6rem; }
.pfx .tutor-card .grow, .pfx .opt .grow { flex: 1; min-width: 0; }

/* живой разговор */
.pfx .live-intro { display: flex; gap: 12px; align-items: flex-start; }
.pfx .live-top { position: sticky; top: 0; z-index: 3; background: var(--fundo); padding-bottom: 4px; }
.pfx .live-stage { text-align: center; margin: 0 0 6px; }
.pfx .live-stage p { margin: 2px 0; }
.pfx .live-ava .agent-img.lg { width: 92px; height: 92px; }
.pfx .live-ava { width: 104px; height: 104px; margin: 0 auto 2px; border-radius: 50%; display: grid; place-items: center; position: relative; }
.pfx .live-ava .agent-img.lg { margin: 0; }
.pfx .live-ava::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 3px solid var(--turquesa); opacity: 0; }
.pfx .live-ava.talk::after { animation: live-ring 1.1s ease-out infinite; }
@keyframes live-ring { 0% { transform: scale(0.92); opacity: 0.9; } 100% { transform: scale(1.18); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .pfx .live-ava.talk::after { animation: none; opacity: 0.9; } }
.pfx .live-left { font-variant-numeric: tabular-nums; font-size: 1.1rem; }
.pfx .live-ctl { position: sticky; bottom: calc(10px + var(--sab, 0px)); background: var(--fundo); padding: 8px 0; }
.pfx .opt .chip { flex: none; align-self: center; }
.pfx .agent-img.talking { animation: talk-pulse 0.9s ease-in-out infinite; border-color: var(--turquesa); }
@keyframes talk-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(32, 165, 138, 0.45); } 50% { box-shadow: 0 0 0 6px rgba(32, 165, 138, 0); } }
@media (prefers-reduced-motion: reduce) { .pfx .agent-img.talking { animation: none; box-shadow: 0 0 0 3px var(--turquesa); } }

/* пальцу удобно (аудит 23.10): фишки ≥ 36 px, слова «Собери» ≥ 42 px, раскрывашки ≥ 36 px */
.pfx .chip-row .chip, .pfx .filter-row .chip { min-height: 36px; display: inline-flex; align-items: center; }
.pfx [data-bank] .chip { min-height: 42px; min-width: 42px; justify-content: center; padding: 8px 12px; font-size: 1rem; }
.pfx details > summary { padding: 8px 0; cursor: pointer; }
.pfx .card a[href]:not(.btn) { display: inline-block; padding: 6px 0; }
.pfx .list-row .wr-ru { display: block; margin-top: 2px; font-weight: 500; }   /* подпись под названием урока/вопроса, а не впритык */
/* плитки тем (Celpe-Bras, фразы): в Bairro Vivo не было стиля .quick — название и подпись слипались в строку */
.pfx .quick { background: var(--cartao); border: 1px solid var(--linha); border-radius: var(--r-md); box-shadow: var(--sombra);
  padding: 12px 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; text-align: center; min-height: 96px; width: 100%; }
.pfx .quick .ico { font-size: 1.5rem; margin-bottom: 2px; }
.pfx .quick b { font-size: .95rem; line-height: 1.25; }
.pfx .quick .tiny { display: block; max-width: 100%; }
.pfx .quick:disabled { opacity: .5; }
.pfx .text-toggle { display: flex; gap: 8px; align-items: center; min-height: 40px; padding: 0 10px; border: 1px solid var(--linha); border-radius: 999px; background: var(--cartao); cursor: pointer; }
.pfx .text-toggle input { width: 20px; height: 20px; }
.pfx .toggle-row input[type=checkbox], .pfx .doc-row input[type=checkbox] { width: 24px; height: 24px; flex: none; accent-color: var(--verde); }
/* сила памяти по вопросу (memory.js) */
.pfx .mem-bar { display: inline-block; width: 34px; height: 6px; border-radius: 3px; background: var(--linha); overflow: hidden; flex: none; align-self: center; }
.pfx .mem-bar i { display: block; height: 100%; background: var(--turquesa); }
.pfx .mem-bar.mid i { background: var(--sol); }
.pfx .mem-bar.low i { background: var(--coral); }
.pfx .review-card { border-color: var(--turquesa); }
.pfx .mem-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 4px 0 10px; }
/* видеозвонок: агент Мендес за столом, губы в такт голосу */
.pfx .vc-frame { position: relative; height: 196px; border-radius: 18px; overflow: hidden; margin: 2px 0 6px;
  background: linear-gradient(180deg, #DCE8E3 0%, #EEF4F1 72%, #C9A97F 72%, #B38E64 100%); }
.pfx .vc-flag { position: absolute; top: 10px; left: 12px; font-size: 1.4rem; }
.pfx .vc-sign { position: absolute; top: 12px; right: 12px; font: 800 .62rem/1 system-ui, sans-serif; letter-spacing: .04em; color: #1F3352; background: #F6C84C; border-radius: 6px; padding: 4px 6px; }
.pfx .vc-char { width: 186px; height: 186px; position: absolute; left: 50%; bottom: -8px; transform: translateX(-50%); }
.pfx .vc-char .eyes { transform-box: fill-box; transform-origin: center; animation: vc-blink 4.6s infinite; }
.pfx .vc-char[data-st="listen"] .head { transform-box: fill-box; transform-origin: 50% 95%; animation: vc-nod 2.4s ease-in-out infinite; }
@keyframes vc-blink { 0%, 95%, 100% { transform: scaleY(1); } 97% { transform: scaleY(.1); } }
@keyframes vc-nod { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-3deg); } }
@media (prefers-reduced-motion: reduce) { .pfx .vc-char .eyes, .pfx .vc-char .head { animation: none; } }
/* штамп решения: DEFERIDO / EM ANÁLISE / INDEFERIDO */
.pfx .stamp-box { text-align: center; margin: 2px 0 12px; }
.pfx .stamp { display: inline-block; font: 900 1.2rem/1 "Courier New", ui-monospace, monospace; letter-spacing: .12em; padding: 8px 14px;
  border: 4px double currentColor; border-radius: 8px; transform: rotate(-7deg); opacity: .9; animation: stamp-in .4s cubic-bezier(.2, 1.6, .4, 1); }
.pfx .stamp.fail { color: var(--pfx-red); }
.pfx .stamp.weak { color: var(--pfx-amber); }
.pfx .stamp.pass { color: var(--verde-txt); }
.pfx .stamp-gloss { margin-top: 6px; }
.pfx .stamp-joke { margin-top: 8px; }
@keyframes stamp-in { from { transform: rotate(-7deg) scale(1.9); opacity: 0; } to { transform: rotate(-7deg) scale(1); opacity: .9; } }
.pfx .vc-mini { display: inline-block; overflow: hidden; background: #DCE8E3; }
.pfx .vc-mini svg { width: 100%; height: 100%; animation: none; }
/* «Мои ошибки» */
.pfx .mist-row { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid var(--linha); }
.pfx .mist-row:last-child { border-bottom: 0; }
.pfx .mist-row .grow { flex: 1; min-width: 0; }
.pfx .mist-was { color: var(--coral-txt); }
.pfx .hub-group { margin: 18px 4px 8px; font-size: .95rem; color: var(--texto-2); }
.pfx .hub-group + .opt-list { margin-top: 0; }

/* ===== «Готовимся вместе» (pair.js) ===== */
/* 👫 Готовимся вместе (js/pf/pair.js) — склеить в pf.css или подключить <link> после pf.css */

/* «ты» — зелёный, партнёр — коралловый; в тёмной теме светлее, иначе тонут на тёмной карточке */
.pfx { --pair-me: var(--verde); --pair-them: #c2412f; }
:root[data-theme="dark"] .pfx { --pair-me: var(--turquesa); --pair-them: var(--coral); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):not([data-theme="dark"]) .pfx { --pair-me: var(--turquesa); --pair-them: var(--coral); } }

/* две буквы внахлёст: «ты» и партнёр */
.pfx .pair-duo { display: inline-flex; flex: none; }
.pfx .pair-duo i { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-weight: 800;
  font-size: 1rem; color: #fff; border: 3px solid var(--cartao); }
.pfx .pair-duo i.a { background: var(--verde); transform: rotate(-6deg); }
.pfx .pair-duo i.b { background: var(--coral); margin-left: -12px; transform: rotate(5deg); }
.pfx .pair-duo.sm i { width: 34px; height: 34px; font-size: .88rem; border-width: 2px; }

/* карточка на главной раздела */
.pfx .pair-home { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; font: inherit; color: inherit; cursor: pointer;
  border: 2px solid var(--ceu); margin-top: 12px; }
.pfx .pair-home .grow { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; overflow-wrap: anywhere; }
.pfx .pair-home.invited { border-color: var(--coral); background: var(--coral-suave); }
.pfx .pair-home.has { flex-direction: column; align-items: stretch; gap: 10px; }
.pfx .pair-line { display: flex; align-items: center; gap: 12px; }
.pfx .pair-flame { font-weight: 800; font-size: 1.15rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pfx .pair-new { display: block; background: var(--sol-suave); border-radius: var(--r-sm); padding: 8px 10px; font-size: .88rem; overflow-wrap: anywhere; }

/* без пары: польза */
.pfx .pair-hero-art { position: relative; height: 90px; margin: 0 0 8px; }
.pfx .pair-ava { position: absolute; top: 10px; width: 74px; height: 74px; border-radius: 50%; display: grid; place-items: center;
  font-size: 1.9rem; font-weight: 800; color: #fff; border: 4px solid var(--cartao); }
.pfx .pair-ava.a { left: 0; background: var(--verde); transform: rotate(-8deg); }
.pfx .pair-ava.b { left: 56px; background: var(--coral); transform: rotate(7deg); }
.pfx .pair-hero-fire { position: absolute; left: 50px; top: 0; font-size: 1.6rem; transform: rotate(-12deg); }
.pfx .pair-why { list-style: none; margin: 12px 0 2px; display: grid; gap: 8px; }
.pfx .pair-hero + .big-cta, .pfx .pair-wait + .big-cta { margin-top: 14px; }
.pfx .big-cta + .btn-soft { margin-top: 10px; }

/* живой код ждёт партнёра */
.pfx .pair-wait { border: 2px dashed var(--sol); margin-top: 12px; }
.pfx .pair-wait .btn { margin-top: 8px; }
.pfx .pair-code-sm { letter-spacing: .12em; white-space: nowrap; font-variant-numeric: tabular-nums; }

/* код в приглашении — как отметка на бумаге */
.pfx .pair-code { display: inline-block; padding: 10px 18px 10px 22px; border: 3px dashed var(--verde); border-radius: 12px;
  background: var(--verde-suave); color: var(--verde-txt); font: 800 2rem/1.1 ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  letter-spacing: .14em; transform: rotate(-2deg); user-select: all; -webkit-user-select: all; }
.pfx .pair-code-in { text-transform: uppercase; text-align: center; letter-spacing: .18em; font: 800 1.5rem/1.2 ui-monospace, "SF Mono", Menlo, Consolas, monospace; }
.pfx .pair-code-in::placeholder { letter-spacing: .18em; opacity: .4; }
.pfx .pair-share a.btn { text-decoration: none; }

/* экран пары */
.pfx .pair-head { display: flex; align-items: center; gap: 12px; }
.pfx .pair-head .grow { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.pfx .pair-fire { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; margin: 14px 0 10px; padding: 12px 14px;
  border-radius: var(--r-md); background: var(--sol-suave); border-left: 5px solid var(--sol); }
.pfx .pair-fire.zero { background: var(--ceu-suave); border-left-color: var(--ceu); }
.pfx .pair-fire-n { font-size: 2.3rem; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.pfx .pair-today { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0; }
.pfx .pair-today .chip { max-width: 100%; overflow-wrap: anywhere; color: var(--texto); }

/* неделя: верхняя точка — ты, нижняя — партнёр; оба — день серии */
.pfx .pair-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; margin: 4px 0 6px; }
.pfx .pw-day { display: flex; flex-direction: column; align-items: center; gap: 5px; padding: 6px 0 8px; border-radius: 10px; border: 1px solid transparent; }
.pfx .pw-day.both { background: var(--sol-suave); border-color: var(--sol); }
.pfx .pw-day.today { border-style: dashed; border-color: var(--texto-2); }
.pfx .pw-day.both.today { border-style: solid; border-color: var(--sol); }
.pfx .pw-dow { font-size: .7rem; font-weight: 700; color: var(--texto-2); }
.pfx .pw-dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; border: 2px solid var(--linha); }
.pfx .pw-dot.me.on { background: var(--pair-me); border-color: var(--pair-me); }
.pfx .pw-dot.them.on { background: var(--coral); border-color: var(--coral); }
.pfx .pw-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; margin-bottom: 10px; }
.pfx .pw-legend span { display: inline-flex; align-items: center; gap: 5px; min-width: 0; overflow-wrap: anywhere; }
.pfx .pw-legend .pw-dot { width: 10px; height: 10px; flex: none; }
.pfx .pw-legend .pw-both::before { content: ""; width: 12px; height: 12px; flex: none; border-radius: 4px; background: var(--sol-suave); border: 1px solid var(--sol); }

/* ты и партнёр — цифры рядом */
.pfx .pair-table { margin: 2px 0 12px; }
.pfx .pt-row { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr); gap: 8px; align-items: center;
  padding: 7px 0; border-bottom: 1px solid var(--linha); }
.pfx .pt-row:last-child { border-bottom: 0; }
.pfx .pt-row > * { min-width: 0; overflow-wrap: anywhere; }
.pfx .pt-head b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pfx .pt-head .me { color: var(--pair-me); }
.pfx .pt-head .them { color: var(--pair-them); }
.pfx .pt-row .v { font-weight: 700; font-variant-numeric: tabular-nums; }
.pfx .pt-row .skill-bar { display: block; width: 100%; max-width: 90px; height: 6px; margin-top: 4px; }

/* подбодрить: три кнопки, значок над словом */
.pfx .pair-cheer-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 6px; }
.pfx .pair-cheer-btn { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 64px; padding: 8px 4px;
  border-radius: var(--r-md); border: 2px solid transparent; background: var(--ceu-suave); color: var(--texto); font: inherit; font-size: .8rem;
  font-weight: 700; line-height: 1.15; text-align: center; cursor: pointer; overflow-wrap: break-word; hyphens: auto; }
.pfx .pair-cheer-btn .e { font-size: 1.45rem; line-height: 1; }
.pfx .pair-cheer-btn:active { transform: scale(.97); }
.pfx .pair-cheer-btn:disabled { opacity: .45; cursor: default; transform: none; }
.pfx .pair-cheer-btn.sent { border-color: var(--sol); animation: pair-pop .5s ease; }
@keyframes pair-pop { 0% { transform: scale(1); } 35% { transform: scale(1.1) rotate(-3deg); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .pfx .pair-cheer-btn.sent { animation: none; } }
.pfx .pair-unlink { margin-top: 8px; font-size: .88rem; }

/* лента подбадриваний */
.pfx .pair-feed h3 { margin-bottom: 4px; }
.pfx .pair-feed-row { display: flex; align-items: flex-start; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--linha); }
.pfx .pair-feed-row:last-child { border-bottom: 0; }
.pfx .pair-feed-row .ico { width: 28px; flex: none; font-size: 1.3rem; text-align: center; }
.pfx .pair-feed-row .grow { flex: 1; min-width: 0; font-size: .92rem; overflow-wrap: anywhere; }
.pfx .pair-feed-row .pf-when { display: block; margin-top: 1px; }
.pfx .pair-feed-row.new b { color: var(--pair-them); }
.pfx .pair-feed-row .chip { flex: none; }

.pfx .pair-more { margin-top: 12px; }
.pfx .pair-privacy { margin: 16px 0 4px; }

/* ===== Celpe-Bras · письменная часть (celpewrite.js) ===== */
/* Гражданство · PF — Celpe-Bras, письменная часть (js/pf/celpewrite.js). Только .pfx .pfw-*, цвета — переменные Bairro Vivo.
   Подключается самим модулем (link на этот файл), можно добавить и в index.html рядом с pf.css. */

/* свои оттенки текста: в светлой теме — как в pf.css, в тёмной — светлее (иначе тёмно-жёлтый на тёмном не читается) */
.pfx { --pfw-warn: #8a6a10; --pfw-bad: #b0402f; --pfw-green: var(--verde); }
:root[data-theme="dark"] .pfx { --pfw-warn: #e2bd5a; --pfw-bad: #f08d7e; --pfw-green: #6fd3b5; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]):not([data-theme="dark"]) .pfx { --pfw-warn: #e2bd5a; --pfw-bad: #f08d7e; --pfw-green: #6fd3b5; } }

/* шапки и списки */
.pfx .pfw-head { flex: 1; min-width: 0; }
.pfx .pfw-head h2 { overflow-wrap: anywhere; }
.pfx .pfw-sec { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin: 18px 2px 8px; }
.pfx .pfw-list, .pfx .pfw-hist { padding: 4px 14px; }
.pfx .pfw-hist h3 { margin: 10px 0 2px; }
.pfx .pfw-list .list-row .grow > span:first-child, .pfx .pfw-hist .list-row .grow > span:first-child { display: block; }
.pfx .pfw-list .arr { color: var(--texto-2); padding: 0 4px; }
.pfx .pfw-badge { flex: none; display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 28px; padding: 2px 8px;
  border-radius: 999px; font-weight: 800; font-size: .85rem; background: var(--verde-suave); color: var(--pfw-green); font-variant-numeric: tabular-nums; }
.pfx .pfw-badge.weak { background: var(--sol-suave); color: var(--pfw-warn); }
.pfx .pfw-badge.fail { background: var(--coral-suave); color: var(--pfw-bad); }
.pfx .pron-score small { font-size: .62rem; font-weight: 700; opacity: .75; margin-left: 1px; }
.pfx .pfw-est { margin-top: 0; }
.pfx .pfw-est .pron-score { min-width: 64px; height: 64px; font-size: 1.02rem; }
.pfx .pfw-levels { width: 100%; border-collapse: collapse; margin-top: 6px; font-size: .85rem; }
.pfx .pfw-levels td { padding: 6px 4px; border-bottom: 1px solid var(--linha); vertical-align: top; }
.pfx .pfw-levels td:first-child { white-space: nowrap; color: var(--texto-2); font-variant-numeric: tabular-nums; padding-right: 10px; }

/* материал: расшифровка, аудио, статья */
.pfx .pfw-mat h3 { line-height: 1.3; }
.pfx .pfw-mat > .small { margin-top: 6px; }
.pfx .pfw-player { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.pfx .pfw-player .btn { width: auto; flex: 1 1 auto; min-height: 44px; }
.pfx .pfw-article .pfw-player { margin-top: 0; flex-wrap: nowrap; }
.pfx .pfw-prog { min-height: 1.2em; margin-top: 6px; }
.pfx .pfw-tr { margin-top: 4px; }
.pfx .pfw-script { display: flex; flex-direction: column; gap: 4px; margin-top: 10px; }
.pfx .pfw-script .pfw-line { padding: 6px 8px; border-radius: var(--r-sm); line-height: 1.5; overflow-wrap: anywhere; transition: background .2s ease; }
.pfx .pfw-who { color: var(--pfw-green); margin-right: 2px; }
.pfx .pfw-title { margin-top: 10px; font-size: 1.08rem; line-height: 1.3; }
.pfx .pfw-sub { margin-top: 14px; font-size: .88rem; line-height: 1.35; color: var(--pfw-green); }
.pfx .pfw-article .pfw-line { margin-top: 10px; line-height: 1.55; border-radius: 4px; overflow-wrap: anywhere; transition: background .2s ease, box-shadow .2s ease; }
.pfx .pfw-line.now { background: var(--sol-suave); }
.pfx .pfw-article .pfw-line.now { box-shadow: 0 0 0 4px var(--sol-suave); }

/* задание */
.pfx .pfw-enun { margin-top: 6px; font-weight: 600; line-height: 1.5; }
.pfx .pfw-task details { margin-top: 4px; }
.pfx .pfw-task details > p { margin-top: 2px; }
.pfx .pfw-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 6px; }
.pfx .pfw-grid > div { background: var(--verde-suave); border-radius: var(--r-sm); padding: 8px 10px; min-width: 0; }
.pfx .pfw-grid span { display: block; }
.pfx .pfw-grid .small { overflow-wrap: anywhere; margin-top: 2px; }
@media (max-width: 420px) { .pfx .pfw-grid { grid-template-columns: 1fr; } }
.pfx .pfw-formulas { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; padding: 8px 12px; border-left: 3px solid var(--turquesa);
  background: var(--verde-suave); border-radius: 0 var(--r-sm) var(--r-sm) 0; }
.pfx .pfw-formulas span { font-size: .9rem; font-style: italic; overflow-wrap: anywhere; }
.pfx .pfw-tries { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; padding: 10px 14px; }
.pfx .pfw-tries .pfw-badge { min-width: 32px; min-height: 26px; }
.pfx .pfw-tries .btn, .pfx .pfw-clear, .pfx .pfw-inline { width: auto; min-height: 36px; padding: 4px 10px; }
.pfx .pfw-inline { display: inline-flex; color: var(--pfw-green); }

/* поле ответа */
.pfx .pfw-text { min-height: 280px; margin-top: 8px; font-size: 1rem; font-weight: 500; line-height: 1.55; resize: vertical; }
.pfx .pfw-countrow { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 36px; margin: 6px 0 10px; }
.pfx .pfw-count { font-size: .85rem; color: var(--texto-2); min-width: 0; }
.pfx .pfw-count.ok { color: var(--pfw-green); font-weight: 600; }
.pfx .pfw-count.mid { color: var(--pfw-warn); }
.pfx .pfw-count.low, .pfx .pfw-count.high { color: var(--pfw-bad); }
.pfx .pfw-clear { flex: none; }
.pfx .pfw-pending { display: flex; gap: 10px; align-items: center; background: var(--ceu-suave); border-radius: var(--r-md); padding: 10px 12px; margin-bottom: 10px; }
.pfx .pfw-spin { width: 22px; height: 22px; flex: none; border-radius: 50%; border: 3px solid var(--linha); border-top-color: var(--turquesa); animation: pfw-spin 1s linear infinite; }
@keyframes pfw-spin { to { transform: rotate(360deg); } }
.pfx .pfw-note { background: var(--sol-suave); border-radius: var(--r-sm); padding: 8px 10px; margin: 0 0 10px; }
.pfx .judge .pfw-note { margin: 8px 0 0; }

/* разбор */
.pfx .pfw-checks { margin-top: 10px; }
.pfx .pfw-crit { padding: 10px 0; border-bottom: 1px solid var(--linha); }
.pfx .pfw-crit:last-of-type { border-bottom: 0; }
.pfx .pfw-crit .row-between { margin: 0; align-items: baseline; }
.pfx .pfw-crit p { margin-top: 6px; }
.pfx .pfw-fix { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-bottom: 1px dashed var(--linha); }
.pfx .pfw-fix:last-child { border-bottom: 0; }
.pfx .pfw-num { flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; font-size: .78rem;
  background: var(--coral-suave); color: var(--pfw-bad); margin-top: 1px; }
.pfx .pfw-fixbody { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.pfx .pfw-pair { display: flex; gap: 8px; align-items: baseline; }
.pfx .pfw-pair > :last-child { min-width: 0; overflow-wrap: anywhere; }
.pfx .pfw-pair b { font-weight: 600; }
.pfx .pfw-tag { flex: none; font-size: .66rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; padding: 2px 6px; border-radius: 6px; }
.pfx .pfw-tag.was { background: var(--coral-suave); color: var(--pfw-bad); }
.pfx .pfw-tag.fix { background: var(--verde-suave); color: var(--pfw-green); }
.pfx .pfw-was { text-decoration: line-through; text-decoration-color: var(--pfw-bad); color: var(--texto-2); }
.pfx .pfw-model { background: var(--verde-suave); border-radius: var(--r-md); padding: 12px 14px; line-height: 1.55; margin-top: 8px; overflow-wrap: anywhere; }
.pfx .pfw-mine summary { min-height: 36px; }
.pfx .pfw-mytext { line-height: 1.6; margin-top: 8px; overflow-wrap: anywhere; }
.pfx .pfw-mark { background: var(--coral-suave); color: inherit; border-radius: 4px; padding: 0 2px; }
.pfx .pfw-mark sup { font-size: .62rem; font-weight: 800; color: var(--pfw-bad); margin-left: 2px; }
.pfx .pfw-actions { margin-top: 12px; }

/* ===== «Мой преподаватель» и «Официальные бумаги» (pf-teacher.css) ===== */
/* «Мой преподаватель» и «Официальные бумаги» (js/pf/teacher.js, js/pf/officialdocs.js) — склеить в pf.css.
   Шторка ответа (.feedback) и листы (sheet) — снаружи экрана, поэтому их содержимое обёрнуто в .pfx. */

/* загрузка файлов */
.pfx .tl-upload { display: flex; gap: 10px; margin: 10px 0 6px; }
.pfx .tl-upload .btn { flex: 1; min-width: 0; padding: 12px 8px; cursor: pointer; }
.pfx .tl-files { display: flex; flex-direction: column; gap: 6px; }
.pfx .tl-file { display: flex; align-items: center; gap: 8px; background: var(--verde-suave); border-radius: var(--r-sm); padding: 2px 2px 2px 10px; font-size: .9rem; }
.pfx .tl-file .grow { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pfx .tl-x { width: 36px; height: 36px; flex: none; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  color: var(--texto-2); background: transparent; font-size: 1rem; cursor: pointer; }
.pfx .tl-x:hover, .pfx .tl-x:focus-visible { background: var(--coral-suave); color: var(--coral); }
.pfx .tl-text { margin-top: 6px; font-size: 1rem; font-weight: 500; }
.pfx .tl-hint, .pfx .od-hint { margin-top: 10px; font-size: 1rem; font-weight: 500; min-height: 48px; }

/* мои занятия */
.pfx .tl-list { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
.pfx .tl-list .card + .card { margin-top: 0; }
.pfx .tl-card { display: block; width: 100%; text-align: left; font: inherit; color: inherit; cursor: pointer; }
.pfx .tl-card .row-between { display: flex; gap: 8px; align-items: flex-start; }
.pfx .tl-title { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.pfx .tl-sub { display: block; margin-top: 2px; overflow-wrap: anywhere; }
.pfx .tl-card .chip { flex: none; }
.pfx .tl-mem { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.pfx .tl-mem .skill-bar { flex: 1; width: auto; }
.pfx .tl-due { margin-top: 12px; }
.pfx .tl-draft { margin-bottom: 12px; }
.pfx .tl-empty { margin-top: 12px; }
.pfx .tl-empty-ico { font-size: 2.4rem; text-align: center; margin-bottom: 6px; }
.pfx .tl-what, .pfx .od-what { list-style: none; margin: 10px 0; display: grid; gap: 6px; }
.pfx .tl-what li { font-size: .95rem; }
.pfx .od-what li { font-size: .92rem; padding-left: 18px; position: relative; }
.pfx .od-what li::before { content: "✓"; position: absolute; left: 0; color: var(--turquesa); font-weight: 800; }

/* ожидание фоновой задачи */
.pfx .tl-wait { padding: 6vh 8px 18px; }
.pfx .tl-spin { font-size: 3rem; display: inline-block; animation: tl-bob 1.6s ease-in-out infinite; }
@keyframes tl-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@media (prefers-reduced-motion: reduce) { .pfx .tl-spin { animation: none; } }
.pfx .tl-stage { font-weight: 700; margin-top: 12px; overflow-wrap: anywhere; }

/* проверка найденных слов */
.pfx .tl-rows { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.pfx .tl-rev { background: var(--cartao); border: 1px solid var(--linha); border-radius: var(--r-md); padding: 6px 6px 8px 8px; }
.pfx .tl-rev.unc { background: var(--sol-suave); border-color: var(--sol); }
.pfx .tl-rev-top { display: flex; align-items: center; gap: 4px; }
.pfx .tl-rev input, .pfx .tl-rev select { width: 100%; min-width: 0; min-height: 40px; border: 1px solid transparent; background: transparent;
  color: var(--texto); padding: 6px; border-radius: 8px; font: inherit; }
.pfx .tl-rev input:focus, .pfx .tl-rev select:focus { border-color: var(--turquesa); outline: none; background: var(--fundo); }
.pfx .tl-rev .tl-pt { flex: 1; font-weight: 700; font-size: 1.05rem; }
.pfx .tl-rev-ru { display: flex; align-items: center; gap: 6px; }
.pfx .tl-rev .tl-ru { flex: 1; color: var(--texto-2); }
.pfx .tl-rev-ru select { flex: none; width: auto; max-width: 42%; font-size: 1rem; color: var(--texto-2); border: 1px solid var(--linha); }
.pfx .tl-meta { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 2px; }
.pfx .tl-meta .chip { white-space: normal; }
.pfx .tl-ctx { flex-basis: 100%; overflow-wrap: anywhere; padding: 0 6px; }
.pfx .tl-unc-mark { background: var(--sol-suave); padding: 0 4px; border-radius: 4px; }
.pfx .tl-mat { margin-top: 12px; }
.pfx .tl-mat summary, .pfx .tl-text-card summary, .pfx .od-paste summary { cursor: pointer; min-height: 36px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.pfx .tl-material { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .82rem; color: var(--texto-2); margin-top: 8px; max-height: 300px; overflow: auto; font-family: inherit; }
.pfx .sticky-save .btn-plain { margin-top: 4px; }

/* занятие */
.pfx .tl-word { display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--linha); }
.pfx .tl-word:last-child { border-bottom: 0; }
.pfx .tl-word-main { flex: 1; min-width: 0; min-height: 48px; padding: 6px 0; display: flex; flex-direction: column; justify-content: center;
  text-align: left; font: inherit; color: inherit; background: transparent; cursor: pointer; }
.pfx .tl-word-main b, .pfx .tl-word-main span { overflow-wrap: anywhere; }
.pfx .tl-new { flex: none; font-size: .72rem; color: var(--texto-2); }
.pfx .tl-del { margin-top: 14px; color: var(--coral-txt); }
.pfx .tl-text-card { margin-top: 12px; }
.pfx .tl-ltext { line-height: 1.9; margin-top: 8px; }
.pfx .tl-lt { display: inline; text-align: left; padding: 2px 3px; border-radius: 6px; font: inherit; color: inherit; background: transparent; cursor: pointer; }
.pfx .tl-lt:hover, .pfx .tl-lt:focus-visible { background: var(--sol-suave); }
.pfx .tl-sheet-pt { overflow-wrap: anywhere; min-width: 0; }
.pfx .tl-sent { display: flex; gap: 10px; align-items: flex-start; padding: 8px 0; border-bottom: 1px solid var(--linha); }
.pfx .tl-sent:last-child { border-bottom: 0; }
.pfx .tl-sent .grow { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.pfx .tl-sent mark, .pfx .ex-sentence mark { background: var(--sol-suave); color: inherit; border-radius: 4px; padding: 0 2px; }

/* упражнения */
.pfx .tl-ctl { flex-wrap: nowrap; }
.pfx .tl-ctl .btn { width: auto; flex: 1 1 0; min-width: 0; padding-left: 6px; padding-right: 6px; font-size: .9rem; }
.pfx .tl-intro-pt { overflow-wrap: anywhere; min-width: 0; }
.pfx .tl-acc { display: flex; gap: 4px; flex-wrap: wrap; margin: 8px 0 2px; }
.pfx .tl-acc button { min-width: 36px; height: 36px; border-radius: 8px; background: var(--cartao); border: 1px solid var(--linha); font-weight: 700; color: var(--texto); cursor: pointer; }
.pfx .tl-blank { display: inline-block; min-width: 64px; border-bottom: 3px solid var(--sol); color: transparent; }
.pfx .tl-diff { display: grid; gap: 6px; background: var(--fundo); border-radius: var(--r-md); padding: 8px 10px; margin: 6px 0; }
.pfx .tl-diff-line { font-size: 1.15rem; font-weight: 700; letter-spacing: .02em; overflow-wrap: anywhere; }
.pfx .tl-d-bad { color: #fff; background: var(--coral); border-radius: 3px; }
.pfx .tl-d-miss { color: #fff; background: var(--turquesa); border-radius: 3px; }
.pfx .tl-d-gap { color: var(--coral-txt); }
.pfx .tl-fbw { display: flex; gap: 10px; align-items: center; margin-top: 8px; }
.pfx .tl-fbw > div { min-width: 0; overflow-wrap: anywhere; }
.pfx .tl-self { margin-top: 10px; }

/* официальные бумаги */
.pfx .od-title { overflow-wrap: anywhere; min-width: 0; }
.pfx .od-sub { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pfx .od-urg { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 6px 12px; font-weight: 800; font-size: .9rem; margin-bottom: 10px; }
.pfx .od-urg.high { background: var(--coral-suave); color: #b0402f; }
.pfx .od-urg.medium { background: var(--sol-suave); color: #8a6a10; }
.pfx .od-urg.low { background: var(--verde-suave); color: var(--verde-txt); }
.pfx .od-list, .pfx .od-steps { margin: 8px 0 0 20px; display: grid; gap: 6px; overflow-wrap: anywhere; }
.pfx .od-steps li::marker { font-weight: 800; color: var(--verde-txt); }
.pfx .od-date { display: flex; gap: 10px; align-items: flex-start; padding: 8px 0; border-bottom: 1px dashed var(--linha); }
.pfx .od-date:last-child { border-bottom: 0; }
.pfx .od-date .grow { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.pfx .od-date .chip { margin-left: 2px; vertical-align: middle; }
.pfx .od-quote { margin-top: 2px; font-style: italic; }
.pfx .od-gl { display: flex; gap: 10px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--linha); }
.pfx .od-gl:last-of-type { border-bottom: 0; }
.pfx .od-gl .grow { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.pfx .od-paste { margin-top: 10px; }
.pfx .od-paste .type-input { margin-top: 6px; font-size: 1rem; font-weight: 500; }

:root[data-theme="dark"] .pfx .od-urg.high { color: #ffb4a8; }
:root[data-theme="dark"] .pfx .od-urg.medium { color: #f3d27a; }
:root[data-theme="dark"] .pfx .od-urg.low { color: #8fd8bf; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not([data-theme="dark"]) .pfx .od-urg.high { color: #ffb4a8; }
  :root:not([data-theme="light"]):not([data-theme="dark"]) .pfx .od-urg.medium { color: #f3d27a; }
  :root:not([data-theme="light"]):not([data-theme="dark"]) .pfx .od-urg.low { color: #8fd8bf; }
}

/* ===== «Истории на слух» (pf-stories.css) ===== */
/* «Истории на слух» (js/pf/stories.js): список, слушание диалога, вопросы, слова, итог.
   Экран живёт внутри <main class="screen pfx">, поэтому всё под .pfx.
   Листок обратной связи runLesson добавляется прямо в <body> — его части оформлены отдельно: .feedback .st-… */

/* ---------- список ---------- */
.pfx .st-sum .skill-bar { margin-top: 8px; }
.pfx .st-seg { margin: 4px 0 12px; }
.pfx .st-seg button { min-height: 44px; }
.pfx .st-row .chip { padding: 1px 8px; font-size: .72rem; vertical-align: 1px; }
.pfx .st-row .wr-ru { display: block; }
.pfx .st-best { flex: none; align-self: center; font-weight: 800; font-size: .76rem; color: var(--verde-txt); background: var(--verde-suave); border-radius: 999px; padding: 4px 8px; white-space: nowrap; }
.pfx .st-sum .row-between { flex-wrap: wrap; gap: 2px 10px; }

/* ---------- слушание ---------- */
.pfx .st-hint { margin-bottom: 12px; }
.pfx .st-log { gap: 12px; margin-bottom: 14px; }
.pfx .st-line { align-items: flex-start; scroll-margin: 90px 0 var(--st-bar-h, 170px); }   /* запас снизу — под липкую панель; высоту панели ставит stories.js */
.pfx .st-line .avatar { margin-top: 2px; }
.pfx .st-line.c0 .avatar { background: var(--verde-suave); }
.pfx .st-line.c1 .avatar { background: var(--sol-suave); }
.pfx .st-line.c2 .avatar { background: var(--ceu-suave); }
.pfx .st-line.c3 .avatar { background: var(--coral-suave); }
.pfx .st-line .txt { flex: 0 1 auto; max-width: calc(100% - 52px); min-width: min(9.5rem, calc(100% - 52px)); padding: 6px 12px 8px; transition: box-shadow .15s ease, border-color .15s ease; }
.pfx .st-line.now .txt { border-color: var(--turquesa); box-shadow: 0 0 0 3px rgba(32, 165, 138, .45); }
.pfx .st-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.pfx .st-who { font-size: .76rem; font-weight: 800; letter-spacing: .02em; opacity: .85; }
.pfx .st-head .audio-btn { margin: -2px -8px -2px 0; }
.pfx .st-body { display: block; width: 100%; min-height: 36px; padding: 2px 0 0; text-align: left; font: inherit; color: inherit; cursor: pointer; }
.pfx .st-pt { display: block; overflow-wrap: anywhere; transition: filter .2s ease; }
.pfx .st-pt.blur { filter: blur(6px); }
.pfx .st-ru { display: block; margin-top: 4px; overflow-wrap: anywhere; }

/* панель плеера: липнет к низу экрана, пока диалог длиннее экрана */
.pfx .st-bar { position: sticky; bottom: calc(8px + var(--sab, 0px)); z-index: 4; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; padding: 10px;
  background: var(--cartao); border: 1px solid var(--linha); border-radius: var(--r-lg); box-shadow: var(--sombra-up); }
.pfx .st-bar .btn { min-height: 46px; padding: 8px 6px; font-size: .86rem; line-height: 1.2; white-space: normal; overflow-wrap: anywhere; }
.pfx .st-bar .btn:not(.st-play) { flex-direction: column; gap: 0; }
.pfx .st-bar .btn span[aria-hidden] { font-size: 1.2rem; line-height: 1.15; }
.pfx .st-bar .st-play { grid-column: 1 / -1; font-size: 1rem; }
@media (max-width: 339px) {
  .pfx .st-bar { gap: 6px; padding: 8px; }
  .pfx .st-bar .btn { min-height: 42px; padding: 4px 2px; font-size: .74rem; }
}
:root[data-textsize="large"] .pfx .st-bar, :root[data-textsize="xlarge"] .pfx .st-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
:root[data-textsize="large"] .pfx .st-bar .btn:last-child, :root[data-textsize="xlarge"] .pfx .st-bar .btn:last-child { grid-column: 1 / -1; }
:root[data-textsize="large"] .pfx .st-bar .btn:not(.st-play), :root[data-textsize="xlarge"] .pfx .st-bar .btn:not(.st-play) { font-size: .8rem; }
.pfx .st-bar .btn[aria-pressed="true"] { background: var(--verde); color: #fff; }
/* «мягкие» кнопки читаются и на тёмной теме (там --verde слишком тёмный для текста) */
.pfx.st-screen .btn-soft, .pfx .st-ear .btn-soft { color: var(--texto); }
.pfx .st-bar .btn-soft[aria-pressed="true"] { color: #fff; }

/* ---------- вопросы ---------- */
.pfx .st-q { font-size: 1.15rem; line-height: 1.35; margin: 4px 0 12px; }
.pfx .st-ear .btn { flex: 1 1 0; min-height: 44px; padding: 8px 8px; font-size: .86rem; }
.feedback .st-quote { display: flex; gap: 10px; align-items: flex-start; margin: 8px 0; padding: 8px 10px; border-radius: var(--r-sm); background: var(--verde-suave); }
.feedback .st-quote .grow { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.feedback .st-qpt { font-weight: 700; font-style: italic; }
.feedback .st-why { margin-top: 4px; }

/* ---------- слова ---------- */
.pfx .st-word { display: flex; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--linha); }
.pfx .st-word:last-child { border-bottom: 0; }
.pfx .st-word .grow { flex: 1; min-width: 0; overflow-wrap: anywhere; }

/* ---------- итог ---------- */
.pfx .st-acc { font-size: 2.6rem; font-weight: 800; line-height: 1.1; color: var(--verde-txt); margin: 6px 0 0; }
.pfx .st-trl { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid var(--linha); }
.pfx .st-trl:last-child { border-bottom: 0; }
.pfx .st-trl .grow { flex: 1; min-width: 0; overflow-wrap: anywhere; }

/* ===== «Диктант» и «Глаголы» (pf-drills.css) ===== */
/* Гражданство · PF — тренажёры «Диктант» (dx-) и «Глаголы» (vx-). Подключается сам из js/pf/dictation.js,
   если в index.html нет ссылки. Цвета — переменные Bairro Vivo; свои оттенки текста — с тёмной темой. */
:root { --pfx-amber: #7d600e; --pfx-red: #b0402f; --pfx-blue: #2b6d8c; }
:root[data-theme="dark"] { --pfx-amber: #f2d47a; --pfx-red: #f4a496; --pfx-blue: #8ccde8; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]):not([data-theme="dark"]) { --pfx-amber: #f2d47a; --pfx-red: #f4a496; --pfx-blue: #8ccde8; }
}

/* ---------- диктант: ввод и кнопки букв ---------- */
.pfx .dx-in { margin-top: 10px; font-size: 1.15rem; line-height: 1.4; }
.pfx textarea.dx-in { resize: vertical; min-height: 64px; }
.pfx .dx-keys { display: grid; grid-template-columns: repeat(auto-fill, minmax(38px, 1fr)); gap: 6px; margin: 8px 0 10px; }
.pfx .dx-key { min-height: 38px; border: 1px solid var(--linha); border-radius: 10px; background: var(--cartao); color: var(--texto);
  font-size: 1.08rem; font-weight: 700; line-height: 1; touch-action: manipulation; }
.pfx .dx-key:active { background: var(--verde-suave); }
.pfx .dx-count { margin: -2px 2px 8px; }
.pfx .dx-mean { margin: -2px 0 8px; color: var(--texto-2); }
.pfx .btn-row.dx-play .btn { width: auto; flex: 1 1 0; }
.pfx .dx-result + .card { margin-top: 14px; }
.pfx .dx-best { flex: none; font-size: .8rem; font-weight: 800; color: var(--verde-txt); background: var(--verde-suave); border-radius: 999px; padding: 3px 9px; }
.pfx .dx-chip b { font-size: 1.05rem; }

/* ---------- разбор в нижней панели урока ---------- */
.pfx.dx-fb { max-height: min(46vh, 430px); overflow-y: auto; overscroll-behavior: contain; margin-bottom: 10px; }
.pfx .dx-lab { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 4px; }
.pfx .dx-line { font-size: 1.12rem; font-weight: 600; line-height: 1.75; overflow-wrap: anywhere; margin: 2px 0 6px; }
.pfx .dx-line.dx-good { color: var(--verde-txt); }
.pfx .dx-typed { font-weight: 500; }
.pfx .dx-w { border-radius: 5px; padding: 0 1px; }
.pfx .dx-dia { background: var(--sol-suave); }
.pfx .dx-bad { background: var(--coral-suave); }
.pfx .dx-add { background: var(--verde-suave); outline: 1.5px dashed var(--turquesa); outline-offset: 1px; padding: 0 3px; }
.pfx .dx-extra { color: var(--pfx-red); text-decoration: line-through; text-decoration-thickness: 2px; }
.pfx .dx-gap { color: var(--pfx-red); font-weight: 800; padding: 0 2px; }
.pfx .dx-ch { color: var(--pfx-red); font-weight: 800; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.pfx .dx-ch.dia { color: var(--pfx-amber); }
.pfx .dx-errs { list-style: none; margin: 8px 0 0; padding: 0; }
.pfx .dx-errs li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 5px 0; border-bottom: 1px dashed var(--linha); font-size: .95rem; }
.pfx .dx-errs li:last-child { border-bottom: 0; }
.pfx .dx-errs s { color: var(--texto-2); }
.pfx .dx-ew { min-width: 0; overflow-wrap: anywhere; }
.pfx .dx-ek { flex: none; font-size: .72rem; font-weight: 700; border-radius: 999px; padding: 2px 8px; background: var(--coral-suave); color: var(--pfx-red); white-space: nowrap; }
.pfx .dx-ek.dia { background: var(--sol-suave); color: var(--pfx-amber); }
.pfx .dx-tip { margin-top: 8px; background: var(--ceu-suave); border-radius: var(--r-sm); padding: 6px 10px; }
.pfx .dx-ru { margin-top: 4px; }
.pfx .dx-fixrow, .pfx .vx-missrow { padding: 6px 0; border-bottom: 1px dashed var(--linha); overflow-wrap: anywhere; }
.pfx .dx-fixrow:last-child, .pfx .vx-missrow:last-of-type { border-bottom: 0; }
.pfx .dx-fixrow s { color: var(--texto-2); }
/* «почти»: только знаки — панель жёлтая, без красного */
.feedback.bad.pfx-almost { border-top-color: var(--sol); }

/* ---------- глаголы: экран выбора ---------- */
.pfx .vx-h { margin: 16px 2px 6px; font-size: .95rem; color: var(--texto-2); }
.pfx .seg.vx-grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pfx .seg.vx-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pfx .seg.vx-grid3 button, .pfx .seg.vx-grid2 button { min-height: 48px; line-height: 1.2; hyphens: manual; }
.pfx .seg.vx-grid3 button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; }
.pfx .seg.vx-grid3 button .tiny { font-weight: 600; color: var(--texto-2); }
.pfx .vx-tenses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.pfx .vx-tg { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-height: 58px; padding: 8px 10px; text-align: left;
  border: 2px solid var(--linha); border-radius: var(--r-sm); background: var(--cartao); }
.pfx .vx-tg-h { font-weight: 800; font-size: .92rem; }
.pfx .vx-tg .tiny { color: var(--texto-2); line-height: 1.3; }
.pfx .vx-tg.on { border-color: var(--turquesa); background: var(--verde-suave); }
.pfx .vx-tg.on .vx-tg-h { color: var(--verde-txt); }
.pfx .vx-tg.on .vx-tg-h::after { content: " ✓"; }
.pfx .vx-badge { flex: none; font-size: .75rem; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: var(--verde-suave); color: var(--verde-txt); }
.pfx .vx-badge.irr { background: var(--sol-suave); color: var(--pfx-amber); }

/* ---------- глаголы: задания ---------- */
.pfx .vx-ask { padding: 14px 16px; }
.pfx .vx-ask-row { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 10px; }
.pfx .vx-pr { background: var(--ceu-suave); color: var(--pfx-blue); border-radius: 999px; padding: 2px 10px; font-weight: 700; font-size: .9rem; }
.pfx .vx-inf { font-size: 1.5rem; overflow-wrap: anywhere; }
.pfx .vx-tense { display: inline-block; margin-top: 8px; background: var(--sol-suave); color: var(--pfx-amber); border-radius: 10px; padding: 4px 10px; font-size: .88rem; }
.pfx .vx-line { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.pfx .vx-line .type-input { flex: 1; min-width: 0; margin-top: 0; }
.pfx .vx-pron { font-weight: 800; font-size: 1.05rem; white-space: nowrap; }
.pfx .vx-sent { display: block; }
.pfx .vx-blank { color: var(--turquesa); letter-spacing: 1px; font-weight: 800; }
.pfx .vx-fill { background: var(--verde-suave); color: var(--verde-txt); border-radius: 6px; padding: 0 4px; }
.pfx .vx-inf-hint { font-size: .95rem; font-weight: 600; }
.pfx .vx-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.pfx .vx-two .answer { justify-content: center; text-align: center; font-size: 1.1rem; }
.pfx .vx-rule { margin-top: 12px; }
.pfx .vx-row { margin-top: 8px; color: var(--texto-2); line-height: 1.6; }
.pfx .vx-row .on { color: var(--texto); font-weight: 800; }
.pfx .vx-peek { display: flex; align-items: center; justify-content: center; min-height: 40px; flex: 1 1 auto; }

/* ---------- таблицы спряжений ---------- */
.pfx .vx-th { margin-bottom: 4px; }
.pfx .vx-ex { background: var(--verde-suave); border-radius: var(--r-md); padding: 10px 12px; margin: 8px 0 4px; }
.pfx .vx-ex .row-between { margin: 0 0 2px; }
.pfx .vx-tb { padding: 10px 0; border-bottom: 1px solid var(--linha); }
.pfx .vx-tb:last-of-type { border-bottom: 0; }
.pfx .vx-tb .row-between { margin: 0; }
.pfx .vx-tb.ref .vx-f { font-weight: 600; }
.pfx .vx-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 4px 12px; margin-top: 6px; align-items: center; }
.pfx .vx-p { color: var(--texto-2); font-size: .85rem; }
.pfx .vx-f { font-weight: 700; justify-self: start; overflow-wrap: anywhere; }
.pfx .vx-f.irr { background: var(--sol-suave); color: var(--pfx-amber); border-radius: 6px; padding: 0 6px; }
.pfx .vx-list .list-row .grow { overflow-wrap: anywhere; }

/* ===== QA 24.10 ===== */
.pfx .lesson-top .grow { flex: 1; min-width: 0; }                       /* полоса прогресса урока была 0 px */
.pfx .msg-tools button { min-height: 44px; min-width: 44px; padding: 4px 12px; border-radius: 999px; }
.pfx button.chip { min-height: 40px; }
.pfx .chip.on { background: var(--verde); color: #fff; }                 /* выбранный фильтр отличим */
.pfx .pron-score small { opacity: .95; }
/* иллюстрации разделов (локальный Codex, стиль раздела) — баннер под заголовком */
.pfx .sec-hero { display: block; width: 100%; height: 150px; object-fit: cover; border-radius: var(--r-lg); margin: 0 0 12px; background: var(--verde-suave); }
@media (min-width: 600px) { .pfx .sec-hero { height: 210px; } }
.pfx .top3 h3 { margin-bottom: 6px; }
.pfx .top3-row { padding: 8px 0; border-bottom: 1px solid var(--linha); }
.pfx .top3-row:last-of-type { border-bottom: 0; }
/* узкий экран и крупный текст: шапка «Шпаргалки» переносит кнопку печати под заголовок (была прокрутка вбок),
   чипы фильтра «Все · 15» не рвутся, а переходят на новую строку, три группы глаголов — столбиком */
.pfx .topline:has([data-print]) { flex-wrap: wrap; }
.pfx .st-seg button { white-space: nowrap; }
:root[data-textsize="xlarge"] .pfx .seg.vx-grid3 { grid-template-columns: minmax(0, 1fr); }