.video-playback-state {
    box-sizing: border-box;
    width: 100%;
    min-height: clamp(260px, 42vw, 480px);
    padding: 40px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    text-align: center;
    background: #f8f9fc;
    color: #252a3b;
    border: 1px solid #e8eaf0;
    border-radius: 12px;
    font-family: inherit;
    line-height: 1.7;
}
.video-playback-state[hidden], .video-playback-state [hidden], [data-video-failover] iframe[hidden] { display: none !important; }
[data-video-failover]:has(> .video-playback-state:not([hidden])) { aspect-ratio: auto; }
.video-playback-state__icon { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #eeedfc; color: #5146ba; }
.video-playback-state strong { font-size: clamp(19px, 2.2vw, 24px); font-weight: 600; }
.video-playback-state p { margin: 0; max-width: 36em; font-size: 15px; color: #62697a; }
.video-playback-state__loader { width: 24px; height: 24px; border: 2px solid #dedcf3; border-top-color: #5146ba; border-radius: 50%; animation: video-playback-spin 1s linear infinite; }
.video-playback-state:not([data-state="preparing"]) .video-playback-state__loader { display: none; }
.video-playback-state button { border: 1px solid #d8dbea; border-radius: 8px; background: #fff; color: #353b50; padding: 9px 20px; font: inherit; cursor: pointer; }
.video-playback-state button:focus-visible { outline: 2px solid #5146ba; outline-offset: 3px; }
@keyframes video-playback-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .video-playback-state__loader { animation: none; } }
