/* Новогоднее оформление (09.11.2026, Темирлан: «хочу какое то новогоднее оформление для сайта в двух темах»).
   Всё работает только под классом html.ny — его ставит сервер (index(): с 15 декабря по 10 января или PORTAL_NY=1/0).
   Гирлянда висит под шапкой (.ny-garland в templates/index.html, лампочки раскладывает static/js/newyear.js),
   снег идёт в баннере главной (.home-hero::after — только CSS, переживает перерисовку Vue). */

html.ny{
  --ny-wire:#6B5A4E;
  --ny-red:#E5484D;--ny-gold:#F0A800;--ny-green:#22955E;--ny-blue:#2F7BF0;
  --ny-glow:.7;                              /* 09.11.2026: «в белой не заметно» — лампочки светятся и в светлой теме */
  --ny-snow:rgba(70,115,170,.75);
  --ny-snow-soft:rgba(70,115,170,.45);
  --ny-drift:rgba(110,150,200,.30);
  --ny-page-snow:rgba(70,115,170,.30);
  --ny-cap:#EEF5FC;--ny-cap-edge:rgba(70,115,170,.55);
  --ny-shine:rgba(255,255,255,.75);
  --ny-fir:#1E8449;--ny-fir-dark:#16693A;--ny-trunk:#8A5A34;--ny-tinsel:#E0A100;--ny-star:#F5B400;
}
html.ny[data-theme="dark"]{
  --ny-wire:#8A7A6E;
  --ny-red:#FF6B6F;--ny-gold:#FFD15C;--ny-green:#4CD38E;--ny-blue:#6AA8FF;
  --ny-glow:1;
  --ny-snow:rgba(255,255,255,.75);
  --ny-snow-soft:rgba(255,255,255,.4);
  --ny-drift:rgba(255,255,255,.12);
  --ny-page-snow:rgba(255,255,255,.22);
  --ny-cap:#F2F6FA;--ny-cap-edge:rgba(255,255,255,0);
  --ny-shine:rgba(255,255,255,.6);
  --ny-fir:#2E9E5E;--ny-fir-dark:#237F4B;--ny-trunk:#9C6B44;--ny-tinsel:#FFD15C;--ny-star:#FFD15C;
}

/* ---------- гирлянда под шапкой ---------- */
.ny-garland{display:none;}
html.ny .ny-garland{
  display:block;position:absolute;left:0;right:0;top:100%;height:26px;
  pointer-events:none;overflow:hidden;z-index:1;
}
/* провод — провисающие дуги по 112px, цвет переменной через маску */
html.ny .ny-garland::before{
  content:"";position:absolute;inset:0 0 auto 0;height:18px;background:var(--ny-wire);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='112' height='18'%3E%3Cpath d='M0 1.5Q56 26 112 1.5' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E") repeat-x 0 0/112px 18px;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='112' height='18'%3E%3Cpath d='M0 1.5Q56 26 112 1.5' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E") repeat-x 0 0/112px 18px;
}
html.ny .ny-bulb{
  position:absolute;width:8px;height:11px;margin-left:-4px;border-radius:50% 50% 50% 50% / 58% 58% 42% 42%;
  background:var(--c);transform-origin:50% 0;
  box-shadow:0 0 calc(var(--ny-glow) * 10px) calc(var(--ny-glow) * 2px) var(--c);
  animation:ny-twinkle 2.6s ease-in-out infinite;animation-delay:var(--d);
}
html.ny .ny-bulb::before{   /* цоколь */
  content:"";position:absolute;left:1.5px;top:-3px;width:5px;height:4px;border-radius:1px;background:var(--ny-wire);
}
html.ny .ny-bulb.c1{--c:var(--ny-red);}
html.ny .ny-bulb.c2{--c:var(--ny-gold);}
html.ny .ny-bulb.c3{--c:var(--ny-green);}
html.ny .ny-bulb.c4{--c:var(--ny-blue);}
@keyframes ny-twinkle{
  0%,100%{opacity:1;filter:brightness(1.05);}
  50%{opacity:.45;filter:brightness(.8);}
}

/* ---------- вертикальные гирлянды в просветах между колонками (09.11.2026, «ещё гирлянду свисающую между инструментами и серединой, и между серединой и правой частью»)
   div.ny-vgarland создаёт и ставит по месту static/js/newyear.js */
.ny-vgarland{display:none;}
html.ny .ny-vgarland{position:fixed;width:18px;pointer-events:none;z-index:1;overflow:visible;}
html.ny .ny-vgarland::before{
  content:"";position:absolute;inset:0;background:var(--ny-wire);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='112'%3E%3Cpath d='M9 0Q21 28 9 56T9 112' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E") repeat-y 0 0/18px 112px;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='112'%3E%3Cpath d='M9 0Q21 28 9 56T9 112' fill='none' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E") repeat-y 0 0/18px 112px;
}

/* ---------- снег в баннере главной ---------- */
html.ny .home-hero{position:relative;overflow:hidden;}
html.ny .home-hero-in{position:relative;z-index:1;}
html.ny .home-hero::after{
  content:"";position:absolute;inset:-200px 0 0 0;pointer-events:none;z-index:0;
  background-image:
    radial-gradient(circle at 20% 30%, var(--ny-snow) 0 2.6px, transparent 3.2px),
    radial-gradient(circle at 70% 60%, var(--ny-snow) 0 2.2px, transparent 2.8px),
    radial-gradient(circle at 40% 80%, var(--ny-snow-soft) 0 3px, transparent 3.6px),
    radial-gradient(circle at 85% 15%, var(--ny-snow-soft) 0 1.4px, transparent 2px),
    radial-gradient(circle at 55% 45%, var(--ny-snow) 0 1.2px, transparent 1.8px);
  background-size:150px 150px, 210px 210px, 270px 270px, 120px 120px, 330px 330px;
  animation:ny-snow 22s linear infinite;
}
@keyframes ny-snow{
  from{background-position:0 0, 0 0, 0 0, 0 0, 0 0;}
  to{background-position:30px 300px, -42px 420px, 54px 540px, -24px 240px, 66px 660px;}
}
/* снежная кромка внизу баннера — пологие волны во всю ширину, цвет переменной через маску */
html.ny .home-hero::before{
  content:"";position:absolute;left:0;right:0;bottom:0;height:12px;pointer-events:none;z-index:0;
  background:var(--ny-drift);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='12'%3E%3Cpath d='M0 7Q30 1 60 6T120 5T180 7T240 7V12H0Z'/%3E%3C/svg%3E") repeat-x 0 100%/240px 12px;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='12'%3E%3Cpath d='M0 7Q30 1 60 6T120 5T180 7T240 7V12H0Z'/%3E%3C/svg%3E") repeat-x 0 100%/240px 12px;
}

/* ---------- снег по фону всей страницы (09.11.2026, «ещё надо добавить, а то слабо») ----------
   z-index:-1 — снег под всеми блоками: виден только на фоне между карточками, текст не закрывает */
.ny-snowfall{display:none;}
html.ny .ny-snowfall{
  display:block;position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:
    radial-gradient(circle at 15% 20%, var(--ny-page-snow) 0 2.4px, transparent 3px),
    radial-gradient(circle at 65% 70%, var(--ny-page-snow) 0 1.8px, transparent 2.4px),
    radial-gradient(circle at 40% 50%, var(--ny-page-snow) 0 3px, transparent 3.6px),
    radial-gradient(circle at 85% 30%, var(--ny-page-snow) 0 1.4px, transparent 2px);
  background-size:180px 180px, 240px 240px, 320px 320px, 140px 140px;
  animation:ny-page-snow 40s linear infinite;
}
@keyframes ny-page-snow{
  from{background-position:0 0, 0 0, 0 0, 0 0;}
  to{background-position:60px 720px, -80px 960px, 100px 1280px, -40px 560px;}
}

/* ---------- снежная шапка на домике в баннере (path.ny-cap в frontend/src/sections/Home.vue) ---------- */
.home-logo .ny-cap{display:none;}
html.ny .home-logo{overflow:visible;}
html.ny .home-logo .ny-cap{display:inline;fill:none;stroke:var(--ny-cap);stroke-width:8;stroke-linecap:round;stroke-linejoin:round;
  filter:drop-shadow(0 1.5px 0 var(--ny-cap-edge));}
html.ny .home-logo circle.ny-cap{fill:var(--ny-cap);stroke:none;}

/* ---------- ёлочные шары на нитках у верхнего края баннера, над домиком ---------- */
html.ny .home-hero-in::before{
  content:"";position:absolute;top:0;right:44px;width:176px;height:44px;pointer-events:none;
  background:
    radial-gradient(circle at 38% 36%, var(--ny-shine) 0 16%, transparent 22%) 16px 18px/18px 18px no-repeat,
    radial-gradient(circle, var(--ny-red) 0 64%, transparent 68%) 16px 18px/18px 18px no-repeat,
    linear-gradient(var(--ny-gold),var(--ny-gold)) 22px 16px/6px 3px no-repeat,
    linear-gradient(var(--ny-wire),var(--ny-wire)) 24.5px 0/1px 17px no-repeat,
    radial-gradient(circle at 38% 36%, var(--ny-shine) 0 16%, transparent 22%) 66px 8px/14px 14px no-repeat,
    radial-gradient(circle, var(--ny-gold) 0 64%, transparent 68%) 66px 8px/14px 14px no-repeat,
    linear-gradient(var(--ny-wire),var(--ny-wire)) 72.5px 0/1px 8px no-repeat,
    radial-gradient(circle at 38% 36%, var(--ny-shine) 0 16%, transparent 22%) 108px 22px/20px 20px no-repeat,
    radial-gradient(circle, var(--ny-green) 0 64%, transparent 68%) 108px 22px/20px 20px no-repeat,
    linear-gradient(var(--ny-gold),var(--ny-gold)) 115px 20px/6px 3px no-repeat,
    linear-gradient(var(--ny-wire),var(--ny-wire)) 117.5px 0/1px 21px no-repeat,
    radial-gradient(circle at 38% 36%, var(--ny-shine) 0 16%, transparent 22%) 150px 10px/16px 16px no-repeat,
    radial-gradient(circle, var(--ny-blue) 0 64%, transparent 68%) 150px 10px/16px 16px no-repeat,
    linear-gradient(var(--ny-wire),var(--ny-wire)) 157.5px 0/1px 10px no-repeat;
  transform-origin:50% 0;animation:ny-swing 6s ease-in-out infinite;
}
@keyframes ny-swing{0%,100%{transform:rotate(-1.2deg);}50%{transform:rotate(1.2deg);}}
@media (max-width:700px){ html.ny .home-hero-in::before{right:12px;} }

/* ---------- нарядная ёлка слева от домика (svg.ny-tree в frontend/src/sections/Home.vue) ---------- */
.ny-tree{display:none;}
/* 09.11.2026 «не статичную, а в динамике; чуть больше и левее»: ёлка покачивается, мишура «бежит», огоньки мигают, шары блестят, вокруг падает снег */
/* 09.11.2026 «неестественно двигается»: ёлка сама стоит на месте, живут только огоньки, мишура, звезда, снег и подарки */
html.ny .ny-tree{display:block;width:132px;height:172px;flex:none;margin-right:22px;overflow:visible;}
html.ny .ny-tree .ny-fir{fill:var(--ny-fir);stroke:var(--ny-fir);stroke-width:5;stroke-linejoin:round;}
html.ny .ny-tree .ny-fir.dk{fill:var(--ny-fir-dark);stroke:var(--ny-fir-dark);}
html.ny .ny-tree .ny-trunk{fill:var(--ny-trunk);}
html.ny .ny-tree .ny-tinsel{fill:none;stroke:var(--ny-tinsel);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:1 3.4;
  animation:ny-tinsel 1.6s linear infinite;}
@keyframes ny-tinsel{to{stroke-dashoffset:-8.8;}}
html.ny .ny-tree .ny-ball{animation:ny-ball 3.4s ease-in-out infinite;}
html.ny .ny-tree .ny-ball:nth-of-type(2n){animation-delay:-1.1s;}
html.ny .ny-tree .ny-ball:nth-of-type(3n){animation-delay:-2.3s;}
@keyframes ny-ball{0%,100%{filter:brightness(1);}50%{filter:brightness(1.4);}}
/* подарки под ёлкой: изредка подпрыгивают по очереди */
html.ny .ny-tree .ny-gift .box{fill:var(--c);}
html.ny .ny-tree .ny-gift .lid{filter:brightness(1.15);}
html.ny .ny-tree .ny-gift .rib{fill:var(--ny-tinsel);}
html.ny .ny-tree .ny-gift.g1{--c:var(--ny-red);}
html.ny .ny-tree .ny-gift.g2{--c:var(--ny-blue);}
html.ny .ny-tree .ny-gift.g3{--c:var(--ny-green);}
html.ny .ny-tree .ny-gift{animation:ny-gift-hop 6s ease-in-out infinite;}
html.ny .ny-tree .ny-gift.g2{animation-delay:-2s;}
html.ny .ny-tree .ny-gift.g3{animation-delay:-4s;}
@keyframes ny-gift-hop{0%,84%,100%{transform:translateY(0);}88%{transform:translateY(-4px);}92%{transform:translateY(0);}95%{transform:translateY(-1.5px);}}
html.ny .ny-tree .ny-ball.b1{fill:var(--ny-red);}
html.ny .ny-tree .ny-ball.b2{fill:var(--ny-gold);}
html.ny .ny-tree .ny-ball.b3{fill:var(--ny-blue);}
html.ny .ny-tree .ny-ball.b4{fill:var(--ny-cap);}
html.ny .ny-tree .ny-light{--c:var(--ny-gold);fill:var(--c);animation:ny-tree-light 1.4s ease-in-out infinite;}
html.ny .ny-tree .ny-light.l2{--c:var(--ny-red);animation-delay:-.35s;}
html.ny .ny-tree .ny-light.l3{--c:var(--ny-blue);animation-delay:-.7s;}
html.ny .ny-tree .ny-light.l4{--c:var(--ny-cap);animation-delay:-1.05s;}
@keyframes ny-tree-light{0%,100%{opacity:1;filter:drop-shadow(0 0 3px var(--c));}50%{opacity:.25;filter:none;}}
html.ny .ny-tree .ny-star{fill:var(--ny-star);stroke:var(--ny-star);stroke-width:1.5;stroke-linejoin:round;
  transform-origin:50px 11px;animation:ny-star 2.4s ease-in-out infinite;}
@keyframes ny-star{0%,100%{transform:scale(1) rotate(0);filter:drop-shadow(0 0 2px var(--ny-star));}50%{transform:scale(1.2) rotate(18deg);filter:drop-shadow(0 0 8px var(--ny-star));}}
html.ny .ny-tree .ny-flake{fill:var(--ny-snow);animation:ny-flake 6s linear infinite;}
html.ny .ny-tree .ny-flake:nth-of-type(2){animation-duration:7.5s;animation-delay:-2s;}
html.ny .ny-tree .ny-flake:nth-of-type(3){animation-duration:5.2s;animation-delay:-4s;}
html.ny .ny-tree .ny-flake:nth-of-type(4){animation-duration:8s;animation-delay:-1s;}
html.ny .ny-tree .ny-flake:nth-of-type(5){animation-duration:6.6s;animation-delay:-3.3s;}
@keyframes ny-flake{0%{transform:translate(0,0);opacity:0;}10%{opacity:1;}50%{transform:translate(4px,60px);}90%{opacity:1;}100%{transform:translate(-3px,120px);opacity:0;}}
@media (max-width:700px){ html.ny .ny-tree{display:none;} }

/* кто просит меньше движения — без мерцания и снегопада */
@media (prefers-reduced-motion: reduce){
  html.ny .ny-bulb,html.ny .home-hero::after,html.ny .ny-snowfall,html.ny .home-hero-in::before,html.ny .ny-tree,html.ny .ny-tree *{animation:none;}
}
@media print{ html.ny .ny-snowfall,html.ny .ny-garland,html.ny .ny-vgarland,html.ny .home-hero::after,html.ny .home-hero::before{display:none;} }