/* The layer never receives input and stays below navigation and dialogs. */
.seasonal-layer{position:fixed;inset:0;z-index:30;overflow:hidden;pointer-events:none;contain:strict;user-select:none}
.season-particle{position:absolute;top:-45px;left:var(--x);width:var(--size);height:var(--size);color:var(--color);opacity:0;animation:season-fall var(--duration) var(--delay) linear infinite;will-change:transform}
.season-sprite{display:block;width:100%;height:100%;animation:season-sway var(--sway-duration) var(--delay) linear infinite;backface-visibility:visible}
.season-sprite svg{display:block;width:100%;height:100%}
.season-dot{border-radius:50%;background:currentColor}
.seasonal-layer[data-season="winter"] .season-sprite{animation-name:snow-sway}
.seasonal-layer[data-season="summer"] .season-particle{animation-name:summer-drift}
.seasonal-layer[data-season="summer"] .season-dot{box-shadow:0 0 8px 2px color-mix(in srgb,currentColor 40%,transparent);animation:firefly-glow var(--sway-duration) var(--delay) ease-in-out infinite}
.seasonal-layer[data-paused="true"] *,.motion-paused .art-pickaxe,.motion-paused .art-diamond{animation-play-state:paused!important}
.season-toggle{width:31px;height:31px;flex:0 0 31px;display:grid;place-items:center;padding:6px;border:1px solid #ffffff0c;border-radius:5px;background:#ffffff03;color:#be8859;position:relative;transition:background .2s,color .2s,border-color .2s}
.season-toggle svg{height:17px;width:17px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.season-toggle[data-season="winter"]{color:#9bc3d7}.season-toggle[data-season="spring"]{color:#d5a4af}.season-toggle[data-season="summer"]{color:#b2bc85}
.season-toggle:hover{background:#ffffff09;border-color:#ffffff24}.season-toggle[aria-pressed="false"]{color:#69727e}.season-toggle[aria-pressed="false"]:after{content:'';position:absolute;width:19px;height:1px;background:currentColor;transform:rotate(-45deg);box-shadow:0 1px #0b0d11}.season-toggle:disabled{opacity:.45;cursor:default}
@keyframes season-fall{0%{transform:translate3d(0,-20px,0);opacity:0}8%{opacity:var(--opacity)}90%{opacity:var(--opacity)}100%{transform:translate3d(var(--drift),calc(100dvh + 100px),0);opacity:0}}
@keyframes season-sway{0%{transform:translateX(0) rotate(var(--rotation)) rotateY(0deg)}25%{transform:translateX(var(--sway)) rotate(calc(var(--rotation) + 90deg)) rotateY(65deg)}50%{transform:translateX(0) rotate(calc(var(--rotation) + 180deg)) rotateY(155deg)}75%{transform:translateX(calc(var(--sway) * -1)) rotate(calc(var(--rotation) + 270deg)) rotateY(230deg)}100%{transform:translateX(0) rotate(calc(var(--rotation) + 360deg)) rotateY(360deg)}}
@keyframes snow-sway{0%,100%{transform:translateX(calc(var(--sway) * -.5)) rotate(0deg)}50%{transform:translateX(var(--sway)) rotate(90deg)}}
@keyframes summer-drift{0%{transform:translate3d(0,calc(100dvh + 100px),0);opacity:0}15%{opacity:var(--opacity)}75%{opacity:var(--opacity)}100%{transform:translate3d(var(--drift),-30px,0);opacity:0}}
@keyframes firefly-glow{0%,100%{opacity:.25;transform:translateX(0)}35%{opacity:1;transform:translateX(var(--sway))}70%{opacity:.4;transform:translateX(calc(var(--sway) * -.6))}}

@media(prefers-reduced-motion:no-preference){
  .modal-backdrop:not([hidden]){animation:backdrop-enter .18s ease-out both}
  .modal-backdrop:not([hidden]) .modal{animation:dialog-enter .25s cubic-bezier(.2,.8,.2,1) both}
  .mobile-nav:not([hidden]){animation:menu-enter .2s ease-out both}
  .menu-button span{transition:transform .2s}
  .menu-button[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}
  .menu-button[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)}
}
@keyframes backdrop-enter{from{opacity:0}to{opacity:1}}
@keyframes dialog-enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes menu-enter{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.season-toggle{width:2.75rem;height:2.75rem;flex-basis:2.75rem;padding:.75rem;border-color:#ffffff16;background:transparent;color:#ca9159}
.season-toggle svg{width:1.125rem;height:1.125rem;stroke-width:1.6}
.season-toggle:hover{background:#ffffff09;border-color:#ffffff25}
.season-toggle[data-season="winter"]{color:#8cbfd0}.season-toggle[data-season="spring"]{color:#d2a1b1}.season-toggle[data-season="summer"]{color:#c0c988}
.season-toggle[aria-pressed="false"]{color:#747d75}
.season-toggle[aria-pressed="false"]:after{box-shadow:0 1px var(--paper)}
@media(prefers-reduced-motion:reduce){.seasonal-layer{display:none}}
