.video-navigation{width:100%;height:100%;min-width:0;min-height:0;display:grid;grid-template-columns:minmax(58px,7vw) minmax(0,1fr) minmax(58px,7vw);align-items:center;gap:10px}
.video-viewport{width:100%;height:100%;min-width:0;min-height:0;display:grid;place-items:center;container-type:size}
.video-nav-button{align-self:stretch;display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;padding:8px;background:transparent!important;border-color:transparent!important;color:var(--muted);border-radius:12px}
.video-nav-button:hover:not(:disabled){background:color-mix(in srgb,var(--soft,#26352e) 78%,transparent)!important;border-color:var(--line)!important;color:var(--text,#fff)}
.video-nav-button .video-nav-arrow{font-size:clamp(2.8rem,6vw,5.75rem);font-weight:200;line-height:1}
.video-nav-button kbd{flex:none;margin:0;padding:2px 5px;border:1px solid currentColor;border-radius:4px;color:inherit;font-family:inherit;font-size:.78rem;line-height:1.3;opacity:.75}
.video-nav-button:disabled{opacity:.22}
@media(max-width:760px){.video-navigation{grid-template-columns:48px minmax(0,1fr) 48px;gap:4px}.video-nav-button{padding:2px;flex-direction:column;gap:2px}.video-nav-button .video-nav-arrow{font-size:2.5rem}.video-nav-button kbd{font-size:.65rem}}
