/* A continuous ground behind the portfolio: the intro's ink and ember palette, kept faint under the content. */
.atmosphere { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; background: var(--bg); transition: background .45s ease; }
.atmosphere-glow { position: absolute; border-radius: 50%; filter: blur(90px); will-change: transform; }
.atmosphere-glow--a { width: 62vmax; height: 62vmax; top: -24vmax; right: -18vmax; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 26%, transparent), transparent 66%); animation: atmosphere-drift-a 52s ease-in-out infinite alternate; }
.atmosphere-glow--b { width: 48vmax; height: 48vmax; bottom: -20vmax; left: -14vmax; background: radial-gradient(circle, color-mix(in srgb, #9a5f45 22%, transparent), transparent 66%); animation: atmosphere-drift-b 64s ease-in-out infinite alternate; }
.atmosphere-ink { position: absolute; inset: -12%; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221600%22%20height%3D%221600%22%3E%3Cfilter%20id%3D%22m%22%20x%3D%220%22%20y%3D%220%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.0017%22%20numOctaves%3D%224%22%20seed%3D%2211%22%20stitchTiles%3D%22stitch%22%2F%3E%3CfeComponentTransfer%3E%3CfeFuncA%20type%3D%22table%22%20tableValues%3D%220%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%22%2F%3E%3C%2FfeComponentTransfer%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%200.96%200%200%200%200%200.93%200%200%200%200%200.86%200%200%200%201%200%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%220.45%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%221600%22%20height%3D%221600%22%20filter%3D%22url%28%23m%29%22%2F%3E%3C%2Fsvg%3E"); background-size: 1500px 1500px; opacity: .085; will-change: transform; animation: atmosphere-drift-ink 120s linear infinite alternate; }
:root[data-theme="light"] .atmosphere-glow--a { background: radial-gradient(circle, color-mix(in srgb, var(--accent) 20%, transparent), transparent 66%); }
:root[data-theme="light"] .atmosphere-glow--b { background: radial-gradient(circle, color-mix(in srgb, #b57a58 16%, transparent), transparent 66%); }
:root[data-theme="light"] .atmosphere-ink { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221600%22%20height%3D%221600%22%3E%3Cfilter%20id%3D%22m%22%20x%3D%220%22%20y%3D%220%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20color-interpolation-filters%3D%22sRGB%22%3E%3CfeTurbulence%20type%3D%22fractalNoise%22%20baseFrequency%3D%220.0017%22%20numOctaves%3D%224%22%20seed%3D%2211%22%20stitchTiles%3D%22stitch%22%2F%3E%3CfeComponentTransfer%3E%3CfeFuncA%20type%3D%22table%22%20tableValues%3D%220%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%200%200%200%200%200%200%201%200%22%2F%3E%3C%2FfeComponentTransfer%3E%3CfeColorMatrix%20type%3D%22matrix%22%20values%3D%220%200%200%200%200.22%200%200%200%200%200.17%200%200%200%200%200.13%200%200%200%201%200%22%2F%3E%3CfeGaussianBlur%20stdDeviation%3D%220.45%22%2F%3E%3C%2Ffilter%3E%3Crect%20width%3D%221600%22%20height%3D%221600%22%20filter%3D%22url%28%23m%29%22%2F%3E%3C%2Fsvg%3E"); opacity: .075; }
@keyframes atmosphere-drift-a { to { transform: translate(-9vmax, 7vmax) scale(1.12); } }
@keyframes atmosphere-drift-b { to { transform: translate(8vmax, -6vmax) scale(1.08); } }
@keyframes atmosphere-drift-ink { to { transform: translate(4%, 3%) rotate(1.5deg) scale(1.06); } }
/* Slides travel over the ground instead of carrying their own flat card. */
.section-mode #top > section:not(.portal-intro) { background: transparent; }
/* Softer fixed fades so the ground reads through the header and the controls. */
body::before { background: linear-gradient(180deg, color-mix(in srgb, var(--bg) 82%, transparent) 25%, transparent); }
.section-mode body::after { background: linear-gradient(0deg, color-mix(in srgb, var(--bg) 78%, transparent) 40%, transparent); }
@media (max-width: 760px) { body::before { background: linear-gradient(180deg, color-mix(in srgb, var(--bg) 88%, transparent) 55%, transparent); } }
html.portal-world .atmosphere { visibility: hidden; }
@media (prefers-reduced-motion: reduce) { .atmosphere-glow, .atmosphere-ink { animation: none; } }
@media print { .atmosphere { display: none; } }