.local-player { position: relative; width: 100%; min-width: 0; margin-bottom: 1.5rem; overflow: hidden; border-radius: .75rem; color: var(--white); background: var(--ink); }
.video-surface { position: relative; aspect-ratio: 16 / 9; }
.video-surface video { display: block; width: 100%; height: 100%; object-fit: contain; background: #000; }
.local-player[data-enhanced] .video-surface { cursor: pointer; touch-action: pan-y pinch-zoom; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.local-player[data-enhanced] video { pointer-events: none; }
.player-controls, .player-start, .player-feedback { display: none; }
.local-player[data-enhanced] .player-controls { position: absolute; right: 0; bottom: 0; left: 0; z-index: 2; display: block; padding: .65rem .75rem .5rem; background: linear-gradient(to bottom, rgb(16 24 32 / 30%), rgb(16 24 32 / 75%)); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); opacity: 1; transition: opacity 180ms ease, transform 180ms ease; }
.local-player.controls-hidden[data-paused="false"] .player-controls { opacity: 0; pointer-events: none; transform: translateY(.35rem); }
.local-player.controls-hidden[data-paused="false"] .video-surface { cursor: none; }
.local-player[data-enhanced][data-paused="true"] .player-start { position: absolute; top: 50%; left: 50%; display: grid; width: 3.5rem; height: 3.5rem; padding: .8rem; place-items: center; border: 1px solid rgb(255 255 255 / 40%); border-radius: 50%; background: rgb(16 24 32 / 65%); backdrop-filter: blur(5px); transform: translate(-50%, -50%); pointer-events: none; }
.player-start svg { width: 100%; height: 100%; fill: currentColor; }
.local-player[data-enhanced] .player-feedback { position: absolute; top: 1rem; left: 50%; display: block; max-width: 90%; padding: .4rem .8rem; border-radius: .6rem; background: rgb(16 24 32 / 85%); font-size: .9rem; font-weight: 750; text-align: center; opacity: 0; transform: translateX(-50%); pointer-events: none; transition: opacity 120ms ease; }
.local-player.is-feedback .player-feedback { opacity: 1; }
.player-timeline { display: flex; align-items: center; gap: .65rem; }
.player-timeline input { flex: 1; width: 0; min-width: 0; height: 1.4rem; margin: 0; background: transparent; accent-color: var(--blue); cursor: pointer; }
.player-time { flex: 0 0 auto; font-size: .7rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.player-toolbar { display: flex; align-items: center; gap: .25rem; margin-top: .25rem; }
.player-toolbar button { display: grid; flex: 0 0 auto; width: 2.3rem; height: 2.3rem; padding: .4rem; place-items: center; border: 0; border-radius: .45rem; color: var(--white); background: transparent; cursor: pointer; }
.player-toolbar button:hover { background: rgb(255 255 255 / 12%); }
.player-toolbar button:disabled { opacity: .35; cursor: default; }
.player-toolbar svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.player-toolbar .player-play-icon { fill: currentColor; stroke: none; }
.player-toolbar svg text { fill: currentColor; stroke: none; font-family: inherit; font-size: 12px; font-weight: 800; text-anchor: middle; }
.player-pause-icon, .player-muted-icon { display: none; }
.local-player[data-paused="false"] .player-play-icon, .local-player[data-muted="true"] .player-sound-icon { display: none; }
.local-player[data-paused="false"] .player-pause-icon, .local-player[data-muted="true"] .player-muted-icon { display: block; }
.player-spacer { flex: 1; }
.player-toolbar .player-speed { width: 3rem; padding-inline: .2rem; font-size: .85rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.player-subtitles { position: relative; flex: 0 0 auto; width: 2.3rem; height: 2.3rem; }
.player-subtitles > button { width: 100%; font-size: .7rem; font-weight: 850; }
.player-subtitles > button span { padding: .05rem .15rem; border: 1px solid currentColor; border-radius: .15rem; line-height: 1.1; }
.player-subtitles > button[data-active="true"] { color: var(--blue); }
.player-subtitles-menu { position: absolute; right: 0; bottom: calc(100% + .6rem); width: 10.5rem; padding: .4rem; border: 1px solid rgb(255 255 255 / 18%); border-radius: .65rem; background: rgb(16 24 32 / 94%); backdrop-filter: blur(12px); box-shadow: 0 .5rem 1.5rem rgb(0 0 0 / 25%); }
.player-subtitles-menu[hidden] { display: none; }
.player-subtitles-menu p { margin: .25rem .5rem .4rem; color: rgb(255 255 255 / 65%); font-size: .7rem; }
.player-toolbar .player-subtitles-menu button { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 1.85rem; padding: .25rem .5rem; font-size: .8rem; text-align: left; }
.player-subtitles-menu button[aria-pressed="true"] { color: var(--blue); background: rgb(255 255 255 / 8%); }
.player-subtitles-menu button[aria-pressed="true"]::after { content: '✓'; }
.player-captions { position: absolute; right: .6rem; bottom: calc(var(--player-controls-height, 5.1rem) + .35rem); left: .6rem; display: none; text-align: center; pointer-events: none; transition: bottom 180ms ease; }
.local-player[data-enhanced] .player-captions:not([hidden]) { display: block; }
.player-captions span { display: inline-block; max-width: 100%; padding: .2rem .5rem; border-radius: .2rem; color: #fff; background: rgb(0 0 0 / 78%); font-size: clamp(.8rem, 1.3vw, 1.25rem); line-height: 1.35; white-space: pre-line; }
.local-player.controls-hidden[data-paused="false"] .player-captions { bottom: .65rem; }
.local-player :is(button, input, [data-video-surface]):focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }
.local-player:fullscreen, .local-player.is-expanded { display: flex; flex-direction: column; width: 100%; height: 100%; margin: 0; border-radius: 0; background: #000; }
.local-player:fullscreen .video-surface, .local-player.is-expanded .video-surface { flex: 1; min-height: 0; aspect-ratio: auto; }
.local-player:fullscreen .player-captions span, .local-player.is-expanded .player-captions span { font-size: clamp(1rem, 1.6vw, 1.6rem); }
.local-player:fullscreen .player-controls, .local-player.is-expanded .player-controls { padding-bottom: max(.5rem, env(safe-area-inset-bottom)); }
.local-player.is-expanded { position: fixed; inset: 0; z-index: 2000; height: 100dvh; }
body.player-expanded { overflow: hidden; }
@media (max-width: 500px) {
  .player-subtitles-menu:not([hidden]) { display: grid; grid-template-columns: 1fr 1fr; width: 13rem; gap: .1rem; bottom: calc(100% + .15rem); }
  .player-subtitles-menu p { grid-column: 1 / -1; }
}
@media (max-width: 400px) {
  .local-player[data-enhanced] .player-controls { padding-inline: .4rem; }
  .player-toolbar { gap: .1rem; }
  .player-toolbar button { width: 2.1rem; }
  .player-toolbar .player-speed { width: 2.6rem; }
  .player-subtitles { width: 2.1rem; }
}
@media (max-width: 360px) {
  .local-player[data-subtitles-lang] .player-toolbar button, .local-player[data-subtitles-lang] .player-subtitles { width: 1.85rem; }
  .local-player[data-subtitles-lang] .player-toolbar .player-speed { width: 2.4rem; }
}
@media (prefers-reduced-motion: reduce) {
  .player-feedback, .player-captions, .local-player[data-enhanced] .player-controls { transition: none; }
}
.local-player .player-toolbar .player-subtitles-menu button { width: 100%; }
