[data-theme="dark"] {
  --color-terracotta: #e37142;
  --color-terracotta-dk: #b6491d;
  --color-terracotta-lt: #5a3022;
  --color-avorio: #1a1714;
  --color-avorio-dk: #28221d;
  --color-travertino: #5d4c3d;
  --color-travertino-lt: #3d332b;
  --color-notte: #10182f;
  --color-notte-lt: #26375c;
  --color-ink: #f7eee5;
  --color-ink-mid: #dbc8b7;
  --color-ink-soft: #caa78a;
  --color-cream-card: #211c18;
  --text-primary: #f7eee5;
  --text-secondary: #dbc8b7;
  --text-muted: #caa78a;
  --hero-overlay-strong: rgba(0, 0, 0, 0.95);
  --hero-overlay-soft: rgba(0, 0, 0, 0.30);
}
[data-theme="dark"] .site-footer { background: #0f0d0b; }
[data-theme="dark"] .story-band__quote { color: #f7eee5; }
[data-theme="dark"] .read-link--light { color: #f7eee5; }
.btn-darkmode {
  width: 42px; height: 24px;
  background: var(--color-avorio-dk);
  border: 1px solid var(--color-travertino-lt);
  border-radius: 12px;
  cursor: pointer;
  position: relative;
  transition: background 0.2s;
  flex-shrink: 0;
  display: none;
}
.btn-darkmode::after {
  content: '';
  position: absolute;
  width: 18px; height: 18px;
  background: var(--text-primary);
  border-radius: 50%;
  top: 2px; left: 2px;
  transition: transform 0.2s, background 0.2s;
}
[data-theme="dark"] .btn-darkmode::after { 
  transform: translateX(18px); 
  background: var(--color-terracotta); 
}

/* ── Topbar theme toggle con icone sole/luna ── */
.topbar__theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text-secondary);
  transition: color 0.2s ease;
  flex-shrink: 0;
}

.topbar__theme-toggle:hover {
  color: var(--color-terracotta);
}

.topbar__theme-toggle svg {
  position: absolute;
  width: 14px;
  height: 14px;
  transition: opacity 0.2s ease;
}

.icon-sun {
  opacity: 1;
}

.icon-moon {
  opacity: 0;
}

[data-theme="dark"] .icon-sun {
  opacity: 0;
}

[data-theme="dark"] .icon-moon {
  opacity: 1;
}
.skip-link { position: absolute; left: -9999px; z-index: 1000; }
.skip-link:focus { left: 1rem; top: 1rem; background: #fff; color: #000; padding: .75rem; }
