/* Стили, которые на холсте живут прямо в странице (`<helmet><style>`).
   Переносятся сюда как есть скриптом scripts/musli-port.py — править надо
   на холсте, а не здесь.

   Внизу — единственная дописка: на холсте наведение мышью задаётся приёмом
   `style-hover`, которого в браузере нет. Обычное правило делает то же самое. */

.float-notes-hero musli-notes-web { height: 100%; }
@media (max-width: 900px) { .uses-two-col, .feature-grid { grid-template-columns: 1fr !important; } }
.uses { background: #f4f1ea; }
@keyframes noise-drift-l { from { transform: translateX(0); } to { transform: translateX(-46%); } }
@keyframes noise-drift-r { from { transform: translateX(-46%); } to { transform: translateX(0); } }
@media (prefers-reduced-motion: reduce) { .transcript-noise > div { animation: none !important; } }
.uses-fig-card rect:not([style*="yellow"]) { stroke: rgb(29 27 23 / 0%); fill: rgb(29 27 23 / 6%); }
.uses-fig-card rect[style*="dasharray"] { stroke: rgb(29 27 23 / 26%); fill: none; }
@keyframes marker-run-a {
  0%, 4% { left: -13%; opacity: 0; }
  9% { left: -5%; opacity: 1; }
  24% { left: 99%; opacity: 1; }
  27%, 100% { left: 99%; opacity: 0; }
}
@keyframes marker-run-b {
  0%, 26% { left: -13%; opacity: 0; }
  30% { left: -5%; opacity: 1; }
  46%, 54% { left: 99%; opacity: 1; }
  64%, 100% { left: 99%; opacity: 0; }
}
@keyframes marker-hl-a {
  0%, 7% { transform: scaleX(0); }
  24%, 100% { transform: scaleX(1); }
}
@keyframes marker-hl-b {
  0%, 28% { transform: scaleX(0); }
  46%, 100% { transform: scaleX(1); }
}
@keyframes marker-slot {
  0%, 3% { opacity: 1; }
  8%, 54% { opacity: 0.1; }
  64%, 100% { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  [data-marker-run], [data-marker-highlight], [data-marker-slot] { animation: none !important; }
  [data-marker-highlight] { transform: scaleX(1) !important; }
  [data-marker-run] { opacity: 0 !important; }
}

/* Дописка переноса: наведение на кнопку «Запросить доступ». */
.cta-yellow:hover { background: var(--ink); color: var(--yellow); }