/* ============================================================
   ОСЕНЬ 2026 — «Золотой сентябрь», редакция 3 (устойчивая).

   Почему ред. 3: в ред. 1-2 лист имел базовую opacity:0 и становился
   видимым ТОЛЬКО из анимации, а сама анимация задавалась шорткатом
   с двумя var(). Если хоть одна переменная не разрезолвится, весь
   шорткат невалиден -> анимации нет -> лист остаётся прозрачным
   навсегда. Здесь: базовая прозрачность видимая, анимация задана
   ДЛИННЫМИ свойствами (сбой одного не роняет остальные), а в
   @keyframes больше нет var() вообще.

   ОТКАТ: убрать <link> в header.ejs и <div class="leaffall"> в index.ejs.
   ============================================================ */

:root{
  --amber:#e0a355;
  --amber2:#f0c88b;
  --rust:#c4622a;
  --crimson:#b8433a;
}

/* ---- кольцо рун: из золота в ржавый янтарь, чтобы разница читалась ---- */
.hero.sky .sky-ring{
  border-color:rgba(226,140,70,.55)!important;
  background:radial-gradient(circle at 50% 50%,rgba(226,140,70,.10),transparent 62%)!important;
  box-shadow:inset 0 0 90px rgba(196,98,42,.18),0 0 100px rgba(226,140,70,.12)!important;
}
.hero.sky .sky-ring::before{border-color:rgba(226,140,70,.36)!important}
.hero.sky .sky-ring::after{border-color:rgba(196,98,42,.24)!important}

/* ---- орнамент под словом AION ---- */
.hero.sky .sky-wm .orn i{background:linear-gradient(90deg,transparent,rgba(226,140,70,.85))}
.hero.sky .sky-wm .orn i:last-child{background:linear-gradient(270deg,transparent,rgba(226,140,70,.85))}
.hero.sky .sky-wm .orn b{color:#c4622a}

/* ---- хвосты у летящих ников ---- */
.hero.sky .bg-name::after{
  background:linear-gradient(90deg,transparent,rgba(226,140,70,.5))!important;
}

/* ---- закатная дымка снизу УБРАНА по просьбе юзера 31.08 (ред. 4).
   Если понадобится вернуть — восстановить правило .hero.sky .starfield::after
   с двумя радиальными градиентами (196,98,42,.28) и (184,67,58,.18). ---- */
.hero.sky .starfield .s1{opacity:.34}
.hero.sky .starfield .s2{opacity:.18}

/* ---- тёплые акценты в общих элементах ---- */
.online-widget{background:rgba(226,140,70,.10);border-color:rgba(226,140,70,.32)}
.fac-cta{
  background:linear-gradient(90deg,rgba(232,192,116,.18),rgba(196,98,42,.09));
  border-color:rgba(232,192,116,.55);
}

/* ============================================================
   ЛИСТОПАД — устойчивая версия
   ============================================================ */
.leaffall{
  position:absolute; inset:0; z-index:4;
  pointer-events:none; overflow:hidden;
}
.leaffall i{
  position:absolute;
  /* 🔑 top:0, а не -40px: подъём над кромкой делает САМ кейфрейм.
     Иначе при неработающей анимации лист висел бы выше героя
     и всё равно срезался overflow:hidden — то есть запасной
     вариант был бы таким же невидимым, как основной. */
  top:0;
  left:var(--x,50%);
  width:var(--w,18px);
  height:var(--w,18px);
  border-radius:0 100% 0 100%;
  /* сплошной цвет как основа + градиент поверх: если градиент почему-то
     не применится, лист всё равно останется видимым пятном */
  background-color:var(--c1,#e0a355);
  background-image:linear-gradient(135deg,var(--c1,#e0a355),var(--c2,#b8763a));
  /* 🔑 базовая прозрачность ВИДИМАЯ. Даже без анимации листья висят
     в верхней части героя, а не исчезают совсем. */
  opacity:.72;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.45));
  /* 🔑 длинные свойства вместо шортката: сбой одного не роняет остальные */
  animation-name:leaffall;
  animation-duration:var(--dur,15s);
  animation-delay:var(--d,0s);
  animation-timing-function:linear;
  animation-iteration-count:infinite;
  animation-fill-mode:both;
  will-change:transform;
}
/* прожилка вдоль острия — без неё пятно не читается как лист */
.leaffall i::after{
  content:"";position:absolute;left:12%;top:50%;width:76%;height:1px;
  background:rgba(60,26,10,.45);
  transform:translateY(-50%) rotate(45deg);
}
/* 🔑 в keyframes больше НЕТ var() — только константы */
@keyframes leaffall{
  0%   {transform:translate(0,-40px)    rotate(0deg);   opacity:0}
  7%   {                                               opacity:.72}
  35%  {transform:translate(52px,34vh)  rotate(150deg)}
  70%  {transform:translate(-26px,70vh) rotate(300deg)}
  90%  {                                               opacity:.72}
  100% {transform:translate(34px,106vh) rotate(430deg); opacity:0}
}

/* на узких экранах листьев вдвое меньше — бережём слабые телефоны */
@media(max-width:700px){
  .leaffall i:nth-child(even){display:none}
}

/* уважаем системную настройку «меньше движения» */
@media(prefers-reduced-motion:reduce){
  .leaffall i{animation:none;opacity:.5;top:auto;bottom:12%}
}