/* Scoped to feed clips; native controls remain the no-script fallback. */
.ef-post__media.is-video { --elm-feed-player-ready:1; }
.elm-feed-player { isolation:isolate; }
.elm-feed-player .elm-feed-controls {
  position:absolute; z-index:5; inset:auto 12px 12px; margin-inline:auto;
  display:flex; align-items:center; gap:8px; max-width:600px; min-width:0;
  padding:7px 9px; border:1px solid rgba(255,255,255,.2); border-radius:14px;
  color:#fff; background:rgba(20,39,30,.88); box-shadow:0 3px 16px rgba(0,0,0,.15);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  font:500 12px/1.2 system-ui,sans-serif; cursor:default;
}
.elm-feed-controls button {
  display:inline-flex; align-items:center; justify-content:center; flex:0 0 36px;
  width:36px; height:36px; margin:0; padding:8px; border:0; border-radius:10px;
  color:inherit; background:transparent; box-shadow:none; cursor:pointer;
}
.elm-feed-controls button:hover { background:rgba(255,255,255,.14); }
.elm-feed-controls svg { display:block; width:20px; height:20px; pointer-events:none; }
.elm-feed-controls :focus-visible { outline:2px solid #bce7cc; outline-offset:3px; }
.elm-feed-controls input[type=range] {
  appearance:none; -webkit-appearance:none; min-width:0; width:100%; height:22px;
  margin:0; padding:0; border:0; border-radius:0; box-shadow:none; background:transparent;
  accent-color:#bce7cc; cursor:pointer;
}
.elm-feed-controls input[type=range]::-webkit-slider-runnable-track { height:3px; border-radius:3px; background:linear-gradient(to right,#bce7cc var(--played,0%),rgba(255,255,255,.28) var(--played,0%)); }
.elm-feed-controls input[type=range]::-moz-range-track { height:3px; border-radius:3px; background:rgba(255,255,255,.28); }
.elm-feed-controls input[type=range]::-moz-range-progress { height:3px; border-radius:3px; background:#bce7cc; }
.elm-feed-controls input[type=range]::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; height:11px; width:11px; margin-top:-4px; border:0; border-radius:50%; background:#fff; box-shadow:0 0 0 2px rgba(255,255,255,.12); }
.elm-feed-controls input[type=range]::-moz-range-thumb { height:11px; width:11px; border:0; border-radius:50%; background:#fff; }
.elm-feed-controls input:disabled { opacity:.45; cursor:default; }
.elm-feed-controls .elm-feed-seek { flex:1 1 100px; }
.elm-feed-time { white-space:nowrap; font-variant-numeric:tabular-nums; opacity:.9; }
.elm-feed-volume { position:relative; flex:0 0 36px; }
.elm-feed-volume-popover {
  position:absolute; bottom:100%; left:50%; transform:translateX(-50%);
  width:112px; padding:12px 14px 18px; opacity:0; visibility:hidden;
  border-radius:12px 12px 0 0; background:rgba(20,39,30,.96);
}
.elm-feed-volume:hover .elm-feed-volume-popover,
.elm-feed-volume:focus-within .elm-feed-volume-popover { opacity:1; visibility:visible; }
.elm-feed-player .elm-feed-notice { position:absolute; z-index:6; bottom:76px; left:16px; right:16px; width:fit-content; margin:auto; padding:7px 12px; border-radius:10px; color:#fff; background:rgba(20,39,30,.92); font:13px/1.4 system-ui,sans-serif; }
.elm-feed-player [hidden] { display:none!important; }
.elm-feed-player:fullscreen,.elm-feed-player:-webkit-full-screen { height:100%!important; width:100%!important; max-height:none!important; background:#101b15; border-radius:0; }
@media(max-width:600px) {
  .elm-feed-player .elm-feed-controls { inset-inline:8px; bottom:8px; gap:5px; padding:4px 5px; }
  .elm-feed-controls button { width:40px; height:40px; flex-basis:40px; }
  .elm-feed-volume { flex-basis:40px; }
  .elm-feed-time { font-size:11px; }
}
@media(hover:none) { .elm-feed-volume-popover { display:none; } }
/* Portrait clips can be narrow even on a desktop. Give seeking its own row. */
.elm-feed-player.is-compact .elm-feed-controls { display:grid; grid-template-columns:32px minmax(0,1fr) 32px 32px 32px; gap:2px 4px; padding:6px; }
.elm-feed-player.is-compact .elm-feed-controls button { width:32px; height:32px; min-width:0; padding:6px; }
.elm-feed-player.is-compact .elm-feed-controls>button:first-child { grid-column:1; grid-row:1; }
.elm-feed-player.is-compact .elm-feed-seek { grid-column:1 / -1; grid-row:2; width:100%; }
.elm-feed-player.is-compact .elm-feed-time { grid-column:2; grid-row:1; min-width:0; overflow:hidden; font-size:11px; }
.elm-feed-player.is-compact .elm-feed-captions { grid-column:3; grid-row:1; }
.elm-feed-player.is-compact .elm-feed-volume { grid-column:4; grid-row:1; }
.elm-feed-player.is-compact .elm-feed-fullscreen { grid-column:5; grid-row:1; }
@media(hover:hover) {
  .elm-feed-controls { transition:opacity .16s ease; }
  .elm-feed-player.is-playing:not(:hover):not(:focus-within) .elm-feed-controls { opacity:0; pointer-events:none; }
}
@media(prefers-reduced-motion:reduce) { .elm-feed-controls { transition:none; } }