/* ============================================================
   COODZAVUI — C03 SHARED THEME AUTHORITY
   Candidate only. Theme values are centralized here.
   ============================================================ */

:root,
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg-void: #060608;
  --bg-deep: #0a0a0e;
  --bg-surface: #0f0f14;
  --bg-raised: #161620;
  --signal: #00ff41;
  --signal-dim: #00c032;
  --signal-ghost: rgba(0,255,65,0.08);
  --signal-glow: rgba(0,255,65,0.25);
  --blood: #c0392b;
  --blood-dim: #8b2319;
  --amber: #f39c12;
  --text-primary: #e8e8e0;
  --text-secondary: #9a9a8a;
  --text-ghost: rgba(232,232,224,0.3);
  --border: rgba(0,255,65,0.12);
  --border-hot: rgba(0,255,65,0.4);
  --nav-bg: rgba(10,10,14,0.92);
  --reading-bg: #101310;
  --reading-text: #a8afa5;
  --scanline: rgba(0,0,0,0.025);
}

:root[data-theme="light"] {
  color-scheme: light;
  --bg-void: #ece9e0;
  --bg-deep: #f4f1e8;
  --bg-surface: #faf8f2;
  --bg-raised: #e4e0d5;
  --signal: #0a6c2c;
  --signal-dim: #085923;
  --signal-ghost: rgba(10,108,44,0.09);
  --signal-glow: rgba(10,108,44,0.14);
  --blood: #952d25;
  --blood-dim: #70221c;
  --amber: #765100;
  --text-primary: #1c221d;
  --text-secondary: #4d574f;
  --text-ghost: rgba(28,34,29,0.48);
  --border: rgba(10,108,44,0.20);
  --border-hot: rgba(10,108,44,0.48);
  --nav-bg: rgba(244,241,232,0.92);
  --reading-bg: #f8f6ef;
  --reading-text: #3f4941;
  --scanline: rgba(28,34,29,0.018);
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    color-scheme: light;
    --bg-void: #ece9e0;
    --bg-deep: #f4f1e8;
    --bg-surface: #faf8f2;
    --bg-raised: #e4e0d5;
    --signal: #0a6c2c;
    --signal-dim: #085923;
    --signal-ghost: rgba(10,108,44,0.09);
    --signal-glow: rgba(10,108,44,0.14);
    --blood: #952d25;
    --blood-dim: #70221c;
    --amber: #765100;
    --text-primary: #1c221d;
    --text-secondary: #4d574f;
    --text-ghost: rgba(28,34,29,0.48);
    --border: rgba(10,108,44,0.20);
    --border-hot: rgba(10,108,44,0.48);
    --nav-bg: rgba(244,241,232,0.92);
    --reading-bg: #f8f6ef;
    --reading-text: #3f4941;
    --scanline: rgba(28,34,29,0.018);
  }
}

.nav,
.nav.scrolled { background: var(--nav-bg) !important; }

body::after {
  background: repeating-linear-gradient(0deg, transparent, transparent 2px, var(--scanline) 2px, var(--scanline) 4px) !important;
}

.theme-toggle {
  appearance: none;
  -webkit-appearance: none;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-height: 2.25rem;
  padding: 0.45rem 0.7rem;
  border: 1px solid var(--border-hot);
  background: var(--bg-surface);
  color: var(--text-primary);
  font-family: var(--font-ui);
  font-size: 0.58rem;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s, color 0.2s, transform 0.2s;
}
.theme-toggle:hover { border-color: var(--signal); color: var(--signal); background: var(--signal-ghost); }
.theme-toggle:focus-visible { outline: 2px solid var(--signal); outline-offset: 3px; }
.theme-toggle:active { transform: translateY(1px); }
.theme-toggle-icon { font-size: 0.9rem; line-height: 1; }

body.article-page { background: var(--reading-bg) !important; }
body.article-page::before { opacity: 0.16 !important; }
body.article-page::after { opacity: 0.52; }
body.article-page .article-page,
body.article-page .article-body { background: var(--reading-bg); }
body.article-page .article-body p {
  max-width: 62ch !important;
  font-size: 1.03rem !important;
  line-height: 1.90 !important;
  color: var(--reading-text) !important;
}
body.article-page .article-body li { max-width: 60ch !important; color: var(--reading-text) !important; }
body.article-page .article-body hr::after { background: var(--reading-bg) !important; }
body.article-page .article-excerpt,
body.article-page .serie-desc,
body.article-page .serie-part-excerpt { color: var(--reading-text); }

@media (max-width: 900px) {
  .theme-toggle-text { display: none; }
  .theme-toggle { padding-inline: 0.6rem; }
}
@media (max-width: 768px) {
  body.article-page .article-body p { max-width: none !important; font-size: 1rem !important; line-height: 1.82 !important; }
  body.article-page .article-body li { max-width: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  .theme-toggle { transition: none !important; }
}