/* ============================================================
   Живой логотип ПУСК: зайчик шевелит ушами при наведении, а пока программа
   думает (html.pusk-busy) — у него прорисовываются усики на мордочке.
   Дыхание, прокрутка, прыжок при переходе и сон — ниже и в pusk-logo.js.
   ============================================================ */

.pusk-logo {
  --logo-ink: color-mix(in srgb, var(--text-primary, #191a1c) 76%, var(--bg-surface, #fff));
  --logo-soft: color-mix(in srgb, var(--text-primary, #191a1c) 48%, var(--bg-surface, #fff));
  overflow: visible;
  cursor: default;
}
.pusk-logo .pusk-ear ellipse { fill: var(--logo-ink); }
.pusk-logo .pusk-logo-word { stroke: var(--logo-ink); }
.pusk-logo .pusk-logo-head {
  fill: color-mix(in srgb, var(--bg-warm, #f3f1ed) 70%, var(--text-primary, #191a1c) 5%);
  stroke: color-mix(in srgb, var(--text-primary, #191a1c) 16%, var(--bg-surface, #fff));
}
.pusk-logo .pusk-logo-line { stroke: var(--logo-soft); }
.pusk-logo .pusk-logo-dot { fill: var(--logo-soft); }
.pusk-logo .pusk-whiskers { stroke: var(--logo-soft); }

/* Уши поворачиваются от основания, а не от центра */
.pusk-logo .pusk-ear { transform-box: view-box; }
.pusk-logo .pusk-ear--l { transform-origin: 588px 404px; }
.pusk-logo .pusk-ear--r { transform-origin: 635px 404px; }

@keyframes pusk-ear-l {
  0%, 100% { transform: rotate(0); }
  18% { transform: rotate(-16deg); }
  38% { transform: rotate(5deg); }
  58% { transform: rotate(-9deg); }
  78% { transform: rotate(2deg); }
}
@keyframes pusk-ear-r {
  0%, 100% { transform: rotate(0); }
  18% { transform: rotate(16deg); }
  38% { transform: rotate(-5deg); }
  58% { transform: rotate(9deg); }
  78% { transform: rotate(-2deg); }
}
.pusk-logo:hover .pusk-ear--l,
.pusk-side-brand:hover .pusk-ear--l { animation: pusk-ear-l 900ms var(--e-out, ease-out); }
.pusk-logo:hover .pusk-ear--r,
.pusk-side-brand:hover .pusk-ear--r { animation: pusk-ear-r 900ms var(--e-out, ease-out) 60ms; }

/* --- Думает: усики вылезают из носика внизу, подрагивают, носик
   принюхивается; потом усики прячутся обратно --- */
.pusk-logo .pusk-whiskers path {
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  transition: stroke-dashoffset 380ms var(--e-out, ease-out), opacity 300ms ease;
  opacity: 0;
}
.pusk-logo .pusk-whiskers path:nth-child(2),
.pusk-logo .pusk-whiskers path:nth-child(5) { transition-delay: 70ms; }
.pusk-logo .pusk-whiskers path:nth-child(3),
.pusk-logo .pusk-whiskers path:nth-child(6) { transition-delay: 140ms; }
.pusk-logo .pusk-logo-nose {
  transform-box: fill-box;
  transform-origin: center;
}

@keyframes pusk-whisker-l {
  0%, 100% { transform: rotate(0); }
  50% { transform: rotate(-5deg); }
}
@keyframes pusk-whisker-r {
  0%, 100% { transform: rotate(0); }
  50% { transform: rotate(5deg); }
}
@keyframes pusk-sniff {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.25, .85); }
}
@keyframes pusk-ear-listen-l {
  0%, 100% { transform: rotate(0); }
  50% { transform: rotate(-6deg); }
}
@keyframes pusk-ear-listen-r {
  0%, 100% { transform: rotate(0); }
  50% { transform: rotate(6deg); }
}

html.pusk-busy .pusk-logo .pusk-whiskers path {
  stroke-dashoffset: 0;
  opacity: 1;
  transform-box: view-box;
}
html.pusk-busy .pusk-logo .pusk-whiskers path:nth-child(-n+3) {
  transform-origin: 603px 567px;
  animation: pusk-whisker-l 520ms ease-in-out 400ms infinite;
}
html.pusk-busy .pusk-logo .pusk-whiskers path:nth-child(n+4):nth-child(-n+6) {
  transform-origin: 621px 567px;
  animation: pusk-whisker-r 520ms ease-in-out 400ms infinite;
}
html.pusk-busy .pusk-logo .pusk-logo-nose {
  animation: pusk-sniff 520ms ease-in-out 300ms infinite;
}
html.pusk-busy .pusk-logo .pusk-ear--l { animation: pusk-ear-listen-l 1040ms ease-in-out infinite; }
html.pusk-busy .pusk-logo .pusk-ear--r { animation: pusk-ear-listen-r 1040ms ease-in-out 120ms infinite; }

/* ============================================================
   Живой зайчик (состояния ставит pusk-logo.js на svg):
   is-idle — спокойно дышит; is-drowsy — дыхание замедляется;
   is-asleep — глаза закрыты, покачивается, над ним «z».
   Прыжок, зевок, встряхивание и прокрутка — из JS (Web Animations).
   ============================================================ */

/* Точки вращения: тело и весь зайчик — от низа головы, уши — от основания,
   усики — от носика */
.pusk-logo .pl-bunny,
.pusk-logo .pl-body,
.pusk-logo .pl-ear,
.pusk-logo .pl-whisk,
.pusk-logo .pl-shadow { transform-box: view-box; }
.pusk-logo .pl-bunny,
.pusk-logo .pl-body { transform-origin: 611px 562px; }
.pusk-logo .pl-ear--l { transform-origin: 588px 404px; }
.pusk-logo .pl-ear--r { transform-origin: 635px 404px; }
.pusk-logo .pl-whisk--l { transform-origin: 600px 566px; }
.pusk-logo .pl-whisk--r { transform-origin: 624px 566px; }
.pusk-logo .pl-shadow { transform-origin: 611px 568px; fill: var(--logo-soft); opacity: 0; }

.pusk-logo .pl-eyes { stroke: var(--logo-ink); opacity: 0; transition: opacity 500ms ease; }
.pusk-logo .pl-cloud {
  fill: var(--bg-surface, #fff);
  stroke: var(--logo-soft);
  pointer-events: none;
}
.pusk-logo .pl-cloud > * { opacity: 0; transform-box: fill-box; transform-origin: center; }

/* Дыхание: тело чуть вытягивается и возвращается. Амплитуда — доли пикселя */
@keyframes pl-breathe {
  0%, 100% { transform: scale(1, 1); }
  50% { transform: scale(.994, 1.018); }
}
.pusk-logo.is-idle .pl-body,
.pusk-logo.is-drowsy .pl-body { animation: pl-breathe 4.2s ease-in-out infinite; }
.pusk-logo.is-drowsy .pl-body { animation-duration: 6.5s; }

/* Сон: медленное покачивание, закрытые глаза, облачко — сначала два пузырька,
   потом само облачко, и оно чуть «дышит» */
@keyframes pl-sleep-sway {
  0%, 100% { transform: rotate(-1.2deg) scale(1, 1); }
  50% { transform: rotate(1.2deg) scale(.992, 1.012); }
}
@keyframes pl-cloud-in {
  from { opacity: 0; transform: scale(.4); }
  to { opacity: 1; transform: scale(1); }
}
@keyframes pl-cloud-float {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-4px) scale(1.04); }
}
.pusk-logo.is-asleep .pl-body { animation: pl-sleep-sway 7s ease-in-out infinite; }
.pusk-logo.is-asleep .pl-eyes { opacity: 1; }
.pusk-logo.is-asleep .pl-cloud > * { opacity: 1; animation: pl-cloud-in 500ms ease-out both; }
.pusk-logo.is-asleep .pl-cloud > :nth-child(1) { animation-delay: 700ms; }
.pusk-logo.is-asleep .pl-cloud > :nth-child(2) { animation-delay: 1100ms; }
.pusk-logo.is-asleep .pl-cloud > :nth-child(3) {
  animation: pl-cloud-in 600ms ease-out 1500ms both, pl-cloud-float 5s ease-in-out 2100ms infinite;
}

/* Спящего не дёргаем наведением и «думанием» */
.pusk-logo.is-asleep .pusk-ear,
.pusk-side-brand:hover .pusk-logo.is-asleep .pusk-ear { animation: none; }

/* Телефон: движения мельче, без постоянного дыхания */
@media (pointer: coarse) {
  .pusk-logo.is-idle .pl-body,
  .pusk-logo.is-drowsy .pl-body { animation: none; }
  .pusk-logo.is-asleep .pl-body { animation-duration: 9s; }
}

@media (prefers-reduced-motion: reduce) {
  .pusk-logo *,
  html.pusk-busy .pusk-logo * { animation: none !important; transition: none !important; }
  /* Сон остаётся заметен без движения */
  .pusk-logo.is-asleep .pl-cloud > * { opacity: 1; }
}