/* Короткие классы строк списков статических публичных страниц (банк
   заданий): строк на странице до 60, страниц — десятки тысяч, и длинные
   цепочки утилит Tailwind в каждой строке удваивали вес HTML. Файл копирует
   в dist/seo/ scripts/prerender-public.mjs. Цвета — те же, что у PublicShell. */
.sr-row { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 16px; transition: background-color .16s ease; }
.sr-row:hover { background: rgba(0, 122, 255, .06); }
.sr-row:active { transform: scale(.995); }
.sr-b { width: 40px; height: 40px; flex-shrink: 0; border-radius: 12px; color: #fff; font-weight: 700; font-size: 15px;
  display: flex; align-items: center; justify-content: center; box-shadow: 0 1px 3px rgba(0, 0, 0, .12);
  background: linear-gradient(135deg, var(--a, #007AFF), var(--b, #5E5CE6)); }
.sr-m { min-width: 0; flex: 1; }
.sr-t { display: block; font-size: 15px; font-weight: 600; line-height: 1.35; color: #15264a; }
.sr-s { display: block; margin-top: 2px; font-size: 13px; line-height: 1.35; color: #4f5f85;
  overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.sr-c { flex-shrink: 0; font-size: 13px; font-weight: 500; color: #007AFF; }
.sr-x { flex-shrink: 0; font-size: 18px; line-height: 1; color: rgba(79, 95, 133, .6); transition: transform .16s ease; }
.sr-row:hover .sr-x { transform: translateX(2px); }
.dark .sr-t { color: #fff; }
.dark .sr-s { color: #aab4c8; }
.dark .sr-c { color: #4DA3FF; }
/* Чипы предметов каталога репетиторов (server/publicCatalog.js). */
.sr-chip { display: inline-flex; align-items: center; height: 32px; padding: 0 12px; border-radius: 9999px;
  background: rgba(0, 122, 255, .1); color: #007AFF; font-size: 13px; font-weight: 600; }
.sr-chip.is-on { background: #007AFF; color: #fff; }
.dark .sr-chip:not(.is-on) { color: #4DA3FF; }
/* Окно заявки «Подберите репетитора» (src/seo/MatchCta.jsx). */
.pub-trap { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.pub-dialog { border: 0; max-height: calc(100dvh - 32px); overflow-y: auto; color: inherit; }
.pub-dialog::backdrop { background: rgba(10, 20, 40, .35); backdrop-filter: blur(4px); }
.pub-dialog[open] { animation: pub-pop .22s cubic-bezier(.2, .9, .3, 1.2); }
@keyframes pub-pop { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
/* Итог готового варианта и таймер. */
.var-ok { color: #30a14e; }
.var-bad { color: #ff375f; }
.var-timer { position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 40;
  padding: 10px 16px; border-radius: 9999px; color: #fff; font-weight: 700; font-variant-numeric: tabular-nums;
  background: linear-gradient(135deg, #007AFF, #5E5CE6); box-shadow: 0 8px 24px rgba(0, 122, 255, .35); }
/* Карточки каталога репетиторов (server/publicCatalog.js). */
.cat-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.cat-head { font-size: 13px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: #4f5f85; padding: 4px 8px 8px; }
.dark .cat-head { color: #aab4c8; }
.cat-card { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 18px; transition: background-color .16s ease; }
.cat-card:hover { background: rgba(0, 122, 255, .06); }
.cat-card.is-pro { box-shadow: inset 0 0 0 1px rgba(0, 122, 255, .18); margin-bottom: 6px; }
.cat-main { display: flex; align-items: center; gap: 12px; min-width: 0; flex: 1; }
.cat-about { -webkit-line-clamp: 2; }
.cat-badge { display: inline-flex; align-items: center; height: 20px; padding: 0 8px; margin-left: 6px; border-radius: 9999px; vertical-align: 2px;
  font-size: 11px; font-weight: 700; color: #fff; background: linear-gradient(135deg, #30D158, #0A84FF); }
.cat-side { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex-shrink: 0; }
.cat-price { font-size: 14px; font-weight: 700; color: #15264a; white-space: nowrap; }
.dark .cat-price { color: #fff; }
.cat-go { display: inline-flex; align-items: center; height: 36px; padding: 0 14px; border-radius: 9999px; font-size: 14px; font-weight: 600;
  color: #fff; background: #007AFF; white-space: nowrap; transition: transform .12s ease, opacity .12s ease; }
.cat-go:active { transform: scale(.96); opacity: .85; }
@media (max-width: 520px) {
  .cat-card { flex-wrap: wrap; }
  .cat-side { flex-direction: row; align-items: center; justify-content: space-between; width: 100%; }
}