@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Playfair+Display:wght@600;700;800&display=swap');

/* ===== Литературный Союз авторов — главная ===== */

:root {
  --bg: #ffffff;
  --bg-soft: #faf8ff;
  --ink: #1a1330;
  --muted: #5f5873;
  --line: #ece8f6;
  --line-2: #e2dcf2;
  --accent: #6a3fd0;        /* фиолетовый — основной */
  --accent-soft: #5630ad;
  --accent-d: #5630ad;
  --accent-l: #8a63e6;
  --accent-2: #ef5a3c;      /* коралл — второй акцент */
  --accent-2-bright: #ff6a4a;
  --accent-2-d: #c23f29;
  --chip: #ece4fb;
  --chip2: #fde3dc;
  --copper: #ef5a3c;
  --ok: #2e9b6b;
  --radius: 14px;
  --radius-lg: 20px;
  --shadow: 0 10px 30px rgba(60,40,120,.08);
  --shadow-lg: 0 24px 60px rgba(60,40,120,.16);
  --gold-grad: linear-gradient(135deg, #7c52e6, #6a3fd0);
  --display: "Playfair Display", "Lora", Georgia, "Times New Roman", serif;
  --serif: "Lora", Georgia, "PT Serif", "Times New Roman", serif;
  --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: clip; }
body { max-width: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: var(--sans); font-size: 17px; line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3 { font-family: var(--display); font-weight: 700; line-height: 1.16; letter-spacing: -0.01em; margin: 0; }
a { color: inherit; text-decoration: none; }
.container { width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 16px; }
.muted { color: var(--muted); }

/* Доступность: видимый фокус для навигации с клавиатуры */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible,
select:focus-visible, summary:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 4px;
}

/* ===== Buttons ===== */
.btn {
  display: inline-block; padding: 12px 22px; border-radius: 999px;
  font-size: 15px; font-weight: 600; cursor: pointer; border: 1px solid transparent;
  transition: transform .08s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
}
.btn:hover { transform: translateY(-1px); }
.btn-primary { background: var(--accent); color: #fff; }
.btn-primary:hover { box-shadow: 0 8px 20px rgba(106, 63, 208, .28); }
.btn-gold { background: var(--accent-2); color: #fff; }
.btn-gold:hover { background: var(--accent-2-d); box-shadow: 0 10px 24px rgba(239, 90, 60, .38); }
.btn-ghost { background: transparent; color: var(--ink); border-color: var(--line); }
.btn-ghost:hover { border-color: var(--accent); color: var(--accent); }
/* btn-light — вторичная кнопка. На СВЕТЛОМ фоне (hero и пр.) — фиолетовый контур;
   ВНУТРИ тёмных/цветных контейнеров автоматически переключается на белый (см. ниже). */
.btn-light { background: transparent; color: var(--accent); border-color: var(--line-2); }
.btn-light:hover { background: var(--chip); border-color: var(--accent); }
/* тёмный контекст → светлая кнопка (иначе фиолетовый текст на фиолетовом = невидим).
   ВНИМАНИЕ: только РЕАЛЬНО тёмные контейнеры. .cab-head/.faq-cta/.founder/.projects-sec — СВЕТЛЫЕ, их тут НЕТ. */
.cta-band .btn-light, .panel.dark .btn-light, .promo .btn-light,
.course-strip .btn-light, .market-cta .btn-light, [class*="dark"] .btn-light {
  background: rgba(255,255,255,.12); color: #fff; border-color: rgba(255,255,255,.45);
}
.cta-band .btn-light:hover, .panel.dark .btn-light:hover, .promo .btn-light:hover,
.course-strip .btn-light:hover, .market-cta .btn-light:hover, [class*="dark"] .btn-light:hover {
  background: rgba(255,255,255,.22); border-color: #fff; color: #fff;
}

/* ===== Header ===== */
.site-header {
  position: sticky; top: 0; z-index: 30;
  background: rgba(255, 255, 255, 0.92); backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--line);
}
.site-header .container { display: flex; align-items: center; justify-content: space-between; height: 66px; }
.brand { display: flex; align-items: center; gap: 11px; font-family: var(--display); font-weight: 700; font-size: 20px; letter-spacing: -0.01em; color: var(--ink); }
.brand .mark {
  width: 38px; height: 38px; border-radius: 50%;
  border: 1.5px solid var(--accent);
  background: linear-gradient(150deg,#7c52e6,#5630ad);
  display: grid; place-items: center; flex: none;
}
.brand .mark svg { width: 19px; height: 19px; fill: #fff; }
.nav { display: flex; gap: 24px; align-items: center; }
.nav a { color: var(--muted); font-size: 15px; }
.nav a:not(.btn):hover { color: var(--accent); }   /* .btn сохраняет свой белый текст на hover */
.nav a.cur { color: var(--ink); }
.nav a.cur::after { content: ""; display: block; height: 2px; background: var(--accent); border-radius: 2px; margin-top: 3px; }
.nav .btn { color: #fff; }
.nav .btn.cur::after { display: none; }
@media (max-width: 760px) { .nav a:not(.btn) { display: none; } }

/* Бургер-меню (мобильное) */
.burger { display: none; flex-direction: column; gap: 5px; width: 44px; height: 40px; align-items: center; justify-content: center; background: none; border: 1px solid var(--line-2); border-radius: 10px; cursor: pointer; flex: none; }
.burger span { width: 20px; height: 2px; background: var(--accent); border-radius: 2px; transition: transform .2s ease, opacity .2s ease; }
.burger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.burger.open span:nth-child(2) { opacity: 0; }
.burger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.mobile-menu { position: fixed; inset: 66px 0 0 0; background: var(--bg-soft); z-index: 35; transform: translateX(100%); transition: transform .25s ease; overflow-y: auto; padding: 22px 20px 40px; display: flex; flex-direction: column; }
.mobile-menu.open { transform: none; }
.mobile-menu .mm-aud { display: flex; gap: 6px; border: 1px solid var(--line-2); border-radius: 999px; padding: 4px; margin-bottom: 18px; }
.mobile-menu .mm-aud a { flex: 1; text-align: center; padding: 11px; border-radius: 999px; color: var(--muted); font-weight: 600; }
.mobile-menu .mm-aud a.on { background: var(--accent); color: #fff; }
.mobile-menu > a { color: var(--ink); font-family: var(--serif); font-size: 19px; padding: 15px 8px; border-bottom: 1px solid var(--line); }
.mobile-menu > a.cur { color: var(--accent); }
.mobile-menu .mm-auth { margin-top: 20px; }
.mobile-menu .mm-auth .btn { width: 100%; text-align: center; }
.mobile-menu .mm-logout { display: block; text-align: center; margin-top: 14px; color: var(--accent); font-weight: 600; }
@media (max-width: 760px) {
  .burger { display: flex; }
  .site-header .nav, .site-header .aud-switch { display: none; }
}

/* ===== Hero (тёмный, кинематографичный) ===== */
.hero {
  padding: 92px 0 64px; color: var(--ink);
  background:
    radial-gradient(1100px 460px at 50% -12%, rgba(106,63,208,.20), transparent 62%),
    var(--bg-soft);
  border-bottom: 1px solid rgba(106,63,208,.18);
}
.hero .container { max-width: 940px; text-align: center; }
.hero .quill { width: 54px; height: 54px; margin: 0 auto 22px; display: grid; place-items: center; border: 1.5px solid var(--accent); border-radius: 50%; }
.hero .quill svg { width: 28px; height: 28px; fill: var(--accent); }
.eyebrow {
  display: inline-block; font-size: 13px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--accent); font-weight: 700; margin-bottom: 18px;
}
.hero h1 { font-size: clamp(27px, 6vw, 58px); margin-bottom: 20px; color: var(--ink); overflow-wrap: break-word; }
@media (max-width: 560px) { .hero { padding: 60px 0 44px; } }
.hero h1 em { font-style: normal; color: var(--accent); }
.hero p.lead { font-size: clamp(17px, 2.4vw, 21px); color: var(--muted); margin: 0 auto 30px; max-width: 720px; }
.hero-actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.stats { display: flex; gap: 0; justify-content: center; margin-top: 46px; flex-wrap: wrap;
  border-top: 1px solid rgba(106,63,208,.22); padding-top: 26px; }
.stat { padding: 0 36px; position: relative; }
.stat + .stat::before { content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: 1px; background: rgba(106,63,208,.22); }
@media (max-width: 560px) { .stat { padding: 0 22px; } }
.stat .num { font-family: var(--display); font-weight: 700; font-size: 34px; color: var(--accent); line-height: 1.1; }
.stat .lbl { font-size: 14px; color: var(--muted); margin-top: 2px; }

/* ===== Карусель жанров в герое ===== */
.gcar { position: relative; max-width: 1180px; margin: 8px auto 0; padding: 8px 28px 6px; }
.grow { display: flex; gap: 18px; overflow-x: auto; scroll-behavior: smooth; padding: 10px 2px; scrollbar-width: none; }
.grow::-webkit-scrollbar { display: none; }
.gc { flex: none; width: 170px; aspect-ratio: 3/4; border-radius: 14px; position: relative; overflow: hidden; display: flex; align-items: flex-end; padding: 16px; color: #fff; box-shadow: var(--shadow); transition: transform .18s ease, box-shadow .2s ease; }
.gc .g { position: absolute; inset: 0; }
.gc::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,.06), transparent 40%, rgba(0,0,0,.66)); }
.gc .em { position: absolute; width: 64%; height: 64%; right: -12%; top: 5%; fill: rgba(255,255,255,.06); transform: rotate(-12deg); }
.gc .gfoot { position: relative; z-index: 1; }
.gc .gn { font-family: var(--display); font-weight: 700; font-size: 20px; line-height: 1.1; }
.gc .gcount { font-size: 12.5px; opacity: .85; margin-top: 4px; font-weight: 600; }
.gc:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.garr { position: absolute; top: calc(50% - 4px); transform: translateY(-50%); width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line-2); background: #fff; color: var(--accent); font-size: 21px; display: grid; place-items: center; cursor: pointer; z-index: 3; box-shadow: var(--shadow); }
.garr:hover { background: var(--accent); color: #fff; border-color: var(--accent); }
.garr.prev { left: 6px; } .garr.next { right: 6px; }
@media (max-width: 760px) { .garr { display: none; } }

/* ===== Sections ===== */
.section { padding: clamp(40px, 5vw, 64px) 0; }
.section.tight { padding: clamp(32px, 4vw, 48px) 0; }
.section.alt { background: var(--bg-soft); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.section-head { display: flex; align-items: end; justify-content: space-between; margin-bottom: 26px; gap: 20px; flex-wrap: wrap; }
.section-head h2 { font-size: clamp(25px, 4vw, 34px); }
.section-head p { color: var(--muted); margin: 6px 0 0; }
.section-head .link { color: var(--accent); font-weight: 600; font-size: 14px; white-space: nowrap;
  border: 1px solid var(--line-2); border-radius: 999px; padding: 9px 17px; transition: background .15s ease, color .15s ease, border-color .15s ease; }
.section-head .link:hover { background: var(--accent); color: #fff; border-color: var(--accent); }

/* ===== Три оффера (центр главной) ===== */
.offers { background: var(--bg-soft); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.offers-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
@media (max-width: 900px) { .offers-grid { grid-template-columns: 1fr; } }
.offer {
  position: relative; background: var(--bg); border: 1px solid var(--line);
  border-radius: 18px; padding: 30px 26px; overflow: hidden;
  transition: transform .12s ease, box-shadow .2s ease;
}
.offer:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.offer::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--accent-2); }
.offer.hot::before { background: var(--accent); }
.offer .ic { font-size: 30px; line-height: 1; margin-bottom: 16px; }
.offer .who { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--accent-2); font-weight: 700; }
.offer.hot .who { color: var(--accent); }
.offer h3 { font-size: 22px; margin: 8px 0 10px; }
.offer p { color: var(--muted); margin: 0; font-size: 15.5px; }

/* ===== Жанровые чипы ===== */
.chips { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 26px; }
.chip {
  border: 1px solid var(--line); background: var(--bg-soft); color: var(--muted);
  padding: 8px 16px; border-radius: 999px; font-size: 14px; cursor: pointer;
  transition: all .15s ease; font-weight: 600;
}
.chip:hover { border-color: var(--accent); color: var(--accent); }
.chip.active { background: var(--accent); color: #fff; border-color: var(--accent); }

.grid-count { color: var(--muted); font-size: 14px; margin: -8px 0 22px; }
.grid-count b { color: var(--ink); font-weight: 700; }
.grid-count a { color: var(--accent); font-weight: 600; white-space: nowrap; }
.grid-count a:hover { text-decoration: underline; }

/* ===== Карточка произведения ===== */
.grid-works { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
@media (max-width: 980px) { .grid-works { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .grid-works { grid-template-columns: 1fr; } }

.work {
  background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--radius);
  overflow: hidden; display: flex; flex-direction: column;
  transition: transform .12s ease, box-shadow .2s ease;
}
.work:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.cover { aspect-ratio: 3 / 4; display: flex; align-items: flex-end; padding: 18px; color: #fff; position: relative; overflow: hidden; }
.cover .g { position: absolute; inset: 0; z-index: 0; }
/* Верхний блик + нижняя виньетка — глубина и читаемость заголовка */
.cover::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,.22) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 46%, rgba(0,0,0,.62) 100%); }
/* Тонкая внутренняя рамка + фиолетовый блик слева — «обрез» обложки */
.cover::before { content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; border-radius: inherit;
  border: 1px solid rgba(255,255,255,.10); box-shadow: inset 2px 0 0 rgba(124,82,230,.30), inset 0 -1px 0 rgba(255,255,255,.05); }
/* Эмблема-перо как фактура обложки */
.cover-emblem { position: absolute; z-index: 1; width: 64%; height: 64%; right: -13%; top: 4%;
  fill: rgba(255,255,255,.05); transform: rotate(-12deg); pointer-events: none; }
.cover-foot { position: relative; z-index: 2; width: 100%; }
.cover-kicker { display: inline-block; font-family: var(--sans); font-size: 10.5px; font-weight: 700;
  letter-spacing: .09em; text-transform: uppercase; color: var(--accent-2-bright); margin-bottom: 7px;
  text-shadow: 0 1px 6px rgba(0,0,0,.5); }
.cover .cover-title { font-family: var(--display); font-weight: 700; font-size: 22px; line-height: 1.12;
  text-shadow: 0 2px 14px rgba(0,0,0,.55); }
.cover .badge {
  position: absolute; top: 12px; right: 12px; z-index: 1;
  font-size: 12px; font-weight: 700; padding: 5px 10px; border-radius: 999px;
  background: rgba(255,255,255,.92); color: var(--ink);
}
.cover .badge.free { background: var(--ok); color: #fff; }
.cover .flag {
  position: absolute; top: 12px; left: 12px; z-index: 1; font-size: 11px; font-weight: 700;
  letter-spacing: .04em; padding: 4px 9px; border-radius: 999px; text-transform: uppercase;
  background: var(--accent); color: #fff;
}
.cover .flag.new { background: var(--accent-2); color: #fff; }
.cover .audio-flag { position: absolute; left: 10px; bottom: 10px; z-index: 2; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 14px; background: rgba(106,63,208,.92); box-shadow: 0 2px 8px rgba(20,16,30,.3); }
.work .body { padding: 14px 16px 18px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.work .author { color: var(--muted); font-size: 14px; }
.work .meta { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 10px; }
.tag { font-size: 12px; color: var(--accent); background: rgba(106,63,208,.08); padding: 3px 9px; border-radius: 999px; }
.rating { font-size: 14px; color: var(--muted); }
.rating b { color: var(--ink); }
.price { font-weight: 700; }
.price.free { color: var(--ok); }

/* ===== Горизонтальные ленты витрин ===== */
.row { display: flex; gap: 18px; overflow-x: auto; padding: 12px 2px 16px; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; touch-action: pan-x pan-y; }
.row .work { min-width: 230px; max-width: 230px; scroll-snap-align: start; }
.row::-webkit-scrollbar { height: 8px; }
.row::-webkit-scrollbar-thumb { background: var(--line); border-radius: 999px; }

/* ===== Обёртка карусели: стрелки + края ===== */
.car-wrap { position: relative; }
.car-wrap.no-car .row { justify-content: center; }
.car-arrow {
  position: absolute; top: calc(50% - 9px); transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line-2);
  background: #fff; color: var(--accent); font-size: 24px; line-height: 1; font-weight: 400;
  cursor: pointer; display: grid; place-items: center; z-index: 6; box-shadow: 0 6px 18px rgba(60,40,120,.20);
  transition: opacity .2s ease, transform .12s ease, background .15s ease, color .15s ease, border-color .15s ease;
}
.car-arrow:hover { background: var(--accent); color: #fff; border-color: var(--accent); transform: translateY(-50%) scale(1.06); }
.car-arrow.prev { left: -8px; }
.car-arrow.next { right: -8px; }
.car-arrow.hide { opacity: 0; pointer-events: none; }
/* градиентные края — намёк, что лента продолжается */
.car-wrap::before, .car-wrap::after { content: ""; position: absolute; top: 0; bottom: 16px; width: 34px; z-index: 5; pointer-events: none; opacity: 0; transition: opacity .2s ease; }
.car-wrap::before { left: 0; background: linear-gradient(90deg, var(--bg), transparent); }
.car-wrap::after { right: 0; background: linear-gradient(270deg, var(--bg), transparent); }
.car-wrap.fade-l::before { opacity: 1; }
.car-wrap.fade-r::after { opacity: 1; }
.section.alt .car-arrow, .offers .car-arrow, .subs .car-arrow { background: var(--bg); }
@media (max-width: 760px) { .car-arrow { display: none; } .car-wrap::before, .car-wrap::after { display: none; } }

/* ===== Хит недели ===== */
.hit { display: grid; grid-template-columns: 1.1fr 1fr; gap: 32px; align-items: stretch; }
@media (max-width: 860px) { .hit { grid-template-columns: 1fr; } }
.hit-feature {
  position: relative; border-radius: 20px; overflow: hidden; color: #fff;
  min-height: 340px; display: flex; align-items: flex-end; box-shadow: var(--shadow);
}
.hit-feature .g { position: absolute; inset: 0; }
.hit-feature .cover-emblem { position: absolute; z-index: 0; width: 52%; height: 52%; right: -8%; top: 8%; fill: var(--bg-soft); transform: rotate(-12deg); pointer-events: none; }
.hit-feature .shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.78)); }
.hit-feature .inner { position: relative; z-index: 1; padding: 32px; }
.hit-feature .flag { display: inline-block; background: var(--accent-2); color: #fff; font-weight: 700; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; }
.hit-feature h3 { font-size: clamp(26px, 4vw, 38px); margin: 14px 0 8px; }
.hit-feature .by { color: #ddd6ef; margin-bottom: 16px; }
.hit-feature .hf-meta { display: flex; gap: 18px; align-items: center; margin-bottom: 18px; font-size: 15px; color: #f0e6da; }
.hit-list { display: flex; flex-direction: column; gap: 6px; }
.hit-list h4 { font-family: var(--sans); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin: 0 0 8px; }
.hit-item { display: flex; align-items: center; gap: 14px; padding: 12px; border-radius: 12px; transition: background .15s ease; }
.hit-item:hover { background: var(--bg-soft); }
.hit-item .rank { font-family: var(--serif); font-size: 24px; color: var(--accent-2); width: 28px; text-align: center; }
.hit-item .hi-body { flex: 1; }
.hit-item .hi-title { font-weight: 600; }
.hit-item .hi-sub { font-size: 13px; color: var(--muted); }
.hit-item .hi-price { font-weight: 700; font-size: 14px; white-space: nowrap; }
.hit-item .hi-price.free { color: var(--ok); }

/* ===== Подписки ===== */
.subs { background: var(--bg-soft); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.subs-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
@media (max-width: 1040px) { .subs-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px) { .subs-grid { grid-template-columns: 1fr; } }
.sub {
  background: var(--bg); border: 1px solid var(--line); border-radius: 16px; padding: 22px 20px;
  display: flex; flex-direction: column; gap: 10px; transition: transform .12s ease, box-shadow .2s ease;
}
.sub:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.sub.accent { background: linear-gradient(160deg, #6a3fd0, #4a2aa0); color: #fff; border-color: transparent; }
.sub .kind { font-family: var(--serif); font-size: 19px; }
.sub.accent .kind { color: #fff; }
.sub .desc { font-size: 14px; color: var(--muted); flex: 1; }
.sub.accent .desc { color: #e6e0f4; }
.sub .price { font-weight: 700; color: var(--accent); }
.sub.accent .price { color: var(--accent-2); }
.sub .pill { align-self: flex-start; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; background: var(--accent-2); color: #fff; padding: 3px 9px; border-radius: 999px; }

/* ===== Сплит-блоки (автор / заработок) ===== */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 44px; align-items: center; }
@media (max-width: 860px) { .split { grid-template-columns: 1fr; gap: 28px; } }
.split .eyebrow { margin-bottom: 12px; }
.split h2 { font-size: clamp(26px, 4vw, 36px); margin-bottom: 14px; }
.split p.lead { color: var(--muted); margin: 0 0 22px; }
.flow { display: flex; flex-direction: column; gap: 14px; }
.flow .step { display: flex; gap: 14px; align-items: flex-start; }
.flow .step .n { flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; font-family: var(--serif); font-weight: 700; background: rgba(106,63,208,.1); color: var(--accent); }
.flow .step .t { font-weight: 600; }
.flow .step .d { color: var(--muted); font-size: 15px; }
.panel { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 18px; padding: 30px; box-shadow: var(--shadow); }
.panel.dark { background: linear-gradient(135deg, #6a3fd0, #4a2aa0); color: #fff; border: none; }
.panel .big { font-family: var(--serif); font-size: clamp(34px, 6vw, 52px); color: var(--accent); }
.panel.dark .big { color: var(--accent-2); }
.panel .cap { color: var(--muted); }
.panel.dark .cap { color: #ddd6ef; }
.panel hr { border: none; border-top: 1px solid var(--line); margin: 20px 0; }
.panel.dark hr { border-top-color: rgba(255,255,255,.14); }

/* ===== Курс (скромный раздел) ===== */
.course-strip {
  display: flex; flex-wrap: wrap; align-items: center; gap: 22px 34px;
  background: linear-gradient(135deg, #6a3fd0, #4a2aa0); color: #fff;
  border-radius: 18px; padding: 28px 32px;
}
.course-strip .cs-main { flex: 1 1 300px; min-width: 0; }
@media (max-width: 760px) { .course-strip { flex-direction: column; align-items: stretch; text-align: center; } }
.course-strip .badge-c { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--accent-2); font-weight: 700; }
.course-strip h3 { font-size: 24px; margin: 6px 0; }
.course-strip p { color: #e6e0f4; margin: 6px 0 0; font-size: 15px; max-width: 560px; }
.course-strip .cnums { display: flex; gap: 22px; flex: none; }
.course-strip .cnums .n { font-family: var(--serif); font-size: 24px; color: var(--accent-2); }
.course-strip .cnums .l { font-size: 12px; color: #d6cef0; }
.course-strip .btn { flex: none; }
@media (max-width: 760px) { .course-strip .cnums { justify-content: center; } }

/* ===== Блог ===== */
.grid-blog { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
@media (max-width: 820px) { .grid-blog { grid-template-columns: 1fr; } }
.article { background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--radius); padding: 24px; transition: box-shadow .2s ease, transform .12s ease; }
.article:hover { box-shadow: var(--shadow); transform: translateY(-3px); }
.article .cat { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--accent-2); font-weight: 700; }
.article h3 { font-size: 20px; margin: 10px 0 14px; }
.article .read { color: var(--muted); font-size: 14px; }

/* ===== Как это работает (цикл) ===== */
.flywheel { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
@media (max-width: 900px) { .flywheel { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .flywheel { grid-template-columns: 1fr; } }
.fw-step { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 16px; padding: 24px 22px; }
.fw-step .n { width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; font-family: var(--serif); font-weight: 700; font-size: 18px; background: var(--accent); color: #fff; margin-bottom: 14px; }
.fw-step .who { font-size: 11px; letter-spacing: .07em; text-transform: uppercase; font-weight: 700; color: var(--accent-2); display: block; margin-bottom: 6px; }
.fw-step h3 { font-size: 18px; margin-bottom: 8px; }
.fw-step p { color: var(--muted); font-size: 14.5px; margin: 0; }
.fw-note { text-align: center; margin-top: 24px; color: var(--muted); font-size: 15.5px; }
.fw-note b { color: var(--accent); }

/* ===== FAQ ===== */
.faq { display: grid; grid-template-columns: 1fr 1fr; gap: 0 36px; }
@media (max-width: 760px) { .faq { grid-template-columns: 1fr; } }
.faq details { border-bottom: 1px solid var(--line); padding: 16px 0; }
.faq summary { cursor: pointer; font-weight: 600; font-size: 16.5px; list-style: none; display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--accent); font-size: 24px; line-height: 1; flex: none; }
.faq details[open] summary::after { content: "\2212"; }
.faq p { color: var(--muted); font-size: 15px; margin: 12px 0 2px; }

/* ===== Слово основателя (тёмный кинематографичный блок) ===== */
.founder {
  color: var(--ink);
  background:
    radial-gradient(800px 360px at 82% 0%, rgba(106,63,208,.14), transparent 56%),
    var(--bg-soft);
  border-top: 1px solid rgba(106,63,208,.18); border-bottom: 1px solid rgba(106,63,208,.18);
}
.founder .container { display: grid; grid-template-columns: auto 1fr; gap: 36px; align-items: center; }
@media (max-width: 720px) { .founder .container { grid-template-columns: 1fr; text-align: center; } }
.founder .seal { width: 92px; height: 92px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.30); display: grid; place-items: center; background: linear-gradient(150deg, #7c52e6, #5630ad); box-shadow: 0 8px 22px rgba(60,40,120,.28); }
@media (max-width: 720px) { .founder .seal { margin: 0 auto; } }
.founder .seal svg { width: 46px; height: 46px; fill: var(--accent-2); }
.founder blockquote { font-family: var(--serif); font-size: clamp(20px, 3vw, 29px); line-height: 1.42; margin: 0; color: var(--ink); }
.founder blockquote::before { content: "«"; color: var(--accent-2); }
.founder blockquote::after { content: "»"; color: var(--accent-2); }
.founder .who { margin-top: 18px; color: var(--accent-2); font-weight: 700; font-size: 16px; }
.founder .who span { color: var(--muted); font-weight: 400; }

/* ===== Журнал Союза (рубрики) ===== */
.grid-journal { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 900px) { .grid-journal { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .grid-journal { grid-template-columns: 1fr; } }
.rubric {
  background: var(--bg-soft); border: 1px solid var(--line); border-left: 4px solid var(--accent-2);
  border-radius: 14px; padding: 22px 22px 24px; transition: transform .12s ease, box-shadow .2s ease;
}
.rubric:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.rubric .meta-r { font-size: 12px; letter-spacing: .05em; text-transform: uppercase; color: var(--accent); font-weight: 700; }
.rubric h3 { font-size: 19px; margin: 8px 0 10px; }
.rubric p { color: var(--muted); font-size: 14.5px; margin: 0; }

/* ===== Финальный CTA ===== */
.cta-band { background: linear-gradient(135deg, var(--accent), #3f2480); color: #fff; border-radius: 22px; padding: 50px 40px; text-align: center; box-shadow: var(--shadow-lg); }
.cta-band h2 { font-size: clamp(26px, 4vw, 38px); margin-bottom: 12px; }
.cta-band p { color: #e6e0f4; max-width: 620px; margin: 0 auto 26px; }
.cta-band .hero-actions { justify-content: center; }

/* ===== Footer ===== */
.site-footer { background: #171026; color: #c6bedd; padding: 48px 0 32px; margin-top: 24px; }
.site-footer .container { display: flex; justify-content: space-between; gap: 30px; flex-wrap: wrap; }
.site-footer .brand { color: #fff; }
.site-footer a { color: #b4abce; font-size: 15px; }
.site-footer a:hover { color: #fff; }
.site-footer .cols { display: flex; gap: 60px; flex-wrap: wrap; }
.site-footer .col h4 { font-family: var(--sans); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: #857ea6; margin: 0 0 12px; }
.site-footer .col a { display: block; margin-bottom: 8px; }
.copy { color: #7b7299; font-size: 13px; margin-top: 30px; border-top: 1px solid #2c2444; padding-top: 18px; }

/* ============================================================= */
/* ===== Страница произведения (work.html) ===== */
.breadcrumb { padding: 22px 0 0; font-size: 14px; color: var(--muted); }
.breadcrumb a:hover { color: var(--accent); }
.breadcrumb .sep { margin: 0 8px; opacity: .5; }

/* Шапка книги — тёмная, кинематографичная */
.work-top {
  color: var(--ink); padding: 34px 0 40px; margin-bottom: 8px;
  background:
    radial-gradient(900px 420px at 78% -10%, rgba(106,63,208,.16), transparent 60%),
    var(--bg-soft);
  border-bottom: 1px solid rgba(106,63,208,.18);
}
.work-hero { display: grid; grid-template-columns: 300px 1fr; gap: 40px; align-items: start; }
@media (max-width: 820px) { .work-hero { grid-template-columns: 1fr; gap: 26px; } }

.wh-cover { position: relative; border-radius: 16px; overflow: hidden; aspect-ratio: 3/4; box-shadow: var(--shadow-lg); }
@media (max-width: 820px) { .wh-cover { max-width: 260px; } }
.wh-cover .g { position: absolute; inset: 0; }
.wh-cover .ttl { position: absolute; left: 0; right: 0; bottom: 0; padding: 20px; z-index: 1; font-family: var(--serif); font-size: 26px; color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.4); }
.wh-cover .age { position: absolute; top: 12px; right: 12px; z-index: 1; background: rgba(0,0,0,.55); border: 1px solid rgba(255,255,255,.25); color: #fff; font-size: 12px; font-weight: 700; padding: 4px 9px; border-radius: 8px; }
.wh-cover .status { position: absolute; top: 12px; left: 12px; z-index: 1; background: var(--accent-2); color: #fff; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 4px 9px; border-radius: 999px; }

.wh-info h1 { font-size: clamp(28px, 4vw, 42px); color: var(--ink); margin-bottom: 8px; }
.wh-author { color: var(--muted); font-size: 17px; margin-bottom: 4px; }
.wh-author a { color: var(--accent-2); }
.wh-series { color: var(--muted); font-size: 14px; margin-bottom: 16px; }
.wh-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.wh-tags .t { font-size: 13px; color: var(--accent); background: var(--chip); border: 1px solid transparent; padding: 4px 12px; border-radius: 999px; }
.reactions { display: flex; gap: 22px; flex-wrap: wrap; margin-bottom: 22px; }
.reaction { display: flex; align-items: center; gap: 8px; }
.reaction .e { font-size: 20px; }
.reaction .n { font-weight: 700; color: var(--ink); }
.reaction .l { font-size: 13px; color: var(--muted); }

/* Панель действий */
/* цена/подписки/заметка живут в модалке .buy-box (см. ниже) */
.buy-box .price-lg { font-family: var(--serif); font-size: 30px; color: var(--ink); margin-bottom: 14px; }
.buy-box .price-lg .free { color: #6fcf97; }
.buy-box .acts { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 18px; }

/* строка действий в шапке книги: [Читать] [Купить/Подписки] [⋯] */
.wh-cta { margin-top: 18px; max-width: 460px; }
.wh-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.wh-dots { width: 46px; padding-left: 0; padding-right: 0; font-size: 22px; line-height: 1; letter-spacing: .04em; }
.wh-more { position: relative; }
.more-menu { position: absolute; top: calc(100% + 8px); right: 0; min-width: 232px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-lg); padding: 6px; display: none; z-index: 40; }
.more-menu.open { display: grid; gap: 2px; }
.more-menu a { padding: 11px 12px; border-radius: 8px; color: var(--ink); font-size: 14px; }
.more-menu a:hover { background: rgba(106,63,208,.07); color: var(--accent); }

/* модалка покупки/подписки */
.buy-modal { position: fixed; inset: 0; z-index: 90; display: none; align-items: center; justify-content: center; padding: 20px; }
.buy-modal.open { display: flex; }
.buy-back { position: absolute; inset: 0; background: rgba(20,16,30,.55); backdrop-filter: blur(2px); }
.buy-box { position: relative; z-index: 1; background: var(--bg); border: 1px solid var(--line); border-radius: 20px; padding: 32px 28px 28px; max-width: 460px; width: 100%; max-height: 90vh; overflow-y: auto; box-shadow: var(--shadow-lg); animation: pwup .25s ease; }
.buy-close { position: absolute; top: 12px; right: 14px; background: none; border: none; font-size: 26px; line-height: 1; color: var(--muted); cursor: pointer; }
.buy-close:hover { color: var(--accent); }
.sub-ways { border-top: 1px solid var(--line-2); padding-top: 16px; display: grid; gap: 10px; }
.sub-ways .h { font-size: 12px; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); font-weight: 700; }
.sub-way { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 14.5px; color: var(--muted); }
.sub-way .p { color: var(--accent-2); font-weight: 700; white-space: nowrap; }
/* Заметка «автор ищет читателей» — тихая, не залитый фиолетом блок (успокаиваем карточку) */
.earn-banner { margin-top: 18px; background: rgba(106,63,208,.07); border: 1px solid var(--line-2); border-radius: 12px; padding: 14px 16px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.earn-banner .e { font-size: 22px; }
.earn-banner .txt { font-size: 13.5px; color: var(--ink); flex: 1; min-width: 170px; }
.earn-banner .txt b { color: var(--accent-2); }

/* Подвкладки-якоря */
.subnav { position: sticky; top: 66px; z-index: 15; background: rgba(250,248,255,.92); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
.subnav .container { display: flex; gap: 26px; overflow-x: auto; }
.subnav a { padding: 16px 0; font-size: 15px; color: var(--muted); font-weight: 600; white-space: nowrap; border-bottom: 2px solid transparent; }
.subnav a:hover { color: var(--accent); }
/* закреплённая кнопка чтения в липком подменю — справа, всегда под рукой */
.subnav-read-slot { margin-left: auto; display: flex; align-items: center; flex: none; padding-left: 16px; }
.subnav .subnav-read { padding: 8px 18px; font-size: 13.5px; color: #fff; border-bottom: 1px solid transparent; }
.subnav .subnav-read:hover { color: #fff; }

/* Аннотация + характеристики */
.annotation { font-size: 17px; line-height: 1.7; color: var(--ink); max-width: 760px; }
.annotation p { margin: 0 0 14px; }
.meta-table { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 40px; max-width: 760px; }
@media (max-width: 600px) { .meta-table { grid-template-columns: 1fr; } }
.meta-table .row { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.meta-table .k { color: var(--muted); }
.meta-table .v { font-weight: 600; text-align: right; }

/* Оглавление (свёрнуто по умолчанию; главы раскрываются) */
.toc-wrap { max-width: 760px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg-soft); overflow: hidden; }
.toc-wrap > summary { cursor: pointer; list-style: none; padding: 16px 20px; font-family: var(--serif); font-size: 19px; font-weight: 700; display: flex; align-items: center; justify-content: space-between; }
.toc-wrap > summary::-webkit-details-marker { display: none; }
.toc-wrap > summary .hint { font-family: var(--sans); font-size: 13px; font-weight: 400; color: var(--muted); margin-left: auto; margin-right: 12px; }
.toc-wrap > summary::after { content: "▾"; color: var(--accent-2); }
.toc-wrap[open] > summary::after { content: "▴"; }
.toc-list { border-top: 1px solid var(--line); }
.chapter { border-bottom: 1px solid var(--line); }
.chapter:last-child { border-bottom: none; }
.chapter > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 12px; padding: 11px 18px; transition: background .15s ease; }
.chapter > summary::-webkit-details-marker { display: none; }
.chapter > summary:hover { background: rgba(106,63,208,.04); }
.chapter .cn { font-family: var(--serif); color: var(--accent-2); font-size: 17px; width: 26px; text-align: center; flex: none; }
.chapter .ct { flex: 1; font-weight: 600; font-size: 15px; }
.chapter .ct small { color: var(--muted); font-weight: 400; font-size: 12px; margin-left: 8px; }
.chapter .lock { font-size: 13px; color: var(--muted); white-space: nowrap; }
.chapter.free .lock { color: var(--ok); font-weight: 600; }
.chapter.current > summary { border-left: 3px solid var(--accent); background: rgba(106,63,208,.05); }
.chapter .badge-cur { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #fff; background: var(--accent); padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.chapter .ch-body { padding: 2px 18px 16px 56px; color: var(--muted); font-size: 14.5px; }
.chapter .ch-body p { margin: 0 0 12px; }

/* Впечатления (отзывы) */
.reviews { max-width: 820px; display: grid; gap: 14px; }
.review { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 14px; padding: 20px; }
.review .head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.review .ava { width: 40px; height: 40px; border-radius: 50%; background: var(--accent); color: #fff; display: grid; place-items: center; font-weight: 700; flex: none; }
.review .who { font-weight: 600; }
.review .who small { display: block; color: var(--muted); font-weight: 400; font-size: 13px; }
.review .react { margin-left: auto; font-size: 13px; color: var(--accent); font-weight: 700; white-space: nowrap; }
.review p { margin: 0; color: var(--ink); }

/* Об авторе */
.author-card { display: flex; gap: 20px; align-items: center; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 16px; padding: 24px; max-width: 760px; }
@media (max-width: 560px) { .author-card { flex-direction: column; text-align: center; } }
.author-card .ava { width: 72px; height: 72px; border-radius: 50%; background: linear-gradient(150deg, #7c52e6, #5630ad); display: grid; place-items: center; color: #fff; font-family: var(--serif); font-size: 28px; flex: none; }
.author-card .ainfo { flex: 1; }
.author-card .ainfo h3 { font-size: 21px; margin-bottom: 4px; }
.author-card .ainfo .ameta { color: var(--muted); font-size: 14px; margin-bottom: 8px; }
.author-card .ainfo p { margin: 0; color: var(--ink); font-size: 15px; }

/* Форматы (Текст / Аудио) */
.formats { display: inline-flex; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; overflow: hidden; margin-bottom: 16px; }
.formats span { padding: 6px 16px; font-size: 14px; color: var(--muted); }
.formats span.on { background: var(--accent-2); color: #fff; font-weight: 700; }
.formats span.soon { opacity: .55; }

/* Статистика книги (оценки · отзывы · цитаты) */
.work-stats { display: flex; gap: 28px; flex-wrap: wrap; margin-bottom: 20px; }
.work-stats .st .v { font-family: var(--serif); font-size: 22px; color: var(--ink); }
.work-stats .st .l { font-size: 13px; color: var(--muted); }

/* Полоски-реакции (как у Яндекса) */
.rbars { display: grid; gap: 11px; max-width: 340px; margin-bottom: 22px; }
.rbar .top { display: flex; justify-content: space-between; font-size: 14px; margin-bottom: 5px; }
.rbar .top .l { color: var(--muted); }
.rbar .top .l .e { margin-right: 7px; }
.rbar .top .c { color: var(--ink); font-weight: 700; }
.rbar .track { height: 6px; background: var(--line-2); border-radius: 999px; overflow: hidden; }
.rbar .fill { height: 100%; background: var(--accent); border-radius: 999px; }

/* Доп-действия */
/* вторичные действия — тихие текст-ссылки под разделителем (не пёстрые пилюли; hover фиолетовый, не белый) */
.sec-actions { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.sec-actions a { font-size: 13px; color: var(--muted); font-weight: 600; }
.sec-actions a:hover { color: var(--accent); }

/* Категории (теги в стиле Яндекса) */
.cats { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 22px; }
.cats .c { font-size: 13px; color: var(--accent); background: rgba(106,63,208,.08); padding: 5px 13px; border-radius: 999px; }

/* Сворачиваемое описание (кнопка-тоггл всегда внизу) */
.collapse-text { max-width: 760px; font-size: 17px; line-height: 1.7; color: var(--ink); }
.ct-body { position: relative; }
.ct-body p { margin: 0 0 14px; }
.ct-body.clamped { max-height: 92px; overflow: hidden; }
.ct-body.clamped::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 46px; background: linear-gradient(transparent, var(--bg)); }
.ct-toggle { background: none; border: none; padding: 0; margin-top: 8px; cursor: pointer; color: var(--accent); font-weight: 600; font-size: 15px; font-family: var(--sans); }
.ct-toggle:hover { text-decoration: underline; }

/* Характеристики в стиле Яндекса (в колонки) */
.specs { max-width: 860px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 36px; }
@media (max-width: 860px) { .specs { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .specs { grid-template-columns: 1fr; } }
.specs .s { padding: 9px 0; font-size: 15px; border-bottom: 1px solid var(--line); }
.specs .s .k { color: var(--muted); }
.specs .s .v { color: var(--ink); font-weight: 600; }
.specs .s a.v { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.specs .s a.v:hover { color: #5630ad; }

/* Цитаты */
.quotes { max-width: 760px; display: grid; gap: 14px; }
.quote { background: var(--bg-soft); border-left: 4px solid var(--accent-2); border-radius: 0 12px 12px 0; padding: 18px 22px; font-family: var(--serif); font-size: 18px; font-style: italic; color: var(--ink); line-height: 1.5; }
.quote .meta { display: block; margin-top: 10px; font-style: normal; font-family: var(--sans); font-size: 13px; color: var(--muted); }

/* ===== Доп-правки страницы книги ===== */
/* Кликабельные теги/категории и шапка */
.cats .c { cursor: pointer; }
.cats a.c:hover { background: rgba(106,63,208,.16); }
.wh-series a, .wh-author a { color: var(--accent-2); }
.wh-series a:hover, .wh-author a:hover { color: var(--accent); }
.wh-author .aname { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.wh-author .aname:hover { color: var(--accent-2); }

/* Прогресс чтения (шапка) */
.read-progress { max-width: 340px; margin-bottom: 22px; }
.read-progress .top { display: flex; justify-content: space-between; font-size: 13px; color: var(--muted); margin-bottom: 6px; }
.read-progress .top b { color: var(--ink); }
.read-progress .track { height: 6px; background: var(--line-2); border-radius: 999px; overflow: hidden; margin-bottom: 12px; }
.read-progress .fill { height: 100%; background: var(--accent); }

/* Кнопка в earn-banner */
.earn-banner { flex-wrap: wrap; }
.earn-banner .btn { padding: 8px 15px; font-size: 13px; margin-top: 2px; }

/* Сравнение подписок (выгода) */
.sub-compare { border-top: 1px solid var(--line-2); padding-top: 16px; display: grid; gap: 9px; }
.sub-compare .h { font-size: 12px; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); font-weight: 700; }
.sub-row { display: grid; grid-template-columns: 1fr auto; gap: 3px 12px; padding: 10px 13px; border: 1px solid var(--line-2); border-radius: 11px; }
.sub-row.best { border-color: var(--accent-2); background: rgba(106,63,208,.10); }
.sub-row .t { color: var(--ink); font-size: 14.5px; font-weight: 600; }
.sub-row .p { color: var(--accent-2); font-weight: 700; text-align: right; white-space: nowrap; }
.sub-row .d { grid-column: 1 / -1; color: var(--muted); font-size: 12.5px; }
.sub-row .d b { color: var(--ink); }
.sub-row .pill { display: inline-block; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; background: var(--accent-2); color: #fff; padding: 2px 7px; border-radius: 999px; margin-left: 6px; vertical-align: middle; }

/* Заголовок впечатлений + средний рейтинг */
.reviews-head { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; justify-content: space-between; margin-bottom: 22px; }
.reviews-rating { display: flex; align-items: center; gap: 14px; }
.reviews-rating .big { font-family: var(--serif); font-size: 48px; color: var(--accent); line-height: 1; }
.reviews-rating .stars { color: var(--accent-2); font-size: 16px; letter-spacing: 2px; }
.reviews-rating .sub { color: var(--muted); font-size: 13px; }

/* Лента активности «Читают сейчас» */
.activity { max-width: 760px; display: grid; gap: 10px; }
.act { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 12px; }
.act .ava { width: 34px; height: 34px; border-radius: 50%; background: var(--accent); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: 14px; flex: none; }
.act .txt { flex: 1; font-size: 14.5px; }
.act .txt b { font-weight: 600; }
.act .when { color: var(--muted); font-size: 13px; white-space: nowrap; display: flex; align-items: center; gap: 7px; }
.act .when .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ok); }

/* Возрастной гейт 18+ (ФЗ-436) */
.age-gate { position: fixed; inset: 0; z-index: 100; background: rgba(20,16,30,.93); backdrop-filter: blur(5px); display: grid; place-items: center; padding: 24px; }
.age-gate .box { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 18px; padding: 36px; max-width: 420px; text-align: center; box-shadow: var(--shadow-lg); }
.age-gate .ic { font-size: 42px; }
.age-gate h3 { font-size: 24px; margin: 12px 0 8px; }
.age-gate p { color: var(--muted); margin: 0 0 22px; }
.age-gate .acts { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* Плашка фильтра каталога (перелинковка с главной) */
.filter-note { margin-bottom: 16px; color: var(--muted); font-size: 14px; }
.filter-note b { color: var(--ink); }
.filter-note a { color: var(--accent); font-weight: 600; }

/* Тумблер аудитории в шапке (переключение страниц) */
.aud-switch { display: inline-flex; gap: 4px; border: 1px solid rgba(106,63,208,.45); border-radius: 999px; padding: 3px; flex: none; }
.aud-switch a { padding: 6px 15px; border-radius: 999px; font-size: 13px; font-weight: 600; color: var(--muted); white-space: nowrap; transition: all .15s ease; }
.aud-switch a:hover { color: var(--accent); background: rgba(106,63,208,.08); }   /* не белый — иначе невидим на светлом */
.aud-switch a.on, .aud-switch a.on:hover { background: var(--accent); color: #fff; }
@media (max-width: 520px) { .aud-switch a { padding: 6px 11px; font-size: 12px; } }
@media (max-width: 600px) { .brand .bt { display: none; } }

/* Ценовые пакеты (страница авторов) */
.tier-price { font-family: var(--serif); font-size: 30px; color: var(--accent); margin: 6px 0 10px; }
.tier-price small { font-family: var(--sans); font-size: 14px; color: var(--muted); font-weight: 600; }

/* Список преимуществ (что внутри курса и т.п.) */
.bullets { max-width: 760px; display: grid; gap: 10px; margin: 22px 0 0; padding: 0; list-style: none; }
.bullets li { padding-left: 26px; position: relative; color: var(--muted); }
.bullets li::before { content: "✦"; position: absolute; left: 0; color: var(--accent-2); }

/* Промо-блоки (Голоса, Архив без пыли) */
.promos { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
@media (max-width: 760px) { .promos { grid-template-columns: 1fr; } }
/* Промо-блоки — единая «тёмная панель» (как .panel.dark / .vs-card.good), различаются
   лишь тонким акцентом-полосой слева. Так блоки не «кардинально разные». */
.promo { position: relative; overflow: hidden; color: #fff; border-radius: 18px; padding: 28px 28px 28px 32px; box-shadow: var(--shadow);
  background: linear-gradient(135deg, #6a3fd0, #4a2aa0); border: none; }
.promo::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--accent-2); }
.promo.voices::before { background: rgba(255,255,255,.6); }
.promo.archive::before { background: var(--accent-2); }
.promo .k { font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--accent-2); font-weight: 700; }
.promo.voices .k { color: var(--accent-l); }
.promo h3 { font-size: 22px; margin: 8px 0 10px; color: #fff; }
.promo p { color: #e6e0f4; font-size: 14.5px; margin: 0 0 18px; }

/* ===== Каталог: двухпанельная раскладка с независимым скроллом ===== */
.cat-shell { height: calc(100vh - 66px); display: flex; flex-direction: column; }
.cat-shell .work-top { flex: none; padding: 16px 0; }
.cat-layout { flex: 1; min-height: 0; display: grid; grid-template-columns: 286px 1fr; }
.filters { display: grid; gap: 18px; align-content: start; height: 100%; overflow-y: scroll; padding: 22px 22px 34px; border-right: 1px solid var(--line); }
.cat-main { height: 100%; overflow-y: scroll; }
.cat-main-inner { padding: 24px 32px 44px; }
.filters::-webkit-scrollbar, .cat-main::-webkit-scrollbar { width: 11px; }
.filters::-webkit-scrollbar-track, .cat-main::-webkit-scrollbar-track { background: transparent; }
.filters::-webkit-scrollbar-thumb, .cat-main::-webkit-scrollbar-thumb { background: #d8cef0; border-radius: 999px; border: 3px solid var(--bg); }
.filters::-webkit-scrollbar-thumb:hover, .cat-main::-webkit-scrollbar-thumb:hover { background: var(--accent-2); }
@media (max-width: 880px) {
  .cat-shell { height: auto; display: block; }
  .cat-shell .work-top { padding: 24px 0 16px; }
  .cat-layout { display: block; height: auto; }
  .filters, .cat-main { height: auto; overflow: visible; }
  .filters { border-right: none; border-bottom: 1px solid var(--line); padding: 0 0 18px; margin-bottom: 6px; }
  .cat-main-inner { padding: 0; }
}
.filters .f-group { border-bottom: 1px solid var(--line); padding-bottom: 16px; }
.filters .f-group:last-child { border-bottom: none; }
.filters h4 { font-size: 12px; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); margin: 0 0 12px; }
.filters .btn { width: 100%; text-align: center; }
.f-price-out { font-weight: 700; color: var(--accent); }
input[type="range"] { width: 100%; accent-color: var(--accent); margin: 6px 0; }

/* переключатели */
.switch { display: flex; align-items: center; gap: 11px; font-size: 14.5px; cursor: pointer; margin-bottom: 12px; }
.switch:last-child { margin-bottom: 0; }
.switch input { appearance: none; -webkit-appearance: none; width: 38px; height: 22px; background: var(--line); border-radius: 999px; position: relative; cursor: pointer; transition: background .2s ease; flex: none; }
.switch input::after { content: ""; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: left .2s ease; box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.switch input:checked { background: var(--accent); }
.switch input:checked::after { left: 18px; }

/* чекбоксы */
.check { display: flex; align-items: center; gap: 9px; font-size: 14.5px; cursor: pointer; margin-bottom: 9px; }
.check:last-child { margin-bottom: 0; }
.check input { width: 17px; height: 17px; accent-color: var(--accent); cursor: pointer; flex: none; }

/* заголовок результатов */
.results-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; flex-wrap: wrap; }
.results-head .rc { color: var(--muted); font-size: 15px; }
.results-head .rc b { color: var(--ink); }
.results-head .reset { color: var(--accent); font-weight: 600; font-size: 14px; }

/* карусели подборок */
.car { margin-bottom: 14px; }
.car-title { font-family: var(--serif); font-size: clamp(21px, 3vw, 27px); margin: 30px 0 14px; }

/* рейтинг с крупными цифрами (топ-10) */
.rank-row { display: flex; gap: 6px; overflow-x: auto; padding: 12px 2px 18px; }
.rank-row::-webkit-scrollbar { height: 8px; }
.rank-row::-webkit-scrollbar-thumb { background: var(--line); border-radius: 999px; }
.rank-item { position: relative; flex: none; width: 176px; padding-left: 50px; scroll-snap-align: start; }
.rank-item .rk { position: absolute; left: 0; bottom: 30px; font-family: var(--serif); font-weight: 800; font-size: 130px; line-height: .7; color: var(--ink); opacity: .12; z-index: 0; pointer-events: none; }
.rank-item .rcover { position: relative; z-index: 1; display: block; height: 188px; border-radius: 10px; overflow: hidden; box-shadow: var(--shadow); transition: transform .12s ease, box-shadow .2s ease; }
.rank-item .rcover .rt { position: absolute; left: 0; right: 0; bottom: 0; padding: 10px; color: #fff; font-family: var(--serif); font-size: 15px; line-height: 1.15; text-shadow: 0 2px 8px rgba(0,0,0,.45); }
.rank-item .rcap { display: block; margin-top: 9px; font-size: 13.5px; color: var(--ink); line-height: 1.3; }
.rank-item .rcap b { display: block; color: var(--muted); font-weight: 400; font-size: 12px; }
.rank-item:hover .rcover { box-shadow: var(--shadow-lg); transform: translateY(-3px); }

/* ===== Читалка ===== */
body.reading { --read-bg: #fdfcff; --read-ink: #211b2e; --read-soft: #f7f4ff; --read-line: #ece8f6; background: var(--read-bg); }
body.reading.rt-sepia { --read-bg: #f3e9d2; --read-ink: #3a2f1c; --read-soft: #efe3c6; --read-line: #ddcfa8; }
body.reading.rt-dark  { --read-bg: #14121c; --read-ink: #d8d2e4; --read-soft: #1d1a28; --read-line: #2c2740; }

.reader-toolbar { position: sticky; top: 66px; z-index: 20; background: var(--read-soft); border-bottom: 1px solid var(--read-line); }
.reader-toolbar .rt-prog { height: 3px; background: var(--accent); width: 0; transition: width .1s linear; }
.reader-toolbar .rt-inner { display: flex; align-items: center; gap: 14px; padding: 10px 0; }
.reader-toolbar .rt-inner .container { display: flex; align-items: center; gap: 14px; width: min(1180px, 92vw); margin: 0 auto; }
.rt-back { color: var(--read-ink); font-size: 14px; font-weight: 600; white-space: nowrap; opacity: .85; }
.rt-back:hover { opacity: 1; color: var(--accent); }
.rt-chsel { flex: 1; min-width: 0; }
.rt-chsel select { width: 100%; max-width: 360px; background: transparent; color: var(--read-ink); border: 1px solid var(--read-line); border-radius: 8px; padding: 7px 10px; font-family: var(--sans); font-size: 14px; cursor: pointer; }
.rt-tools { display: flex; align-items: center; gap: 6px; }
.rt-btn { width: 36px; height: 34px; display: grid; place-items: center; border: 1px solid var(--read-line); background: transparent; color: var(--read-ink); border-radius: 8px; cursor: pointer; font-size: 14px; font-weight: 700; }
.rt-btn:hover { border-color: var(--accent); color: var(--accent); }
.rt-btn.on { background: var(--accent); color: #fff; border-color: var(--accent); }
@media (max-width: 620px) { .rt-back span { display: none; } }

.read-task { max-width: 720px; margin: 20px auto -12px; background: rgba(106,63,208,.13); border: 1px solid var(--read-line); border-radius: 12px; padding: 12px 16px; color: var(--read-ink); font-size: 14px; }
.read-task b { color: var(--accent); }
.reader { max-width: 720px; margin: 0 auto; padding: 44px 20px 90px; color: var(--read-ink); }
.reader .ch-eyebrow { font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--accent-2); font-weight: 700; }
.reader h1.ch-title { font-family: var(--serif); font-size: clamp(28px, 5vw, 40px); margin: 10px 0 30px; color: var(--read-ink); }
.reader .ch-text { font-family: var(--serif); font-size: var(--rfs, 20px); line-height: 1.85; }
.reader .ch-text p { margin: 0 0 1.15em; }
.reader .ch-text p:first-of-type::first-letter { font-size: 3.1em; float: left; line-height: .82; padding: 6px 10px 0 0; color: var(--accent); font-weight: 700; }

.reader-nav { display: flex; justify-content: space-between; gap: 14px; margin-top: 50px; padding-top: 26px; border-top: 1px solid var(--read-line); }
.reader-nav a.nv { flex: 1; max-width: 300px; padding: 14px 18px; border: 1px solid var(--read-line); border-radius: 12px; color: var(--read-ink); display: block; }
.reader-nav a.nv:hover { border-color: var(--accent); }
.reader-nav a.nv.next { text-align: right; margin-left: auto; }
.reader-nav a.nv .s { display: block; font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; }
.reader-nav a.nv .t { font-weight: 600; }
.reader-nav a.nv.disabled { opacity: .4; pointer-events: none; }

.paywall { max-width: 560px; margin: 30px auto; background: var(--read-soft); border: 1px solid var(--read-line); border-radius: 18px; padding: 40px 32px; text-align: center; }
.paywall .ic { font-size: 40px; }
.paywall h2 { font-size: 26px; margin: 12px 0 8px; color: var(--read-ink); }
.paywall p { color: var(--muted); margin: 0 0 22px; }
.paywall .acts { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* текущая глава в тулбаре */
.rt-now { flex: 1; min-width: 0; text-align: center; font-size: 14px; color: var(--read-ink); opacity: .75; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 640px) { .rt-now { display: none; } }

/* Панель-оглавление в читалке */
.toc-backdrop { position: fixed; inset: 0; background: rgba(20,16,30,.5); z-index: 60; opacity: 0; pointer-events: none; transition: opacity .2s ease; }
.toc-backdrop.open { opacity: 1; pointer-events: auto; }
.toc-drawer { position: fixed; top: 0; left: 0; bottom: 0; width: 350px; max-width: 86vw; background: var(--read-soft); border-right: 1px solid var(--read-line); z-index: 61; transform: translateX(-100%); transition: transform .22s ease; display: flex; flex-direction: column; }
.toc-drawer.open { transform: none; }
.toc-head { padding: 20px 22px; border-bottom: 1px solid var(--read-line); display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.toc-head h3 { font-family: var(--serif); font-size: 20px; color: var(--read-ink); margin: 0; }
.toc-head .sub { font-size: 13px; color: var(--muted); margin-top: 3px; }
.toc-close { background: none; border: none; font-size: 26px; cursor: pointer; color: var(--read-ink); line-height: 1; }
.toc-items { overflow-y: auto; padding: 6px 0; }
.toc-i { display: flex; align-items: center; gap: 12px; padding: 12px 22px; color: var(--read-ink); cursor: pointer; border-left: 3px solid transparent; }
.toc-i:hover { background: rgba(106,63,208,.06); }
.toc-i.cur { border-left-color: var(--accent); background: rgba(106,63,208,.08); }
.toc-i .n { font-family: var(--serif); color: var(--accent-2); width: 26px; text-align: center; flex: none; }
.toc-i .tt { flex: 1; font-size: 15px; }
.toc-i .tt small { display: block; font-size: 12px; color: var(--muted); }
.toc-i .mk { font-size: 13px; color: var(--muted); white-space: nowrap; }

/* Конец главы */
.chapter-end { margin-top: 52px; padding-top: 30px; border-top: 1px solid var(--read-line); text-align: center; }
.chapter-end .ce-line { color: var(--muted); font-size: 13px; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 16px; }
.chapter-end .btn.big { padding: 14px 30px; font-size: 16px; }
.chapter-end .ce-fin { font-family: var(--serif); font-size: 26px; color: var(--read-ink); margin-bottom: 18px; }
.chapter-end .ce-sub { display: flex; gap: 20px; justify-content: center; flex-wrap: wrap; margin-top: 20px; }
.chapter-end .ce-sub a, .chapter-end .ce-sub button { color: var(--accent); font-weight: 600; font-size: 14px; background: none; border: none; cursor: pointer; font-family: var(--sans); }
.chapter-end .ce-sub a:hover, .chapter-end .ce-sub button:hover { text-decoration: underline; }
.chapter-end .ce-sub .dis { opacity: .4; pointer-events: none; }

/* Пэйвол-модалка (всплывает при дочитывании бесплатного отрывка) */
.pw-modal { position: fixed; inset: 0; z-index: 80; display: none; align-items: flex-end; justify-content: center; }
.pw-modal.open { display: flex; }
.pw-modal .pw-back { position: absolute; inset: 0; background: rgba(20,16,30,.55); backdrop-filter: blur(2px); }
.pw-box { position: relative; z-index: 1; background: var(--read-soft); border: 1px solid var(--read-line); border-radius: 20px 20px 0 0; padding: 34px 30px 30px; max-width: 520px; width: 100%; text-align: center; box-shadow: var(--shadow-lg); animation: pwup .25s ease; }
@media (min-width: 560px) { .pw-modal { align-items: center; } .pw-box { border-radius: 20px; } }
@keyframes pwup { from { transform: translateY(30px); opacity: .3; } to { transform: none; opacity: 1; } }
.pw-box .ic { font-size: 38px; }
.pw-box h2 { font-family: var(--serif); font-size: 24px; color: var(--read-ink); margin: 10px 0 6px; }
.pw-box > p { color: var(--muted); margin: 0 0 20px; }
.pw-opts { display: grid; gap: 10px; text-align: left; }
.pw-opt { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 16px; border: 1px solid var(--read-line); border-radius: 12px; cursor: pointer; color: var(--read-ink); }
.pw-opt:hover { border-color: var(--accent); }
.pw-opt.main { background: var(--accent); color: #fff; border-color: var(--accent); }
.pw-opt .p { font-weight: 700; white-space: nowrap; }
.pw-opt.main .p { color: var(--accent-2); }
.pw-later { margin-top: 16px; background: none; border: none; color: var(--muted); cursor: pointer; font-size: 14px; font-family: var(--sans); }
.pw-later:hover { color: var(--read-ink); text-decoration: underline; }

/* ===== Кабинет читателя ===== */
.cab-head { color: var(--ink); padding: 30px 0; border-bottom: 1px solid rgba(106,63,208,.18);
  background: radial-gradient(800px 360px at 82% -10%, rgba(106,63,208,.16), transparent 56%), var(--bg-soft); }
.cab-head .container { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.cab-ava { width: 74px; height: 74px; border-radius: 50%; background: linear-gradient(150deg, #7c52e6, #5630ad); display: grid; place-items: center; color: #fff; font-family: var(--serif); font-size: 30px; flex: none; }
.cab-id { flex: 1; min-width: 200px; }
.cab-id h1 { font-size: clamp(24px, 4vw, 34px); color: var(--ink); margin: 0 0 5px; }
.cab-id .rep { color: var(--muted); font-size: 14px; }
.cab-id .rep b { color: var(--accent-2); }
.cab-bal { background: var(--bg-soft); border: 1px solid rgba(106,63,208,.32); border-radius: 16px; padding: 18px 22px; min-width: 230px; }
.cab-bal .l { font-size: 13px; color: var(--muted); }
.cab-bal .b { font-family: var(--serif); font-size: 32px; color: var(--accent-2); margin: 2px 0 12px; }
.cab-bal .acts { display: flex; gap: 8px; flex-wrap: wrap; }
.cab-bal .btn { font-size: 13px; padding: 9px 14px; }

.cab-sec { margin-top: 8px; }
.cab-empty { color: var(--muted); background: var(--bg-soft); border: 1px dashed var(--line); border-radius: 14px; padding: 22px; }
.cab-empty a { color: var(--accent); font-weight: 600; }

/* ---- Страница серии ---- */
.series-ava { font-size: 30px; color: #fff; position: relative; overflow: hidden; }
.series-ava::after { content: ""; position: absolute; inset: 0; background: rgba(20,16,30,.34); }
.series-ava { display: grid; place-items: center; }
.series-ava > * { position: relative; z-index: 1; }
.series-kicker { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--accent-2); font-weight: 700; margin-bottom: 4px; }
.author-series { margin-top: 10px; font-size: 13.5px; color: var(--muted); }
.author-series a { color: var(--accent-2); font-weight: 600; }
.author-socials { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.author-soc { font-size: 13px; font-weight: 600; color: var(--ink); background: var(--bg-soft); border: 1px solid rgba(106,63,208,.35); border-radius: 999px; padding: 6px 13px; }
.author-soc:hover { border-color: var(--accent-2); color: #fff; }
.author-edit { display: inline-block; margin-top: 12px; font-size: 13px; color: var(--accent-2); font-weight: 600; }
.author-edit:hover { text-decoration: underline; }
.cab-id .rep .aname { color: var(--accent-2); font-weight: 600; }
.series-progress { margin-top: 16px; max-width: 420px; }
.series-progress .top { display: flex; justify-content: space-between; font-size: 13px; color: var(--muted); margin-bottom: 6px; }
.series-progress .top b { color: var(--accent-2); }
.series-progress .track { height: 7px; border-radius: 6px; background: var(--line-2); overflow: hidden; }
.series-progress .fill { height: 100%; background: linear-gradient(90deg, var(--accent-2), #8a63e6); border-radius: 6px; }

.series-order { display: grid; gap: 12px; }
.so-item { display: flex; align-items: center; gap: 16px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 16px; padding: 14px 18px; transition: border-color .15s, box-shadow .15s; }
.so-item:hover { border-color: var(--accent-2); box-shadow: 0 6px 22px rgba(31,26,20,.07); }
.so-item.is-done { opacity: .82; }
.so-num { font-family: var(--serif); font-size: 26px; color: var(--accent-2); width: 30px; text-align: center; flex: none; }
.so-cover { position: relative; width: 52px; height: 72px; border-radius: 8px; overflow: hidden; flex: none; box-shadow: 0 4px 12px rgba(31,26,20,.18); }
.so-cover .g { position: absolute; inset: 0; }
.so-cover .badge { position: absolute; left: 4px; bottom: 4px; font-size: 10px; padding: 2px 6px; }
.so-main { flex: 1; min-width: 0; }
.so-title { display: block; font-family: var(--serif); font-size: 19px; color: var(--ink); line-height: 1.2; }
.so-title:hover { color: var(--accent); }
.so-title.muted { color: var(--muted); }
.so-meta { color: var(--muted); font-size: 13px; margin-top: 4px; }
.so-status { margin-top: 7px; min-height: 0; }
.so-pill { display: inline-block; font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 999px; }
.so-pill.done { background: rgba(106,63,208,.1); color: var(--accent); }
.so-pill.read { background: rgba(106,63,208,.16); color: #5630ad; }
.so-pill.new { background: rgba(45,120,90,.14); color: #2c7a52; }
.so-track { height: 5px; border-radius: 5px; background: var(--bg-soft); overflow: hidden; margin-top: 8px; max-width: 260px; }
.so-fill { height: 100%; background: linear-gradient(90deg, var(--accent-2), #8a63e6); }
.so-act { flex: none; display: flex; flex-direction: column; align-items: stretch; gap: 6px; text-align: center; }
.so-act .btn { font-size: 13px; padding: 9px 18px; }
.so-detail { font-size: 12.5px; color: var(--muted); }
.so-detail:hover { color: var(--accent); }
.so-next { display: flex; align-items: center; gap: 16px; border: 1px dashed var(--line); border-radius: 16px; padding: 16px 18px; background: var(--bg-soft); }
.so-next .so-num { color: var(--muted); }

/* ---- О проекте: наши проекты ---- */
a.seal { cursor: pointer; transition: transform .15s, box-shadow .2s; }
a.seal:hover { transform: translateY(-3px); box-shadow: 0 10px 26px rgba(0,0,0,.35); }
.projects-sec { color: var(--ink);
  background:
    radial-gradient(800px 360px at 18% -10%, rgba(106,63,208,.14), transparent 56%),
    var(--bg-soft); }
.projects-sec .section-head h2 { color: var(--ink); }
.projects-sec .section-head p { color: var(--muted); }
.projects-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
@media (max-width: 720px) { .projects-grid { grid-template-columns: 1fr; } }
.project-card { display: flex; flex-direction: column; gap: 14px;
  background: var(--bg); border: 1px solid var(--line); border-radius: 18px;
  padding: 24px; transition: border-color .15s, transform .15s, box-shadow .2s; }
.project-card:hover { border-color: var(--accent-2); transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.project-card.main { border-color: rgba(106,63,208,.55); background: rgba(106,63,208,.08); }
.pc-top { display: flex; align-items: center; gap: 14px; }
.pc-logo { width: 52px; height: 52px; border-radius: 14px; flex: none; display: grid; place-items: center; font-size: 26px;
  background: linear-gradient(150deg, #7c52e6, #5630ad); }
.pc-name { font-family: var(--serif); font-size: 21px; color: var(--ink); line-height: 1.15; }
.pc-handle { font-size: 13px; color: var(--accent-2); margin-top: 3px; }
.pc-desc { color: var(--muted); font-size: 14.5px; line-height: 1.6; margin: 0; flex: 1; }
.pc-tags { display: flex; flex-wrap: wrap; gap: 7px; }
.pc-tag { font-size: 12px; color: var(--accent-d); background: var(--chip); border: 1px solid transparent; border-radius: 999px; padding: 4px 11px; }
.pc-link { color: var(--accent-2); font-weight: 700; font-size: 14.5px; margin-top: 2px; }
.project-card:hover .pc-link { color: #8a63e6; }

/* ---- О проекте: манифест ---- */
.manifesto-sec { text-align: center; }
.manifesto { max-width: 780px; margin: 0 auto; }
.m-kicker { font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--accent-2); font-weight: 700; margin-bottom: 22px; }
.manifesto p { font-family: var(--serif); font-size: clamp(20px, 2.7vw, 28px); line-height: 1.5; color: var(--ink); margin: 0 0 18px; }
.manifesto .dropcap { float: left; font-size: 3.1em; line-height: .82; padding: 6px 14px 0 0; color: var(--accent); font-weight: 700; }
.manifesto .m-credo { color: var(--accent); font-style: italic; }
.m-sign { font-family: var(--sans); font-size: 16px; color: var(--muted); margin-top: 8px; }
.m-sign a { color: var(--accent); font-weight: 700; }
.m-sign span { color: var(--muted); }

/* принципы (убеждения) */
.principles-list { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 54px; }
@media (max-width: 720px) { .principles-list { grid-template-columns: 1fr; } }
.principle { display: flex; gap: 18px; align-items: flex-start; padding: 24px 0; border-bottom: 1px solid var(--line); }
.principle .idx { font-family: var(--serif); font-size: 34px; line-height: 1; color: var(--accent-2); flex: none; width: 46px; }
.principle h3 { font-family: var(--serif); font-size: 21px; margin: 2px 0 7px; }
.principle p { color: var(--muted); font-size: 15px; line-height: 1.62; margin: 0; }

/* путь Союза (таймлайн) */
.path { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.path::before { content: ""; position: absolute; top: 7px; left: 8px; right: 8px; height: 2px; background: linear-gradient(90deg, var(--accent-2), var(--line)); }
.path-step { padding-right: 22px; position: relative; }
.path-step .dot { width: 16px; height: 16px; border-radius: 50%; background: var(--accent-2); border: 3px solid var(--bg); position: relative; z-index: 1; margin-bottom: 16px; }
.path-step .when { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--accent-2); font-weight: 700; margin-bottom: 5px; }
.path-step h3 { font-family: var(--serif); font-size: 19px; margin-bottom: 6px; }
.path-step p { color: var(--muted); font-size: 14px; line-height: 1.55; margin: 0; }
@media (max-width: 760px) {
  .path { grid-template-columns: 1fr; gap: 22px; }
  .path::before { left: 7px; top: 8px; bottom: 8px; right: auto; width: 2px; height: auto; background: linear-gradient(180deg, var(--accent-2), var(--line)); }
  .path-step { padding-left: 28px; padding-right: 0; }
  .path-step .dot { position: absolute; left: 0; top: 2px; margin: 0; }
}

/* люди */
.people-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 620px) { .people-grid { grid-template-columns: 1fr; } }
.person { display: flex; gap: 16px; align-items: flex-start; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 16px; padding: 22px; }
.person .pava { width: 60px; height: 60px; border-radius: 50%; flex: none; display: grid; place-items: center; font-family: var(--serif); font-size: 26px; color: #fff; background: linear-gradient(150deg, #7c52e6, #5630ad); }
.person h3 { font-family: var(--serif); font-size: 20px; margin: 0; }
.person .role { color: var(--accent-2); font-size: 13px; font-weight: 600; margin: 3px 0 9px; }
.person p { color: var(--muted); font-size: 14.5px; line-height: 1.6; margin: 0 0 10px; }
.person a { color: var(--accent); font-weight: 600; font-size: 14px; }

/* ===== Поиск ===== */
.search-btn { background: none; border: 1px solid rgba(106,63,208,.4); border-radius: 10px; width: 40px; height: 38px; color: var(--accent-2); font-size: 16px; cursor: pointer; display: grid; place-items: center; flex: none; transition: border-color .15s, background .15s; }
.search-btn:hover { border-color: var(--accent-2); background: rgba(106,63,208,.14); }
.mm-search { width: 100%; text-align: left; background: var(--bg-soft); border: 1px solid rgba(106,63,208,.32); border-radius: 12px; color: var(--ink); font-size: 16px; padding: 14px 16px; margin-bottom: 16px; cursor: pointer; font-family: var(--serif); }

.search-modal { position: fixed; inset: 0; z-index: 60; background: rgba(20,16,30,.62); backdrop-filter: blur(4px); display: none; padding: 8vh 16px 16px; }
.search-modal.open { display: block; }
.sm-box { max-width: 640px; margin: 0 auto; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 30px 80px rgba(0,0,0,.42); overflow: hidden; display: flex; flex-direction: column; max-height: 84vh; }
.sm-input { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.sm-input .sm-ic { font-size: 18px; opacity: .7; }
.sm-input input { flex: 1; border: none; outline: none; background: none; font-family: var(--sans); font-size: 17px; color: var(--ink); }
.sm-close { border: 1px solid var(--line); background: var(--bg); border-radius: 8px; padding: 5px 9px; font-size: 12px; color: var(--muted); cursor: pointer; flex: none; }
.sm-results { overflow-y: auto; padding: 8px; }
.sm-foot { display: flex; justify-content: space-between; gap: 10px; padding: 10px 16px; border-top: 1px solid var(--line); font-size: 12px; color: var(--muted); flex-wrap: wrap; }
.sm-foot b { color: var(--accent); }

.sr-group { padding: 4px 2px 8px; }
.sr-h { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); font-weight: 700; padding: 8px 8px 4px; display: flex; gap: 6px; }
.sr-h span { color: var(--accent-2); }
.sr-item { display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: 10px; }
.sr-item:hover, .sr-item.on { background: rgba(106,63,208,.14); }
.sr-cover { width: 32px; height: 44px; border-radius: 5px; flex: none; box-shadow: 0 2px 8px rgba(31,26,20,.2); }
.sr-ava { width: 36px; height: 36px; border-radius: 50%; flex: none; display: grid; place-items: center; background: linear-gradient(150deg, #7c52e6, #5630ad); color: var(--accent-2); font-family: var(--serif); font-size: 17px; border: 1px solid var(--accent-2); }
.sr-ico { width: 36px; height: 36px; flex: none; display: grid; place-items: center; font-size: 20px; }
.sr-main { flex: 1; min-width: 0; }
.sr-t { display: block; font-size: 15px; color: var(--ink); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sr-m { display: block; font-size: 12.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sr-tail { flex: none; color: var(--muted); font-size: 13px; }
.sr-tail .badge { font-size: 11px; padding: 2px 7px; }
.sr-more { display: block; padding: 7px 10px; font-size: 13px; color: var(--accent); font-weight: 600; }
.sr-all { display: block; text-align: center; padding: 12px; margin: 6px 2px 2px; background: var(--accent); color: #fff; font-weight: 700; border-radius: 10px; }
.sr-all:hover { background: #5630ad; }
.sm-empty { padding: 34px 16px; text-align: center; color: var(--ink); font-size: 16px; line-height: 1.6; }
.sm-empty span { color: var(--muted); font-size: 14px; }
.sm-empty a { color: var(--accent); font-weight: 600; }
.sm-chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 6px 8px; }
.sm-chip { font-size: 13px; padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink); background: var(--bg); }
.sm-chip:hover { border-color: var(--accent-2); color: var(--accent); }

/* страница поиска */
.search-top { background: radial-gradient(800px 300px at 50% -10%, rgba(106,63,208,.14), transparent 56%), linear-gradient(160deg,#f6f2ff,#faf8ff); color: var(--ink); padding: 40px 0 34px; border-bottom: 1px solid rgba(106,63,208,.18); }
.search-top h1 { font-size: clamp(26px,4vw,38px); color: var(--ink); margin-bottom: 18px; }
.sp-field { display: flex; align-items: center; gap: 12px; background: var(--bg-soft); border: 1px solid rgba(106,63,208,.4); border-radius: 14px; padding: 14px 18px; max-width: 640px; }
.sp-field .ic { font-size: 20px; }
.sp-field input { flex: 1; border: none; outline: none; background: none; color: var(--ink); font-family: var(--sans); font-size: 17px; caret-color: var(--accent); }
.sp-field input::placeholder { color: var(--muted); }
.sp-head { margin-top: 16px; color: var(--muted); font-size: 15px; }
.sp-head b { color: var(--accent-2); }
.sp-block { margin-bottom: 36px; }
.sp-block h2 { font-size: 24px; margin-bottom: 18px; display: flex; gap: 8px; align-items: baseline; }
.sp-block h2 span { font-size: 16px; color: var(--accent-2); }
.sr-list { display: grid; gap: 2px; max-width: 720px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 14px; padding: 6px; }

/* ===== 404 ===== */
.nf { padding: 56px 0 70px; text-align: center;
  background: radial-gradient(700px 320px at 50% -8%, rgba(106,63,208,.10), transparent 58%); }
.nf-wrap { max-width: 680px; }
.nf-code { font-family: var(--serif); font-weight: 700; font-size: clamp(78px, 15vw, 150px); line-height: 1; color: var(--accent); display: flex; align-items: center; justify-content: center; gap: 8px; }
.nf-quill { width: clamp(70px, 13vw, 130px); height: clamp(70px, 13vw, 130px); border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 50% 36%, #7c52e6, #5630ad); box-shadow: 0 12px 34px rgba(106,63,208,.18); }
.nf-quill svg { width: 52%; height: 52%; fill: var(--accent-2); transform: rotate(-8deg); }
.nf .eyebrow { margin-top: 22px; }
.nf h1 { font-size: clamp(24px, 4vw, 36px); margin: 10px 0 14px; }
.nf .lead { color: var(--muted); margin: 0 auto; max-width: 540px; }
.nf-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin: 26px 0 0; }
.nf-hint { margin-top: 16px; color: var(--muted); font-size: 13px; }
.nf-hint b { color: var(--accent); background: var(--bg-soft); border: 1px solid var(--line); border-radius: 6px; padding: 1px 7px; }

/* мини-игра «Поймай перо» */
.game { position: relative; max-width: 560px; height: 320px; margin: 32px auto 0; overflow: hidden;
  border: 1px solid rgba(106,63,208,.32); border-radius: 18px;
  background: radial-gradient(600px 240px at 50% -20%, rgba(106,63,208,.16), transparent 60%), var(--bg-soft); }
.game .hud { position: absolute; top: 0; left: 0; right: 0; z-index: 3; display: flex; justify-content: space-between; gap: 10px; padding: 12px 16px; color: var(--muted); font-size: 13.5px; }
.game .hud b { color: var(--accent-2); }
.feather { position: absolute; z-index: 2; font-size: 30px; line-height: 1; padding: 6px; background: none; border: none; cursor: pointer; user-select: none; -webkit-user-select: none; filter: drop-shadow(0 4px 8px rgba(0,0,0,.4)); }
.feather:hover { transform: scale(1.12); }
.g-overlay { position: absolute; inset: 0; z-index: 4; display: grid; place-items: center; text-align: center; padding: 20px; background: rgba(250,248,255,.82); backdrop-filter: blur(3px); }
.g-overlay.hide { display: none; }
.g-quill { width: 58px; height: 58px; margin: 0 auto 12px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(150deg, #7c52e6, #5630ad); }
.g-quill svg { width: 28px; height: 28px; fill: #fff; }
.g-overlay h3 { font-family: var(--serif); font-size: 24px; color: var(--ink); margin-bottom: 6px; }
.g-overlay p { color: var(--muted); font-size: 14px; max-width: 320px; margin: 0 auto 16px; }
.g-overlay p b { color: var(--accent-2); }

/* ===== Настройки профиля ===== */
.settings { display: grid; grid-template-columns: 200px 1fr; gap: 30px; align-items: start; }
@media (max-width: 760px) { .settings { grid-template-columns: 1fr; } }
.set-side { position: sticky; top: 86px; display: flex; flex-direction: column; gap: 2px; }
@media (max-width: 760px) { .set-side { position: static; flex-direction: row; flex-wrap: wrap; gap: 8px; margin-bottom: 6px; } }
.set-side a { padding: 9px 14px; border-radius: 10px; color: var(--muted); font-weight: 600; font-size: 14.5px; }
.set-side a:hover { background: var(--bg-soft); color: var(--accent); }
.set-main { max-width: 640px; }
.set-card { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 16px; padding: 24px 26px; margin-bottom: 18px; scroll-margin-top: 86px; }
.set-card h2 { font-size: 21px; margin-bottom: 4px; }
.set-note { color: var(--muted); font-size: 13.5px; margin: 0 0 18px; }
.auth-field textarea, .auth-field select { width: 100%; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; font-size: 15px; background: var(--bg); color: var(--ink); box-sizing: border-box; font-family: var(--sans); }
.auth-field textarea:focus, .auth-field select:focus { outline: none; border-color: var(--accent); }
.set-chips { display: flex; flex-wrap: wrap; gap: 9px; }
.set-toggle { display: flex; align-items: center; gap: 11px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 14.5px; color: var(--ink); cursor: pointer; }
.set-toggle:last-child { border-bottom: none; }
.set-toggle input { width: 18px; height: 18px; accent-color: var(--accent); flex: none; cursor: pointer; }
.set-actions { display: flex; align-items: center; gap: 16px; margin: 6px 0 26px; }
.set-saved { color: #2c7a52; font-weight: 700; font-size: 14px; opacity: 0; transform: translateY(4px); transition: opacity .2s, transform .2s; }
.set-saved.show { opacity: 1; transform: none; }
.set-account-acts { display: flex; flex-wrap: wrap; gap: 10px; }
.btn-danger { background: transparent; color: var(--accent); border-color: rgba(106,63,208,.4); }
.btn-danger:hover { background: var(--accent); color: #fff; border-color: var(--accent); }
.mm-auth > a:not(.btn) { display: block; text-align: center; margin-top: 12px; color: var(--muted); font-weight: 600; }

/* ===== Правовые страницы ===== */
.legal-top { background: radial-gradient(700px 280px at 50% -10%, rgba(106,63,208,.12), transparent 58%), linear-gradient(160deg,#f6f2ff,#faf8ff); color: var(--ink); padding: 40px 0 32px; border-bottom: 1px solid rgba(106,63,208,.18); }
.legal-top h1 { font-size: clamp(26px,4vw,38px); color: var(--ink); margin: 8px 0 8px; }
.legal-meta { color: var(--muted); font-size: 14px; }
.legal-body { max-width: 800px; }
.legal-note { background: rgba(106,63,208,.1); border: 1px solid var(--accent-2); border-radius: 12px; padding: 14px 18px; color: var(--ink); font-size: 14px; line-height: 1.6; margin-bottom: 26px; }
.legal-note code { background: rgba(0,0,0,.06); padding: 1px 5px; border-radius: 4px; font-size: 13px; }
.legal-toc { background: var(--bg-soft); border: 1px solid var(--line); border-radius: 14px; padding: 18px 22px; margin-bottom: 28px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px 18px; }
@media (max-width: 600px) { .legal-toc { grid-template-columns: 1fr; } }
.legal-toc b { grid-column: 1 / -1; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-bottom: 4px; }
.legal-toc a { color: var(--accent); font-size: 14.5px; padding: 2px 0; }
.legal-toc a:hover { text-decoration: underline; }
.legal-intro { font-size: 16.5px; color: var(--ink); line-height: 1.7; margin-bottom: 8px; }
.legal-body h2 { font-size: 22px; margin: 32px 0 12px; scroll-margin-top: 80px; padding-top: 6px; }
.legal-body p { color: var(--ink); line-height: 1.75; margin: 0 0 12px; }
.legal-body ol, .legal-body ul { margin: 0 0 14px; padding-left: 24px; }
.legal-body li { color: var(--ink); line-height: 1.7; margin-bottom: 8px; }
.legal-body a { color: var(--accent); font-weight: 600; }
.legal-body a:hover { text-decoration: underline; }
.legal-key { background: rgba(106,63,208,.06); border-left: 4px solid var(--accent); border-radius: 0 12px 12px 0; padding: 16px 20px; margin: 14px 0 16px; }
.legal-key p { margin: 0; color: var(--ink); font-size: 16px; }
.legal-links { margin-top: 36px; padding-top: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: 14.5px; }
.legal-links a { color: var(--accent); font-weight: 600; }

/* правовые ссылки в подвале (добавляет auth.js) */
.foot-legal { display: flex; flex-wrap: wrap; gap: 6px 16px; justify-content: center; padding: 8px 0 4px; }
.foot-legal a { color: #9a8d7d; font-size: 13px; }
.foot-legal a:hover { color: var(--accent-2); }

/* ===== FAQ-центр ===== */
.faq-block { margin-bottom: 30px; scroll-margin-top: 80px; }
.faq-block h2 { font-size: 23px; margin-bottom: 14px; }
.faq-block .faq details.faq-key { border-color: var(--accent-2); background: rgba(106,63,208,.07); }
.faq-block .faq details.faq-key summary { color: var(--accent); }
.faq-cta { background: radial-gradient(600px 240px at 50% -30%, rgba(106,63,208,.16), transparent 60%), linear-gradient(160deg,#f6f2ff,#faf8ff); color: var(--ink); border-radius: 18px; padding: 32px; text-align: center; margin-top: 10px; }
.faq-cta h3 { font-family: var(--serif); font-size: 24px; color: var(--ink); margin-bottom: 6px; }
.faq-cta p { color: var(--muted); margin-bottom: 18px; }
.faq-cta .hero-actions { justify-content: center; }

/* пояснение к продвижению (не покупка отзывов) */
.promo-clar { display: flex; gap: 14px; align-items: flex-start; background: rgba(106,63,208,.1); border: 1px solid var(--accent-2); border-radius: 14px; padding: 16px 20px; margin-bottom: 26px; }
.promo-clar .ic { font-size: 22px; flex: none; }
.promo-clar p { margin: 0; color: var(--ink); font-size: 14.5px; line-height: 1.6; }
.promo-flex { margin-top: 22px; text-align: center; color: var(--muted); font-size: 14.5px; }
.promo-flex a { color: var(--accent); font-weight: 600; }

/* ===== Донат автору ===== */
.dn-modal { position: fixed; inset: 0; z-index: 90; display: none; align-items: center; justify-content: center; padding: 20px; }
.dn-modal.open { display: flex; }
.dn-back { position: absolute; inset: 0; background: rgba(20,16,30,.55); backdrop-filter: blur(2px); }
.dn-box { position: relative; z-index: 1; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 20px; padding: 28px; max-width: 460px; width: 100%; box-shadow: var(--shadow-lg); text-align: center; }
.dn-ic { font-size: 38px; }
.dn-box h3 { font-family: var(--serif); font-size: 22px; margin: 6px 0 4px; }
.dn-sub { color: var(--muted); font-size: 14px; margin-bottom: 18px; }
.dn-sub b { color: var(--ink); }
.dn-amts { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin-bottom: 12px; }
.dn-amt { border: 1px solid var(--line); background: var(--bg); padding: 9px 16px; border-radius: 999px; cursor: pointer; font-size: 15px; font-weight: 700; color: var(--ink); }
.dn-amt:hover { border-color: var(--accent-2); }
.dn-amt.sel { background: var(--accent-2); color: #fff; border-color: var(--accent-2); }
#dn-custom, #dn-msg { width: 100%; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; font-size: 15px; background: var(--bg); color: var(--ink); box-sizing: border-box; margin-bottom: 10px; font-family: var(--sans); }
#dn-custom:focus, #dn-msg:focus { outline: none; border-color: var(--accent-2); }
.dn-box .rv-acts { justify-content: center; }
.dn-note { color: var(--muted); font-size: 12px; margin-top: 12px; }
@media (max-width: 620px) {
  .so-item, .so-next { flex-wrap: wrap; }
  .so-num { width: 22px; font-size: 22px; }
  .so-act { flex-direction: row; width: 100%; margin-top: 4px; align-items: center; justify-content: space-between; }
  .so-track { max-width: none; }
}

/* промо-баннер Биржи прочтений */
.market-cta { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; justify-content: space-between;
  background: linear-gradient(135deg, var(--accent), #3f2480); color: #fff; border-radius: 18px; padding: 26px 30px; }
.market-cta .mc-t { font-family: var(--serif); font-size: 23px; }
.market-cta .mc-d { color: #e6e0f4; font-size: 14.5px; margin-top: 4px; max-width: 560px; }

/* карточка «продолжить читать» */
.cont-meta { color: var(--accent); font-weight: 600; font-size: 13px; }

/* ===== Биржа прочтений: задания ===== */
.task-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 18px; }

/* гейт регистрации на Бирже (для незарегистрированных) */
.gate-wrap { position: relative; }
.gate-wrap .task-grid { max-height: 430px; overflow: hidden; }
.reg-gate { position: absolute; left: 0; right: 0; bottom: 0; top: 130px; display: flex; align-items: flex-end; justify-content: center; background: linear-gradient(180deg, rgba(250,248,255,0) 0%, var(--bg) 52%); padding-bottom: 8px; }
.reg-card { background: var(--bg-soft); border: 1px solid var(--accent-2); border-radius: 18px; padding: 28px 30px; max-width: 520px; text-align: center; box-shadow: var(--shadow-lg); }
.reg-card .ic { font-size: 36px; }
.reg-card h3 { font-size: 23px; margin: 8px 0 6px; }
.reg-offers { list-style: none; padding: 0; margin: 0 auto 20px; display: grid; gap: 8px; text-align: left; max-width: 360px; }
.reg-offers li { padding-left: 26px; position: relative; color: var(--muted); }
.reg-offers li::before { content: "✓"; position: absolute; left: 0; color: var(--ok); font-weight: 700; }
.task { display: flex; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; transition: transform .12s ease, box-shadow .2s ease; }
.task:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.task .tcover { width: 112px; flex: none; position: relative; }
.task .tcover .g { position: absolute; inset: 0; }
.task .tcover .treward { position: absolute; left: 8px; top: 8px; background: var(--accent-2); color: #fff; font-weight: 800; font-size: 14px; padding: 4px 10px; border-radius: 999px; box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.task .tbody { flex: 1; padding: 15px 17px; display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.task .tt { font-family: var(--serif); font-size: 18px; line-height: 1.15; }
.task .tmeta { color: var(--muted); font-size: 13px; }
.task .tmin { font-size: 13px; color: var(--ink); }
.task .tmin b { color: var(--accent); }
.task .tact { margin-top: auto; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; padding-top: 4px; }
.task .tact .btn { padding: 8px 14px; font-size: 13px; }
.tpill { font-size: 12px; font-weight: 700; padding: 5px 11px; border-radius: 999px; }
.tpill.taken { background: rgba(106,63,208,.16); color: #5630ad; }
.tpill.review { background: rgba(47,109,127,.14); color: #2c6070; }
.tpill.paid { background: rgba(47,125,79,.14); color: var(--ok); }

/* лента «Мои задания» */
.mytasks-empty { color: var(--muted); background: var(--bg-soft); border: 1px dashed var(--line); border-radius: 14px; padding: 20px; }
.market-count { color: var(--muted); font-size: 14px; margin-bottom: 16px; }
.market-count b { color: var(--ink); }

/* ===== Форма отклика (модалка) ===== */
.rv-modal { position: fixed; inset: 0; z-index: 90; display: none; align-items: center; justify-content: center; padding: 20px; }
.rv-modal.open { display: flex; }
.rv-back { position: absolute; inset: 0; background: rgba(20,16,30,.55); backdrop-filter: blur(2px); }
.rv-box { position: relative; z-index: 1; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 20px; padding: 28px; max-width: 560px; width: 100%; box-shadow: var(--shadow-lg); max-height: 90vh; overflow-y: auto; }
.rv-box h3 { font-family: var(--serif); font-size: 23px; margin: 0 0 4px; }
.rv-box .rv-sub { color: var(--muted); font-size: 14px; margin-bottom: 18px; }
.rv-react { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.rv-r { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: var(--bg); padding: 9px 14px; border-radius: 999px; cursor: pointer; font-size: 14px; font-weight: 600; color: var(--ink); }
.rv-r .e { font-size: 18px; }
.rv-r:hover { border-color: var(--accent); }
.rv-r.sel { background: var(--accent); color: #fff; border-color: var(--accent); }
.rv-ta { width: 100%; min-height: 132px; border: 1px solid var(--line); border-radius: 12px; padding: 14px; font-family: var(--sans); font-size: 15px; line-height: 1.6; resize: vertical; background: var(--bg); color: var(--ink); box-sizing: border-box; }
.rv-ta:focus { outline: none; border-color: var(--accent); }
.rv-meta { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; font-size: 13px; color: var(--muted); }
.rv-meta .ok { color: var(--ok); font-weight: 600; }
.rv-meta .bad { color: var(--accent); font-weight: 600; }
.rv-note { background: rgba(106,63,208,.1); border-radius: 10px; padding: 11px 13px; font-size: 13px; color: var(--muted); margin-top: 14px; }
.rv-acts { display: flex; gap: 10px; justify-content: flex-end; margin-top: 18px; }
.rv-acts .btn[disabled] { opacity: .45; pointer-events: none; }

/* меню профиля в шапке */
/* компактная пилюля залогиненного пользователя (не большой CTA) */
.um-trigger { display: inline-flex; align-items: center; gap: 9px; padding: 5px 14px 5px 5px; border-radius: 999px;
  background: var(--bg-soft); border: 1px solid var(--line-2); color: var(--ink); font-weight: 600; font-size: 14px; transition: border-color .15s ease, background .15s ease; }
.um-trigger:hover { border-color: var(--accent); background: #fff; }
.um-trigger .um-ava { width: 28px; height: 28px; border-radius: 50%; flex: none; display: grid; place-items: center;
  background: var(--accent); color: #fff; font-size: 13px; font-weight: 700; font-family: var(--sans); }
.user-menu { position: absolute; top: 60px; right: 0; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-lg); min-width: 180px; padding: 6px; display: none; z-index: 40; }
.user-menu.open { display: grid; }
.user-menu .um-head { padding: 10px 12px 8px; font-weight: 700; border-bottom: 1px solid var(--line); margin-bottom: 4px; }
.user-menu .um-head small { display: block; color: var(--muted); font-weight: 400; font-size: 12px; }
.user-menu a { padding: 9px 12px; border-radius: 8px; color: var(--ink); font-size: 14px; }
.user-menu a:hover { background: rgba(106,63,208,.06); color: var(--accent); }
.user-menu .um-logout { color: var(--accent); font-weight: 600; }

/* карточки-рекомендации статей (в .row) */
.row .b-tile { min-width: 280px; max-width: 280px; height: 200px; }
.row .b-tile .b-title { font-size: 18px; }

/* ===== Страница статьи ===== */
.post-cover { aspect-ratio: 21 / 9; border-radius: 18px; position: relative; overflow: hidden; margin-bottom: 22px; color: #fff; display: flex; align-items: flex-end; padding: 28px; box-shadow: var(--shadow); }
.post-cover .g { position: absolute; inset: 0; } .post-cover .shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.72)); }
.post-cover .in { position: relative; z-index: 1; }
.post-rub { display: inline-block; background: var(--accent-2); color: #fff; font-weight: 700; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; padding: 4px 11px; border-radius: 999px; }
.post-cover .post-title { color: #fff; }
.post-title { font-family: var(--serif); font-size: clamp(28px, 5vw, 44px); line-height: 1.15; margin: 14px 0 0; }
.post-byline { display: flex; align-items: center; gap: 12px; margin: 18px 0 2px; }
.post-byline .ava { width: 46px; height: 46px; border-radius: 50%; background: linear-gradient(150deg, #7c52e6, #5630ad); display: grid; place-items: center; color: #fff; font-family: var(--serif); font-size: 21px; flex: none; }
.post-byline .who { font-weight: 600; } .post-byline .who small { display: block; color: var(--muted); font-weight: 400; font-size: 13px; }
.post-lead { font-family: var(--serif); font-size: 20px; line-height: 1.6; color: var(--muted); margin: 16px 0 26px; max-width: 760px; }

.post-layout { display: grid; grid-template-columns: minmax(0,1fr) 250px; gap: 48px; align-items: start; }
@media (max-width: 920px) { .post-layout { grid-template-columns: 1fr; gap: 18px; } }
.post-toc { position: sticky; top: 84px; }
.post-toc h4 { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin: 0 0 12px; }
.post-toc nav { display: grid; gap: 9px; border-left: 2px solid var(--line); padding-left: 14px; }
.post-toc a { color: var(--muted); font-size: 14px; line-height: 1.35; border-left: 2px solid transparent; margin-left: -16px; padding-left: 14px; }
.post-toc a:hover, .post-toc a.active { color: var(--accent); border-left-color: var(--accent); }
.toc-mobile { display: none; }
@media (max-width: 920px) { .post-toc { display: none; } .toc-mobile { display: block; margin-bottom: 18px; } }
.toc-mobile summary { cursor: pointer; font-weight: 600; padding: 12px 16px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 12px; }
.toc-mobile nav { display: grid; gap: 8px; padding: 14px 16px; }
.toc-mobile a { color: var(--muted); font-size: 14px; }

.article-body { max-width: 760px; font-size: 18px; line-height: 1.8; color: var(--ink); }
.article-body > p { margin: 0 0 1.1em; }
.article-body h2 { font-family: var(--serif); font-size: 28px; margin: 1.7em 0 .5em; scroll-margin-top: 84px; }
.article-body h3 { font-family: var(--serif); font-size: 21px; margin: 1.3em 0 .4em; scroll-margin-top: 84px; }
.article-body ul, .article-body ol { margin: 0 0 1.2em; padding-left: 1.45em; }
.article-body li { margin-bottom: .5em; }
.article-body a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
.article-body a:hover { color: #5630ad; }
.article-body strong { font-weight: 700; }
.article-body blockquote { margin: 1.4em 0; padding: 16px 22px; border-left: 4px solid var(--accent-2); background: var(--bg-soft); border-radius: 0 12px 12px 0; font-family: var(--serif); font-style: italic; font-size: 19px; }
.article-body blockquote p { margin: 0; }
.article-body table { width: 100%; border-collapse: collapse; margin: 1.4em 0; font-size: 16px; }
.article-body th, .article-body td { text-align: left; padding: 11px 14px; border-bottom: 1px solid var(--line); vertical-align: top; }
.article-body thead th { background: var(--bg-soft); border-bottom: 2px solid var(--accent-2); }
.article-body tbody tr:hover { background: var(--bg-soft); }
.article-body figure { margin: 1.7em 0; }
.article-body figure img { width: 100%; border-radius: 14px; display: block; box-shadow: var(--shadow); }
.article-body figcaption { color: var(--muted); font-size: 14px; margin-top: 8px; text-align: center; }
.video-embed { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; margin: 1.7em 0; box-shadow: var(--shadow); display: block; }
.video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-embed.poster { display: grid; place-items: center; color: #fff; background: linear-gradient(150deg, #23262b, #3a0d0d); text-decoration: none; }
.video-embed.poster .play { width: 64px; height: 64px; border-radius: 50%; background: rgba(255,255,255,.16); border: 2px solid #fff; display: grid; place-items: center; font-size: 22px; }
.video-embed.poster .cap { position: absolute; bottom: 14px; left: 16px; right: 16px; font-weight: 600; font-size: 14px; }

.author-box { display: flex; gap: 18px; align-items: flex-start; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 16px; padding: 22px; margin-top: 38px; max-width: 760px; }
.author-box .ava { width: 60px; height: 60px; border-radius: 50%; background: linear-gradient(150deg, #7c52e6, #5630ad); display: grid; place-items: center; color: #fff; font-family: var(--serif); font-size: 26px; flex: none; }
.author-box h4 { font-size: 18px; margin: 0 0 4px; }
.author-box .role { color: var(--accent); font-size: 13px; margin-bottom: 8px; }
.author-box p { color: var(--muted); font-size: 14.5px; margin: 0; }

/* ===== Журнал: бенто-сетка ===== */
.bento { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 178px; gap: 16px; grid-auto-flow: dense; }
@media (max-width: 980px) { .bento { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .bento { grid-template-columns: 1fr; grid-auto-rows: 200px; } }
.b-tile { position: relative; overflow: hidden; border-radius: 16px; color: #fff; display: flex; align-items: flex-end; padding: 20px; box-shadow: var(--shadow); transition: transform .12s ease, box-shadow .2s ease; }
.b-tile:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.b-tile .g { position: absolute; inset: 0; z-index: 0; }
.b-tile .shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.74)); z-index: 0; }
.b-tile .in { position: relative; z-index: 1; width: 100%; }
.b-rub { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #fff; background: var(--accent-2); padding: 3px 9px; border-radius: 999px; margin-bottom: 10px; }
.b-title { font-family: var(--serif); font-size: 18px; line-height: 1.2; }
.b-ex { color: #ddd6ef; font-size: 14px; margin-top: 8px; display: none; }
.b-meta { color: var(--muted); font-size: 12.5px; margin-top: 10px; }
.b-tile.big { grid-column: span 2; grid-row: span 2; }
.b-tile.wide { grid-column: span 2; }
.b-tile.tall { grid-row: span 2; }
.b-tile.big .b-title { font-size: 30px; }
.b-tile.wide .b-title { font-size: 22px; }
.b-tile.big .b-ex, .b-tile.wide .b-ex, .b-tile.tall .b-ex { display: block; }
@media (max-width: 560px) {
  .b-tile.big, .b-tile.wide { grid-column: span 1; }
  .b-tile.big, .b-tile.tall { grid-row: span 1; }
  .b-tile.big .b-title { font-size: 24px; }
}

/* ===== Подписки (страница) ===== */
.sub.gift { border-color: var(--accent-2); box-shadow: inset 0 0 0 1px var(--accent-2); }
.gift-badge { display: inline-block; background: var(--accent-2); color: #fff; font-weight: 700; font-size: 12px; padding: 4px 10px; border-radius: 999px; margin-top: 8px; }
.mystery-row { display: flex; gap: 16px; flex-wrap: wrap; }
.mystery { width: 140px; }
.mystery .cv { aspect-ratio: 3 / 4; border-radius: 12px; background: linear-gradient(150deg, #241640, #5630ad); border: 1px dashed var(--accent-2); display: grid; place-items: center; color: var(--accent-2); font-family: var(--serif); font-size: 52px; box-shadow: var(--shadow); }
.mystery .lbl { text-align: center; margin-top: 8px; font-size: 13px; color: var(--muted); }
.adj-note { background: rgba(106,63,208,.1); border-radius: 12px; padding: 14px 16px; font-size: 14.5px; color: var(--ink); margin-top: 18px; }
.adj-note b { color: var(--accent); }

/* ===== Вход / Регистрация ===== */
.auth-wrap { min-height: calc(100vh - 66px); display: grid; place-items: center; padding: 40px 20px;
  background: radial-gradient(900px 500px at 50% -10%, rgba(138,99,230,.16), transparent 60%), var(--bg-soft); }
.auth-card { width: min(960px, 100%); background: var(--bg-soft); border: 1px solid var(--line); border-radius: 20px; box-shadow: var(--shadow-lg); display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; }
@media (max-width: 780px) { .auth-card { grid-template-columns: 1fr; } }
.auth-aside { background: linear-gradient(160deg, #6a3fd0, #4a2aa0); color: #fff; padding: 44px 38px; display: flex; flex-direction: column; justify-content: center; }
@media (max-width: 780px) { .auth-aside { display: none; } }
.auth-aside .quill { width: 52px; height: 52px; margin: 0 0 22px; display: grid; place-items: center; border: 1.5px solid rgba(255,255,255,.3); border-radius: 50%; }
.auth-aside .quill svg { width: 26px; height: 26px; fill: var(--accent-2); }
.auth-aside h2 { font-family: var(--serif); font-size: 27px; color: #fff; margin: 0 0 8px; }
.auth-aside .tag { color: #f0e7ff; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 24px; }
.auth-aside ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 15px; }
.auth-aside li { display: flex; gap: 12px; align-items: flex-start; color: #ece4fb; font-size: 14.5px; line-height: 1.4; }
.auth-aside .quill { border-color: rgba(255,255,255,.6); }
.auth-aside .quill svg { fill: #fff; }
.auth-aside li .e { font-size: 20px; flex: none; }
.auth-main { padding: 34px; }
@media (max-width: 480px) { .auth-main { padding: 26px 20px; } }
.auth-main .quill { width: 46px; height: 46px; margin: 0 auto 14px; display: grid; place-items: center; border: 1.5px solid var(--line-2); border-radius: 50%; }
.auth-main .quill svg { width: 23px; height: 23px; fill: var(--accent-2); }
@media (min-width: 781px) { .auth-main .quill { display: none; } }
.auth-head { text-align: center; margin-bottom: 20px; }
.auth-head h1 { font-family: var(--serif); font-size: 26px; margin: 0 0 4px; }
.auth-head p { color: var(--muted); font-size: 14px; margin: 0; }
.auth-tabs { display: flex; gap: 6px; background: var(--bg); border: 1px solid var(--line); border-radius: 999px; padding: 4px; margin-bottom: 22px; }
.auth-tabs button { flex: 1; border: none; background: none; padding: 9px; border-radius: 999px; cursor: pointer; font-weight: 600; color: var(--muted); font-family: var(--sans); font-size: 14px; }
.auth-tabs button.on { background: var(--accent); color: #fff; }
.role-seg { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 18px; }
.role-seg button { border: 1px solid var(--line); background: var(--bg); border-radius: 14px; padding: 14px; cursor: pointer; text-align: center; font-family: var(--sans); color: var(--ink); }
.role-seg button .e { font-size: 24px; display: block; }
.role-seg button .t { display: block; font-weight: 700; margin-top: 6px; }
.role-seg button .d { display: block; font-size: 12px; color: var(--muted); margin-top: 3px; line-height: 1.3; }
.role-seg button.on { border-color: var(--accent); background: rgba(106,63,208,.07); box-shadow: inset 0 0 0 1px var(--accent); }
.auth-field { margin-bottom: 14px; }
.auth-field label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; color: var(--muted); }
.auth-field input { width: 100%; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; font-size: 15px; background: var(--bg); color: var(--ink); box-sizing: border-box; }
.auth-field input:focus { outline: none; border-color: var(--accent); }
.auth-genres { display: flex; flex-wrap: wrap; gap: 7px; margin: 4px 0 4px; }
.auth-genres .chip { cursor: pointer; }
.auth-card .btn.full { width: 100%; text-align: center; margin-top: 6px; }
.auth-alt { text-align: center; margin-top: 16px; color: var(--muted); font-size: 13px; }
.auth-demo { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 16px; display: grid; gap: 8px; }
.auth-demo .h { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); text-align: center; }
.auth-hint { color: var(--muted); font-size: 12px; margin-top: 10px; text-align: center; }
.oauth { display: grid; gap: 10px; }
.btn-oauth { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 11px 14px; border: 1px solid var(--line); border-radius: 12px; background: #fff; color: #2a2a2a; font-weight: 600; font-size: 14.5px; cursor: pointer; font-family: var(--sans); }
.btn-oauth:hover { border-color: var(--accent); box-shadow: var(--shadow); }
.btn-oauth svg { flex: none; }
.btn-oauth .yic { width: 20px; height: 20px; border-radius: 5px; background: #FC3F1D; color: #fff; display: grid; place-items: center; font-weight: 800; font-size: 13px; flex: none; }
.auth-divider { display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: 12px; margin: 16px 0; }
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
/* шаговая авторизация: ссылка «← Назад» и переключатель вход/регистрация */
.auth-back { display: inline-block; font-size: 13.5px; font-weight: 600; color: var(--muted); margin-bottom: 16px; }
.auth-back:hover { color: var(--accent); }
.auth-switch { text-align: center; font-size: 14px; color: var(--muted); margin-top: 18px; }
.auth-switch a { color: var(--accent); font-weight: 600; }

/* ===== Публикация книги ===== */
.pub-form { max-width: 760px; display: grid; gap: 18px; }
.pub-form label { font-weight: 600; font-size: 14px; display: block; margin-bottom: 6px; }
.pub-form input[type=text], .pub-form input[type=number], .pub-form select, .pub-form textarea {
  width: 100%; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; font-family: var(--sans); font-size: 15px; background: var(--bg-soft); color: var(--ink); box-sizing: border-box; }
.pub-form input:focus, .pub-form select:focus, .pub-form textarea:focus { outline: none; border-color: var(--accent); }
.pub-form textarea { min-height: 150px; resize: vertical; line-height: 1.6; }
.pub-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 600px) { .pub-row { grid-template-columns: 1fr; } }
.pub-drop { position: relative; border: 2px dashed var(--line-2); border-radius: 14px; padding: 26px 22px; text-align: center; color: var(--muted); background: var(--bg-soft); cursor: pointer; transition: border-color .15s ease, background .15s ease; }
.pub-drop:hover { border-color: var(--accent); background: rgba(106,63,208,.04); }
.pub-drop .ic { font-size: 30px; }
.pub-drop b { color: var(--ink); }
/* нативный file-input — невидимый оверлей на всю зону (вся дропзона кликабельна) */
.pub-drop input[type=file] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; margin: 0; cursor: pointer; }
.pub-or { text-align: center; color: var(--muted); font-size: 13px; letter-spacing: .04em; }
.pub-preview { margin-top: 28px; }
.pub-stat { color: var(--muted); font-size: 14px; margin-bottom: 12px; }
.pub-stat b { color: var(--ink); }
.pub-chaps { display: grid; gap: 6px; max-width: 760px; margin: 10px 0 18px; }
.pub-chap { display: flex; gap: 12px; padding: 10px 14px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 10px; align-items: center; }
.pub-chap .n { color: var(--accent-2); font-family: var(--serif); font-size: 17px; width: 26px; text-align: center; flex: none; }
.pub-chap .nm { font-weight: 600; }
.pub-chap .ln { margin-left: auto; color: var(--muted); font-size: 12px; }
.pub-prev-text { max-width: 760px; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 14px; padding: 24px 26px; font-family: var(--serif); font-size: 17px; line-height: 1.75; max-height: 380px; overflow: auto; }
.pub-prev-text p { margin: 0 0 1em; }
.pub-success { max-width: 760px; background: rgba(47,125,79,.1); border: 1px solid rgba(47,125,79,.32); border-radius: 16px; padding: 24px; }
.pub-success h3 { font-size: 22px; margin: 0 0 8px; }
.pub-success .acts { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }

/* бейдж «на модерации» в списке откликов */
.rev-mod { display: inline-block; margin-top: 10px; font-size: 12px; font-weight: 700; color: #5630ad; background: rgba(106,63,208,.16); padding: 4px 10px; border-radius: 999px; }
.review.mine { border-color: var(--accent-2); }
.fb-dispute { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.fb-dispute .fb-note { flex: 1; min-width: 200px; font-size: 12.5px; line-height: 1.45; color: var(--muted); }
.fb-dispute .btn { flex: none; }

/* ===== Авторская статистика по книгам ===== */
.stat-bar { display: flex; align-items: center; justify-content: space-between; gap: 14px 24px; flex-wrap: wrap; margin-bottom: 18px; }
.stat-switch { display: flex; flex-wrap: wrap; gap: 8px; }
.stat-tab { font: 600 13.5px/1 var(--sans); color: var(--muted); background: var(--bg-soft); border: 1px solid var(--line-2); padding: 10px 16px; border-radius: 999px; cursor: pointer; transition: color .15s ease, border-color .15s ease, background .15s ease; }
.stat-tab:hover { color: var(--accent); border-color: var(--accent-l); }
.stat-tab.on { color: #fff; background: var(--accent); border-color: var(--accent); }

/* выбор периода (сегмент-контрол) */
.stat-periods { display: inline-flex; background: var(--bg-soft); border: 1px solid var(--line-2); border-radius: 999px; padding: 3px; }
.period-tab { font: 600 12.5px/1 var(--sans); color: var(--muted); background: transparent; border: 0; padding: 8px 14px; border-radius: 999px; cursor: pointer; transition: color .15s ease, background .15s ease; }
.period-tab:hover { color: var(--accent); }
.period-tab.on { color: #fff; background: var(--accent); }
.stat-cap { font-size: 12.5px; color: var(--muted); margin: 0 0 14px; }

.stat-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 16px; }
.kpi { background: var(--bg); border: 1px solid var(--line); border-radius: 14px; padding: 18px 18px 16px; box-shadow: var(--shadow); }
.kpi-l { font-size: 12.5px; color: var(--muted); }
.kpi-v { font-family: var(--display); font-size: 30px; line-height: 1.1; color: var(--ink); margin: 8px 0 6px; }
.kpi-d { font-size: 12.5px; font-weight: 700; }
.kpi-d.up { color: var(--ok); }
.kpi-d.down { color: var(--accent-2-d); }
.kpi-d.none { color: var(--muted); font-weight: 600; }
.kpi-s { font-size: 12px; color: var(--muted); margin-top: 4px; }

.stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.stat-card { background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 22px 24px; box-shadow: var(--shadow); }
.stat-card h3 { font-size: 18px; margin: 0 0 6px; }
.stat-note { font-size: 13px; color: var(--muted); margin: 0 0 18px; line-height: 1.5; }
.stat-note b { color: var(--accent-2-d); }

/* воронка прочтения */
.funnel { display: grid; gap: 15px; }
.fn-row { display: grid; grid-template-columns: 1fr 40px; column-gap: 12px; row-gap: 5px; align-items: center; }
.fn-top { grid-column: 1 / -1; display: flex; justify-content: space-between; font-size: 13.5px; color: var(--ink); }
.fn-top b { font-weight: 700; }
.fn-bar { grid-column: 1; height: 12px; border-radius: 999px; background: var(--bg-soft); overflow: hidden; }
.fn-bar span { display: block; height: 100%; border-radius: 999px; transition: width .55s cubic-bezier(.2,.7,.2,1); }
.fn-p { grid-column: 2; font-size: 13px; font-weight: 700; color: var(--muted); text-align: right; }

/* удержание по главам — столбцы с % дошедших читателей */
.ret-chart { display: flex; align-items: flex-end; gap: 5px; }
.ret-col { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 5px; cursor: default; }
.ret-pct { font-size: 10.5px; font-weight: 700; color: var(--muted); }
.ret-track { width: 100%; height: 120px; background: var(--bg-soft); border-radius: 6px; display: flex; align-items: flex-end; overflow: hidden; }
.ret-fill { width: 100%; border-radius: 6px 6px 0 0; transition: height .55s cubic-bezier(.2,.7,.2,1); }
.ret-n { font-size: 11px; font-weight: 600; color: var(--muted); }
.ret-col.worst .ret-pct, .ret-col.worst .ret-n { color: var(--accent-2-d); }

/* активность чтения · 4 недели */
.stat-wide .sw-head h3 { margin: 0 0 18px; }
.stat-wide .sw-body { display: grid; grid-template-columns: auto 1fr; gap: 32px; align-items: center; }
.cal-wd, .heat-cal { display: grid; grid-template-columns: repeat(7, 22px); gap: 6px; }
.cal-wd { margin-bottom: 8px; }
.cal-wd span { font-size: 10px; color: var(--muted); text-align: center; }
.cal-c { width: 22px; height: 22px; border-radius: 6px; }
.cal-leg { display: flex; align-items: center; gap: 5px; margin-top: 14px; font-size: 11px; color: var(--muted); }
.cal-leg i { width: 14px; height: 14px; border-radius: 4px; }
.sw-facts { display: grid; gap: 18px; }
.fact-v { font-family: var(--display); font-size: 26px; color: var(--accent); line-height: 1.1; }
.fact-l { font-size: 12.5px; color: var(--muted); margin-top: 3px; }

/* лента-карусель заказов / откликов (обёртывается carousel.js при большом числе) */
.cab-rail.row { padding: 4px 2px 12px; }
.cab-rail .task { min-width: 340px; max-width: 340px; flex: none; scroll-snap-align: start; }
.cab-rail .review { min-width: 360px; max-width: 360px; flex: none; align-self: stretch; scroll-snap-align: start; }

@media (max-width: 900px) {
  .stat-kpis { grid-template-columns: repeat(2, 1fr); }
  .stat-grid { grid-template-columns: 1fr; }
  .stat-wide .sw-body { grid-template-columns: 1fr; gap: 24px; }
  .sw-facts { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 560px) {
  .stat-bar { gap: 12px; }
  .stat-periods { width: 100%; justify-content: space-between; }
  .stat-kpis { grid-template-columns: 1fr 1fr; gap: 10px; }
  .kpi { padding: 14px 14px 13px; }
  .kpi-v { font-size: 25px; }
  .sw-facts { grid-template-columns: 1fr; gap: 12px; }
  .ret-chart { gap: 3px; }
  .ret-track { height: 96px; }
  .ret-pct { font-size: 9px; white-space: nowrap; }
  .ret-n { font-size: 10px; }
  .cab-rail .task { min-width: 280px; max-width: 280px; }
  .cab-rail .review { min-width: 300px; max-width: 300px; }
}

/* ===== Доход + вывод средств ===== */
.inc-top { display: grid; grid-template-columns: 320px 1fr; gap: 16px; margin-bottom: 16px; }
.inc-balance { background: linear-gradient(160deg, #241640, #150d29); color: #fff; border-radius: var(--radius-lg); padding: 24px; box-shadow: var(--shadow); display: flex; flex-direction: column; align-items: flex-start; }
.ib-l { font-size: 13px; color: #c9bdf0; }
.ib-v { font-family: var(--display); font-size: 38px; line-height: 1.05; margin: 8px 0 16px; }
.inc-balance .btn-gold { width: 100%; }
.inc-balance .btn-gold[disabled] { opacity: .5; cursor: not-allowed; }
.ib-hint { font-size: 11.5px; color: #b3a7da; margin-top: 12px; }
.inc-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }

.src-row { margin-bottom: 15px; }
.src-row:last-child { margin-bottom: 0; }
.src-top { display: flex; justify-content: space-between; font-size: 13.5px; color: var(--ink); margin-bottom: 6px; }
.src-top b { font-weight: 700; }
.src-bar { height: 10px; border-radius: 999px; background: var(--bg-soft); overflow: hidden; }
.src-bar span { display: block; height: 100%; border-radius: 999px; transition: width .55s cubic-bezier(.2,.7,.2,1); }
.src-desc { font-size: 11.5px; color: var(--muted); margin-top: 5px; }

.payouts { display: grid; }
.po-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 0; border-top: 1px solid var(--line); }
.po-row:first-child { border-top: 0; padding-top: 4px; }
.po-amt { font-weight: 700; font-size: 15px; }
.po-meta { font-size: 12.5px; color: var(--muted); margin-top: 2px; }

/* модалка вывода средств */
.wd-modal { position: fixed; inset: 0; z-index: 95; display: none; align-items: center; justify-content: center; padding: 20px; }
.wd-modal.open { display: flex; }
.wd-back { position: absolute; inset: 0; background: rgba(20,16,30,.55); backdrop-filter: blur(2px); }
.wd-box { position: relative; background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 28px; max-width: 440px; width: 100%; box-shadow: var(--shadow-lg); }
.wd-box h3 { font-size: 22px; margin: 0 0 8px; text-align: center; }
.wd-avail { text-align: center; color: var(--muted); margin: 0 0 18px; }
.wd-avail b { color: var(--accent); }
.wd-box input { width: 100%; padding: 11px 12px; border: 1px solid var(--line-2); border-radius: 10px; background: var(--bg); color: var(--ink); font: 15px var(--sans); }
.wd-box .rv-sub { display: block; margin-bottom: 6px; }
.wd-quick { display: flex; gap: 8px; margin-top: 8px; }
.wd-q { flex: 1; font: 600 12.5px var(--sans); color: var(--accent); background: var(--chip); border: 0; border-radius: 8px; padding: 9px; cursor: pointer; transition: background .15s ease, color .15s ease; }
.wd-q:hover { background: var(--accent); color: #fff; }
.wd-note { font-size: 11.5px; color: var(--muted); margin-top: 14px; text-align: center; }
.wd-done { text-align: center; padding: 12px 0; }
.wd-ic { font-size: 44px; }
.wd-done h3 { margin: 10px 0 8px; }
.wd-done p { color: var(--muted); margin: 0 0 22px; }

@media (max-width: 900px) { .inc-top { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .inc-kpis { grid-template-columns: 1fr; } }

/* ===== Авторская озвучка (плеер) ===== */
.nar-card { background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 22px 24px; box-shadow: var(--shadow); max-width: 720px; }
.nar-head { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.nar-ava { width: 44px; height: 44px; border-radius: 50%; background: var(--accent); color: #fff; display: grid; place-items: center; font-weight: 700; flex: none; }
.nar-who { font-weight: 600; font-size: 14.5px; line-height: 1.3; }
.nar-who small { display: block; color: var(--muted); font-weight: 400; font-size: 12.5px; }
.nar-badge { margin-left: auto; font-size: 12px; font-weight: 700; color: var(--accent); background: var(--chip); padding: 6px 12px; border-radius: 999px; white-space: nowrap; }
.nar-player { display: flex; align-items: center; gap: 16px; }
.nar-play { flex: none; width: 54px; height: 54px; border-radius: 50%; border: 0; background: var(--accent); color: #fff; font-size: 17px; cursor: pointer; display: grid; place-items: center; transition: background .15s ease, transform .1s ease; }
.nar-play:hover { background: var(--accent-d); }
.nar-play:active { transform: scale(.95); }
.nar-main { flex: 1; min-width: 0; }
.nar-title { font-size: 14px; font-weight: 600; margin-bottom: 8px; }
.nar-bar { height: 8px; border-radius: 999px; background: var(--bg-soft); cursor: pointer; overflow: hidden; }
.nar-fill { height: 100%; background: var(--accent); border-radius: 999px; }
.nar-time { display: flex; justify-content: space-between; font-size: 11.5px; color: var(--muted); margin-top: 6px; }
.nar-speed { flex: none; font: 700 13px var(--sans); color: var(--accent); background: var(--chip); border: 0; border-radius: 8px; padding: 8px 12px; cursor: pointer; transition: background .15s ease, color .15s ease; }
.nar-speed:hover { background: var(--accent); color: #fff; }
.nar-list { display: grid; gap: 2px; margin: 18px 0 4px; }
.nar-tr { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; border: 0; background: transparent; cursor: pointer; text-align: left; font: inherit; transition: background .12s ease; }
.nar-tr:hover { background: var(--bg-soft); }
.nar-tr.on { background: var(--chip); }
.nar-tr-n { flex: none; width: 18px; color: var(--accent); font-size: 12px; text-align: center; }
.nar-tr-t { flex: 1; min-width: 0; font-size: 13.5px; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nar-tr[data-lock] .nar-tr-t { color: var(--muted); }
.nar-tr-d { flex: none; font-size: 12px; color: var(--muted); }
.nar-note { font-size: 12px; color: var(--muted); margin-top: 12px; padding-top: 14px; border-top: 1px solid var(--line); }
.nar-real { font-size: 11px; }
.nar-demo { color: var(--muted); font-weight: 400; font-size: 12px; }
.nar-tr[data-lock] { cursor: default; }
.nar-locked { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; background: var(--bg-soft); border: 1px solid var(--line-2); border-radius: 14px; padding: 18px 20px; }
.nl-ic { font-size: 28px; flex: none; }
.nl-txt { flex: 1; min-width: 200px; }
.nl-txt b { display: block; font-size: 15px; margin-bottom: 2px; }
.nl-txt span { font-size: 13px; color: var(--muted); line-height: 1.5; }
.nar-locked .btn { flex: none; }
@media (max-width: 560px) { .nar-badge { display: none; } .nar-player { gap: 12px; } .nar-card { padding: 18px; } }

/* загрузчик авторской озвучки в публикации */
.pub-audio-intro { font-size: 13px; color: var(--muted); margin: 4px 0 12px; line-height: 1.5; }
.pub-audio { display: grid; gap: 10px; }
.na-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; background: var(--bg-soft); border: 1px solid var(--line-2); border-radius: 12px; padding: 12px 14px; }
.na-title { flex: 1; min-width: 200px; padding: 9px 11px; border: 1px solid var(--line-2); border-radius: 9px; background: var(--bg); color: var(--ink); font: 14px var(--sans); }
.na-ctrl { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.na-mini { font: 600 12.5px var(--sans); color: var(--accent); background: var(--chip); border: 0; border-radius: 8px; padding: 8px 12px; cursor: pointer; transition: background .15s ease, color .15s ease; }
.na-mini:hover { background: var(--accent); color: #fff; }
.na-del { background: transparent; color: var(--muted); padding: 8px 10px; }
.na-del:hover { background: var(--accent-2); color: #fff; }
.na-src { font-size: 11.5px; color: var(--muted); }
.na-recording { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--accent-2-d); font-weight: 600; }
.na-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--accent-2); animation: na-pulse 1s ease-in-out infinite; }
@keyframes na-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }
.na-stop { background: var(--accent-2); color: #fff; }
.na-stop:hover { background: var(--accent-2-d); color: #fff; }
.na-add { margin-top: 4px; font: 600 13px var(--sans); color: var(--accent); background: transparent; border: 1px dashed var(--line-2); border-radius: 10px; padding: 11px; cursor: pointer; width: 100%; transition: border-color .15s ease, color .15s ease; }
.na-add:hover { border-color: var(--accent); }
.na-note { font-size: 11.5px; color: var(--muted); margin-top: 6px; }
.na-note b { color: var(--ink); }
.na-poem-t { flex: 1; min-width: 180px; font-size: 14px; color: var(--ink); display: flex; align-items: center; gap: 10px; }
.na-poem-n { flex: none; width: 22px; height: 22px; border-radius: 6px; background: var(--chip); color: var(--accent); font-size: 12px; font-weight: 700; display: grid; place-items: center; }
.na-row.done { border-color: var(--accent-l); }
.na-hint { font-size: 13px; color: var(--muted); background: var(--bg-soft); border: 1px dashed var(--line-2); border-radius: 10px; padding: 16px; line-height: 1.5; }
@media (prefers-reduced-motion: reduce) { .na-dot { animation: none; } }

/* ===== Бета-ридинг ===== */
.beta-karma-card { display: grid; grid-template-columns: 1.2fr 1fr; background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); }
.bk-main { background: linear-gradient(160deg, #241640, #150d29); color: #fff; padding: 26px 28px; }
.bk-l { font-size: 13px; color: #c9bdf0; }
.bk-v { font-family: var(--display); font-size: 40px; line-height: 1; margin: 6px 0 10px; }
.bk-v span { font-family: var(--sans); font-size: 14px; color: #b3a7da; }
.bk-lv { font-weight: 600; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.beta-badge { font-size: 12px; font-weight: 700; background: rgba(255,255,255,.16); color: #fff; padding: 5px 11px; border-radius: 999px; }
.bk-bar { height: 8px; border-radius: 999px; background: rgba(255,255,255,.16); overflow: hidden; margin: 16px 0 8px; }
.bk-bar span { display: block; height: 100%; background: var(--accent-2); border-radius: 999px; }
.bk-next { font-size: 12.5px; color: #c9bdf0; }
.bk-side { padding: 26px 28px; display: flex; flex-direction: column; gap: 16px; }
.bk-sv { font-family: var(--display); font-size: 30px; color: var(--accent); line-height: 1; }
.bk-sl { font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.bk-hint { font-size: 12.5px; color: var(--muted); line-height: 1.5; }

.bx-deadline { font-size: 13px; font-weight: 600; color: var(--accent-2-d); background: var(--chip2); border: 1px solid rgba(239,90,60,.28); border-radius: 12px; padding: 12px 16px; margin-bottom: 16px; }
.bx-deadline.ok { color: var(--ok); background: rgba(46,155,107,.08); border-color: rgba(46,155,107,.3); }
.bx-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.bx-col { background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 20px 22px; box-shadow: var(--shadow); display: flex; flex-direction: column; }
.bx-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.bx-who { display: flex; align-items: center; gap: 11px; }
.bx-who .ava { width: 40px; height: 40px; border-radius: 50%; background: var(--accent); color: #fff; display: grid; place-items: center; font-weight: 700; flex: none; }
.bx-who .ava.locked { background: var(--line-2); }
.bx-who b { font-size: 14.5px; }
.bx-who small { display: block; color: var(--muted); font-size: 12.5px; }
.bx-tag { font-size: 11.5px; font-weight: 700; color: var(--accent); background: var(--chip); padding: 5px 10px; border-radius: 999px; white-space: nowrap; }
.bx-tag.done { color: var(--ok); background: rgba(46,155,107,.1); }
.bx-react { font-size: 13px; font-weight: 700; color: var(--accent-2); white-space: nowrap; }

.beta-draft { position: relative; overflow-y: auto; max-height: 280px; border: 1px solid var(--line); border-radius: 12px; padding: 16px 18px; background: var(--bg-soft); user-select: none; -webkit-user-select: none; font-family: var(--serif); font-size: 15.5px; line-height: 1.7; color: var(--ink); }
.beta-draft p { margin: 0 0 12px; }
.beta-draft p:last-child { margin-bottom: 0; }
.beta-wm { position: absolute; inset: -40%; pointer-events: none; display: flex; flex-wrap: wrap; gap: 30px 48px; transform: rotate(-24deg); align-content: center; justify-content: center; }
.beta-wm span { color: var(--accent); opacity: .13; font: 700 15px var(--sans); white-space: nowrap; }

.bx-write { margin-top: 14px; }
.bx-write textarea { width: 100%; min-height: 110px; padding: 11px 12px; border: 1px solid var(--line-2); border-radius: 10px; background: var(--bg); color: var(--ink); font: 15px var(--sans); resize: vertical; }
.bx-write-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; }
.bx-wc { font-size: 12.5px; color: var(--muted); }
.bx-mine-l { font-size: 12.5px; color: var(--muted); margin: 4px 0 8px; }
.bx-mine p, .bx-partner-review p { margin: 0; color: var(--ink); font-size: 15px; line-height: 1.6; }
.bx-useful { color: var(--ok); font-weight: 700; }

.bx-locked { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 8px; padding: 34px 16px; background: var(--bg-soft); border: 1px dashed var(--line-2); border-radius: 12px; }
.bl-ic { font-size: 34px; }
.bx-locked b { font-size: 15px; }
.bx-locked span { font-size: 13px; color: var(--muted); line-height: 1.55; max-width: 360px; }

.bx-vote { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.bx-vote-note { font-size: 11.5px; color: var(--muted); flex: 1; min-width: 160px; }
.bx-reported { font-size: 13px; font-weight: 600; color: var(--accent-2-d); }

.bx-foot { margin-top: 14px; }
.link-quiet { font-size: 13px; color: var(--muted); }
.link-quiet:hover { color: var(--accent); }
.beta-slot .tbody { padding: 18px 20px; }

.bk-stats { display: flex; gap: 26px; flex-wrap: wrap; }
.ba-project { background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 20px 22px; box-shadow: var(--shadow); margin-bottom: 16px; }
.ba-project:last-child { margin-bottom: 0; }
.ba-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.ba-ch { font-family: var(--display); font-size: 19px; color: var(--ink); }
.ba-meta { font-size: 12.5px; color: var(--muted); margin-top: 3px; }
.ba-reviews { display: grid; gap: 12px; }
.ba-reviews .reviews, .ba-reviews .review { max-width: none; }
.ba-late { font-size: 12.5px; color: var(--accent-2-d); background: var(--chip2); border-radius: 10px; padding: 10px 14px; }
.bc-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.beta-rules { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.beta-rule { display: flex; gap: 14px; background: var(--bg); border: 1px solid var(--line); border-radius: 14px; padding: 18px; box-shadow: var(--shadow); }
.br-ic { font-size: 26px; flex: none; }
.beta-rule b { display: block; margin-bottom: 4px; }
.beta-rule span { font-size: 13px; color: var(--muted); line-height: 1.5; }

.beta-toast { position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%) translateY(20px); background: var(--ink); color: #fff; font-size: 14px; padding: 13px 20px; border-radius: 12px; box-shadow: var(--shadow-lg); z-index: 200; opacity: 0; pointer-events: none; transition: opacity .25s ease, transform .25s ease; max-width: 90vw; text-align: center; }
.beta-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

@media (max-width: 900px) {
  .beta-karma-card { grid-template-columns: 1fr; }
  .bx-grid { grid-template-columns: 1fr; }
  .beta-rules { grid-template-columns: 1fr; }
}

/* ===== Защита контента от выделения/копирования (детеррент) =====
   Включается ТОЛЬКО на боевом домене (html.no-copy ставит auth.js); на localhost — выделяется. */
html.no-copy body { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
html.no-copy input, html.no-copy textarea, html.no-copy select, html.no-copy [contenteditable="true"], html.no-copy .allow-select {
  -webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text;
}
html.no-copy img { -webkit-user-drag: none; -khtml-user-drag: none; -moz-user-drag: none; -o-user-drag: none; user-drag: none; }

/* ============================================================
   ПРЕМИУМ-ПОЛИРОВКА (lsa-design): a11y, типографика, ритм.
   Глобально, без коллизий — только element/утилитарные селекторы.
   ============================================================ */

/* 1. Уважать «уменьшить движение» — отключаем анимации/параллакс/плавный скролл */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* 2. Типографика: заголовки без «вдов», абзацы аккуратнее переносятся */
h1, h2, h3, .hero h1, .section-head h2, blockquote { text-wrap: balance; }
p, .lead, li { text-wrap: pretty; }

/* 3. Якоря секций не прячутся под липкой шапкой (66px) */
section[id], .section[id], [id="top"] { scroll-margin-top: 84px; }

/* 4. Цифры/цены — моноширинные (ровные колонки, не «прыгают») */
.num, .stat .num, .cnums .n, .gc .gn, .hit-item .rank,
.price, .hi-price, .price-lg, .tier-price, .big {
  font-variant-numeric: tabular-nums;
}

/* 5. Выделение текста — в цвет бренда (там, где выделение разрешено) */
::selection { background: rgba(106,63,208,.18); color: var(--ink); }
::-moz-selection { background: rgba(106,63,208,.18); color: var(--ink); }
