/* Дополнения к макетам: то, что появилось при переносе в WordPress. */

html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;min-height:100vh}
.pg{overflow-x:clip}
[hidden]{display:none!important}

/* Тема: иконка луны в светлой теме, солнца – в тёмной. */
.ibtn__sun,.ibtn__moon{display:inline-flex}
.ibtn__sun{display:none}
.dark .ibtn__sun{display:inline-flex}
.dark .ibtn__moon{display:none}

/* Мобильное меню: строка «Тёмная тема» – кнопка. */
.sheet button.row{width:100%;border:0;font:inherit;color:inherit;cursor:pointer;text-align:left}
.sheet a.it{text-decoration:none}
@media (min-width:1180px){.page.menu-open .sheet{display:none}}

/* Плашка cookie: компактная строка внизу, не закрывает текст. */
.ck{position:fixed;left:24px;bottom:24px;z-index:50;display:flex;align-items:center;gap:12px;max-width:440px;padding:10px 10px 10px 18px;border-radius:20px 20px 20px 6px;background:var(--surface);color:var(--ink);box-shadow:0 0 0 1px var(--line),0 12px 32px rgba(22,22,29,.14);font:400 14px/20px var(--font-text)}
.ck[hidden]{display:none}
.dark .ck{box-shadow:0 0 0 1px var(--line),0 12px 32px rgba(0,0,0,.5)}
.ck__t{margin:0;color:var(--ink-secondary)}
.ck__t b{font-weight:600;color:var(--ink)}
.ck__t a{color:var(--cobalt);text-underline-offset:3px}
.ck__ok{flex:none;min-height:40px;padding:0 18px;border:0;border-radius:999px;background:var(--cobalt);color:var(--on-cobalt);font:600 15px/20px var(--font-text);cursor:pointer}
.ck__ok:hover{background:var(--cobalt-strong)}
.ck__ok:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
@media (max-width:640px){.ck{left:8px;right:8px;bottom:8px;max-width:none;padding:8px 8px 8px 14px;font-size:13px;line-height:18px}}

/* Закреплённая шапка. */
:root{--hh:64px}
@media (min-width:641px){:root{--hh:72px}}
@media (min-width:1180px){:root{--hh:80px}}
html{scroll-padding-top:calc(var(--hh) + 16px)}
.header{position:sticky;top:0;z-index:40}
.fbar{top:var(--hh)}
.toc{top:calc(var(--hh) + var(--space-5))}
.gside{top:calc(var(--hh) + var(--space-6))}
.saside,.spside{top:calc(var(--hh) + var(--space-5))}
.page.menu-open .sheet{position:fixed;left:0;right:0;top:var(--hh);z-index:39;max-height:calc(100dvh - var(--hh));overflow:auto;box-shadow:0 16px 32px rgba(22,22,29,.12)}
@media (max-width:420px){.header__row{gap:var(--space-2)}.logo svg{height:24px}.header__actions{gap:0}.header .burger{margin-left:8px}.header .icon-btn,.header .ibtn:not(.burger){width:40px;height:40px}.burger{padding:0 12px;gap:6px;font-size:15px}}

/* Кнопка «Наверх»: появляется, когда листают назад, и прячется сама. */
.totop{position:fixed;right:16px;bottom:16px;z-index:45;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:var(--surface);color:var(--ink);box-shadow:0 0 0 1px var(--line),0 6px 18px rgba(22,22,29,.12);cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity 200ms ease,transform 200ms ease,visibility 0s linear 200ms}
.totop .icon{transform:rotate(-90deg)}
.totop.is-on{opacity:.92;visibility:visible;transform:none;transition:opacity 200ms ease,transform 200ms ease}
.totop:hover{opacity:1;color:var(--cobalt)}
.ck-on .totop{bottom:76px}
@media (min-width:1025px){.totop{right:24px;bottom:24px}.ck-on .totop{bottom:24px}}
@media (prefers-reduced-motion:reduce){.totop{transition:none}}

/* Картинки вместо заглушек. */
.post__img img,.art-cover img,.acover img,.pcard__photo img,.xp__photo img,.cover img,.book__stage img{display:block;width:100%;height:100%;object-fit:cover}
.post__img,.acover,.pcard__photo,.xp__photo{position:relative;overflow:hidden}
.acover img{position:absolute;inset:0}
.pcard__photo img{position:absolute;inset:0}
.book__stage .cover--img{padding:0;overflow:hidden}
.book__stage .cover--img img{height:100%;object-fit:cover}

/* Видео YouTube. */
.vid__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.85}
.vid__frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,0) 40%,rgba(0,0,0,0) 70%,rgba(0,0,0,.45))}
.vid__play,.vid__title,.vid__src{z-index:1}
.vid__iframe{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:var(--radius-l)}

/* Текст из редактора WordPress внутри .prose. */
.prose>*,.chapter>*{min-width:0}
.prose a{color:var(--cobalt);text-underline-offset:3px}
.prose a:hover{color:var(--cobalt-strong)}
.prose strong{font-weight:600}
.prose h4{font:600 20px/28px var(--font-text);margin-top:var(--space-2)}
.prose h5,.prose h6{font:600 17px/26px var(--font-text)}
.prose ol:not(.steps):not(.is-style-steps):not(.tform):not(.toc__list){display:grid;gap:var(--space-3);counter-reset:li;padding:0}
.prose ol:not(.steps):not(.is-style-steps):not(.tform):not(.toc__list)>li{position:relative;padding-left:36px;counter-increment:li;list-style:none}
.prose ol:not(.steps):not(.is-style-steps):not(.tform):not(.toc__list)>li::before{content:counter(li);position:absolute;left:0;top:2px;display:grid;place-items:center;width:26px;height:26px;border-radius:9px 9px 9px 3px;background:var(--cobalt-soft);color:var(--cobalt-strong);font:600 13px/1 var(--font-display)}
.prose li>ul,.prose li>ol{margin-top:var(--space-3)}
.prose img{max-width:100%;height:auto;border-radius:var(--radius-l)}
.prose figure{margin:0}
.prose figure.wp-block-image,.prose figure.fig{display:grid;gap:var(--space-3)}
.prose figcaption{font-size:14px;line-height:20px;color:var(--ink-muted)}
.prose .aligncenter{margin-inline:auto;text-align:center}
.prose hr{border:0;border-top:1px solid var(--line);margin:var(--space-3) 0}
.prose blockquote:not(.quote){margin:0;padding:var(--space-5) var(--space-6);border-radius:var(--radius-xl);border-bottom-left-radius:var(--radius-tail);background:var(--orange-soft);color:var(--ink)}
.prose blockquote:not(.quote) p{font:500 20px/30px var(--font-display);text-wrap:balance}
.prose blockquote:not(.quote) cite,.prose blockquote:not(.quote) footer{display:block;margin-top:var(--space-3);font:400 15px/22px var(--font-text);font-style:normal;color:var(--ink-secondary)}
.prose blockquote hr{display:none}
.prose details{border-radius:var(--radius-m);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);padding:var(--space-4) var(--space-5)}
.prose details summary{cursor:pointer;font-weight:600}
.prose .wp-block-buttons{display:flex;flex-wrap:wrap;gap:var(--space-3)}
.prose .wp-block-button__link{display:inline-flex;align-items:center;gap:var(--space-2);min-height:48px;padding:0 var(--space-5);border-radius:var(--radius-pill);background:var(--cobalt);color:var(--on-cobalt);text-decoration:none;font:500 16px/20px var(--font-text)}
.prose .wp-block-button.is-style-outline .wp-block-button__link{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line-strong)}
.prose .wp-block-columns{display:grid;gap:var(--space-5)}
@media (min-width:641px){.prose .wp-block-columns{grid-template-columns:repeat(auto-fit,minmax(0,1fr))}}
.prose .has-text-align-center{text-align:center}
.prose .tbl table{min-width:0}
.prose .tbl td:last-child{white-space:normal}
@media (max-width:640px){.prose .tbl table{min-width:520px}}
.chapter--intro{padding-bottom:var(--space-6)}
.prose code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;padding:2px 6px;border-radius:6px;background:var(--surface-sunken)}

/* Инструменты «Фразиса», перенесённые со старого сайта как есть. */
.tool-embed{margin:0 auto;max-width:900px}
.tool-embed :where(input,textarea,select,button){font-family:var(--font-text)}

/* Поиск по сайту. */

/* Пагинация, если нет JS. */
.more a[aria-busy]{opacity:.6;pointer-events:none}

/* Статья без оглавления – текст по центру. */
@media (min-width:1025px){.reader__grid--solo{grid-template-columns:minmax(0,760px);justify-content:center}}
a.tag{text-decoration:none}
.xapp__logo img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
@media (min-width:1025px){.reader__grid--tool{grid-template-columns:minmax(0,900px)}}
.tool-embed h2,.tool-embed h3{font-family:var(--font-display);text-align:left}
.tool-embed p{margin:0 0 var(--space-3)}
.tvid>img,figure.tvid img,video.tvid{display:block;width:100%;height:auto;border-radius:inherit}
.xp__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* Стили блоков из редактора: «Шаги», цитаты, совет-группа. */
.prose ol.is-style-steps,.prose ol.steps{display:grid;gap:var(--space-3);padding:0;list-style:none;counter-reset:st}
.prose ol.is-style-steps>li,.prose ol.steps>li{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-4);border-radius:var(--radius-m);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);font-weight:500;counter-increment:st}
.prose ol.is-style-steps>li::before,.prose ol.steps>li:not(:has(>span))::before{content:counter(st);display:grid;place-items:center;width:36px;height:36px;flex-shrink:0;border-radius:12px 12px 12px 4px;background:var(--cobalt);color:#fff;font:600 15px/1 var(--font-display)}
.prose blockquote.is-style-phrasis{margin:0;padding:var(--space-6) var(--space-6) var(--space-5);border-radius:var(--radius-xl);border-bottom-left-radius:var(--radius-tail);background:var(--logo-cobalt);color:#fff}
.prose blockquote.is-style-phrasis p{font:500 22px/32px var(--font-display);text-wrap:balance}
.prose blockquote.is-style-phrasis cite{color:rgba(255,255,255,.75)}
.prose .wp-block-group.tip>*{margin:0}
.prose .gday__mark{display:inline-flex;align-items:center;gap:4px}

/* Пример «Вместо / Лучше» – доступен в любом тексте. */
.gday__mark{display:inline-flex;align-items:center;gap:4px;font:600 13px/16px var(--font-text);letter-spacing:.5px;text-transform:uppercase}
.gday__mark--yes{color:var(--orange-text)}
.tex{display:grid;gap:var(--space-4)}
.tex__sit{display:inline-flex;align-items:center;gap:6px;margin:0;font:600 15px/20px var(--font-text);color:var(--ink)}
.tex__row{display:grid;gap:6px;justify-items:start}
.tex__row .bubble{margin:0;max-width:88%;font-size:16px;line-height:24px}
.tex__case{padding:var(--space-4)}
.prose blockquote.is-style-soft{margin:0;padding:var(--space-6);border-radius:var(--radius-xl);border-bottom-right-radius:var(--radius-tail);background:var(--orange-soft);color:var(--ink)}
.prose blockquote.is-style-soft p{font:500 20px/30px var(--font-display)}
.prose .tex__bad{text-decoration:line-through;color:var(--ink-secondary)}
.prose .tex__case{display:grid;gap:var(--space-3);border-radius:var(--radius-l);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line)}
.prose .tex__bad{background:var(--surface-sunken)}
.prose .tex__row--ok{justify-items:end}
.prose figure.tbl figcaption{padding:var(--space-3) var(--space-4)}
@media (min-width:641px) and (max-width:1359px){.header .btn--primary{padding:0 18px;font-size:15px}.header__row{gap:var(--space-4)}}
@media (min-width:1180px) and (max-width:1279px){.nav a{padding:0 10px;font-size:15px}}
@media (min-width:641px) and (max-width:719px){.header__actions{gap:0}.logo svg{height:28px}}

/* Фильтры-чипсы: на компьютере переносятся на новую строку, чтобы были видны все. Высокая панель не липнет. */
@media (min-width:1024px){
  .fbar__chips{flex-wrap:wrap;overflow:visible}
  .fbar.is-tall{position:static}
}
.more{display:flex;justify-content:center;margin-top:var(--space-6)}

/* Главная, «Словарь общения»: карточка не шире экрана, длинное слово переносится, буквы алфавита стоят ровной сеткой. */
@media (max-width:1024px){.gloss{grid-template-columns:minmax(0,1fr)}}
@media (min-width:1025px){.gloss{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:var(--space-7);align-items:start}.gloss>.gloss__side:only-child{grid-column:1/-1}}
.term-day__word{overflow-wrap:break-word;hyphens:manual}
.term-day__def{overflow-wrap:break-word}
@media (max-width:640px){.term-day__word{font-size:clamp(1.5rem,.375rem + 6.4vw,2.25rem)}.term-day__ex .bubble{max-width:92%}}
.abc>*{display:grid;place-items:center;aspect-ratio:1;min-height:40px;min-width:0}
.abc span{font:500 15px/1 var(--font-display);color:var(--ink-muted);opacity:.55;border-radius:var(--radius-s);background:var(--milk)}
@media (min-width:641px){.abc>*{min-height:0}}

/* «Приложения», карточка хронометра: значения не вылезают из плашек на узком экране. */
.demo__res div{min-width:0}
.demo__res b{white-space:nowrap}
@media (max-width:480px){.demo__res{grid-template-columns:repeat(2,minmax(0,1fr))}.demo__res div:first-child{grid-column:1/-1;display:flex;align-items:baseline;gap:8px}}
.fbar__more{cursor:pointer;border:0;background:var(--cobalt-soft);box-shadow:none;color:var(--cobalt-strong);font:500 15px/20px var(--font-text)}
.fbar__more:hover{background:var(--cobalt);color:var(--on-cobalt)}
.fbar__more svg{transition:transform 160ms ease}
.fbar.is-open .fbar__more svg{transform:rotate(180deg)}
.fbar__more[hidden],.fbar__chips .chip[hidden]{display:none}
@media (max-width:640px){.acover:has(img){aspect-ratio:16/7}}


/* Текст под инструментом: отступы между абзацами и заголовки как в статьях. */
.prose--tool{display:grid;gap:var(--space-4);align-content:start}
.prose--tool h2{font:600 clamp(1.375rem,1.1rem + 1vw,1.75rem)/1.3 var(--font-display);margin-top:var(--space-5)}
.prose--tool h2:first-child{margin-top:0}
.prose--tool h3{font:600 20px/28px var(--font-text);margin-top:var(--space-3)}
.prose--tool>.link-arrow{justify-self:start;margin-top:var(--space-4)}