/* Daeva Codex · «Две стороны» — слой поверх старых стилей (portal, public-catalog, site-theme, editorial, kb): подключается
   последним на всех публичных страницах. Палитры и контраст — design/research-2026-10-11.md §5.14 и §9:
   асмодиане — ночь (почти чёрный с бордо, роза #F0577C, фиалка #A58CFF, золото #F2C077),
   элийцы — рассвет на холодном фарфоре (#F4F7FB, лазурь #2D7BE0 — только декор, текст и ссылки #1F63C2; золото #C08A26 — декор,
   текст #8A6114). На розовой кнопке — тёмный текст (белый даёт 3,3:1). Без стекла, свечений и градиентного текста.
   Сигнатура одна — «шов Бездны»: волосяная линия с ромбом (разделители) и смена стороны швом, бегущим от переключателя. */

html[data-faction="asmo"] {
  --dc-bg: #120a0f; --dc-bg-2: #180d14; --dc-panel: #1d1118; --dc-panel-2: #24151e; --dc-ink: #f4ecf0; --dc-muted: #c2b0ba; --dc-faint: #92808b;
  --dc-edge: #3a2431; --dc-edge-2: #4a2f3f; --dc-accent: #f0577c; --dc-accent-ink: #120a0f; --dc-accent-soft: #f0577c1f;
  --dc-violet: #a58cff; --dc-gold: #f2c077; --dc-gold-text: #f2c077; --dc-link: #ff8aa6; --dc-header: #120a0ff2; --dc-focus: #f2c077;
  color-scheme: dark;
}
html[data-faction="elyos"] {
  --dc-bg: #f4f7fb; --dc-bg-2: #edf2f8; --dc-panel: #ffffff; --dc-panel-2: #f7f9fc; --dc-ink: #14233a; --dc-muted: #4e5f75; --dc-faint: #6f7d90;
  --dc-edge: #d7e0ec; --dc-edge-2: #c3d0e1; --dc-accent: #1f63c2; --dc-accent-ink: #ffffff; --dc-accent-soft: #2d7be014;
  --dc-violet: #5b4fcf; --dc-gold: #c08a26; --dc-gold-text: #8a6114; --dc-link: #1f63c2; --dc-header: #f4f7fbf2; --dc-focus: #1f63c2;
  color-scheme: light;
}

/* шрифты: Tenor Sans — только крупные заголовки (одно начертание: иерархия размером и цветом), Manrope — текст; ja/ko — свои стеки */
:root { --font-display: 'Tenor Sans', 'Manrope', system-ui, sans-serif; --font-body: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif; }
:root:lang(ja) { --font-display: 'Hiragino Mincho ProN', 'Yu Mincho', 'Noto Serif JP', serif; --font-body: 'Hiragino Sans', 'Yu Gothic UI', 'Meiryo', 'Noto Sans JP', system-ui, sans-serif; }
:root:lang(ko) { --font-display: 'Noto Serif KR', 'Batang', serif; --font-body: 'Malgun Gothic', 'Apple SD Gothic Neo', 'Noto Sans KR', system-ui, sans-serif; }

/* старые токены страниц — на новую палитру (специфичность как у старых правил, слой подключён позже) */
html[data-faction] .public-redesign {
  --journal-bg: var(--dc-bg); --journal-panel: var(--dc-panel); --journal-ink: var(--dc-ink); --journal-muted: var(--dc-muted); --journal-edge: var(--dc-edge);
  --journal-accent: var(--dc-link); --journal-soft: var(--dc-accent-soft); --journal-header: var(--dc-header);
  --ink: var(--dc-ink); --muted: var(--dc-muted); --edge: var(--dc-edge); --violet: var(--dc-violet);
}
html[data-faction] body { background: var(--dc-bg); color: var(--dc-ink); font-family: var(--font-body); font-size: 16px; line-height: 1.55; }
html[data-faction] body.public-redesign, html[data-faction] .public-redesign { font-family: var(--font-body); }
html[data-faction] :focus-visible { outline: 2px solid var(--dc-focus); outline-offset: 2px; }
html[data-faction] a { color: inherit; }
html[data-faction] .eyebrow { color: var(--dc-gold-text); font-family: var(--font-body); letter-spacing: .08em; }
html[data-faction] h1, html[data-faction] .kb-head h1, html[data-faction] .kb-entity-head h1, html[data-faction] .kb-hero h1,
html[data-faction] .catalog-intro h1, html[data-faction] .article-header h1 { font-family: var(--font-display); font-weight: 400; letter-spacing: 0; }
html[data-faction] h2 { font-family: var(--font-body); font-weight: 700; letter-spacing: -.01em; }
html[data-faction] .kb-h2, html[data-faction] .kb-tile h2 { font-family: var(--font-display); font-weight: 400; letter-spacing: 0; }
html[data-faction] .primary, html[data-faction] .public-redesign .primary { background: var(--dc-accent); color: var(--dc-accent-ink); border-color: transparent; }
.num, .kb-table td.num, time { font-variant-numeric: tabular-nums; }

/* ── шов Бездны: волосяная линия с ромбом ─────────────────────────────────────────────────────── */
.dc-seam { position: relative; height: 1px; margin: 56px 0; border: 0; background: linear-gradient(90deg, transparent, var(--dc-edge-2) 12%, var(--dc-gold) 50%, var(--dc-edge-2) 88%, transparent); }
.dc-seam::after { content: ''; position: absolute; left: 50%; top: 50%; width: 9px; height: 9px; background: var(--dc-bg); border: 1px solid var(--dc-gold); transform: translate(-50%, -50%) rotate(45deg); }

/* ── шапка ─────────────────────────────────────────────────────────────────────────────────────── */
html[data-faction] .public-redesign .topbar.dc-top, html[data-faction] .dc-top {
  position: sticky; top: 0; z-index: 90; display: flex; flex-wrap: nowrap; align-items: center; gap: 22px; height: 64px; min-height: 0; max-width: none; margin: 0;
  padding: 0 max(20px, calc((100vw - 1264px) / 2)); background: var(--dc-header); border-bottom: 1px solid var(--dc-edge); color: var(--dc-ink);
  backdrop-filter: none;
}
.dc-top::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: linear-gradient(90deg, transparent 10%, var(--dc-gold) 50%, transparent 90%); opacity: .45; pointer-events: none; }
.dc-brand { display: inline-flex; align-items: center; gap: 10px; flex: none; color: var(--dc-ink); text-decoration: none; }
.dc-brand .dc-mark { width: 34px; height: 34px; }
.dc-brand span { display: grid; font-family: var(--font-display); font-size: 19px; line-height: 1.05; letter-spacing: 0; }
.dc-brand em { font-family: var(--font-body); font-style: normal; font-size: 10.5px; font-weight: 700; letter-spacing: .14em; color: var(--dc-faint); }
html[data-faction] .dc-top .dc-nav { display: flex; flex-wrap: nowrap; justify-content: flex-start; align-items: center; gap: 4px; min-width: 0; }
html[data-faction] .dc-top .dc-nav > a, html[data-faction] .dc-menu > summary { display: inline-flex; align-items: center; height: 36px; padding: 0 11px; border-radius: 8px; color: var(--dc-muted);
  font-size: 14.5px; font-weight: 600; text-decoration: none; white-space: nowrap; cursor: pointer; }
.dc-nav > a:hover, .dc-menu > summary:hover { color: var(--dc-ink); background: var(--dc-accent-soft); }
.dc-nav > a[aria-current], .dc-menu > summary[aria-current] { color: var(--dc-ink); box-shadow: inset 0 -2px 0 var(--dc-accent); border-radius: 8px 8px 0 0; }
.dc-menu { position: relative; }
.dc-menu > summary { list-style: none; gap: 6px; }
.dc-menu > summary::-webkit-details-marker { display: none; }
.dc-menu > summary::after { content: ''; width: 6px; height: 6px; margin-top: -3px; border: solid currentColor; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); opacity: .7; }
.dc-menu-list { position: absolute; top: calc(100% + 8px); left: 0; display: grid; grid-template-columns: repeat(2, minmax(140px, 1fr)); gap: 2px; min-width: 320px;
  padding: 8px; background: var(--dc-panel); border: 1px solid var(--dc-edge); border-radius: 12px; box-shadow: 0 18px 40px #0000003a; }
.dc-menu-list a { padding: 9px 11px; border-radius: 8px; color: var(--dc-ink); font-size: 14px; font-weight: 500; text-decoration: none; }
.dc-menu-list a:hover { background: var(--dc-accent-soft); }
.dc-search-open.kb-search-open { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; height: 38px; min-width: 210px; padding: 0 8px 0 12px;
  border: 1px solid var(--dc-edge-2); border-radius: 10px; background: var(--dc-panel); color: var(--dc-muted); font: 500 14px var(--font-body); cursor: pointer; }
.dc-search-open:hover { border-color: var(--dc-accent); color: var(--dc-ink); }
.dc-search-open kbd { margin-left: auto; padding: 2px 6px; border: 1px solid var(--dc-edge-2); border-radius: 6px; font: 600 11px var(--font-body); color: var(--dc-faint); }
.dc-top .kb-lang { flex: none; }
.dc-side { display: inline-flex; flex: none; padding: 3px; gap: 2px; border: 1px solid var(--dc-edge-2); border-radius: 10px; background: var(--dc-panel); }
.dc-side button { height: 30px; padding: 0 11px; border: 0; border-radius: 7px; background: transparent; color: var(--dc-muted); font: 700 12.5px var(--font-body); cursor: pointer; }
.dc-side button[aria-pressed="true"] { background: var(--dc-accent); color: var(--dc-accent-ink); }
.dc-side button:not([aria-pressed="true"]):hover { color: var(--dc-ink); }
.dc-top .site-theme-switch { display: none; } /* старый переключатель-портрет заменён сегментом */

/* вторая строка внутри базы: разделы одной строкой, на узком экране — прокрутка */
.dc-subnav { display: flex; gap: 2px; overflow-x: auto; padding: 0 max(20px, calc((100vw - 1264px) / 2)); border-bottom: 1px solid var(--dc-edge);
  background: var(--dc-bg-2); scrollbar-width: none; }
.dc-subnav::-webkit-scrollbar { display: none; }
.dc-subnav a { flex: none; padding: 10px 12px; color: var(--dc-muted); font-size: 13.5px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.dc-subnav a:hover { color: var(--dc-ink); }
.dc-subnav a[aria-current] { color: var(--dc-ink); box-shadow: inset 0 -2px 0 var(--dc-gold); }

/* нижняя панель на телефоне: Поиск · База · Карта · Гайды · Приложение */
.dc-tabbar { display: none; }
@media (max-width: 860px) {
  html[data-faction] .dc-top .dc-nav { display: none; }
  .dc-search-open.kb-search-open { min-width: 0; width: 40px; padding: 0; justify-content: center; }
  .dc-search-open span, .dc-search-open kbd { display: none; }
  html[data-faction] .dc-top { gap: 10px; height: 58px; }
  .dc-brand em { display: none; }
  .dc-tabbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 95; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr;
    padding: 6px 6px calc(6px + env(safe-area-inset-bottom)); background: var(--dc-header); border-top: 1px solid var(--dc-edge); }
  .dc-tabbar a, .dc-tabbar button { display: grid; justify-items: center; gap: 2px; padding: 6px 0; border: 0; background: none; color: var(--dc-muted);
    font: 600 11px var(--font-body); text-decoration: none; cursor: pointer; }
  .dc-tabbar [aria-current] { color: var(--dc-accent); }
  body { padding-bottom: 68px; }
}
@media (max-width: 460px) {
  .dc-side button { padding: 0 8px; font-size: 11.5px; }
  .dc-brand span { font-size: 17px; }
  .dc-top .kb-lang summary { padding: 0 6px; }
}

/* ── подвал ────────────────────────────────────────────────────────────────────────────────────── */
.catalog-footer.dc-footer { display: grid; grid-template-columns: minmax(240px, 1.2fr) 2fr 1fr; gap: 28px 40px; max-width: 1264px; margin: 72px auto 0;
  padding: 36px max(20px, calc((100vw - 1264px) / 2)) 48px; border-top: 1px solid var(--dc-edge); color: var(--dc-muted); font-size: 13.5px; }
.dc-footer .footer-brand { display: inline-flex; align-items: center; gap: 10px; color: var(--dc-ink); font: 400 20px var(--font-display); text-decoration: none; }
.dc-footer p { max-width: 360px; margin: 10px 0; }
.dc-footer nav { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 8px 18px; }
.dc-footer a { color: var(--dc-muted); text-decoration: none; }
.dc-footer a:hover { color: var(--dc-ink); text-decoration: underline; }
.dc-footer button { padding: 0; border: 0; background: none; color: var(--dc-muted); font: inherit; cursor: pointer; }
@media (max-width: 860px) { .catalog-footer.dc-footer { grid-template-columns: 1fr; } }

/* ── смена стороны: «шов» бежит от переключателя через экран (View Transitions; без поддержки и при reduce — мгновенно) ── */
::view-transition-old(root), ::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
.dc-seam-run { position: fixed; top: 0; bottom: 0; z-index: 2147483647; width: 2px; pointer-events: none;
  background: linear-gradient(180deg, transparent, var(--dc-gold) 20%, #fff 50%, var(--dc-gold) 80%, transparent); }
.dc-seam-run::after { content: ''; position: absolute; top: 50%; left: 50%; width: 12px; height: 12px; border: 1.5px solid var(--dc-gold); background: var(--dc-bg);
  transform: translate(-50%, -50%) rotate(45deg); }
@media (prefers-reduced-motion: reduce) { .dc-seam-run { display: none; } }

/* короткие подписи на телефоне: «Асмо | Эли», «RU» */
.dc-short { display: none; }
@media (max-width: 600px) {
  .dc-long { display: none; }
  .dc-short { display: inline; }
  html[data-faction] .dc-top { gap: 8px; padding: 0 12px; }
  .dc-top .kb-lang summary { min-width: 0; padding: 0 8px; }
  .dc-side button { padding: 0 9px; }
}
@media (max-width: 360px) { .dc-brand span { display: none; } }

/* ── База знаний: воздух и типографика (отзыв владельца 11.10.2026 «очень скомкано и иишно») ──
   Заголовки панелей — шрифт заголовков без капса и розового (капс-надзаголовки над каждой панелью и делали страницу «ИИшной»),
   крупнее текст, таблицы и признаки, просторнее панели и карточки; фасеты фильтра — одной строкой с прокруткой, а не тремя рядами чипов. */
html[data-faction] .kb-main { max-width: 1240px; padding: 34px 32px 80px; }
html[data-faction] .kb-head { margin-bottom: 30px; }
html[data-faction] .kb-head h1, html[data-faction] .kb-entity-head h1 { font-weight: 400; letter-spacing: 0; line-height: 1.06; }
html[data-faction] .kb-head h1 { font-size: clamp(38px, 5vw, 62px); }
html[data-faction] .kb-head > p:not(.eyebrow) { font-size: 16.5px; }
html[data-faction] .kb-main .eyebrow { font-size: 12px; letter-spacing: .14em; font-weight: 700; }
html[data-faction] .kb-entity-head { grid-template-columns: 96px minmax(0, 1fr); gap: 28px; margin-bottom: 8px; }
html[data-faction] .kb-entity-head .kb-icon, html[data-faction] .kb-entity-head .kb-title-icon { width: 96px; height: 96px; }
html[data-faction] .kb-entity-head h1 { font-size: clamp(34px, 4.4vw, 56px); }
html[data-faction] .kb-facts { gap: 16px 40px; margin-top: 20px; }
html[data-faction] .kb-facts span { font-size: 12.5px; letter-spacing: .02em; text-transform: none; }
html[data-faction] .kb-facts b { font-size: 17px; }
html[data-faction] .kb-lead { max-width: 68ch; margin: 26px 0 38px; font-size: 18px; line-height: 1.75; color: var(--dc-muted); }
html[data-faction] .kb-panel { padding: 26px 30px 28px; margin-bottom: 24px; border-radius: 10px; }
html[data-faction] .kb-panel h2 { margin: 0 0 18px; font: 400 25px/1.2 var(--font-display); letter-spacing: 0; text-transform: none; color: var(--dc-ink); }
html[data-faction] .kb-panel h2 .kb-count { margin-left: 8px; font: 700 14px var(--font-body); color: var(--dc-faint); vertical-align: 3px; }
html[data-faction] .kb-panel h3 { font: 400 20px/1.25 var(--font-display); letter-spacing: 0; text-transform: none; }
html[data-faction] .kb-panel p { line-height: 1.7; }
html[data-faction] .kb-cols { gap: 24px; }
html[data-faction] .kb-table { font-size: 15.5px; }
html[data-faction] .kb-table th, html[data-faction] .kb-table td { padding: 11px 0; }
html[data-faction] .kb-table thead th { font-size: 13px; letter-spacing: .02em; text-transform: none; }
html[data-faction] .kb-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
html[data-faction] .kb-card b { font-size: 15.5px; line-height: 1.35; }
html[data-faction] .kb-card small { font-size: 13px; }
html[data-faction] .kb-filters { gap: 12px; margin-bottom: 28px; padding: 18px 22px; border-radius: 10px; }
html[data-faction] .kb-facet > b { font-size: 13px; letter-spacing: .02em; text-transform: none; }
html[data-faction] .kb-chip { padding: 6px 13px; font-size: 14px; }
html[data-faction] .kb-facet { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; padding-bottom: 2px; }
html[data-faction] .kb-facet > b { flex: none; min-width: 110px; }
html[data-faction] .kb-facet > .kb-chip { flex: none; }
@media (max-width: 640px) {
  html[data-faction] .kb-main { padding: 22px 16px 60px; }
  html[data-faction] .kb-panel { padding: 20px 18px 22px; }
  html[data-faction] .kb-panel h2 { font-size: 22px; }
  html[data-faction] .kb-entity-head { grid-template-columns: 72px minmax(0, 1fr); gap: 18px; align-items: start; }
  html[data-faction] .kb-facet > b { min-width: 84px; }
  html[data-faction] .kb-facet { scrollbar-width: none; } /* на телефоне листают пальцем — полоса прокрутки под каждым рядом лишняя */
  html[data-faction] .kb-entity-head .kb-icon, html[data-faction] .kb-entity-head .kb-title-icon { width: 72px; height: 72px; }
}