/* v205: seasonal look. Only for the plain look (members who chose a Premium look keep it). */
html[data-season="christmas"]{--s1:#e5484d;--s2:#4cc38a}html[data-season="newyear"]{--s1:#d9a520;--s2:#f3e2a0}html[data-season="valentine"]{--s1:#f2668f;--s2:#ffc2d4}
html[data-season="easter"]{--s1:#b79af5;--s2:#f7e27a}html[data-season="ramadan"]{--s1:#d9b44a;--s2:#3f9d8f}html[data-season="halloween"]{--s1:#f59e2a;--s2:#8b5cf6}
html[data-season="blackfriday"]{--s1:#f2c94c;--s2:#888}html[data-season="winter"]{--s1:#7cc4f5;--s2:#c8e6fb}html[data-season="spring"]{--s1:#f58ab4;--s2:#8fd694}
html[data-season="summer"]{--s1:#f5b84a;--s2:#4fb3e8}html[data-season="autumn"]{--s1:#e08a3c;--s2:#b5482a}
html[data-season][data-theme="plain"]:not([data-look]){--acc:var(--s1)}
html[data-season][data-mode="light"][data-theme="plain"]:not([data-look]){--acc:color-mix(in srgb,var(--s1) 62%,#000)}
html[data-season][data-theme="plain"]:not([data-look]) .card{border-color:color-mix(in srgb,var(--s1) 28%,var(--line))}
html[data-season][data-theme="plain"]:not([data-look]) body::before{content:"";position:fixed;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--s1),var(--s2),var(--s1));z-index:60;pointer-events:none}
/* v223: the decorations appear only after a shake; each shake is its own layer with its own style (coordinates come from seasons.js) */
.ssn-layer{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:90}
.ssn-layer i{position:absolute;left:0;top:0;font-style:normal;font-size:var(--fs,26px);will-change:transform;animation:ssnmove var(--d,5s) var(--e,linear) var(--w,0s) both}
@keyframes ssnmove{0%{transform:translate(var(--x0),var(--y0)) rotate(0);opacity:0}8%{opacity:1}85%{opacity:1}100%{transform:translate(var(--x1),var(--y1)) rotate(var(--r,200deg));opacity:0}}
@keyframes ssnfade{0%{opacity:0}30%{opacity:.95}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.ssn-layer i{left:var(--fx);top:var(--fy);animation:ssnfade 2.6s ease both}.ssn-layer i:nth-child(n+13){display:none}}
/* v241: realistic drawn decorations (svg from seasons.js): soft shadow, depth blur, turning and swaying */
.ssn-layer i{width:1em;height:1em;line-height:0;filter:blur(var(--b,0px)) drop-shadow(0 3px 3px rgba(0,0,0,.5))}
.ssn-layer i svg{width:1em;height:1em;display:block;opacity:var(--o,1);transform-origin:50% 50%;animation:ssnsw var(--s,2.2s) ease-in-out infinite alternate}
.ssn-layer i svg.fl{animation-name:ssnfl}
.ssn-layer i svg.gl{filter:drop-shadow(0 0 5px rgba(255,235,150,.9))}
@keyframes ssnsw{from{transform:rotate(-12deg)}to{transform:rotate(12deg)}}
@keyframes ssnfl{from{transform:rotate(-16deg) rotateY(0)}to{transform:rotate(16deg) rotateY(170deg)}}
@media (prefers-reduced-motion:reduce){.ssn-layer i svg{animation:none}}
