/* ============================================================================
   Лор-хаб «Хроники Аден» — /kategorii/lore/ (V2 «Кодекс»)
   Обложка + оглавление-«нить» (category-lore.php) и читалка-пергамент
   с боковым индексом (content-lore.php). Тёмный переплёт + коричневый свиток.
   ============================================================================ */
.lore-hub, .lore-read{
  --l-ink:#0c0d11; --l-chrome:#111219; --l-line:#282a34;
  --l-gold:#c9a15a; --l-gold-2:#e6c47e; --l-gold-deep:#9c7838; --l-glow:rgba(201,161,90,.3);
  --l-cream:#e9e0cd; --l-dim:#b3aa94; --l-faint:#7d7663;
  --l-paper-edge:#9c8258; --l-sepia:#291d0e; --l-sepia-soft:#453a24; --l-sepia-faint:#6b5a3c; --l-bronze:#7a4d17;
  --l-display:"Palatino Linotype","Book Antiqua",Palatino,Georgia,"Times New Roman",serif;
  --l-body:"Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;
  --l-ui:ui-sans-serif,system-ui,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
.lore-hub *, .lore-read *{box-sizing:border-box}
.lore-hub ::selection, .lore-read ::selection{background:rgba(201,161,90,.28); color:#fff}

/* медальон-логотип (реальная иконка L2, позолочена фильтром) */
.lore-medallion{border-radius:50%; overflow:hidden; position:relative; flex:none; background:#0f1013;
  border:1px solid rgba(201,161,90,.55); box-shadow:0 0 0 5px rgba(201,161,90,.05), 0 10px 28px rgba(0,0,0,.5)}
.lore-medallion img{width:100%; height:100%; object-fit:cover; display:block;
  filter:grayscale(1) sepia(1) saturate(2.6) hue-rotate(2deg) brightness(1.02) contrast(.96)}

/* орнамент: линия — ромб — линия */
.lore-orn{display:flex; align-items:center; justify-content:center; gap:16px; color:var(--l-gold)}
.lore-orn::before,.lore-orn::after{content:""; height:1px; width:86px; max-width:22vw; background:linear-gradient(90deg,transparent,var(--l-gold-deep))}
.lore-orn::after{background:linear-gradient(90deg,var(--l-gold-deep),transparent)}
.lore-orn i{width:7px; height:7px; flex:none; background:var(--l-gold); transform:rotate(45deg); box-shadow:0 0 10px var(--l-glow)}

/* ─────────────  ОБЛОЖКА (лендинг категории)  ───────────── */
.lore-cover{position:relative; overflow:hidden; text-align:center; border-radius:14px;
  padding:clamp(48px,8vw,90px) 24px; margin:8px 0 8px;
  background:radial-gradient(120% 90% at 50% 0%, rgba(201,161,90,.12), transparent 55%),
    linear-gradient(180deg,#181a21 0%,#0f1014 100%);
  border:1px solid var(--l-line); box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.lore-cover-in{position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; gap:22px; max-width:820px; margin:0 auto}
.lore-cover .lore-medallion{width:84px; height:84px}
.lore-eyebrow{font-family:var(--l-ui); font-size:12px; letter-spacing:.4em; text-transform:uppercase; color:var(--l-gold); font-weight:600; padding-left:.4em}
.lore-cover h1{margin:0; font-family:var(--l-display); font-weight:700; font-variant:small-caps; letter-spacing:.05em; line-height:.98;
  font-size:clamp(46px,9vw,104px); text-wrap:balance;
  background:linear-gradient(180deg,#fbf0d4 0%,var(--l-gold-2) 44%,var(--l-gold) 62%,var(--l-gold-deep) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; text-shadow:0 2px 40px rgba(201,161,90,.15)}
.lore-cover p{margin:0; font-style:italic; color:var(--l-dim); font-size:clamp(16px,2.2vw,21px); max-width:48ch; line-height:1.55; text-wrap:balance}
.lore-cta{margin-top:2px; display:inline-flex; align-items:center; gap:10px; font-family:var(--l-ui); font-size:14px; font-weight:600;
  letter-spacing:.04em; color:#1a1509; cursor:pointer; padding:14px 30px; border:0; border-radius:2px;
  background:linear-gradient(180deg,var(--l-gold-2),var(--l-gold)); box-shadow:0 10px 30px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.35);
  transition:transform .18s ease, box-shadow .18s ease; text-decoration:none}
.lore-cta:hover{transform:translateY(-2px); box-shadow:0 16px 40px rgba(201,161,90,.28), inset 0 1px 0 rgba(255,255,255,.4)}
.lore-cta svg{width:16px; height:16px}

/* ─────────────  ОГЛАВЛЕНИЕ (книжное «содержание»: фолио-цифры + линейки)  ───────────── */
.lore-toc{position:relative; margin:56px 0 20px}
.lore-toc-head{text-align:center; margin-bottom:34px}
.lore-toc-head .lore-t{font-family:var(--l-display); font-variant:small-caps; letter-spacing:.04em; font-weight:700;
  font-size:clamp(30px,5vw,48px); margin:12px 0 0; color:var(--l-cream)}
.lore-toc-head .lore-note{color:var(--l-dim); font-style:italic; max-width:56ch; margin:14px auto 0}
.lore-chap{position:relative; display:grid; grid-template-columns:74px 1fr auto; align-items:baseline; gap:26px;
  padding:22px 16px; text-decoration:none; color:inherit; border-top:1px solid rgba(201,161,90,.15);
  transition:background .22s ease}
.lore-chap:last-child{border-bottom:1px solid rgba(201,161,90,.15)}
.lore-chap:hover{background:linear-gradient(100deg,rgba(201,161,90,.055),transparent 80%)}
.lore-chap .lore-num{font-family:var(--l-display); font-variant:small-caps; font-weight:700; font-size:38px; line-height:.85;
  color:var(--l-gold-deep); text-align:center; letter-spacing:.02em; transition:color .22s ease}
.lore-chap:hover .lore-num{color:var(--l-gold-2)}
.lore-chap .lore-ct{font-family:var(--l-display); font-size:25px; color:var(--l-cream); letter-spacing:.01em; line-height:1.22; display:block}
.lore-chap:hover .lore-ct{color:#fff}
.lore-chap .lore-cd{font-size:14.5px; color:var(--l-dim); margin-top:6px; line-height:1.5; font-style:italic}
.lore-chap .lore-meta{font-family:var(--l-ui); font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--l-faint); white-space:nowrap; align-self:center; transition:color .22s ease}
.lore-chap:hover .lore-meta{color:var(--l-gold)}

/* ─────────────  ЧИТАЛКА ГЛАВЫ  ───────────── */
.lore-read{display:grid; grid-template-columns:270px 1fr; gap:34px; align-items:start}
.lore-index{position:sticky; top:24px; align-self:start; font-family:var(--l-body);
  max-height:calc(100vh - 40px); overflow-y:auto; overscroll-behavior:contain; padding-right:8px;
  scrollbar-width:thin; scrollbar-color:var(--l-gold-deep) transparent}
.lore-index::-webkit-scrollbar{width:8px}
.lore-index::-webkit-scrollbar-thumb{background:var(--l-gold-deep); border-radius:4px}
.lore-index::-webkit-scrollbar-thumb:hover{background:var(--l-gold)}
.lore-index::-webkit-scrollbar-track{background:transparent}
.lore-index-head{font-family:var(--l-ui); font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--l-gold);
  padding:0 0 12px; border-bottom:1px solid var(--l-line); margin-bottom:6px; display:flex; align-items:center; gap:10px}
.lore-index-head::after{content:""; flex:1; height:1px; background:linear-gradient(90deg,var(--l-gold-deep),transparent)}
.lore-idx{display:grid; grid-template-columns:32px 1fr; gap:10px; align-items:baseline; padding:7px 10px; border-radius:8px;
  color:var(--l-dim); text-decoration:none; transition:background .16s ease, color .16s ease}
.lore-idx:hover{background:rgba(201,161,90,.06); color:var(--l-cream)}
.lore-idx.active{background:linear-gradient(100deg,rgba(201,161,90,.14),transparent 80%); color:#fff}
.lore-idx .rn{font-family:var(--l-display); font-variant:small-caps; color:var(--l-gold); font-size:15px; text-align:center}
.lore-idx.active .rn{color:var(--l-gold-2)}
.lore-idx .tt{font-family:var(--l-display); font-size:16px; line-height:1.25}
.lore-idx-toc{display:inline-flex; align-items:center; gap:8px; margin-bottom:16px; font-family:var(--l-ui); font-size:11px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--l-faint); text-decoration:none}
.lore-idx-toc:hover{color:var(--l-gold)}

/* пергамент */
.lore-main{min-width:0}
.lore-sheet{position:relative; color:var(--l-sepia); border-radius:4px; padding:58px clamp(24px,5vw,68px) 52px; isolation:isolate;
  background:
    radial-gradient(38% 26% at 17% 12%, rgba(150,100,44,.22), transparent 60%),
    radial-gradient(30% 22% at 86% 82%, rgba(120,74,32,.24), transparent 60%),
    radial-gradient(26% 20% at 73% 22%, rgba(150,108,54,.18), transparent 60%),
    radial-gradient(24% 18% at 28% 74%, rgba(120,82,38,.20), transparent 60%),
    radial-gradient(18% 14% at 55% 48%, rgba(140,96,44,.10), transparent 60%),
    linear-gradient(168deg, #c2a87f 0%, #b69a6d 50%, #ab8f62 100%);
  box-shadow:0 34px 70px rgba(0,0,0,.6), 0 2px 0 rgba(255,255,255,.04), inset 0 0 0 1px var(--l-paper-edge)}
.lore-sheet::before{content:""; position:absolute; inset:0; border-radius:4px; pointer-events:none; z-index:0;
  mix-blend-mode:overlay; opacity:.85; background-size:600px 600px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='600' height='600'><filter id='c' color-interpolation-filters='sRGB'><feTurbulence type='fractalNoise' baseFrequency='0.015' numOctaves='5' seed='11' result='n'/><feDiffuseLighting in='n' surfaceScale='4.5' diffuseConstant='1.15' lighting-color='%23ffffff' result='l'><feDistantLight azimuth='235' elevation='55'/></feDiffuseLighting></filter><rect width='100%25' height='100%25' filter='url(%23c)'/></svg>")}
.lore-sheet::after{content:""; position:absolute; inset:0; border-radius:4px; pointer-events:none; z-index:0;
  mix-blend-mode:multiply; opacity:.6;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23g)' opacity='0.4'/></svg>");
  box-shadow:inset 0 0 150px rgba(96,64,24,.40), inset 0 0 40px rgba(66,42,12,.28)}
.lore-sheet > *{position:relative; z-index:1}

.lore-ch-eyebrow{font-family:var(--l-ui); font-size:11.5px; letter-spacing:.3em; text-transform:uppercase; color:var(--l-bronze); text-align:center; font-weight:600}
.lore-ch-title{font-family:var(--l-display); font-variant:small-caps; letter-spacing:.03em; font-weight:700;
  font-size:clamp(36px,6.5vw,62px); line-height:1.03; text-align:center; margin:12px 0 8px; color:#201a10; text-wrap:balance}
.lore-ch-lede{text-align:center; font-style:italic; color:var(--l-sepia-soft); font-size:19px; margin:0 auto 8px; max-width:48ch}
.lore-body{max-width:64ch; margin:0 auto; font-family:var(--l-body); font-size:19px; line-height:1.75; color:var(--l-sepia)}
.lore-body p{margin:0 0 22px}
.lore-body > p:first-of-type::first-letter{font-family:var(--l-display); float:left; font-size:78px; line-height:.78;
  padding:2px 12px 0 0; font-weight:700; color:var(--l-bronze); text-shadow:0 1px 0 rgba(255,255,255,.35)}
.lore-body h2,.lore-body h3{font-family:var(--l-ui); text-transform:uppercase; letter-spacing:.22em; font-size:12.5px; font-weight:700;
  color:var(--l-bronze); text-align:center; margin:34px 0 20px}
.lore-body b,.lore-body strong{color:#201a10; font-weight:700}
.lore-body blockquote{margin:32px 0; padding:2px 0 2px 24px; border-left:2px solid var(--l-bronze)}
.lore-body blockquote p{font-family:var(--l-display); font-style:italic; font-size:21px; color:#4a3c26; margin:0; line-height:1.5}
.lore-body blockquote cite{display:block; font-style:normal; font-family:var(--l-ui); font-size:11px; letter-spacing:.15em;
  text-transform:uppercase; color:var(--l-sepia-faint); margin-top:11px}
/* ссылки в лоре — явные, «книжная сноска»: бронза + пунктир, не просто жирный */
.lore-body a{color:var(--l-bronze); font-weight:600; text-decoration:underline; text-decoration-style:dotted;
  text-decoration-color:rgba(122,77,23,.65); text-underline-offset:3px; text-decoration-thickness:1px;
  transition:color .15s ease, text-decoration-color .15s ease, background .15s ease; border-radius:2px}
.lore-body a:hover{color:#5e3a12; text-decoration-style:solid; text-decoration-color:var(--l-bronze); background:rgba(122,77,23,.08)}
.lore-body a strong{color:inherit}  /* имя-ссылка (Антарас и т.п.) берёт цвет ссылки, а не тёмный жирный */
/* разделитель актов внутри текста */
.lore-body hr{border:0; display:flex; align-items:center; justify-content:center; gap:14px; margin:34px 0; height:1px; overflow:visible}
.lore-body hr::before{content:"◆"; color:var(--l-bronze); font-size:12px}

/* низ главы: продолжение следует */
.lore-end{margin-top:44px; padding-top:26px; border-top:1px solid var(--l-paper-edge); text-align:center}
.lore-end .cont{font-family:var(--l-ui); font-size:11px; letter-spacing:.34em; text-transform:uppercase; color:var(--l-bronze); margin-bottom:12px}
.lore-end a.next{display:inline-flex; align-items:center; gap:12px; font-family:var(--l-display); font-variant:small-caps;
  letter-spacing:.02em; font-size:clamp(23px,4vw,32px); color:#201a10; text-decoration:none}
.lore-end a.next:hover{color:var(--l-bronze)}
.lore-end a.next svg{width:22px; height:22px; color:var(--l-bronze)}
.lore-end .prevlink{display:inline-block; margin-top:16px; font-family:var(--l-ui); font-size:12px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--l-sepia-faint); text-decoration:none}
.lore-end .prevlink:hover{color:var(--l-bronze)}

/* CTA к каталогу серверов (монетизация) */
.lore-cta-servers{margin:26px 0 0; display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
  padding:20px 24px; border:1px solid var(--l-line); border-radius:12px;
  background:linear-gradient(160deg,#1a1c22,#131419)}
.lore-cta-servers .txt{font-family:var(--l-display); font-size:19px; color:var(--l-cream)}
.lore-cta-servers .txt span{display:block; font-family:var(--l-ui); font-size:12.5px; letter-spacing:.02em; color:var(--l-dim); margin-top:4px}
.lore-cta-servers a{flex:none; font-family:var(--l-ui); font-size:13.5px; font-weight:700; letter-spacing:.03em; color:#1a1509;
  padding:12px 24px; border-radius:8px; text-decoration:none; background:linear-gradient(180deg,var(--l-gold-2),var(--l-gold));
  box-shadow:0 8px 22px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.35); transition:transform .16s ease}
.lore-cta-servers a:hover{transform:translateY(-2px)}

.lore-reveal{opacity:0; transform:translateY(20px); transition:opacity .7s ease, transform .7s ease}
.lore-reveal.in{opacity:1; transform:none}

@media (max-width:900px){
  .lore-read{grid-template-columns:1fr; gap:18px}
  .lore-index{position:static; border:1px solid var(--l-line); border-radius:12px; padding:14px 16px; background:var(--l-chrome);
    max-height:none; overflow:visible}
}
@media (max-width:640px){
  .lore-chap{grid-template-columns:46px 1fr; padding:18px 6px; gap:16px}
  .lore-chap .lore-num{font-size:30px}
  .lore-chap .lore-ct{font-size:21px}
  .lore-chap .lore-meta{display:none}
}
@media (prefers-reduced-motion:reduce){ .lore-reveal{opacity:1; transform:none; transition:none} }

/* ─────────────  ХРОНИКИ СУДЕБ (kind=fate)  ───────────── */
.lore-hub .lore-toc--fate{margin-top:40px}
.lore-hub .lore-num--fate,.lore-hub .lore-num--lore{color:var(--l-gold-deep); font-size:24px; line-height:.9}
.lore-hub .lore-num--lore{font-size:22px}
.lore-hub .lore-src{display:block; margin-top:7px; font-family:var(--l-ui); font-size:11.5px;
  letter-spacing:.03em; color:var(--l-gold-deep); font-style:italic}
/* строка «Источник» в читалке-пергаменте */
.lore-read .lore-ch-src{margin:12px 0 0; font-family:var(--l-ui); font-size:13px; color:var(--l-sepia-soft)}
.lore-read .lore-ch-src span{text-transform:uppercase; letter-spacing:.13em; font-size:10px; font-weight:700;
  color:var(--l-bronze); opacity:.85; margin-right:7px}
.lore-read .lore-ch-src a{color:var(--l-bronze); font-weight:600; text-decoration:underline;
  text-decoration-style:dotted; text-decoration-color:rgba(122,77,23,.6); text-underline-offset:3px}
.lore-read .lore-ch-src a:hover{color:#5e3a12; text-decoration-style:solid}
/* подзаголовок группы «Хроники судеб» в боковом индексе */
.lore-read .lore-index-head--sub{margin-top:20px; padding-top:14px; border-top:1px solid rgba(201,161,90,.18)}