/* Sparse, translucent leaves drift across the viewport without intercepting input. */
body.autumn-active {
    background-color: #faf9f6 !important;
    isolation: isolate;
}

.autumn-active > main,
.autumn-active > footer {
    position: relative;
    z-index: 1;
}

.autumn-leaves {
    position: fixed;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 2;
}

.autumn-leaves[hidden],
.autumn-toggle[hidden] {
    display: none;
}

.autumn-leaf {
    position: absolute;
    top: -48px;
    left: var(--leaf-x, 50%);
    width: var(--leaf-size, 24px);
    height: calc(var(--leaf-size, 24px) * 1.38);
    color: var(--leaf-color, #c7a052);
    animation: autumn-fall var(--fall-time) linear infinite;
    animation-delay: var(--fall-delay);
}

.autumn-leaf svg {
    width: 100%;
    height: 100%;
    animation: autumn-sway var(--sway-time, 7s) cubic-bezier(.45, 0, .55, 1) infinite alternate;
}

.autumn-leaf:nth-child(even) svg { animation-direction: alternate-reverse; animation-delay: -3s; }

@keyframes autumn-fall {
    0% { transform: translate3d(0, 0, 0); opacity: 0; }
    8%, 85% { opacity: .4; }
    100% { transform: translate3d(var(--leaf-drift, 40px), calc(100vh + 96px), 0); opacity: 0; }
}

@keyframes autumn-sway {
    from { transform: translateX(-6px) rotate(calc(var(--leaf-tilt, 0deg) - 25deg)); }
    to { transform: translateX(6px) rotate(calc(var(--leaf-tilt, 0deg) + 32deg)); }
}

.autumn-paused .autumn-leaf,
.autumn-paused .autumn-leaf svg { animation-play-state: paused; }

.autumn-toggle {
    position: fixed;
    bottom: 12px;
    left: 12px;
    z-index: 1040;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    padding: 6px 10px;
    border: 1px solid #e6e1d7;
    border-radius: 20px;
    background: #faf9f6;
    color: #72582f;
    font: inherit;
    font-size: .75rem;
    cursor: pointer;
}

.autumn-toggle svg { width: 13px; height: 18px; }
.autumn-toggle[aria-pressed="false"] { color: #68645c; }
.autumn-toggle:hover { border-color: #bca16a; }
.autumn-toggle:focus-visible { outline: 2px solid #1772d0; outline-offset: 3px; }

@media (max-width: 767.98px) {
    .autumn-leaf:nth-child(n+6) { display: none; }
    .autumn-leaf { width: calc(var(--leaf-size, 24px) * .8); height: calc(var(--leaf-size, 24px) * 1.1); }
    .autumn-leaf svg { animation-name: autumn-sway-mobile; }
    .autumn-toggle { top: 5px; right: 90px; bottom: auto; left: auto; min-height: 44px; }
}

@media (max-width: 359.98px) {
    .autumn-toggle span { display: none; }
    .autumn-toggle { width: 36px; justify-content: center; }
}

@keyframes autumn-sway-mobile {
    from { transform: rotate(calc(var(--leaf-tilt, 0deg) - 18deg)); }
    to { transform: rotate(calc(var(--leaf-tilt, 0deg) + 22deg)); }
}

@media (prefers-reduced-motion: reduce), print {
    .autumn-leaves,
    .autumn-toggle { display: none !important; }
    .autumn-leaf,
    .autumn-leaf svg { animation: none; }
}
