/* One shallow gradient layer. Animate opacity only, never blur or shadow. */
body>header:not(.nav){z-index:12;isolation:isolate}
body>header:not(.nav)::after{content:"";position:absolute;top:100%;left:0;right:0;height:24px;pointer-events:none;background:linear-gradient(90deg,transparent 3%,rgba(var(--accent-rgb),.9) 30%,rgba(var(--accent-rgb),.9) 70%,transparent 97%) top/100% 1px no-repeat,radial-gradient(ellipse at 50% 0%,rgba(var(--accent-rgb),.5),rgba(var(--accent-rgb),.16) 38%,transparent 74%);opacity:.5;animation:touch-header-breathe 4.8s ease-in-out infinite}
@keyframes touch-header-breathe{0%,100%{opacity:.32}50%{opacity:.92}}
body.motion-off>header:not(.nav)::after{animation:none;opacity:.45}
:root[data-light=off] body>header:not(.nav)::after{animation:none;opacity:0}
@media(prefers-reduced-motion:reduce){body>header:not(.nav)::after{animation:none;opacity:.45}}