.teacher-video { position: relative; width: 100%; height: 100%; overflow: hidden; background: #203c36; color: #fff; isolation: isolate; }
.teacher-video button { font: inherit; color: inherit; border: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.teacher-video button:focus-visible { outline: 2px solid #e8c967; outline-offset: 4px; }
.teacher-video svg { width: 24px; height: 24px; flex: none; }
.teacher-video__media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.teacher-video__shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, #112722bd 0%, #11272200 24%, #10282100 47%, #112722b8 72%, #0e221fed 100%); }
.teacher-video__toggle { position: absolute; inset: 0; width: 100%; height: 100%; display: grid; place-items: center; padding: 0; background: transparent; }
.teacher-video__toggle:focus-visible { outline-offset: -5px !important; }
.teacher-video__play-indicator { opacity: 0; transform: scale(.9); }
.teacher-video__toggle[data-paused="true"] .teacher-video__play-indicator, .teacher-video__toggle:focus-visible .teacher-video__play-indicator { opacity: 1; transform: scale(1); }
.teacher-video__toolbar { position: absolute; top: var(--format-top); left: max(var(--edge), env(safe-area-inset-left)); right: max(var(--edge), env(safe-area-inset-right)); display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; }
.teacher-video__eyebrow { display: flex; align-items: center; gap: 7px; min-width: 0; margin: 0; overflow: hidden; color: #e7e3c4; font-size: 9px; font-weight: 650; letter-spacing: .11em; text-overflow: ellipsis; white-space: nowrap; }
.teacher-video__live-dot { flex: none; width: 5px; height: 5px; border-radius: 50%; background: #e6ce93; }
.teacher-video__sound { display: grid; place-items: center; flex: none; width: 44px; height: 44px; padding: 0; border: 1px solid #ffffff40 !important; border-radius: 12px; background: #193b38aa; backdrop-filter: blur(8px); }
.teacher-video__sound svg { width: 19px; height: 19px; }
/* Stack captions above the actual metadata height; reserve the right action rail. */
.teacher-video__details { position: absolute; left: max(var(--edge), env(safe-area-inset-left)); right: calc(max(var(--edge), env(safe-area-inset-right)) + var(--social-reserve)); bottom: calc(var(--content-bottom) + var(--card-footer-line) + var(--card-footer-gap) + 46px); display: flex; flex-direction: column; gap: 12px; pointer-events: none; }
.teacher-video__caption { margin: 0; font-size: clamp(15px, 2vh, 18px); font-weight: 650; line-height: 1.35; text-align: left; text-shadow: 0 1px 4px #000, 0 0 12px #0008; text-wrap: pretty; overflow-wrap: anywhere; }
.teacher-video__caption:empty { display: none; }
.teacher-video__like-notice { color: inherit; position: absolute; top: calc(var(--format-top) + 74px); left: max(var(--edge), env(safe-area-inset-left)); right: max(var(--edge), env(safe-area-inset-right)); margin: 0; padding: 12px; border-radius: 10px; background: #17382cef; font-size: 12px; line-height: 1.5; pointer-events: none; }
.teacher-video__info { --attribution-secondary: #dedecf; }
.teacher-video__footer { --card-footer-color: #e5e8d5a8; position: absolute; bottom: var(--content-bottom); left: max(var(--edge), env(safe-area-inset-left)); right: max(var(--edge), env(safe-area-inset-right)); }
.teacher-video__player { --timeline-text: #ecebdf; --timeline-fill: #ecdfbc; --timeline-track: #ffffff40; }
.teacher-video__error { position: absolute; top: 43%; left: 24px; right: 24px; padding: 16px; margin: 0; border-radius: 12px; background: #17382cef; font-size: 14px; text-align: center; }

@media (max-width: 699px) {
  .teacher-video__details {
    left: max(var(--edge), env(safe-area-inset-left));
  }
  .teacher-video__details { right: calc(max(var(--edge), env(safe-area-inset-right)) + var(--social-reserve)); }
  .teacher-video__error { left: max(var(--edge), env(safe-area-inset-left)); right: max(var(--edge), env(safe-area-inset-right)); }

}
@media (min-width: 700px) {
  .teacher-video__media { object-fit: contain; }
  .teacher-video__shade { background: linear-gradient(0deg,#0e221ff5 0%,#11272288 25%,#11272200 60%,#11272280 100%); }
  .teacher-video__details { right: max(var(--edge), env(safe-area-inset-right)); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 16px; align-items: end; }
  .teacher-video__info { grid-column: 1; grid-row: 1; max-width: 420px; }
  .teacher-video__caption { grid-column: 2; grid-row: 1; width: 100%; max-width: 380px; align-self: end; justify-self: center; text-align: center; }

}
@media (max-height: 620px) {
  .teacher-video__details { gap: 8px; }
  .teacher-video__caption { font-size: 14px; }
}
@media (max-height: 480px) {
  /* Keep the toolbar clear of the social rail in short landscape views. */
  .teacher-video__toolbar { right: calc(max(var(--edge), env(safe-area-inset-right)) + var(--social-reserve)); }
}