/* Toni: Fahrt-Animation – Grundgestaltung (wird nur mit dem Block geladen) */
/* Fahrt-Animation */
.drive { margin: 0; }
.drive__stage { position: relative; aspect-ratio: 4 / 3; border-radius: 16px; overflow: hidden; background: #C9DBEA; }
.drive__still, .drive__still img, .drive__canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.drive__still img { object-fit: cover; }
.drive__canvas { opacity: 0; transition: opacity .25s ease; }
.drive.is-ready .drive__canvas { opacity: 1; }
.drive.is-failed .drive__canvas { display: none; }
.drive__bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: .6rem; min-height: 44px; }
.drive__note { font-size: .875rem; color: #535B66; }
.drive__toggle { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; padding: .4rem .8rem; border: 1px solid #D9D6CE; border-radius: 8px; background: #fff; color: #18243A; font-size: .875rem; font-weight: 600; cursor: pointer; }
.drive__toggle:hover { border-color: #18243A; }
.drive__toggle .icon { width: 16px; height: 16px; }
.drive__icon-play { display: none; }
.drive.is-paused .drive__icon-play { display: block; }
.drive.is-paused .drive__icon-pause { display: none; }

.drive__toggle:focus-visible { outline: 3px solid #18243A; outline-offset: 2px; }
@media print { .drive__canvas, .drive__toggle { display: none !important; } }
