




html[data-season="winter"][data-theme="dark"] {
    --color-bg-page: #071625;
    --color-bg-page-soft: #0a1e30;
    --color-bg-card: #0d2135;
    --color-bg-card-2: #10283c;
    --color-bg-header: #0a1b2c;
    --color-bg-footer: #0a1b2c;
    
    --color-bg-sidebar: #0a1b2c;
    --color-bg-sidebar-2: #10283c;
    --color-bg-tag: #10283c;
    --color-bg-tag-hover: #16334a;
    --color-lifetime-bg: #0a1b2c;
    --color-lifetime-bg-2: #16334a;
}


html[data-season="winter"][data-theme="light"] {
    --color-bg-page: #eef4fb;
    --color-bg-page-soft: #e8f0f9;
    --color-bg-card: #ffffff;
    --color-bg-card-2: #f4f8fd;
    --color-bg-header: #ffffff;
    --color-bg-footer: #ffffff;
    --color-bg-tag: #e8eff8;
    --color-bg-tag-hover: #dbe6f3;
}




html[data-season="winter"] {
    background-color: var(--color-bg-page);
    background-image: none;
}


html[data-season="winter"] .app-body,
html[data-season="winter"] .app-main,
html[data-season="winter"] .app-side-col { background: transparent; }


html[data-season="winter"][data-theme="dark"] {
    scrollbar-color: #1d3a56 #08192a;
}

html[data-season="winter"][data-theme="light"] {
    scrollbar-color: #a9c0d8 #eef4fb;
}




.snowfield {
    position: fixed;
    inset: 0;
    z-index: 850;
    pointer-events: none;
    overflow: hidden;
    
    contain: strict;
}

.snowfield i {
    position: absolute;
    left: 0;                 
    top: 0;
    width: var(--s, 6px);
    height: var(--s, 6px);
    display: block;
    opacity: var(--op, 0.6);
    background-color: #ffffff;
    
    -webkit-mask-image: var(--shape);
            mask-image: var(--shape);
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
            mask-size: 100% 100%;
    
    animation: snowDrift var(--dur, 22s) linear var(--delay, 0s) infinite;
}


html[data-season="winter"][data-theme="light"] .snowfield i {
    background-color: #4f7298;
}




.sf-b {
    --shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg stroke='%23000' stroke-width='8.6' stroke-linecap='round' stroke-linejoin='round' fill='none'%3E%3Cg transform='rotate(0 50 50)'%3E%3Cpath d='M50 50V9M50 26L39 16M50 26L61 16'/%3E%3C/g%3E%3Cg transform='rotate(60 50 50)'%3E%3Cpath d='M50 50V9M50 26L39 16M50 26L61 16'/%3E%3C/g%3E%3Cg transform='rotate(120 50 50)'%3E%3Cpath d='M50 50V9M50 26L39 16M50 26L61 16'/%3E%3C/g%3E%3Cg transform='rotate(180 50 50)'%3E%3Cpath d='M50 50V9M50 26L39 16M50 26L61 16'/%3E%3C/g%3E%3Cg transform='rotate(240 50 50)'%3E%3Cpath d='M50 50V9M50 26L39 16M50 26L61 16'/%3E%3C/g%3E%3Cg transform='rotate(300 50 50)'%3E%3Cpath d='M50 50V9M50 26L39 16M50 26L61 16'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}


.sf-1 {
    --shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg stroke='%23000' stroke-width='5.2' stroke-linecap='round' stroke-linejoin='round' fill='none'%3E%3Cg transform='rotate(0 50 50)'%3E%3Cpath d='M50 50V10M50 20L40 11M50 20L60 11'/%3E%3C/g%3E%3Cg transform='rotate(60 50 50)'%3E%3Cpath d='M50 50V10M50 20L40 11M50 20L60 11'/%3E%3C/g%3E%3Cg transform='rotate(120 50 50)'%3E%3Cpath d='M50 50V10M50 20L40 11M50 20L60 11'/%3E%3C/g%3E%3Cg transform='rotate(180 50 50)'%3E%3Cpath d='M50 50V10M50 20L40 11M50 20L60 11'/%3E%3C/g%3E%3Cg transform='rotate(240 50 50)'%3E%3Cpath d='M50 50V10M50 20L40 11M50 20L60 11'/%3E%3C/g%3E%3Cg transform='rotate(300 50 50)'%3E%3Cpath d='M50 50V10M50 20L40 11M50 20L60 11'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}


.sf-2 {
    --shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg stroke='%23000' stroke-width='4.8' stroke-linecap='round' stroke-linejoin='round' fill='none'%3E%3Cg transform='rotate(0 50 50)'%3E%3Cpath d='M50 50V10M50 20L41 12M50 20L59 12M50 32L43 25M50 32L57 25'/%3E%3C/g%3E%3Cg transform='rotate(60 50 50)'%3E%3Cpath d='M50 50V10M50 20L41 12M50 20L59 12M50 32L43 25M50 32L57 25'/%3E%3C/g%3E%3Cg transform='rotate(120 50 50)'%3E%3Cpath d='M50 50V10M50 20L41 12M50 20L59 12M50 32L43 25M50 32L57 25'/%3E%3C/g%3E%3Cg transform='rotate(180 50 50)'%3E%3Cpath d='M50 50V10M50 20L41 12M50 20L59 12M50 32L43 25M50 32L57 25'/%3E%3C/g%3E%3Cg transform='rotate(240 50 50)'%3E%3Cpath d='M50 50V10M50 20L41 12M50 20L59 12M50 32L43 25M50 32L57 25'/%3E%3C/g%3E%3Cg transform='rotate(300 50 50)'%3E%3Cpath d='M50 50V10M50 20L41 12M50 20L59 12M50 32L43 25M50 32L57 25'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}


.sf-3 {
    --shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg stroke='%23000' stroke-width='4.4' stroke-linecap='round' stroke-linejoin='round' fill='none'%3E%3Cg transform='rotate(0 50 50)'%3E%3Cpath d='M50 50V8M50 22L38 12M50 22L62 12M50 34L42 26M50 34L58 26'/%3E%3C/g%3E%3Cg transform='rotate(60 50 50)'%3E%3Cpath d='M50 50V8M50 22L38 12M50 22L62 12M50 34L42 26M50 34L58 26'/%3E%3C/g%3E%3Cg transform='rotate(120 50 50)'%3E%3Cpath d='M50 50V8M50 22L38 12M50 22L62 12M50 34L42 26M50 34L58 26'/%3E%3C/g%3E%3Cg transform='rotate(180 50 50)'%3E%3Cpath d='M50 50V8M50 22L38 12M50 22L62 12M50 34L42 26M50 34L58 26'/%3E%3C/g%3E%3Cg transform='rotate(240 50 50)'%3E%3Cpath d='M50 50V8M50 22L38 12M50 22L62 12M50 34L42 26M50 34L58 26'/%3E%3C/g%3E%3Cg transform='rotate(300 50 50)'%3E%3Cpath d='M50 50V8M50 22L38 12M50 22L62 12M50 34L42 26M50 34L58 26'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}


.sf-4 {
    --shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg stroke='%23000' stroke-width='5.6' stroke-linecap='round' stroke-linejoin='round' fill='none'%3E%3Cg transform='rotate(0 50 50)'%3E%3Cpath d='M50 50V13M50 13L41 5M50 13L59 5'/%3E%3C/g%3E%3Cg transform='rotate(60 50 50)'%3E%3Cpath d='M50 50V13M50 13L41 5M50 13L59 5'/%3E%3C/g%3E%3Cg transform='rotate(120 50 50)'%3E%3Cpath d='M50 50V13M50 13L41 5M50 13L59 5'/%3E%3C/g%3E%3Cg transform='rotate(180 50 50)'%3E%3Cpath d='M50 50V13M50 13L41 5M50 13L59 5'/%3E%3C/g%3E%3Cg transform='rotate(240 50 50)'%3E%3Cpath d='M50 50V13M50 13L41 5M50 13L59 5'/%3E%3C/g%3E%3Cg transform='rotate(300 50 50)'%3E%3Cpath d='M50 50V13M50 13L41 5M50 13L59 5'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}




@keyframes snowDrift {
    0% {
        transform: translate3d(0, -16vh, 0) rotate(var(--r0, 0deg));
    }
    25% {
        transform: translate3d(calc(var(--dx, 0px) * 0.2 + var(--sw, 0px)), 13vh, 0)
                   rotate(calc(var(--r0, 0deg) + var(--spin, 0deg) * 0.25));
    }
    50% {
        transform: translate3d(calc(var(--dx, 0px) * 0.5 - var(--sw, 0px)), 42vh, 0)
                   rotate(calc(var(--r0, 0deg) + var(--spin, 0deg) * 0.5));
    }
    75% {
        transform: translate3d(calc(var(--dx, 0px) * 0.8 + var(--sw, 0px) * 0.6), 71vh, 0)
                   rotate(calc(var(--r0, 0deg) + var(--spin, 0deg) * 0.75));
    }
    100% {
        transform: translate3d(var(--dx, 0px), 103vh, 0)
                   rotate(calc(var(--r0, 0deg) + var(--spin, 0deg)));
    }
}


@media (prefers-reduced-motion: reduce) {
    .snowfield { display: none; }
}




.app-icon-btn.is-season-on {
    color: var(--color-accent);
    background: var(--color-accent-soft);
}


#seasonIcon svg, #seasonIconMobile svg { transition: transform .45s ease; }
.app-icon-btn.is-season-on #seasonIcon svg,
.app-icon-btn.is-season-on #seasonIconMobile svg { transform: rotate(180deg); }
