/* ============================================================
   heg-learn-dark.css — альтернативный тёмный формат для /learn/
   («разбор» / «эссе» / «дайджест»). Канонический инвертированный
   dark из heg-ai-design-system-6 (tokens/dark.css), НЕ новая палитра.
   Скоуп: .learn-dark обёртка вокруг <main> — header/nav остаются
   светлыми (heg-ds.css), .site-footer уже тёмный по умолчанию, так
   что шов светлый-header → тёмный-main → тёмный-footer не требует
   правок глобального heg-ds.css. Подробности и правила — в
   site-v2/learn/CLAUDE.md, раздел «Альтернативный тёмный формат».

   Акцентные скины: два (не три) — [data-accent] отсутствует ⇒ ember,
   [data-accent="blue"] ⇒ blue. Green сознательно НЕ используется как
   акцент для мелкого текста/линий: --green (#06463D) и даже --green-600
   не проходят контраст на фоне #0A0E0C (см. site-v2/learn/CLAUDE.md).
   Green остаётся в системе как sanctioned soft radial glow внутри
   сплошных карточек — см. .learn-dark .promptcard-foot.
   ============================================================ */

.learn-dark{
  --dark-bg:#0A0E0C;
  --dark-card:#18271F;
  --dark-well:#0C1813;
  --dark-line:rgba(250,247,234,.10);
  --dark-line-strong:rgba(250,247,234,.22);
  --dark-text:var(--heg-ivory);
  --dark-text-secondary:rgba(250,247,234,.70);
  --dark-text-muted:rgba(250,247,234,.45);
  --dark-shadow-sm:0 2px 8px rgba(0,0,0,.30);
  --dark-shadow-lg:0 8px 32px rgba(0,0,0,.40);
  --accent:var(--heg-ember);
  --accent-ink:var(--heg-ink);      /* text color when accent used as a small filled chip */
  --accent-glow:rgba(255,106,61,.20);
  --accent-line:rgba(255,106,61,.55);
  --del:#C25B4E;                     /* muted red, strike-through only, never a fill */

  display:block;
  background:var(--dark-bg);
  color:var(--dark-text);
  font-family:var(--heg-font);
  letter-spacing:.2px;
  padding-bottom:8px;
}
.learn-dark[data-accent="blue"]{
  --accent:#B7D4E4;
  --accent-ink:var(--heg-ink);
  --accent-glow:rgba(183,212,228,.18);
  --accent-line:rgba(183,212,228,.55);
}

.learn-dark *{box-sizing:border-box}
.learn-dark .wrap{max-width:720px;margin:0 auto;padding:0 22px}
.learn-dark .wrap-wide{max-width:1040px;margin:0 auto;padding:0 22px}
.learn-dark a{color:var(--accent);text-decoration:none;border-bottom:1px solid var(--accent-line)}
.learn-dark a:hover{border-bottom-color:currentColor}
.learn-dark ::selection{background:var(--accent-glow)}

/* neutralize heg-ds.css photo-grain/film-filter forced on .article__cover —
   our cover is a typographic SVG, not a photo (grain-on-non-photo is a bug
   per heg-ai-design-system-6/CLAUDE.md). Higher specificity than the
   1-class rule in heg-ds.css wins regardless of load order. */
.learn-dark .article__cover img{filter:none !important}
.learn-dark .article__cover::after{display:none !important;content:none !important}

/* ---------- hero ---------- */
.learn-dark .lrn-hero{padding:56px 0 40px}
.learn-dark .lrn-kicker{
  display:inline-flex;align-items:center;gap:8px;font-family:var(--heg-mono);
  font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);
  margin:0 0 22px;
}
.learn-dark .lrn-kicker .dot{width:6px;height:6px;border-radius:2px;background:var(--accent)}
.learn-dark .lrn-kicker b{color:var(--dark-text-secondary);font-weight:400}
.learn-dark .article__title{
  font-family:var(--heg-font);font-weight:800;color:var(--dark-text);
  font-size:clamp(32px,5.4vw,52px);line-height:1.06;letter-spacing:-.01em;
  margin:0 0 8px;text-wrap:balance;
}
.learn-dark .lrn-subtitle{font-family:var(--heg-mono);color:var(--dark-text-muted);font-size:13px;margin:0 0 24px}
.learn-dark .article__lede{
  font-size:20px;line-height:1.5;color:var(--dark-text-secondary);max-width:640px;
  margin:0 0 26px;text-wrap:pretty;
}
.learn-dark .article__meta{
  display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;
  font-family:var(--heg-mono);font-size:12.5px;color:var(--dark-text-muted);
}

/* ---------- cover ---------- */
.learn-dark .article__cover{max-width:960px;margin:0 auto 8px;border-radius:16px;overflow:hidden;border:1px solid var(--dark-line)}
.learn-dark .article__cover img{display:block;width:100%;height:auto}
.learn-dark .lrn-cover-note{font-family:var(--heg-mono);font-size:11.5px;color:var(--dark-text-muted);margin:8px 2px 0;text-align:center}

/* ---------- body typography ---------- */
.learn-dark .article__body{max-width:720px;margin:0 auto}
.learn-dark section{padding:26px 0}
.learn-dark h2{
  font-family:var(--heg-font);font-weight:700;color:var(--dark-text);
  font-size:clamp(22px,3.2vw,29px);line-height:1.2;margin:40px 0 16px;
}
.learn-dark h2 .idx{color:var(--accent);font-weight:600;font-size:.68em;font-family:var(--heg-mono);margin-right:12px;vertical-align:2px}
.learn-dark p{margin:0 0 18px;color:var(--dark-text-secondary);line-height:1.65}
.learn-dark strong{color:var(--dark-text);font-weight:600}
.learn-dark .dim{color:var(--dark-text-muted)}
.learn-dark .small{font-size:14px;color:var(--dark-text-muted)}

.learn-dark blockquote{
  margin:28px 0;padding:2px 0 2px 22px;border-left:3px solid var(--accent);
  font-family:var(--heg-quote);font-style:italic;font-size:21px;line-height:1.5;color:var(--dark-text);
}
.learn-dark blockquote .who{display:block;margin-top:10px;font-family:var(--heg-mono);font-style:normal;font-size:12px;color:var(--dark-text-muted)}

/* ---------- TL;DR ---------- */
.learn-dark .lrn-tldr{background:var(--dark-card);border:1px solid var(--dark-line-strong);border-radius:16px;padding:24px 26px;margin:8px 0 12px}
.learn-dark .lrn-tldr h3{font-family:var(--heg-mono);font-weight:600;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin:0 0 14px}
.learn-dark .lrn-tldr ol,.learn-dark .lrn-tldr ul{list-style:none;margin:0;padding:0;counter-reset:tldr}
.learn-dark .lrn-tldr li{position:relative;padding:10px 0 10px 30px;border-top:1px dashed var(--dark-line);font-size:15.5px;line-height:1.55;color:var(--dark-text-secondary)}
.learn-dark .lrn-tldr li:first-child{border-top:0}
.learn-dark .lrn-tldr li::before{content:counter(tldr,decimal-leading-zero);counter-increment:tldr;position:absolute;left:0;top:11px;font-family:var(--heg-mono);font-size:12px;color:var(--accent)}

/* ---------- video placeholder / embed ---------- */
.learn-dark .lrn-video{position:relative;margin:30px 0;border-radius:16px;overflow:hidden;border:1px solid var(--dark-line-strong);background:#000;aspect-ratio:16/9}
.learn-dark .lrn-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.learn-dark .lrn-video-cap{font-family:var(--heg-mono);font-size:12.5px;color:var(--dark-text-muted);margin:10px 2px 0}

/* ---------- prompt before/after demo ---------- */
.learn-dark .promptcard{margin:28px 0 8px;border:1px solid var(--dark-line-strong);border-radius:16px;overflow:hidden;background:var(--dark-card)}
.learn-dark .promptcard-bar{display:flex;align-items:center;gap:8px;padding:13px 18px;border-bottom:1px solid var(--dark-line)}
.learn-dark .promptcard-bar i{width:10px;height:10px;border-radius:2px;background:var(--dark-line-strong)}
.learn-dark .promptcard-bar i:nth-child(1){background:var(--del);opacity:.8}
.learn-dark .promptcard-bar i:nth-child(2){background:var(--accent);opacity:.8}
.learn-dark .promptcard-bar span{margin-left:6px;font-family:var(--heg-mono);font-size:12.5px;color:var(--dark-text-muted)}
.learn-dark .promptcard-bar .stat{margin-left:auto;font-family:var(--heg-mono);font-size:12.5px;color:var(--dark-text-muted)}
.learn-dark .promptcard-bar .stat b{color:var(--accent);font-weight:700;font-size:15px}
.learn-dark .plines{padding:16px 20px 6px;font-family:var(--heg-mono);font-size:13px;line-height:1.5}
.learn-dark .pline{
  display:grid;grid-template-columns:26px 1fr;gap:0 12px;padding:4px 0;color:var(--dark-text-secondary);
  border-radius:6px;overflow:hidden;max-height:80px;
  transition:opacity .45s ease,transform .45s ease,max-height .5s ease,padding .5s ease;
}
.learn-dark .pline .ln{color:var(--dark-text-muted);text-align:right;user-select:none}
.learn-dark .pline.gone{color:var(--del);opacity:.55;text-decoration:line-through;text-decoration-color:rgba(194,91,78,.7)}
.learn-dark .pline.gone .ln{color:rgba(194,91,78,.55)}
.learn-dark .pline.collapsed{max-height:0;padding-top:0;padding-bottom:0;opacity:0;transform:translateX(-8px)}
.learn-dark .pline.keep{color:var(--dark-text)}
.learn-dark .pline.keep .ln{color:var(--accent)}
.learn-dark .promptcard-foot{
  display:flex;flex-wrap:wrap;align-items:center;gap:14px;padding:14px 20px 18px;
  border-top:1px solid var(--dark-line);font-size:13px;color:var(--dark-text-secondary);
  background:radial-gradient(120px 60px at 0% 0%, rgba(6,70,61,.35), transparent 70%); /* sanctioned exception: soft single-color glow inside a solid card */
}
.learn-dark .lrn-btn{
  appearance:none;cursor:pointer;border:0;color:var(--accent-ink);background:var(--accent);
  font-family:var(--heg-mono);font-size:13.5px;font-weight:700;letter-spacing:.02em;
  padding:11px 18px;border-radius:12px;transition:transform .12s ease,box-shadow .2s ease;
  box-shadow:0 4px 18px var(--accent-glow);
}
.learn-dark .lrn-btn:hover{transform:translateY(-1px)}
.learn-dark .lrn-btn:active{transform:translateY(0)}
.learn-dark .lrn-btn[disabled]{opacity:.45;cursor:default;transform:none;box-shadow:none}
.learn-dark .lrn-btn-ghost{
  appearance:none;cursor:pointer;background:none;border:none;color:var(--dark-text-muted);
  font-family:var(--heg-mono);font-size:12.5px;border-bottom:1px dashed var(--dark-line-strong);padding:0;
}
.learn-dark .promptcard-verdict{
  display:none;margin:0 20px 18px;padding:12px 16px;border-radius:10px;
  background:rgba(255,106,61,.08);border:1px solid var(--accent-glow);
  font-family:var(--heg-mono);font-size:13px;color:var(--accent);
}
.learn-dark .promptcard-verdict.show{display:block;animation:lrn-fadein .5s ease}
@keyframes lrn-fadein{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* ---------- stats grid ---------- */
.learn-dark .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:30px 0 10px}
.learn-dark .stat{background:var(--dark-card);border:1px solid var(--dark-line-strong);border-radius:16px;padding:20px 18px 16px}
.learn-dark .stat .v{font-family:var(--heg-font);font-weight:700;font-size:clamp(20px,2.8vw,27px);color:var(--accent);line-height:1.1;margin-bottom:8px;letter-spacing:-.01em}
.learn-dark .stat .l{font-size:13px;color:var(--dark-text-muted);line-height:1.4}
@media (max-width:760px){.learn-dark .stats{grid-template-columns:repeat(2,1fr)}}

/* ---------- "still running" callout ---------- */
.learn-dark .lrn-running{display:flex;gap:16px;align-items:flex-start;margin:26px 0;padding:18px 20px;background:var(--dark-card);border:1px solid var(--dark-line-strong);border-radius:16px}
.learn-dark .lrn-pulse{flex:0 0 auto;margin-top:6px;width:9px;height:9px;border-radius:50%;background:var(--accent);position:relative}
.learn-dark .lrn-pulse::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1.5px solid var(--accent);animation:lrn-pulse 1.8s ease-out infinite}
@keyframes lrn-pulse{0%{transform:scale(.5);opacity:.9}100%{transform:scale(1.5);opacity:0}}
@media (prefers-reduced-motion:reduce){.learn-dark .lrn-pulse::after{animation:none;opacity:.3}}
.learn-dark .lrn-running .t{font-family:var(--heg-mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}
.learn-dark .lrn-running p{margin:0;font-size:15px;color:var(--dark-text-secondary)}

/* ---------- routines / comparison list ---------- */
.learn-dark .routines{margin:26px 0 8px;border:1px solid var(--dark-line-strong);border-radius:16px;overflow:hidden}
.learn-dark .routine{display:grid;grid-template-columns:minmax(220px,44%) 1fr;border-top:1px solid var(--dark-line);background:var(--dark-card)}
.learn-dark .routine:first-child{border-top:0}
.learn-dark .routine .prompt{padding:15px 18px;font-family:var(--heg-mono);font-size:12.5px;line-height:1.5;color:var(--accent);background:rgba(255,255,255,.02);border-right:1px solid var(--dark-line)}
.learn-dark .routine .prompt::before{content:"$ ";color:var(--dark-text-muted)}
.learn-dark .routine .what{padding:15px 18px;font-size:14px;color:var(--dark-text-secondary)}
@media (max-width:680px){.learn-dark .routine{grid-template-columns:1fr}.learn-dark .routine .prompt{border-right:0;border-bottom:1px dashed var(--dark-line)}}

/* ---------- digest item (archetype: digest) ---------- */
.learn-dark .digest-list{margin:26px 0 8px;display:flex;flex-direction:column;gap:12px}
.learn-dark .digest-item{background:var(--dark-card);border:1px solid var(--dark-line-strong);border-radius:16px;padding:20px 22px}
.learn-dark .digest-item__h{display:flex;align-items:baseline;gap:10px;margin:0 0 8px}
.learn-dark .digest-item__idx{font-family:var(--heg-mono);font-size:12px;color:var(--accent)}
.learn-dark .digest-item__title{font-family:var(--heg-font);font-weight:700;font-size:17px;color:var(--dark-text);margin:0}
.learn-dark .digest-item p{margin:0 0 10px;font-size:14.5px}
.learn-dark .digest-item a.src{font-family:var(--heg-mono);font-size:12px}

/* ---------- chart card ---------- */
.learn-dark .chart-card{margin:30px 0 8px;background:var(--dark-card);border:1px solid var(--dark-line-strong);border-radius:16px;padding:24px 22px 16px}
.learn-dark .chart-card h4{margin:0 0 4px;font-family:var(--heg-font);font-weight:600;font-size:17px;color:var(--dark-text)}
.learn-dark .chart-sub{margin:0 0 18px;font-size:13.5px;color:var(--dark-text-muted)}
.learn-dark .chart-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.learn-dark .chart-scroll svg{display:block;min-width:640px;width:100%;height:auto}
.learn-dark .chart-note{margin:12px 2px 6px;font-size:12.5px;color:var(--dark-text-muted);line-height:1.5}
.learn-dark details.data{margin:8px 0 0}
.learn-dark details.data summary{cursor:pointer;font-family:var(--heg-mono);font-size:12.5px;color:var(--dark-text-muted)}
.learn-dark details.data table{width:100%;border-collapse:collapse;margin-top:10px;font-size:13.5px}
.learn-dark details.data th,.learn-dark details.data td{text-align:left;padding:7px 10px;border-top:1px solid var(--dark-line);color:var(--dark-text-secondary)}
.learn-dark details.data th{font-family:var(--heg-mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--dark-text-muted)}
.learn-dark #lrn-tip{position:fixed;z-index:60;display:none;pointer-events:none;background:var(--dark-well);border:1px solid var(--dark-line-strong);border-radius:10px;padding:9px 12px;font-size:13px;color:var(--dark-text);box-shadow:var(--dark-shadow-lg)}
.learn-dark #lrn-tip .tt{font-family:var(--heg-mono);font-size:11.5px;color:var(--dark-text-muted);margin-bottom:3px}
.learn-dark #lrn-tip .tv{font-weight:600}

/* ---------- note in margin ---------- */
.learn-dark .lrn-note{margin:24px 0;padding:18px 20px;background:rgba(255,255,255,.03);border:1px solid var(--dark-line-strong);border-radius:14px;font-size:15px;color:var(--dark-text-secondary)}
.learn-dark .lrn-note .lrn-note-tag{display:inline-block;font-family:var(--heg-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}

/* ---------- rules / takeaways ---------- */
.learn-dark .rules{display:grid;gap:12px;margin:26px 0}
.learn-dark .rule{display:grid;grid-template-columns:60px 1fr;gap:16px;background:var(--dark-card);border:1px solid var(--dark-line-strong);border-radius:16px;padding:22px}
.learn-dark .rule .n{font-family:var(--heg-font);font-weight:800;font-size:32px;color:var(--accent);line-height:1}
.learn-dark .rule h5{margin:2px 0 8px;font-size:16.5px;font-weight:700;color:var(--dark-text)}
.learn-dark .rule p{margin:0;font-size:14.5px;color:var(--dark-text-secondary)}
@media (max-width:600px){.learn-dark .rule{grid-template-columns:1fr;gap:6px}}

/* ---------- outro / signature ---------- */
.learn-dark .lrn-outro{margin-top:8px;padding:26px 0 6px;border-top:1px solid var(--dark-line-strong)}
.learn-dark .lrn-sign{display:flex;align-items:center;gap:14px;margin:26px 0 8px}
.learn-dark .lrn-sign .ava{width:42px;height:42px;border-radius:12px;background:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--accent-ink);font-size:15px}
.learn-dark .lrn-sign .who b{display:block;font-weight:700;color:var(--dark-text)}
.learn-dark .lrn-sign .who span{font-size:13px;color:var(--dark-text-muted)}

/* ---------- CTA band ---------- */
.learn-dark .article-cta{max-width:840px;margin:56px auto 40px;padding:48px 30px;text-align:center;border-radius:16px;background:var(--dark-card);border:1px solid var(--dark-line-strong)}
.learn-dark .article-cta h3{font-family:var(--heg-font);font-weight:700;font-size:clamp(23px,3.2vw,32px);margin:0 0 10px;color:var(--dark-text)}
.learn-dark .article-cta p{color:var(--dark-text-secondary);max-width:480px;margin:0 auto 22px;font-size:16px}
.learn-dark .article-cta .lrn-btn{display:inline-block;text-decoration:none;border-bottom:0}

/* ---------- sources ---------- */
.learn-dark .sources{margin:20px 0 0;padding:20px 22px;background:var(--dark-card);border:1px solid var(--dark-line-strong);border-radius:16px}
.learn-dark .sources h4{margin:0 0 12px;font-family:var(--heg-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dark-text-muted);font-weight:600}
.learn-dark .sources ul{list-style:none;margin:0;padding:0}
.learn-dark .sources li{padding:7px 0;border-top:1px dashed var(--dark-line);font-size:14px}
.learn-dark .sources li:first-child{border-top:0}
.learn-dark .sources li span{color:var(--dark-text-muted);font-family:var(--heg-mono);font-size:11.5px;margin-left:8px}

/* ---------- tags footer (article__tags — CMS hook) ---------- */
.learn-dark .article__tags{display:flex;flex-wrap:wrap;gap:8px;margin:36px 0 0;list-style:none;padding:0;max-width:720px;margin-left:auto;margin-right:auto}
.learn-dark .tag{font-family:var(--heg-mono);font-size:12px !important;color:var(--dark-text-secondary);background:rgba(255,255,255,.06);padding:6px 13px}

/* ---------- FAQ (dark variant of the site's .aeo-faq) ---------- */
.learn-dark .aeo-faq{max-width:820px;margin:0 auto;border-top:1px solid var(--dark-line-strong)}
.learn-dark .aeo-faq__item{border-bottom:1px solid var(--dark-line-strong)}
.learn-dark .aeo-faq__item summary{list-style:none;cursor:pointer;padding:20px 0;display:flex;justify-content:space-between;gap:20px;font-family:var(--heg-font);font-weight:700;font-size:17px;color:var(--dark-text)}
.learn-dark .aeo-faq__item summary::-webkit-details-marker{display:none}
.learn-dark .aeo-faq__item summary:after{content:"+";font-size:22px;font-weight:300;color:var(--accent);flex-shrink:0}
.learn-dark .aeo-faq__item[open] summary:after{content:"\2212"}
.learn-dark .aeo-faq__item p{margin:0;padding:0 0 20px;font-size:15px;line-height:1.6;color:var(--dark-text-secondary);max-width:64ch}
.learn-dark .aeo-faq__h{text-align:center;font-family:var(--heg-font);font-weight:700;font-size:clamp(24px,3.6vw,34px);color:var(--dark-text);margin:0 0 28px}

/* ---------- back link + footnote ---------- */
.learn-dark .lrn-back{display:inline-block;font-size:14px;font-weight:600;color:var(--dark-text-muted);margin-bottom:24px}
.learn-dark .lrn-back:hover{color:var(--dark-text);border-bottom-color:transparent}
.learn-dark .lrn-footnote{font-family:var(--heg-mono);font-size:12px;color:var(--dark-text-muted);padding:0 0 40px;max-width:720px;margin:0 auto}

/* ---------- scroll reveal (progressive enhancement, JS-driven) ---------- */
.learn-dark .lrn-reveal{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease}
.learn-dark .lrn-reveal.on{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.learn-dark .lrn-reveal{opacity:1;transform:none;transition:none}}