/* v23 — shared Experience atmosphere and translucent content surfaces.
   Appended after earlier styles to override opaque chapter-specific panels. */
:root,
:root[data-theme="dark"] {
  --unified-scene: radial-gradient(ellipse at 65% 0%, #1a2639 0%, transparent 55%), linear-gradient(155deg, #0d1420, #0a0e15);
  --glass-surface: rgba(32, 49, 67, .43);
  --glass-strong: rgba(34, 53, 71, .58);
  --glass-subtle: rgba(53, 77, 96, .28);
  --glass-line: rgba(183, 211, 226, .18);
  --glass-shadow: 0 22px 64px rgba(0, 0, 0, .21), inset 0 1px 0 rgba(232, 245, 255, .065);
}
:root[data-theme="light"] {
  --unified-scene: radial-gradient(ellipse at 65% 0%, #d4e8f0 0%, transparent 55%), linear-gradient(155deg, #f3f8fa, #e2edf3);
  --glass-surface: rgba(255,255,255,.43);
  --glass-strong: rgba(255,255,255,.66);
  --glass-subtle: rgba(255,255,255,.31);
  --glass-line: rgba(58, 98, 115, .20);
  --glass-shadow: 0 22px 64px rgba(34, 75, 90, .09), inset 0 1px 0 rgba(255,255,255,.65);
}
/* All chapters render on the exact same ambient background as the timeline. */
html,body,#main,
main#main > section[id],
main#main > section[id].deck-active,
main#main > section#experience.journey-section,
#experience .journey-sticky {
  background: var(--unified-scene) !important;
  background-color: transparent !important;
}
/* Keep the timeline's delicate geometric atmosphere exclusive to its chapter;
   every other chapter still shares the same ambient color gradient. */
main#main > section#home.hero.hero-v14::before {
  background: none !important;
}
/* Frosted panels. Keep card descriptions readable over translucent surfaces. */
#experience .journey-card,
#skills .talent-tree,
#skills .talent-inspector,
#credentials .v21-gallery,
#credentials .education-compact-item,
#home .v22-portrait,
#about .section-body {
  background: var(--glass-surface) !important;
  border: 1px solid var(--glass-line) !important;
  box-shadow: var(--glass-shadow) !important;
  -webkit-backdrop-filter: blur(17px) saturate(145%);
  backdrop-filter: blur(17px) saturate(145%);
}
#experience .journey-card.is-current {
  border-color: rgba(var(--accent-rgb),.5) !important;
}
#experience .journey-card-main,
#experience .journey-card-top,
#experience .journey-tags {
  background: transparent !important;
  box-shadow: none !important;
}
/* Nodes sit above the translucent skill-tree panel, with their own glass treatment. */
#skills .talent-node,
#skills .talent-node-root,
#skills .talent-node:hover,
#skills .talent-node.is-selected {
  background: var(--glass-strong) !important;
  border-color: var(--glass-line) !important;
  -webkit-backdrop-filter: blur(9px);
  backdrop-filter: blur(9px);
}
#skills .talent-node:hover,
#skills .talent-node.is-selected { border-color: var(--accent) !important; }
#credentials .v21-gallery-nav,
#credentials .v21-gallery-dots button,
#contact .contact-links a.btn-secondary {
  background: var(--glass-subtle) !important;
  border-color: var(--glass-line) !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
#about .section-body {
  border-radius: 14px;
  padding: clamp(14px, 2vw, 25px) !important;
  box-sizing: border-box;
}
/* Retain transparent image area so actual portrait photo remains clear. */
#home .v22-portrait img { background: transparent; }
/* Fallback for browsers where backdrop-filter isn't supported. */
@supports not (backdrop-filter: blur(2px)) {
  #experience .journey-card,
  #skills .talent-tree,#skills .talent-inspector,
  #credentials .v21-gallery,#credentials .education-compact-item,
  #home .v22-portrait,#about .section-body { background: var(--glass-strong) !important; }
}
@media (max-width: 640px) {
  #about .section-body { padding: 12px !important; }
}