/* ==========================================================================
   Тема нового дизайну: журнал (tb-jr-*), статичні сторінки (tb-pg-*), магазин (tb-st-*),
   лабораторні (tb-lab-*), напрями підвищення кваліфікації (tb-dir-*), школа (tb-sch-*),
   пошук по сайту (tb-srch-*), перевірка документів (tb-proof-*).
   Лише оформлення поверх web/test-beta-static/beta.css; кольори — через змінні beta.css.
   ========================================================================== */

/* ---------- спільне ---------- */
.blog-index.tb-jr-wrap { margin-top: 0; }
.tb-jr-wrap .tb-embedded { margin-top: 30px; }
.tb-jr .lucide { width: 1em; height: 1em; vertical-align: -0.15em; }
.tb-jr .tb-tcard-meta .lucide, .tb-jr .tb-lib-meta .lucide { width: 14px; height: 14px; }
.tb-jr .tb-chip-btn { text-decoration: none; }
.tb-jr .tb-catalog-head { margin-bottom: 16px; }
.tb-jr .tb-catalog-head-row .tb-btn { white-space: normal; text-align: left; }
/* класичний .journal-pr робить напис великими літерами — у дизайн-системі кнопки з великої літери */
.tb-jr .tb-catalog-head-row .tb-btn.journal-pr { text-transform: none; letter-spacing: .01em; }
.tb-jr .tb-btn .lucide { width: 18px; height: 18px; }
.tb-jr .tb-lib-card { position: relative; }
.tb-jr .tb-lib-h2 { display: flex; align-items: center; gap: 8px; }
.tb-jr .tb-lib-h2 .lucide { width: 20px; height: 20px; color: var(--orange); }
.tb-jr-wide .tb-page { max-width: 1180px; margin: 0 auto; }

/* рубрики */
.tb-jr-head .rubrics { margin-top: 2px; }
.tb-jr-head > .rubrics:first-child { margin-top: 0; }
.tb-jr-head > .rubrics:last-child { margin-bottom: 0; } /* відступ до змісту дає .tb-catalog-head (16px), класичні 24px давали 40px */
.tb-jr-head .tb-chip-btn.is-on, .tb-jr-head .tb-chip-btn.is-on:hover { color: var(--ink); }
/* рубрики — у стилі .tb-chip-btn (DESIGN.md §2.2), а не класичні помаранчеві .blog-index .rubrics .rubric */
.tb-jr-head .rubrics .tb-chip-btn.rubric {
    min-height: 36px; padding: 0 12px; line-height: 1; border: 2px solid var(--line); border-radius: 99px; background: #fff;
    color: var(--ink); font: 600 14px/1 var(--f-body); text-decoration: none; white-space: nowrap;
}
.tb-jr-head .rubrics .tb-chip-btn.rubric:hover { background: #fff; border-color: var(--ink-3); color: var(--ink); }
.tb-jr-head .rubrics .tb-chip-btn.rubric.is-on, .tb-jr-head .rubrics .tb-chip-btn.rubric.active {
    background: var(--paper-2, #fff8e1); border-color: var(--go); box-shadow: 0 2px 0 var(--go-d); color: var(--ink);
}
/* в один рядок: зайві рубрики — у меню «Інші» (_rubrics_js.php); до розрахунку рядок невидимий, щоб не блимав */
.tb-jr-head .rubrics { flex-wrap: nowrap; min-width: 0; max-width: 100%; overflow-x: clip; overflow-y: visible; }
.tb-jr-head { min-width: 0; }
.tb-jr-head .rubrics:not(.is-ready) { visibility: hidden; }
.tb-jr-head .rubrics .rubric[hidden], .tb-jr-rubrics-more[hidden], .tb-jr-rubrics-more .tb-dd-item[hidden] { display: none; }
.tb-jr-rubrics-more { flex: none; }
.tb-jr-rubrics-more > .tb-chip-btn svg { width: 15px; height: 15px; color: var(--ink-3); transition: transform .15s; }
.tb-jr-rubrics-more.is-open > .tb-chip-btn { border-color: var(--ink); }
.tb-jr-rubrics-more.is-open > .tb-chip-btn svg { transform: rotate(180deg); }
.tb-jr-rubrics-more > .tb-chip-btn.is-on { background: var(--paper-2, #fff8e1); border-color: var(--go); box-shadow: 0 2px 0 var(--go-d); }
.tb-jr-rubrics-more .tb-dd-menu { min-width: 220px; }
.tb-jr-rubrics-more .tb-dd-item { text-decoration: none !important; color: var(--ink) !important; }
/* без JS — звичайне перенесення рядків */
.no-js .tb-jr-head .rubrics { flex-wrap: wrap; visibility: visible; }

/* верхній блок: головна публікація + новини + найцікавіше */
.tb-jr-top { display: grid; grid-template-columns: minmax(0, 2fr) minmax(260px, 1fr); grid-template-areas: "hero news" "popular news"; gap: 14px; margin-bottom: 14px; }
.tb-jr-hero { grid-area: hero; position: relative; min-height: 340px; border-radius: 18px; overflow: hidden; background: var(--ink) center center / cover no-repeat; border: 2px solid var(--line); box-shadow: 0 4px 0 var(--line); }
.tb-jr-hero-link { position: absolute; inset: 0; display: flex; align-items: flex-end; color: #fff !important; text-decoration: none !important; background: linear-gradient(180deg, rgba(38, 50, 56, 0) 25%, rgba(38, 50, 56, .85) 100%); transition: background .2s; }
.tb-jr-hero-link:hover { background: linear-gradient(180deg, rgba(38, 50, 56, .05) 15%, rgba(38, 50, 56, .92) 100%); }
.tb-jr-hero-body { display: grid; gap: 8px; padding: 22px 24px; }
.tb-jr-hero-title { font: 800 clamp(20px, 2.4vw, 28px)/1.2 var(--f-display); color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .35); }
.tb-jr-hero-sub { font-size: 15px; line-height: 1.4; color: rgba(255, 255, 255, .88); }
.tb-jr-hero-meta, .tb-jr-hero-meta .lucide { color: rgba(255, 255, 255, .85) !important; }
.tb-jr-news { grid-area: news; }
.tb-jr-popular { grid-area: popular; }
.tb-jr-note { display: grid; gap: 10px; align-content: start; }
.tb-jr-note .tb-lib-h2 { margin: 0; }
.tb-jr-note-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.tb-jr-note-list li { display: grid; gap: 3px; padding: 10px 12px; border-radius: 12px; background: var(--paper); }
.tb-jr-note-title { font-weight: 700; font-size: 14.5px; line-height: 1.3; color: var(--ink) !important; text-decoration: none !important; }
.tb-jr-note-title:hover { color: var(--orange-d, #e65100) !important; }
.tb-jr-note-meta { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; font-weight: 600; color: var(--ink-3); }
.tb-jr-note-meta .lucide { width: 14px; height: 14px; }
.tb-jr-note .more-news { justify-self: start; }

/* сітка публікацій */
/* сервер складає ряди по 3 картки з широкою (на 2 колонки) — тож рівно 3 колонки; dense заповнює можливі дірки */
.tb-jr-grid { margin-bottom: 14px; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-flow: row dense; }
@media (max-width: 1199px) { .tb-jr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tb-jr-grid-2 { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important; }
.tb-jr-card { position: relative; }
.tb-jr-card-link { display: flex; flex-direction: column; flex: 1; color: var(--ink) !important; text-decoration: none !important; }
.tb-jr-card .tb-tcard-img { display: block; aspect-ratio: 16 / 9; }
.tb-jr-card .tb-tcard-body { display: flex; }
.tb-jr-card .tb-tcard-tags { display: flex; }
.tb-jr-card .tb-tcard-meta { display: flex; margin-top: auto; }
.tb-jr-card-title { display: block; font: 800 17px/1.25 var(--f-display); color: var(--ink); }
.tb-jr-card:hover .tb-jr-card-title { color: var(--orange-d, #e65100); }
.tb-jr-card-ico { display: grid; place-items: center; height: 120px; background: var(--paper-2); color: var(--go); font-size: 44px; }
.tb-jr-card-wide { grid-column: span 2; min-height: 260px; background: var(--ink) center center / cover no-repeat; }
.tb-jr-card-cover { display: flex; flex: 1; align-items: flex-end; min-height: 260px; color: #fff !important; text-decoration: none !important; background: linear-gradient(180deg, rgba(38, 50, 56, 0) 25%, rgba(38, 50, 56, .85) 100%); }
.tb-jr-card-cover-body { display: grid; gap: 6px; padding: 18px 20px; }
.tb-jr-card-wide .tb-jr-card-title { font-size: 22px; color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .35); }
.tb-jr-card-wide:hover .tb-jr-card-title { color: #fff; }
.tb-jr-card-sub { font-size: 14.5px; line-height: 1.4; color: rgba(255, 255, 255, .88); }
.tb-jr-card-wide .tb-jr-card-meta, .tb-jr-card-wide .tb-jr-card-meta .lucide { color: rgba(255, 255, 255, .85) !important; }
.tb-jr-more { padding: 10px 0 14px; }
.tb-jr-more .tb-btn { min-width: 260px; }
.tb-jr-more .fa-spinner { color: var(--ink-3); }

/* списки новин і афіші */
.tb-jr-list-grid { grid-template-areas: "main top" "main bottom"; }
.tb-jr-list-grid .tb-lib-main { grid-area: main; }
.tb-jr-newslist { display: grid; gap: 10px; }
.tb-jr-month { margin: 12px 0 2px; font: 800 14px/1 var(--f-display); letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); }
.tb-jr-newsrow { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 6px 16px; align-items: start; padding: 14px 16px; border-radius: 16px; background: #fff; border: 2px solid var(--line); box-shadow: 0 4px 0 var(--line); transition: transform .12s, box-shadow .12s; }
.tb-jr-newsrow:hover { transform: translateY(-2px); box-shadow: 0 6px 0 var(--line-2); }
.tb-jr-eventrow { grid-template-columns: minmax(0, 1fr); }
.tb-jr-newsrow-src { font-size: 13px; color: var(--ink-2); }
.tb-jr-newsrow-src strong { font-weight: 800; }
.tb-jr-newsrow-date { display: inline-flex; align-items: center; gap: 5px; margin-top: 4px; font-size: 13px; font-weight: 600; color: var(--ink-3); }
.tb-jr-newsrow-date .lucide { width: 14px; height: 14px; }
.tb-jr-newsrow-title { display: block; font: 800 16px/1.3 var(--f-display); color: var(--ink) !important; text-decoration: none !important; }
.tb-jr-newsrow-title:hover { color: var(--orange-d, #e65100) !important; }
.tb-jr-aside { display: grid; gap: 14px; }
.tb-jr-aside .promo-cert, .tb-jr-aside .bot-promo { border-radius: 16px; }
.tb-jr-fbpage { min-height: 154px; }

/* посторінкова навігація (LinkPager — ті самі адреси, що й у класиці) */
ul.tb-jr-pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; list-style: none; margin: 18px 0 8px; padding: 0; }
ul.tb-jr-pager li a { display: grid; place-items: center; min-width: 38px; height: 38px; padding: 0 10px; border-radius: 10px; border: 2px solid var(--line); background: #fff; color: var(--ink) !important; font-weight: 700; text-decoration: none !important; }
ul.tb-jr-pager li a:hover { border-color: var(--ink); }
ul.tb-jr-pager li.active a { background: var(--ink); border-color: var(--ink); color: #fff !important; }
ul.tb-jr-pager li.disabled a { opacity: .4; pointer-events: none; }

/* збережені журнали */
.tb-jr-bm-item { grid-template-columns: 44px minmax(0, 1fr) auto; }
.tb-jr-bm-ico { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--paper-2); color: var(--orange); }
.tb-jr-bm-ico .lucide { width: 22px; height: 22px; }
.tb-jr-bm-item .tb-lib-tags a.tb-chip { text-decoration: none; }
.tb-jr-bm-item .tb-lib-title a { color: var(--ink); }
.tb-jr .tb-empty { background: #fff; }
.tb-jr .tb-empty p { margin: 0; }

/* ---------- стаття ---------- */
.tb-jr-single .tb-page { max-width: 1180px; }
.tb-jr-article .tb-crumbs { margin: 4px 0 12px; }
.tb-jr-art-grid { grid-template-areas: "main top" "main bottom"; }
.tb-jr-art-grid .tb-lib-main { grid-area: main; }
/* класичний .sth-post-block — flex по центру з висотою 600px: без скидання затемнення стискалося до блока посередині */
.tb-jr-art-hero, .tb-jr-art-hero.sth-post-block.sth-post-block-single { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch; height: auto; min-height: clamp(360px, 38vw, 560px); margin-top: 0 !important; margin-bottom: 16px; border-radius: 20px; overflow: hidden; background: var(--ink); border: 2px solid var(--line); box-shadow: 0 5px 0 var(--line); }
.tb-jr-art-hero .tb-jr-art-hero-bg { position: absolute; inset: 0; width: auto; height: auto; background: center center / cover no-repeat; }
/* обидва розміри обкладинки лежать шарами: якщо потрібного розміру немає на сервері (у частини статей 887.jpg — 403), видно інший */
.tb-jr-art-hero .tb-jr-art-hero-bg.sth-post-background-lg, .tb-jr-art-hero .tb-jr-art-hero-bg.sth-post-background-md { display: block; }
.tb-jr-art-hero .sth-post-background-lg { z-index: 0; }
.tb-jr-art-hero .sth-post-background-md { z-index: -1; }
@media (max-width: 1279px) { .tb-jr-art-hero .sth-post-background-md { z-index: 0; } .tb-jr-art-hero .sth-post-background-lg { z-index: -1; } }
@media (max-width: 992px) { .tb-jr-art-hero.sth-post-block.sth-post-block-single { margin-left: 0; margin-right: 0; } }
.tb-jr-art-hero-body { position: relative; z-index: 1; display: grid; gap: 10px; width: 100%; min-height: 100%; align-content: end; padding: clamp(18px, 3vw, 32px); background: linear-gradient(180deg, rgba(38, 50, 56, .28) 0%, rgba(38, 50, 56, .5) 40%, rgba(38, 50, 56, .92) 100%); color: #fff; }
.tb-jr-art-rubrics { display: flex; flex-wrap: wrap; gap: 6px; }
.tb-jr-art-rubrics a.tb-chip { text-decoration: none !important; }
.tb-jr-art-rubrics a.tb-chip:hover { filter: brightness(.95); }
/* .tb-jr-art-hero у селекторі: класичний .library h1 { font-weight: 400 } інакше перебивав вагу й розмір заголовка на обкладинці */
.tb-jr-art-hero .tb-jr-art-h1, .tb-jr-art-h1 { margin: 0; font: 800 clamp(22px, 3.2vw, 36px)/1.15 var(--f-display); color: #fff; text-shadow: 0 1px 3px rgba(0, 0, 0, .4); word-break: break-word; }
.tb-jr-art-hero .tb-jr-art-sub { font-size: 16px; line-height: 1.45; color: rgba(255, 255, 255, .9); }
.tb-jr-art-hero .tb-jr-art-meta, .tb-jr-art-hero .tb-jr-art-meta .lucide { color: rgba(255, 255, 255, .85) !important; }
.tb-jr-art-card { display: grid; gap: 16px; padding: clamp(16px, 3vw, 28px); }
/* класичний .sth-post-article на телефоні має від’ємні поля — картка виходила за 16px поля сторінки */
.tb-jr-art-card.sth-post-article { margin-left: 0; margin-right: 0; }
.tb-jr-art-card > * { margin: 0; }
.tb-jr-art-h1-plain { margin: 0; font-size: clamp(22px, 3vw, 32px); }
.tb-jr-art-card .tb-jr-art-sub { font-size: 17px; line-height: 1.45; color: var(--ink-2); font-weight: 600; }
.tb-jr-art-meta { display: flex; }
.tb-jr-art-excerpt { font: 600 18px/1.5 var(--f-body); color: var(--ink); }
.tb-jr-art-excerpt:empty { display: none; }
.tb-jr-art-content { font: 400 17px/1.65 var(--f-body); color: var(--ink); overflow-wrap: anywhere; }
.tb-jr-art-content h2 { margin: 24px 0 12px; font: 800 24px/1.25 var(--f-display); }
.tb-jr-art-content h3 { margin: 20px 0 10px; font: 800 20px/1.25 var(--f-display); }
.tb-jr-art-content h4 { margin: 16px 0 8px; font: 800 18px/1.25 var(--f-display); }
.tb-jr-art-content p { margin: 0 0 12px; }
.tb-jr-art-content img { max-width: 100%; height: auto; border-radius: 12px; }
.tb-jr-art-content iframe, .tb-jr-art-content video { max-width: 100%; border-radius: 12px; }
.tb-jr-art-content blockquote { margin: 16px 0; padding: 12px 18px; border-left: 4px solid var(--go); border-radius: 0 12px 12px 0; background: var(--paper-2); font-style: normal; }
.tb-jr-art-content ul, .tb-jr-art-content ol { padding-left: 24px; margin: 0 0 12px; }
.tb-jr-art-content table { max-width: 100%; border-collapse: collapse; }
.tb-jr-art-content table td, .tb-jr-art-content table th { padding: 6px 10px; border: 1px solid var(--line-2); }
.tb-jr-art-content a { color: var(--sky-d); text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 3px; }
.tb-jr-art-content a:hover { color: var(--orange-d); text-decoration: underline; }
.tb-jr-art-fblike { display: grid; gap: 8px; }
.tb-jr-art-fblike hr { margin: 0; border: 0; border-top: 1px solid var(--line); }
.tb-jr-art-fblike-text { font-size: 15px; line-height: 1.3; }

/* промо вебінару в статті й після неї */
.tb-jr-webinar { position: relative; border-radius: 18px; overflow: hidden; background: var(--orange) center center / cover no-repeat; border: 2px solid var(--line); box-shadow: 0 4px 0 var(--line); }
.tb-jr-webinar-inner { position: relative; display: grid; gap: 14px; padding: clamp(16px, 3vw, 26px); background: rgba(38, 50, 56, .72); color: #fff; }
.tb-jr-webinar-h1 a { font: 800 clamp(17px, 2.2vw, 22px)/1.25 var(--f-display); color: #fff !important; text-decoration: none !important; }
.tb-jr-webinar-h1 a:hover { text-decoration: underline !important; text-decoration-color: var(--go) !important; text-underline-offset: 4px; }
.tb-jr-webinar-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.tb-jr-webinar-action .tb-btn { min-width: 220px; }
.tb-jr-webinar-date { font-weight: 700; line-height: 1.45; }
.tb-jr-webinar-date > span { font-size: 12.5px; font-weight: 600; opacity: .8; }
.tb-jr-live { color: var(--coral); }
.tb-jr-webinar .lucide { width: 16px; height: 16px; vertical-align: -3px; }

/* автор, Telegram, підписка, поширення */
.tb-jr-author { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 14px; background: var(--paper); }
.tb-jr-author-row { display: flex; align-items: center; gap: 14px; }
.tb-jr-author-avatar { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 3px var(--go); }
.tb-jr-author-name { font: 800 15.5px/1.25 var(--f-display); color: var(--ink); }
.tb-jr-author-name a { color: var(--ink) !important; }
.tb-jr-author-name a:hover { color: var(--orange-d, #e65100) !important; }
.tb-jr-author-sub { font-size: 12.5px; font-weight: 600; color: var(--ink-3); }
.tb-jr-telegram { margin: 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tb-jr-telegram .lucide { width: 18px; height: 18px; color: var(--sky); }
.tb-jr-subscribe { display: grid; gap: 10px; padding: 16px 18px; border-radius: 16px; background: var(--paper-2); border: 2px solid var(--go); }
.tb-jr-subscribe-items { display: grid; gap: 10px; }
.tb-jr-subscribe-msg { font-size: 15px; line-height: 1.4; color: var(--ink); }
.tb-jr-subscribe-row { display: flex; flex-wrap: wrap; gap: 8px; }
.tb-jr-subscribe-row { align-items: stretch; }
.tb-jr-subscribe-row .tb-input { flex: 1 1 240px; min-width: 0; height: auto; min-height: 48px; box-shadow: none; }
/* класична .btn-subscribe-article має margin-top: -3px і власну висоту — кнопка на одній лінії й висоті з полем */
.tb-jr-subscribe-row .tb-btn { height: auto; min-height: 48px; margin: 0 !important; width: auto !important; min-width: max-content; } /* класична .btn-subscribe-article має фіксовану ширину 89px — «Підписатись» вилазив */
@media (max-width: 640px) { .tb-jr-subscribe-row .tb-btn { flex: 1 1 100%; width: 100% !important; } }
.tb-jr-subscribe .success-form-article { margin: 0; }
.tb-jr-subscribe .alert-warning { background: #fff3e0; border-color: var(--orange); }
.tb-jr-share { display: grid; gap: 8px; }
.tb-jr-share-title { font: 800 15px/1.2 var(--f-display); }
.tb-jr-share-row { display: flex; flex-wrap: wrap; gap: 8px; }
.tb-jr-share-btn { --t: #fff; text-transform: capitalize; }
.tb-jr-share-btn .share-count { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 99px; background: rgba(255, 255, 255, .22); font-size: 12px; }
.tb-jr-share-btn.is-facebook { --c: #3b5998; --c-d: #2a4170; }
.tb-jr-share-btn.is-viber { --c: #7360f2; --c-d: #4f41b8; }
.tb-jr-share-btn.is-telegram { --c: #2aabee; --c-d: #1a7fb5; }
.tb-jr-share-btn.is-twitter { --c: #1da1f2; --c-d: #1476b5; }
.tb-jr-related .tb-lib-h2 { margin-bottom: 8px; }
.tb-jr-related .tb-single-links a { color: var(--ink) !important; }
.tb-jr-docs .library .items { margin: 0; }
.tb-jr-docs .file-item { border-radius: 14px; }
.tb-jr-comments { margin-top: 0; }
.tb-jr-comments .block-head { font: 800 18px/1.25 var(--f-display); margin-bottom: 10px; }
.tb-jr-more-posts { margin-top: 4px; }
.tb-jr-art-main > * + * { margin-top: 0; }

/* мобільна адаптивність */
@media (max-width: 991px) {
    .tb-jr-top { grid-template-columns: 1fr; grid-template-areas: "hero" "news" "popular"; }
    .tb-jr-hero { min-height: 280px; }
}
@media (max-width: 760px) {
    .tb-jr-card-wide { grid-column: auto; }
    .tb-jr-newsrow { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .tb-jr .tb-catalog-head-row { flex-direction: column; align-items: stretch; }
    .tb-jr .tb-catalog-head-row .tb-btn { width: 100%; justify-content: center; text-align: center; }
    .tb-jr-hero { min-height: 240px; }
    .tb-jr-hero-body { padding: 16px; }
    .tb-jr-hero-title { font-size: 20px; }
    .tb-jr-grid, .tb-jr-grid-2 { grid-template-columns: 1fr !important; }
    .tb-jr-more .tb-btn { width: 100%; min-width: 0; }
    .tb-jr-art-hero { min-height: 280px; }
    .tb-jr-art-hero-body { min-height: 280px; }
    .tb-jr-art-card { padding: 14px; border-radius: 14px; }
    .tb-jr-art-content { font-size: 16px; }
    .tb-jr-webinar-action, .tb-jr-webinar-action .tb-btn { width: 100%; min-width: 0; }
    .tb-jr-subscribe-row .tb-btn { width: 100%; }
    .tb-jr-share-row .tb-btn { flex: 1 1 45%; justify-content: center; }
    .tb-jr-bm-item { grid-template-columns: 1fr; }
    .tb-jr-bm-ico { display: none; }
    .tb-jr-bm-item .tb-lib-actions { justify-content: stretch; max-width: none; }
    .tb-jr-bm-item .tb-lib-actions .tb-btn { width: 100%; justify-content: center; }
}

/* ---------- магазин (/store) ---------- */
.tb-st .tb-catalog-head { margin-bottom: 16px; }
.tb-st-grid { margin-bottom: 14px; }
.tb-st-card-img { display: block; aspect-ratio: 4 / 3; background: var(--paper); }
.tb-st-card-img img { width: 100%; height: 100%; object-fit: cover; }
.tb-st-card .tb-tcard-title a { color: var(--ink) !important; text-decoration: none !important; }
.tb-st-card .tb-tcard-title a:hover { color: var(--orange-d, #e65100) !important; }
.tb-st-rating { display: inline-flex; align-items: center; gap: 6px; font-weight: 800; font-size: 14px; color: var(--ink-2); }
.tb-st-rating .tb-stars { flex: none; }
.tb-st-head .tb-crumbs { margin: 6px 0 0; }
.tb-st-main { display: grid; gap: 16px; }
.tb-st-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.tb-st-preview { display: grid; gap: 8px; }
.tb-st-preview-main { border-radius: 14px; overflow: hidden; background: var(--paper); border: 2px solid var(--line); }
.tb-st-preview-main img { display: block; width: 100%; height: auto; }
.tb-st-preview-gallery { display: flex; flex-wrap: wrap; gap: 6px; }
.tb-st-preview-gallery a { display: block; width: 64px; height: 64px; border-radius: 10px; overflow: hidden; border: 2px solid var(--line); transition: border-color .12s; }
.tb-st-preview-gallery a:hover { border-color: var(--go); }
.tb-st-preview-gallery img { width: 100%; height: 100%; object-fit: cover; }
.tb-st-meta { grid-template-columns: 1fr; gap: 8px; }
.tb-st-meta div { display: flex; gap: 6px; flex-wrap: wrap; }
.tb-st-meta dt { font-weight: 600; color: var(--ink-3); }
.tb-st-meta dd { font-weight: 600; }
.tb-st-size dd { color: var(--ink-3); font-weight: 600; }
.tb-st-hr { margin: 0; border: 0; border-top: 1px solid var(--line); }
.tb-st-warn { font-weight: 700; color: var(--coral-d); }
.tb-st-desc img { max-width: 100%; height: auto; border-radius: 12px; }
.tb-st-pay { display: grid; gap: 14px; }
.tb-st-pay-head { display: flex; align-items: center; gap: 14px; }
.tb-st-price-box { display: grid; gap: 2px; }
.tb-st-price-old { font: 700 16px/1.2 var(--f-display); color: var(--coral-d); }
.tb-st-price { font: 900 30px/1 var(--f-display); color: var(--mint-d); }
.tb-st-price-info { font-size: 13px; font-weight: 600; color: var(--ink-2); }
.tb-st-single .tb-jr-share { margin: 0; }

/* ---------- школа (/school/<id>, /school/request) ---------- */
.tb-sch .tb-catalog-head { margin-bottom: 16px; }
.tb-sch .tb-page { max-width: 1180px; margin: 0 auto; }
.tb-sch-about { display: grid; gap: 14px; }
.tb-sch-about p { margin: 0; font-size: 15.5px; line-height: 1.55; }
.tb-sch-address b { font-weight: 800; }
.tb-sch-eggs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.tb-sch-eggs .tb-stat-tile { background: var(--paper); }
.tb-sch-eggs .tb-stat-tile .lucide { width: 22px; height: 22px; }
.tb-sch-eggs .tb-stat-tile span br { display: none; }
.tb-sch-h3 { margin: 6px 0 0; }
.tb-sch-teachers { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
.tb-sch-teacher { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 8px 12px; border-radius: 12px; background: #fff; border: 2px solid var(--line); color: var(--ink) !important; font-weight: 700; font-size: 14px; line-height: 1.25; text-decoration: none !important; transition: border-color .12s, transform .12s; }
.tb-sch-teacher:hover { border-color: var(--ink); transform: translateY(-1px); }
.tb-sch-teacher-avatar { flex: none; width: 34px; height: 34px; border-radius: 50%; object-fit: cover; }
/* без аватара — силует засобами CSS (без inline SVG на кожного з сотень вчителів) */
.tb-sch-teacher-noava { position: relative; display: block; overflow: hidden; background: var(--paper); }
.tb-sch-teacher-noava::before { content: ''; position: absolute; left: 50%; top: 6px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: var(--ink-3); opacity: .55; }
.tb-sch-teacher-noava::after { content: ''; position: absolute; left: 50%; top: 20px; width: 22px; height: 22px; margin-left: -11px; border-radius: 50%; background: var(--ink-3); opacity: .55; }
.tb-sch-invite .tb-sch-teacher-noava::before, .tb-sch-invite .tb-sch-teacher-noava::after { background: var(--orange-d); }
.tb-sch-invite { border-style: dashed; border-color: var(--go); }
.tb-sch-invite .tb-sch-teacher-noava { display: grid; place-items: center; background: var(--paper-2); color: var(--orange-d); }
.tb-sch-invite .tb-sch-teacher-noava::before, .tb-sch-invite .tb-sch-teacher-noava::after { display: none; }
.tb-sch-invite .tb-sch-teacher-noava .lucide { width: 18px; height: 18px; }
.tb-sch-docs .items { margin: 0; }
.tb-sch-docs .file-item { border-radius: 14px; }
.tb-sch-aside { display: grid; gap: 14px; }
.tb-sch-gpage { min-height: 0; }
.tb-sch-form { display: grid; gap: 10px; margin-top: 16px; padding: 18px; border-radius: 16px; background: var(--paper-2); border: 2px solid var(--go); }
.tb-sch-form p { margin: 0; font-weight: 600; }
.tb-sch-form-grid { display: grid; gap: 4px 14px; }
.tb-sch-form-grid.is-two { grid-template-columns: 1fr 1fr; }
.tb-sch-form .form-group { margin-bottom: 8px; }
/* абзац, сітка полів і кнопка лежать у <form>, а не прямо в .tb-sch-form — свій відступ між ними */
.tb-sch-form > form { display: grid; gap: 12px; margin: 0; }
/* класичний .form-group + .form-group { margin-top: 15px } зсував другу колонку нижче першої */
.tb-sch-form-grid > .form-group { margin: 0 !important; min-width: 0; }
.tb-sch-form-grid { row-gap: 12px; }
.tb-sch-form-submit { margin: 0 !important; }
.tb-sch-form .tb-label, .tb-sch-form label.control-label { display: block; margin-bottom: 4px; font: 700 13px/1.2 var(--f-body); color: var(--ink-2); }
.tb-sch-form .form-control.tb-input { height: auto; box-shadow: none; }
.tb-sch-form .help-block { color: var(--coral-d); font-weight: 600; font-size: 13px; }
.tb-sch-form .has-error .form-control { border-color: var(--coral); }
.tb-sch-form-submit .tb-btn { width: 100%; }
.tb-sch-thanks { margin: 0; text-align: center; }

/* ---------- лабораторні (/labs, /lab/<slug>) ---------- */
.tb-lab .tb-page-title { margin-top: 22px; }
.tb-lab-cover { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 20px; align-items: center; margin-bottom: 8px; }
.tb-lab-cover-body { display: grid; gap: 10px; }
body.tb-chrome .tb-lab-h1, .tb-lab-h1 { margin: 0; font: 800 clamp(22px, 3vw, 32px)/1.15 var(--f-display); color: #fff; }
.tb-lab-cover-info { font-size: 15px; line-height: 1.5; color: rgba(255, 255, 255, .9); }
.tb-lab-cover-art img { display: block; width: 100%; height: auto; }
.tb-lab-live-dot { display: inline-block; width: 10px; height: 10px; margin-right: 8px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 0 4px rgba(255, 87, 34, .2); vertical-align: 2px; }
.tb-lab-live { color: var(--coral); font-weight: 800; }
.tb-lab-grid { margin-bottom: 6px; }
.tb-lab-card-img { display: grid; place-items: center; aspect-ratio: 16 / 9; padding: 14px; overflow: hidden; }
.tb-lab-card-img img { max-width: 100%; max-height: 100%; height: auto; object-fit: contain; }
.tb-lab-card .tb-tcard-title a { color: var(--ink) !important; text-decoration: none !important; }
.tb-lab-card .tb-tcard-title a:hover { color: var(--orange-d, #e65100) !important; }
.tb-lab-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 10px; border-top: 1px solid var(--line); }
.tb-lab-card-date { font-size: 12.5px; font-weight: 700; line-height: 1.3; color: var(--ink-2); text-align: right; }
.tb-lab-card-date .lucide { width: 14px; height: 14px; }
.tb-lab-card-time { display: block; } /* на ширших екранах — час під датою, як у класиці */
.tb-lab-about { margin-top: 16px; }
.tb-lab-about-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center; margin-bottom: 12px; }
.tb-lab-about-lead { font-weight: 600; }
.tb-lab-logos { display: flex; align-items: center; gap: 16px; }
.tb-lab-logos img { width: 80px; height: auto; }
.tb-lab-banner { display: block; max-width: 300px; margin-top: 16px; border-radius: 14px; overflow: hidden; border: 2px solid var(--line); }
.tb-lab-banner img { display: block; width: 100%; height: auto; }
.tb-lab-head { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 20px; align-items: center; margin: 8px 0 14px; }
.tb-lab-head::before, .tb-lab-head::after { display: none; }
.tb-lab-head-body { display: grid; gap: 16px; }
.tb-lab-head-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.tb-lab-head-action .tb-btn { min-width: 240px; }
.tb-lab-regform { margin: 0; }
.tb-lab-head-date { font-weight: 700; line-height: 1.45; color: #fff; }
.tb-lab-head-date > span { font-size: 12.5px; font-weight: 600; opacity: .8; }
.tb-lab-head-date .lucide { width: 16px; height: 16px; vertical-align: -3px; }
.tb-lab-head-icon img { display: block; width: 100%; height: auto; }
.tb-lab-regnote { text-align: center; }
.tb-lab-single .tb-lib-card { margin-bottom: 14px; }
.tb-lab-about-card { display: grid; gap: 14px; }
.tb-lab-authors { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; }
.tb-lab-author { display: flex; gap: 14px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; background: var(--paper); }
.tb-lab-author-avatar { flex: none; width: 64px; height: 64px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 3px var(--go); }
.tb-lab-author-name { font: 800 16px/1.25 var(--f-display); margin-bottom: 4px; }
.tb-lab-author-desc { font-size: 14px; line-height: 1.45; color: var(--ink-2); }
.tb-lab-yt { margin: 0 0 12px; }
.tb-lab-video { border-radius: 14px; overflow: hidden; }
.tb-lab .tb-note p { margin: 0; font-weight: 700; }
/* класичні правила лабораторних (.lab-item, .lab-cover-link, .lab-info, .lab-action, .lab-single-head…) з site.css
   вантажаться після теми й мають фіксовані висоти та position:absolute — посилання-обкладинка розтягувалось на всю сторінку */
.tb-lab-card.lab-item { height: auto; margin: 0; background: #fff; box-shadow: 0 4px 0 var(--line); }
.tb-lab-card.lab-item .tb-lab-card-img { position: static; width: auto; height: auto; margin: 0; z-index: auto; }
.tb-lab-card.lab-item .tb-tcard-body { height: auto; padding: 14px 16px 16px; position: static; }
.tb-lab-card.lab-item .tb-tcard-title { margin: 0; font: 800 17px/1.3 var(--f-display); color: var(--ink); }
.tb-lab-card.lab-item .tb-lab-card-foot { position: static; width: auto; margin: auto 0 0; padding: 10px 0 0; }
.tb-lab-card.lab-item .tb-lab-card-date { font-size: 12.5px; color: var(--ink-2); }
.tb-lab-cover.promo-section-block { margin: 0 0 18px; min-height: 0; padding: clamp(18px, 3vw, 28px); background: var(--ink); box-shadow: 0 6px 0 var(--ink-shadow); }
.tb-lab-head.lab-single-head { min-height: 0; padding: clamp(18px, 3vw, 28px); }
.tb-lab-head.lab-single-head .tb-lab-head-icon { position: static; text-align: center; }
.tb-lab-head.lab-single-head .tb-lab-head-date { position: static; top: auto; }
.tb-lab-authors.lab-author-block { padding: 0; }
.tb-lab .tb-lib-card.content-block { margin: 0 0 14px; padding: 18px 20px; font-size: 15px; box-shadow: 0 4px 0 var(--line); }
.tb-lab .tb-note.content-block { margin: 0 0 14px; padding: 12px 16px; font-size: 15px; box-shadow: none; }
.tb-lab .tb-note-err.content-block { background: #ffebee; }
.tb-lab .tb-note-warn.content-block { background: #fff8e1; }
.tb-lab .content-block .tb-lib-h2 { margin: 0 0 10px; }
.tb-lab .tb-page-title.lab-h1-block { margin: 22px 0 12px; font: 800 22px/1.25 var(--f-display); color: var(--ink); }

/* ---------- підвищення кваліфікації (/upgrade) ---------- */
.tb-dir .tb-page { max-width: 1180px; margin: 0 auto; }
.tb-dir-head { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 20px; align-items: start; margin-bottom: 14px; }
.tb-dir-head-body { display: grid; gap: 10px; min-width: 0; }
.tb-dir-head .direction-subtitle:empty { display: none; }
.tb-dir-head .tb-page-h1 { margin: 0; }
.tb-dir-desc p:last-child { margin-bottom: 0; }
.tb-dir-actions { display: grid; gap: 8px; }
.tb-dir-actions .tb-btn { width: 100%; justify-content: center; }
.tb-dir-dropdown { display: block; position: relative; width: 100%; }
.tb-dir-dropdown .tb-btn { width: 100%; }
.tb-dir-menu { min-width: 100%; margin-top: 6px; padding: 6px; border-radius: 12px; border: 2px solid var(--line); box-shadow: 0 6px 0 var(--line), 0 16px 40px rgba(38, 50, 56, .18); }
.tb-dir-menu > li > a { padding: 7px 10px; border-radius: 8px; font-weight: 600; color: var(--ink); white-space: normal; }
.tb-dir-menu > li > a:hover { background: var(--paper); color: var(--ink); }
.tb-dir-benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.tb-dir-benefit { display: grid; gap: 8px; padding: 16px; border-radius: 16px; background: #fff; border: 2px solid var(--line); box-shadow: 0 4px 0 var(--line); }
.tb-dir-benefit-image img { width: 56px; height: 56px; }
.tb-dir-benefit-title { font: 800 15.5px/1.25 var(--f-display); }
.tb-dir-benefit-info { font-size: 13.5px; color: var(--ink-2); line-height: 1.4; }
.tb-dir-filter-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; margin-bottom: 10px; }
.tb-dir-filter-actions .upgrade-teacher-drop-filter-block, .tb-dir-filter-actions .upgrade-teacher-show-filter-block { float: none; margin: 0; width: auto; }
.tb-dir-filter-actions .btn-filter-hide.active { background: var(--ink); color: #fff !important; border-color: var(--ink); }
.tb-dir-contents .upgrade-teacher-filter { padding: 14px; border-radius: 16px; background: #fff; border: 2px solid var(--line); box-shadow: 0 4px 0 var(--line); }
.tb-dir-contents .upgrade-teacher-filter-title { font: 800 14px/1.3 var(--f-display); color: var(--ink); }
.tb-dir-contents .upgrade-teacher-items .upgrade-teacher-item-card { border-radius: 16px; border: 2px solid var(--line); box-shadow: 0 4px 0 var(--line); overflow: hidden; transition: transform .12s, box-shadow .12s; }
.tb-dir-contents .upgrade-teacher-items .upgrade-teacher-item-card:hover { transform: translateY(-2px); box-shadow: 0 6px 0 var(--line-2); }
.tb-dir-contents .upgrade-teacher-item-card-head { font-family: var(--f-display); font-weight: 800; }
.tb-dir-contents h3 { font: 800 18px/1.25 var(--f-display); margin: 14px 0 10px; }
.tb-dir-block { margin-top: 14px; }
.tb-dir-block h3 { margin-bottom: 10px; }
.tb-dir-faq { display: grid; gap: 8px; }
.tb-dir-faq-item { border-radius: 12px; border: 2px solid var(--line); overflow: hidden; }
.tb-dir-faq-q { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; font-weight: 700; cursor: pointer; background: var(--paper); }
.tb-dir-faq-q:hover { background: var(--paper-2); }
.tb-dir-faq-q .lucide { flex: none; width: 18px; height: 18px; transform: rotate(90deg); color: var(--ink-3); }
.tb-dir-faq-a { display: none; padding: 12px 14px; }
.tb-dir-links { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.tb-dir-links a { color: var(--ink) !important; }

/* ---------- перевірка документів (/proof) ---------- */
.tb-proof .tb-page { max-width: 980px; margin: 0 auto; }
.tb-proof-grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "main"; }
.tb-proof-form { display: grid; gap: 14px; margin-bottom: 20px; }
.tb-proof-form-label { font-size: 15px; }
.tb-proof-form-label em { color: var(--ink-3); }
.tb-proof-form-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.tb-proof-input { display: flex; flex: 1 1 260px; max-width: 420px; }
.tb-proof-addon { display: grid; place-items: center; padding: 0 14px; border: 2px solid var(--line); border-right: 0; border-radius: 12px 0 0 12px; background: var(--paper); font-weight: 800; color: var(--ink-2); }
.tb-proof-input .tb-input { flex: 1; min-width: 0; height: auto; border-radius: 0 12px 12px 0; box-shadow: none; }
.tb-proof-result { display: flex; align-items: center; gap: 14px; margin: 0; }
.tb-proof-ico { flex: none; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #fff; }
.tb-proof-ico .lucide { width: 30px; height: 30px; }
.tb-proof-ico.is-ok .lucide { color: var(--mint); }
.tb-proof-ico.is-err .lucide { color: var(--coral); }
.tb-proof-ico.is-soon .lucide { color: var(--ink-3); }
.tb-proof-result-soon { background: #e0f7fa; border-color: var(--teal); }
.tb-proof-doc { display: grid; grid-template-columns: minmax(0, 1fr) 160px; gap: 16px; padding: 16px 18px; border-radius: 14px; background: #f1f8e9; border: 2px solid var(--mint); }
.tb-proof-doc hr { margin: 10px 0; border: 0; border-top: 1px solid var(--line-2); }
.tb-proof-doc-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; }
.tb-proof-doc-preview { display: grid; gap: 8px; align-content: start; }
.tb-proof-doc-img { padding: 3px; background: #fff; border: 1px solid var(--line-2); border-radius: 8px; }
.tb-proof-doc-img img { display: block; width: 100%; height: auto; }
.tb-proof-doc-preview .tb-btn { width: 100%; }

/* ---------- мобільна адаптивність інших розділів ---------- */
@media (max-width: 991px) {
    .tb-lab-cover, .tb-lab-head, .tb-dir-head { grid-template-columns: 1fr; }
    .tb-lab-head-icon { display: none; }
    .tb-dir-benefits { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .tb-st-top { grid-template-columns: 1fr; }
    .tb-st-grid, .tb-lab-grid { grid-template-columns: 1fr !important; }
    .tb-sch-eggs { grid-template-columns: 1fr; }
    .tb-sch-teachers { grid-template-columns: 1fr; }
    .tb-sch-form-grid.is-two { grid-template-columns: 1fr; }
    .tb-lab-head-action, .tb-lab-head-action .tb-btn, .tb-lab-regform { width: 100%; min-width: 0; }
    .tb-lab-about-head { grid-template-columns: 1fr; }
    .tb-lab-card-foot { flex-direction: column; align-items: stretch; }
    .tb-lab-card-foot .tb-btn { width: 100%; }
    .tb-lab-card-date { text-align: left; }
    /* у стовпчику дата й час — одним рядком, а не час окремим рядком під датою */
    .tb-lab-card-date .tb-lab-card-time { display: inline; }
    .tb-lab-banner { max-width: none; }
    .tb-dir-filter-actions { justify-content: stretch; }
    .tb-dir-filter-actions > div, .tb-dir-filter-actions .tb-btn { width: 100%; }
    .tb-proof-input { max-width: none; }
    .tb-proof-form-row .tb-btn { width: 100%; }
    .tb-proof-doc { grid-template-columns: 1fr; }
    .tb-proof-doc-cols { grid-template-columns: 1fr; }
}
/* шапка статті: темний градієнт під текстом, щоб заголовок читався на будь-якій обкладинці */
.tb-jr-art-hero-bg { position: absolute; inset: 0; background-position: center; background-size: cover; }
.tb-jr-art-hero-body { position: relative; z-index: 1; display: grid; gap: 10px; min-height: 360px; align-content: end; padding: 24px 26px; color: #fff; background: linear-gradient(180deg, rgba(38, 50, 56, .28) 0%, rgba(38, 50, 56, .5) 40%, rgba(38, 50, 56, .92) 100%); }
.tb-jr-art-hero-body h1, .tb-jr-art-hero-body .tb-jr-art-title { color: #fff !important; text-shadow: 0 2px 6px rgba(0, 0, 0, .45); }
.tb-jr-art-hero-body a, .tb-jr-art-hero-body span { color: #fff; }
.tb-jr-art-hero-body { background: linear-gradient(180deg, rgba(38, 50, 56, .25) 0%, rgba(38, 50, 56, .55) 45%, rgba(38, 50, 56, .92) 100%) !important; }

/* крихти над сіткою статті — обидві колонки починаються на одній лінії */
.tb-jr-article > .tb-crumbs { margin: 0 0 14px; }
.tb-jr-hero-link { background: linear-gradient(180deg, rgba(38, 50, 56, .22) 0%, rgba(38, 50, 56, .45) 40%, rgba(38, 50, 56, .9) 100%); }
/* рубрика журналу: посилання на вебінари — нативна картка (іконка, назва, опис, дія) замість класичного банера-картинки */
.tb-jr-webinars { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 18px; background: linear-gradient(100deg, var(--paper-2, #fff8e1) 0%, #fff 70%); border: 2px solid var(--line); box-shadow: 0 4px 0 var(--line); color: var(--ink) !important; text-decoration: none !important; transition: border-color .15s, box-shadow .15s, transform .15s; }
.tb-jr-webinars:hover { border-color: var(--ink-3); box-shadow: 0 6px 0 var(--line-2); transform: translateY(-1px); }
.tb-jr-webinars:focus-visible { outline: 3px solid var(--sky); outline-offset: 2px; }
.tb-jr-webinars-ico { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--go); color: #fff; box-shadow: 0 3px 0 var(--go-d); }
.tb-jr-webinars-ico svg { width: 24px; height: 24px; }
.tb-jr-webinars-body { display: grid; gap: 2px; min-width: 0; }
.tb-jr-webinars-title { font: 800 17px/1.25 var(--f-display); color: var(--ink); }
.tb-jr-webinars-sub { font: 600 13.5px/1.35 var(--f-body); color: var(--ink-2); }
.tb-jr-webinars-cta svg { width: 16px; height: 16px; }
.tb-jr-webinars:hover .tb-jr-webinars-cta { border-color: var(--ink-3); }
@media (max-width: 640px) {
    .tb-jr-webinars { grid-template-columns: 44px minmax(0, 1fr); gap: 10px 12px; }
    .tb-jr-webinars-ico { width: 44px; height: 44px; }
    .tb-jr-webinars-cta { grid-column: 1 / -1; width: 100%; justify-content: center; }
}
/* школа: аватар учителя — ініціали, поверх них фото (якщо завантажилось) */
.tb-sch-teacher-avatar { position: relative; display: grid; place-items: center; overflow: hidden; background: var(--paper-2); color: var(--ink-2); }
.tb-sch-teacher-avatar b { font: 800 13px/1 var(--f-display); letter-spacing: .02em; }
.tb-sch-teacher-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.tb-sch-teacher-name { min-width: 0; line-height: 1.3; }
.tb-sch-invite .tb-sch-teacher-avatar { background: #fff3d6; color: var(--orange-d); }
.tb-sch-invite .tb-sch-teacher-avatar .lucide { width: 18px; height: 18px; }
.tb-sch-docs { display: grid; gap: 12px; }
.tb-sch-docs .tb-page-title { margin: 8px 0 0; }
@media (max-width: 640px) {
    .tb-sch .tb-sch-eggs { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px; }
    .tb-sch .tb-sch-eggs .tb-stat-tile { padding: 10px 8px; }
    .tb-sch .tb-sch-eggs .tb-stat-tile b { font-size: 22px; }
    .tb-sch .tb-sch-eggs .tb-stat-tile span { font-size: 12px; line-height: 1.25; }
}