/* UbuntuID Player */
.uid-player { --uid-player-accent: #FBC362; --uid-player-ratio: 16/9; position: relative; margin: 0; width: 100%; aspect-ratio: var(--uid-player-ratio); overflow: hidden; border-radius: 16px; background: #031228; color: #fff; font-family: var(--uid-font, system-ui, sans-serif); box-shadow: 0 30px 60px -24px rgba(3, 18, 40, .5); outline: 0; user-select: none; -webkit-user-select: none; }
.uid-player:focus-visible { box-shadow: 0 0 0 3px var(--uid-player-accent); }
.uid-player__video { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; background: #000; }
.uid-player.has-started .uid-player__video, .uid-player.is-fullscreen .uid-player__video { object-fit: contain !important; }
.uid-player--lightbox { border-radius: 14px; }
.uid-player__overlay { position: absolute; inset: 0; display: grid; place-items: center; background: linear-gradient(180deg, rgba(3, 18, 40, .15), rgba(3, 18, 40, .55)); transition: opacity .3s; }
.uid-player.has-started .uid-player__overlay { opacity: 0; pointer-events: none; }
.uid-player__big { position: relative; display: grid; place-items: center; width: clamp(64px, 9vw, 92px); height: clamp(64px, 9vw, 92px); border: 0; border-radius: 50%; background: var(--uid-player-accent); color: #0B1B33; cursor: pointer; box-shadow: 0 0 0 12px rgba(251, 195, 98, .22); transition: transform .25s cubic-bezier(.2, .7, .2, 1); }
.uid-player__big svg { width: 38%; height: 38%; margin-left: 6%; }
.uid-player__big:hover { transform: scale(1.08); }
.uid-player__big::after { content: ''; position: absolute; inset: -12px; border-radius: 50%; border: 2px solid rgba(251, 195, 98, .5); animation: uid-pulse 2s infinite; }
@keyframes uid-pulse { from { transform: scale(.9); opacity: 1; } to { transform: scale(1.35); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .uid-player__big::after { animation: none; } }
.uid-player__title { position: absolute; left: 22px; bottom: 22px; max-width: 70%; padding: 8px 14px; border-radius: 999px; background: rgba(3, 18, 40, .78); font-size: .88rem; font-weight: 600; }
.uid-player__logo { position: absolute !important; top: 16px !important; right: 18px !important; width: 26px !important; height: auto !important; opacity: .85; pointer-events: none; }
.uid-player__spinner { position: absolute; left: 50%; top: 50%; width: 48px; height: 48px; margin: -24px 0 0 -24px; border-radius: 50%; border: 4px solid rgba(255, 255, 255, .25); border-top-color: var(--uid-player-accent); animation: uid-spin .8s linear infinite; opacity: 0; pointer-events: none; transition: opacity .2s; }
.uid-player.is-loading .uid-player__spinner { opacity: 1; }
@keyframes uid-spin { to { transform: rotate(360deg); } }

.uid-player__controls { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; display: flex; align-items: center; gap: 10px; padding: 34px 14px 12px; background: linear-gradient(0deg, rgba(3, 18, 40, .9), rgba(3, 18, 40, 0)); opacity: 0; transform: translateY(8px); transition: opacity .25s, transform .25s; }
.uid-player.has-started.is-paused .uid-player__controls, .uid-player.is-active .uid-player__controls, .uid-player:focus-within .uid-player__controls { opacity: 1; transform: none; }
.uid-player:not(.has-started) .uid-player__controls { display: none; }
.uid-player.has-started.is-playing:not(.is-active) { cursor: none; }
.uid-p-btn { display: inline-grid; place-items: center; flex: none; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: #fff; cursor: pointer; font: inherit; font-size: .8rem; font-weight: 700; transition: background-color .2s, color .2s; }
.uid-p-btn:hover, .uid-p-btn:focus-visible { background: rgba(255, 255, 255, .14); outline: 0; }
.uid-p-btn svg { width: 20px; height: 20px; }
.uid-p-btn[aria-pressed="true"] { color: var(--uid-player-accent); }
.uid-p-play { width: 40px; height: 40px; border-radius: 50%; background: var(--uid-player-accent); color: #0B1B33; }
.uid-p-play:hover { background: #fff; }
.uid-p-play svg { width: 18px; height: 18px; }
.uid-p-time { flex: none; font-size: .78rem; font-variant-numeric: tabular-nums; color: #E7EEF5; min-width: 36px; }
.uid-p-progress { position: relative; flex: 1; height: 22px; display: flex; align-items: center; cursor: pointer; touch-action: none; outline: 0; }
.uid-p-rail { position: relative; width: 100%; height: 5px; border-radius: 5px; background: rgba(255, 255, 255, .22); transition: height .15s; }
.uid-p-progress:hover .uid-p-rail, .uid-p-progress:focus-visible .uid-p-rail { height: 7px; }
.uid-p-buffered, .uid-p-played { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 5px; }
.uid-p-buffered { background: rgba(255, 255, 255, .35); }
.uid-p-played { background: var(--uid-player-accent); }
.uid-p-thumb { position: absolute; top: 50%; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 3px var(--uid-player-accent); transform: scale(0); transition: transform .15s; }
.uid-p-progress:hover .uid-p-thumb, .uid-p-progress:focus-visible .uid-p-thumb { transform: scale(1); }
.uid-p-tick { position: absolute; top: 0; bottom: 0; width: 3px; margin-left: -1px; background: rgba(3, 18, 40, .85); }
.uid-p-tip { position: absolute; bottom: 26px; transform: translateX(-50%); padding: 4px 8px; border-radius: 6px; background: #fff; color: #0B1B33; font-size: .72rem; font-weight: 700; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .15s; }
.uid-p-progress:hover .uid-p-tip { opacity: 1; }
.uid-p-right { display: flex; align-items: center; gap: 2px; }
.uid-p-vol { display: flex; align-items: center; }
.uid-p-volume { width: 0; opacity: 0; transition: width .2s, opacity .2s; accent-color: var(--uid-player-accent); }
.uid-p-vol:hover .uid-p-volume, .uid-p-volume:focus { width: 72px; opacity: 1; margin-right: 6px; }
.uid-p-pop { position: relative; }
.uid-p-speed { width: auto; padding: 0 8px; }
.uid-p-menu { position: absolute; right: 0; bottom: 44px; min-width: 120px; max-height: 240px; overflow: auto; padding: 6px; border-radius: 10px; background: rgba(3, 18, 40, .96); box-shadow: 0 12px 30px rgba(0, 0, 0, .45); }
.uid-p-menu--chapters { min-width: 240px; }
.uid-p-menu__item { display: flex; gap: 10px; width: 100%; padding: 8px 10px; border: 0; border-radius: 6px; background: transparent; color: #fff; font: inherit; font-size: .8rem; text-align: left; cursor: pointer; }
.uid-p-menu__item span { color: var(--uid-player-accent); font-variant-numeric: tabular-nums; }
.uid-p-menu__item:hover, .uid-p-menu__item.is-active { background: rgba(255, 255, 255, .1); }
.uid-p-menu__item.is-active { color: var(--uid-player-accent); }
.uid-player__end { position: absolute; inset: 0; z-index: 3; display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; background: rgba(3, 18, 40, .8); }
.uid-player__end[hidden] { display: none; }
.uid-player__replay { width: auto; height: auto; padding: 12px 20px; gap: 8px; display: inline-flex; border: 1.5px solid rgba(255, 255, 255, .7); border-radius: 8px; font-size: .95rem; }
.uid-player video::cue { background: rgba(3, 18, 40, .85); color: #fff; font-family: var(--uid-font, sans-serif); font-size: 1.05em; }
.uid-player.is-fullscreen { border-radius: 0; }
@media (max-width: 600px) {
	.uid-p-vol, .uid-p-pip, .uid-p-dur { display: none; }
	.uid-player__controls { gap: 6px; padding: 26px 8px 8px; }
	.uid-player__title { left: 12px; bottom: 12px; font-size: .78rem; }
}