/* Local decorative effects. No downloaded fonts, remote assets, or tracking. */
header { position: relative; padding-bottom: 40px; }
.header-track { position: absolute; bottom: -1px; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, #88ffa118, #7ddac64d 50%, #88ffa118); }
.mascot { position: absolute; width: 44px; height: 44px; top: -43px; left: 0; display: block; z-index: 2; border-radius: 8px; will-change: transform; }
.mascot-art { position: absolute; width: 36px; height: 38px; left: 4px; bottom: 2px; pointer-events: none; filter: drop-shadow(0 0 3px #88ffa12e); }
.mascot-facing { position: absolute; inset: 0; transform-origin: center; }
.mascot[data-direction="left"] .mascot-facing { transform: scaleX(-1); }
.mascot-layer { position: absolute; inset: 0; width: 100%; height: 100%; }
.mascot-body { z-index: 1; animation: mascot-bob 720ms ease-in-out infinite; }
.mascot-leg-left { transform-origin: 42% 77%; animation: mascot-step-left 720ms ease-in-out infinite; }
.mascot-leg-right { transform-origin: 58% 77%; animation: mascot-step-right 720ms ease-in-out infinite; }
.mascot[data-paused] .mascot-layer, .mascot[data-hidden] .mascot-layer, .mascot[data-stopped] .mascot-layer { animation-play-state: paused; }
@keyframes mascot-step-left { 0%,100% { transform: rotate(-12deg); } 50% { transform: rotate(12deg); } }
@keyframes mascot-step-right { 0%,100% { transform: rotate(12deg); } 50% { transform: rotate(-12deg); } }
@keyframes mascot-bob { 0%,50%,100% { transform: translateY(0); } 25%,75% { transform: translateY(-.4px); } }
.mascot:hover .mascot-art, .mascot:focus-visible .mascot-art { filter: drop-shadow(0 0 4px #88ffa15c); }
.logo-shell { position: relative; max-width: 480px; margin: auto; border-radius: 26%; padding: 2px; background: linear-gradient(125deg, #88ffa142, #69d8dc54, #a39af344, #88ffa142); box-shadow: 0 0 18px #88ffa10c, 0 0 38px #70d7c90a; isolation: isolate; }
.logo-shell::before { content: ""; position: absolute; inset: -4px; border-radius: inherit; z-index: -1; background: linear-gradient(140deg, #88ffa114, #70d7ee16, #aaa0ff0e); filter: blur(10px); opacity: .65; }
.logo-shell::after { content: ""; position: absolute; inset: 0; border: 1px solid #b7ffc52e; border-radius: inherit; pointer-events: none; animation: holo-breathe 7s ease-in-out infinite; }
.mark .logo-shell img { border-radius: calc(26% - 2px); max-width: none; }
@keyframes holo-breathe { 0%,100% { opacity: .45; } 50% { opacity: .85; } }
.code-trail { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 5; }
@media(max-width:760px) { .logo-shell { width: 174px; } .mark .logo-shell img { width: 100%; } }
@media(prefers-reduced-motion:reduce) { .mascot-layer, .logo-shell::after { animation: none; } .mascot { will-change: auto; } .code-trail { display: none; } }
