/* Rovers and roads: this stop's own drawings (05-17 sections.rovers). Shared looks are in living/explain.css. */
.rv-wheel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 26px; align-items: center; }
.rv-wheel svg { width: 100%; max-width: 360px; height: auto; justify-self: center; display: block; }
.rv-hole, .rv-rip { opacity: 0; transform-box: fill-box; transform-origin: center; transform: scale(0.3); transition: opacity 0.4s, transform 0.4s; }
.rv-hole.on, .rv-rip.on { opacity: 1; transform: none; }
.dread { display: grid; align-content: center; gap: 12px; padding: 22px; border-radius: 16px; background: #FBF8F3; border: 1px solid var(--rule); }
.dread p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--muted); }
.rv-say { color: var(--ink) !important; font-size: 16px !important; min-height: 3em; }
.rv-fix { padding: 12px 14px; border-left: 3px solid var(--rust); background: #FBF0E8; border-radius: 0 12px 12px 0; }
.rv-slide { width: 100%; accent-color: var(--rust); }
.rv-sizes, .rv-range { width: 100%; height: auto; display: block; }
.rv-far { stroke-dasharray: 10 6; animation: flow 1.6s linear infinite; }
.rove3 { animation: rove 9s linear infinite; }
.blink { animation: pulse 1.4s ease-in-out infinite; }
@media (max-width: 960px) { .rv-wheel { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) { .rv-far, .rove3, .blink { animation: none; } .rv-hole, .rv-rip { transition: none; } }