.road-scene{overflow:hidden;border-radius:12px;background:#d9eadc;margin:0 0 16px;border:1px solid #c7d9d0}.road-scene svg{display:block;width:100%;height:auto!important;aspect-ratio:8/5;background:#d9eadc}.road-scene-caption{margin:0!important;padding:10px 12px;color:#fff9eb!important;font-size:11px!important;font-weight:750;letter-spacing:.04em;line-height:1.35!important;background:#1758d8}.road-your-car,.road-cross-car,.road-motorcycle{transform-box:view-box;transform-origin:0 0}.road-your-car{transform:translate(385px,350px)}.road-cross-car{transform:translate(291px,36px) rotate(180deg)}.road-motorcycle{transform:translate(405px,24px)}.road-clear-path,.road-block-mark,.whistle-lines{opacity:0}.road-scene[data-outcome=waiting] .road-cross-car{animation:road-approach 4s ease-in-out infinite}.road-scene[data-outcome=waiting] .road-motorcycle{animation:motor-approach 4s ease-in-out infinite}.road-scene[data-outcome=clear] .road-cross-car{animation:road-cross 3.5s linear infinite}.road-scene[data-outcome=clear] .road-clear-path{opacity:.75}.road-scene[data-outcome=clear] .road-scene-caption{background:#1b633b}.road-scene[data-outcome=blocked] .road-your-car{animation:road-turn 1.7s ease-in-out forwards}.road-scene[data-outcome=blocked] .road-cross-car{transform:translate(291px,56px) rotate(180deg);transition:transform 1s ease-out}.road-scene[data-outcome=blocked] .road-block-mark{opacity:1;transition:opacity .2s 1.6s}.road-scene[data-outcome=blocked] .road-scene-caption{background:#ad3939}.road-scene[data-outcome=blocked] .whistle-lines{animation:whistle-flash .5s 1.6s 4}.road-scene[data-outcome=blocked] .road-you-label{opacity:0;transition:opacity .4s}
@keyframes road-approach{0%,10%{transform:translate(291px,-50px) rotate(180deg)}65%,100%{transform:translate(291px,54px) rotate(180deg)}}@keyframes motor-approach{0%,10%{transform:translate(405px,62px)}75%,100%{transform:translate(405px,-40px)}}@keyframes road-cross{from{transform:translate(291px,-55px) rotate(180deg)}to{transform:translate(291px,465px) rotate(180deg)}}@keyframes road-turn{0%{transform:translate(385px,350px) rotate(0)}55%{transform:translate(385px,221px) rotate(0)}82%{transform:translate(366px,185px) rotate(-60deg)}100%{transform:translate(332px,165px) rotate(-90deg)}}@keyframes whistle-flash{50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.road-scene *{animation:none!important;transition:none!important}.road-scene[data-outcome=waiting] .road-cross-car{transform:translate(291px,54px) rotate(180deg)}.road-scene[data-outcome=clear] .road-cross-car{transform:translate(291px,220px) rotate(180deg)}.road-scene[data-outcome=blocked] .road-your-car{transform:translate(332px,165px) rotate(-90deg)}.road-scene[data-outcome=blocked] .whistle-lines{opacity:1}}