/* Движение мира «ночь и янтарь» — приёмы из research/design-reference-atoms-2026-08-23.md (§4, п.1,2,5,7).
   Без библиотек; всё отключается при prefers-reduced-motion. */
.donor, .tarif-k, .urok, details.shag, .onb, .repl, .zadacha, .rolik, .tema, .poyav, .tarif{opacity:0; transform:translateY(14px);
  transition:opacity .6s cubic-bezier(.16,1,.3,1), transform .6s cubic-bezier(.16,1,.3,1), border-color .2s}
.vidno{opacity:1 !important; transform:none !important}
/* герой: лёгкий scroll-driven zoom контейнера (не .baza — у него свой transform поворота головы) */
@supports (animation-timeline: view()){
  .portret{animation:geroy-zum linear both; animation-timeline:view(); animation-range:entry 0% cover 45%}
  @keyframes geroy-zum{from{transform:scale(1.05)} to{transform:scale(1)}}
}
/* тепло на главной кнопке: пульсация через @property — так никто из дешёвых сайтов не делает */
@property --temperatura{syntax:'<number>'; inherits:true; initial-value:0}
.knopka:not(.tih), .pill:not(.tih){--temperatura:0; box-shadow:0 0 calc(var(--temperatura)*18px) rgba(255,138,43,.55); transition:--temperatura .35s ease, transform .16s}
.knopka:not(.tih):hover, .knopka:not(.tih):focus-visible, .pill:not(.tih):hover, .pill:not(.tih):focus-visible{--temperatura:1}
/* дешёвый рендер длинных лент на слабых Android */
.donor, .urok, .rolik{content-visibility:auto; contain-intrinsic-size:0 420px}
@media (prefers-reduced-motion: reduce){
  .donor, .tarif-k, .urok, details.shag, .onb, .repl, .zadacha, .rolik, .tema, .poyav, .tarif{opacity:1; transform:none; transition:none}
  .portret{animation:none}
}