/* EGYTAG CLASSIC DARK GRAPHITE SURFACES · 2026-10-26
   Approved permanent classic dark palette, with the newer compact card layout.
   Dark-only, public-site layer; no modification to explicit reading presets.
   This file is deliberately loaded last, after existing page-specific CSS.
*/
:root[data-theme="dark"]{
  color-scheme:dark;
  --eg-graphite-canvas:#171c20;
  --eg-graphite-canvas-high:#1e2428;
  --eg-graphite-raised:#24292d;
  --eg-graphite-inner:#2c3337;
  --eg-graphite-control:#343e45;
  --eg-graphite-edge:#424e56;
  --eg-graphite-border-soft:#39454b;
  --eg-graphite-text:#eef2f4;
  --eg-graphite-secondary:#d0d9de;
  --eg-graphite-muted:#afbbc3;
  --surface-canvas:var(--eg-graphite-canvas);
  --surface-raised:var(--eg-graphite-raised);
  --surface-muted:var(--eg-graphite-inner);
  --surface-soft:var(--eg-graphite-canvas-high);
  --text-primary:var(--eg-graphite-text);
  --text-secondary:var(--eg-graphite-secondary);
  --text-muted:var(--eg-graphite-muted);
  --border-subtle:var(--eg-graphite-border-soft);
  --border-strong:var(--eg-graphite-edge);
  --solid-canvas:var(--eg-graphite-canvas);
  --solid-surface-1:var(--eg-graphite-canvas-high);
  --solid-surface-2:var(--eg-graphite-raised);
  --solid-surface-3:var(--eg-graphite-inner);
  --solid-border:var(--eg-graphite-border-soft);
  --solid-border-strong:var(--eg-graphite-edge);
  --glass-fill:var(--eg-graphite-raised);
  --glass-fill-soft:var(--eg-graphite-canvas-high);
  --glass-fill-strong:var(--eg-graphite-inner);
  --glass-border:var(--eg-graphite-edge);
  --glass-border-soft:var(--eg-graphite-border-soft);
  --shadow-color:18 25 30;
}
/* Restore the prior calm near-black charcoal without changing layout. */
:root[data-theme="dark"],
:root[data-theme="dark"] body{
  background-color:var(--eg-graphite-canvas)!important;
}
:root[data-theme="dark"] body{
  background-image:
    linear-gradient(180deg,#1b2024 0%,#171c20 470px,#171c20 100%)!important;
  background-attachment:scroll!important;
  color:var(--eg-graphite-text);
}
:root[data-theme="dark"] :is(main,#main-content,.page-shell,eg-main-content){
  background-color:transparent;
}
/* Site chrome forms a gentle, distinct layer above the page. */
:root[data-theme="dark"] .editorial-header :is(.masthead,.signal-bar),
:root[data-theme="dark"] .public-header{
  background-color:#1b2125!important;
}
:root[data-theme="dark"] .editorial-header :is(.category-nav,.header-categories,.editorial-navigation){
  background-color:#171c20!important;
}
/* Override legacy homepage background:none so the same subtle gradient stays visible. */
:root[data-theme="dark"] body.homepage-layout{
  background-image:
   linear-gradient(180deg,#1b2024 0%,#171c20 470px,#171c20 100%)!important;
}
:root[data-theme="dark"] body.homepage-layout main#main-content{
  background-color:transparent!important;
}
/* Generic card surfaces: consistent separation without glowing borders. */
:root[data-theme="dark"] :is(.story-card,.news-card,.section-card,.article-related-card,.article-sidebar__box,.article-related,.article-comments,.article-toc,.tool-card){
  background-color:var(--eg-graphite-raised);
  border-color:var(--eg-graphite-border-soft);
  box-shadow:0 12px 27px rgba(8,15,20,.14),inset 0 1px 0 rgba(244,248,249,.025);
}
/* Homepage: override the old hard-coded near-black matte surfaces, not their layout. */
:root[data-theme="dark"] body.homepage-layout{
  --home-matte-canvas:var(--eg-graphite-canvas);
  --home-matte-section:var(--eg-graphite-canvas-high);
  --home-matte-card:var(--eg-graphite-raised);
  --home-matte-inner:var(--eg-graphite-inner);
  --home-matte-border:var(--eg-graphite-border-soft);
  --home-matte-text:var(--eg-graphite-text);
  --home-matte-muted:var(--eg-graphite-muted);
}
:root[data-theme="dark"] body.homepage-layout :is(
 .home-sidebar__box,.home-reference-sidebar .home-sidebar__box,
 .home-briefing-board__lead,.home-briefing-board__support article,
 .home-compact-news-grid__item,.front-item,.home-news-support-card
){
  background:var(--eg-graphite-raised)!important;
  border-color:var(--eg-graphite-border-soft)!important;
  box-shadow:0 10px 23px rgba(9,16,20,.13),inset 0 1px 0 rgba(255,255,255,.018)!important;
}
:root[data-theme="dark"] body.homepage-layout :is(
 .home-sidebar__box>header,.home-sidebar__heading
){
  background:var(--eg-graphite-inner)!important;
  border-color:var(--eg-graphite-border-soft)!important;
}
:root[data-theme="dark"] body.homepage-layout :is(
 .home-sidebar-story,.home-reference-sidebar .home-sidebar-story,
 .home-popular-list>.home-sidebar-story:has(.home-sidebar-thumb)
){
  background:var(--eg-graphite-raised)!important;
  border-color:var(--eg-graphite-border-soft)!important;
}
:root[data-theme="dark"] body.homepage-layout :is(
 .home-sidebar-story,.home-briefing-board__support article,
 .home-compact-news-grid__item,.front-item,.home-news-support-card
):hover{
  background:var(--eg-graphite-inner)!important;
  border-color:#6e808c!important;
}
:root[data-theme="dark"] body.homepage-layout .home-popular-list>.home-sidebar-story .home-list-index{
  background:var(--eg-graphite-control)!important;
  color:#e2e8eb!important;
}

/* Final homepage visual-depth polish: the "Most read" stack reads as stories,
   not as a spreadsheet. Keep hairlines for hierarchy, soften the separators. */
:root[data-theme="dark"] body.homepage-layout .home-sidebar__box--stories{
  border-color:rgba(164,184,195,.19)!important;
  box-shadow:0 14px 31px rgba(7,13,17,.15),inset 0 1px 0 rgba(255,255,255,.035)!important;
  overflow:hidden;
}
:root[data-theme="dark"] body.homepage-layout .home-sidebar__box--stories>header{
  background:var(--eg-graphite-inner)!important;
  border-bottom:1px solid rgba(179,196,207,.18)!important;
}
:root[data-theme="dark"] body.homepage-layout .home-reference-sidebar .home-sidebar__box--stories .home-popular-list>.home-sidebar-story{
  border:0!important;
  border-bottom:1px solid rgba(181,198,208,.13)!important;
  box-shadow:none!important;
  transition:background-color .18s ease;
}
:root[data-theme="dark"] body.homepage-layout .home-reference-sidebar .home-sidebar__box--stories .home-popular-list>.home-sidebar-story:last-child{
  border-bottom-color:transparent!important;
}
:root[data-theme="dark"] body.homepage-layout .home-reference-sidebar .home-sidebar__box--stories .home-popular-list>.home-sidebar-story:hover{
  background:var(--eg-graphite-inner)!important;
}
@media(prefers-reduced-motion:reduce){
 :root[data-theme="dark"] body.homepage-layout .home-reference-sidebar .home-sidebar__box--stories .home-popular-list>.home-sidebar-story{transition:none!important}
}
/* Final micro-refinement of the approved Classic palette.
   Primary/hero cards stay #24292D. Supporting news cards and list rows stay similarly dark without extra visual noise. */
:root[data-theme="dark"] body.homepage-layout{
  --eg-graphite-support:#24292d;
  --eg-graphite-support-hover:#2c3337;
  --eg-graphite-divider:rgba(181,198,208,.08);
}
:root[data-theme="dark"] body.homepage-layout :is(
  .home-news-support-card,
  .home-briefing-board__support article,
  .home-compact-news-grid__item,
  .home-role-desk__card,
  .home-role-analysis__support .front-item,
  .home-role-commercial__card
){
  background:var(--eg-graphite-support)!important;
  border-color:rgba(169,187,198,.22)!important;
  box-shadow:0 8px 20px rgba(8,15,19,.11),inset 0 1px 0 rgba(255,255,255,.012)!important;
}
:root[data-theme="dark"] body.homepage-layout :is(
  .home-news-support-card,
  .home-briefing-board__support article,
  .home-compact-news-grid__item,
  .home-role-desk__card,
  .home-role-analysis__support .front-item,
  .home-role-commercial__card
):hover{
  background:var(--eg-graphite-support-hover)!important;
  border-color:rgba(185,202,213,.4)!important;
}
:root[data-theme="dark"] body.homepage-layout .home-reference-sidebar .home-sidebar__box--stories .home-popular-list>.home-sidebar-story{
  background:var(--eg-graphite-support)!important;
  border-bottom-color:var(--eg-graphite-divider)!important;
}
:root[data-theme="dark"] body.homepage-layout .home-reference-sidebar .home-sidebar__box--stories .home-popular-list>.home-sidebar-story:hover{
  background:var(--eg-graphite-support-hover)!important;
}
:root[data-theme="dark"] body.homepage-layout .home-reference-sidebar .home-sidebar__box--stories>header{
  border-bottom-color:rgba(179,196,207,.13)!important;
}
/* Primary editorial cards, image-led hero and reading surfaces are intentionally untouched. */

/* Editorial blocks and article shell: article reading schemes have their own tokens below.
   Never assign colors/background directly to #reading-content or its descendants. */
:root[data-theme="dark"] body.article-page :is(.article-hero,.article-sidebar__box,.article-related,.article-comments,.article-sidebar .article-toc){
  border-color:var(--eg-graphite-border-soft);
}
:root[data-theme="dark"] body.article-page :is(.article-sidebar__box,.article-related,.article-comments,.article-sidebar .article-toc){
  background-color:var(--eg-graphite-raised);
}
/* About page hero retains its cinematic graphite gradient; surroundings now harmonize. */
:root[data-theme="dark"] body:has(.aboutx-shell) .aboutx-hero{
  border-color:var(--eg-graphite-edge);
}
:root[data-theme="dark"] body:has(.aboutx-shell) .aboutx-feature{
  border-color:var(--eg-graphite-border-soft);
}
/* Distinguish interactive controls without adding an unapproved brand color. */
:root[data-theme="dark"] :is(.egxu-hub__trigger,.egxu-hub__action,.egxv-action){
  border-color:#6c7b85;
}
/* No background-position transitions, for smooth scrolling and low-motion readers. */
@media(prefers-contrast:more){
 :root[data-theme="dark"]{
  --eg-graphite-border-soft:#80939f;
  --eg-graphite-muted:#d0dce2;
 }
}
