/* Malpas Player : lecteur vidéo léger (sans dépendance) */
.mp{position:relative;aspect-ratio:var(--mp-ratio,16/9);background:#000;color:#fff;border-radius:var(--mp-radius,24px);overflow:hidden;font-size:14px;line-height:1.2;-webkit-tap-highlight-color:transparent;outline-offset:3px}
.mp *{box-sizing:border-box}
.mp video,.mp-poster{position:absolute;inset:0;width:100%;height:100%;display:block}
.mp video{object-fit:var(--mp-fit,contain);background:#000}
.mp-poster{object-fit:cover;transition:opacity .3s}
.mp-started .mp-poster{opacity:0;pointer-events:none}

/* gros bouton central */
.mp-big{position:absolute;inset:0;width:100%;height:100%;display:grid;place-items:center;border:0;padding:0;background:rgba(0,0,0,.18);color:#000;cursor:pointer;transition:opacity .25s}
.mp-big span{display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:#fff;transition:transform .2s}
.mp-big svg{width:34px;height:34px;fill:currentColor;margin-left:4px}
.mp-big:hover span,.mp-big:focus-visible span{transform:scale(1.08)}
.mp-playing .mp-big,.mp-started:not(.mp-ended):not(.mp-paused) .mp-big{opacity:0;pointer-events:none}
.mp-started .mp-big{background:transparent}

/* barre de contrôle */
.mp-bar{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:.5rem;padding:2.5rem 1rem .75rem;background:linear-gradient(to top,rgba(0,0,0,.7),transparent);opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s;pointer-events:none}
.mp-started .mp-bar{opacity:1;transform:none;pointer-events:auto}
.mp-idle.mp-playing .mp-bar{opacity:0;transform:translateY(6px);pointer-events:none}
.mp-idle.mp-playing{cursor:none}
.mp-btn{flex:none;width:36px;height:36px;padding:7px;border:0;background:none;color:inherit;cursor:pointer;border-radius:8px}
.mp-btn:hover{background:rgba(255,255,255,.15)}
.mp-btn svg{display:block;width:100%;height:100%;fill:currentColor}
.mp-btn:focus-visible,.mp-seek:focus-visible,.mp-vol:focus-visible{outline:2px solid #fff;outline-offset:2px}
.mp-time{flex:none;font-variant-numeric:tabular-nums;opacity:.9;white-space:nowrap}

/* barre de progression */
.mp-seek{position:relative;flex:1;height:22px;cursor:pointer;touch-action:none}
.mp-seek::before{content:"";position:absolute;left:0;right:0;top:50%;height:4px;margin-top:-2px;border-radius:2px;background:rgba(255,255,255,.3)}
.mp-buf,.mp-prog{position:absolute;left:0;top:50%;height:4px;margin-top:-2px;border-radius:2px;width:0}
.mp-buf{background:rgba(255,255,255,.35)}
.mp-prog{background:#fff}
.mp-thumb{position:absolute;top:50%;left:0;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#fff;transform:scale(0);transition:transform .15s}
.mp-seek:hover .mp-thumb,.mp-seek:focus-visible .mp-thumb,.mp-seeking .mp-thumb{transform:scale(1)}
.mp-seek:hover::before,.mp-seek:hover .mp-buf,.mp-seek:hover .mp-prog{height:6px;margin-top:-3px}

/* bouton de téléchargement (affiché si data-download est présent) */
.mp-dl{position:absolute;top:.75rem;right:.75rem;z-index:3;display:inline-flex;align-items:center;gap:.4rem;padding:.5rem .95rem .5rem .75rem;border-radius:999px;background:rgba(0,0,0,.55);color:#fff;font-weight:600;text-decoration:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:opacity .25s,background-color .2s}
.mp-dl svg{display:block;width:18px;height:18px;fill:currentColor}
.mp-dl:hover,.mp-dl:focus-visible{background:rgba(0,0,0,.85)}
.mp-dl:focus-visible{outline:2px solid #fff;outline-offset:2px}
.mp-idle.mp-playing .mp-dl{opacity:0;pointer-events:none}

/* volume */
.mp-vol{flex:none;width:72px;accent-color:#fff;cursor:pointer}

/* chargement et erreur */
.mp-spin{position:absolute;left:50%;top:50%;width:44px;height:44px;margin:-22px 0 0 -22px;border:3px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;opacity:0;pointer-events:none;animation:mp-rot .8s linear infinite}
.mp-loading .mp-spin{opacity:1}
@keyframes mp-rot{to{transform:rotate(360deg)}}
.mp-msg{position:absolute;inset:0;display:none;place-items:center;padding:1.5rem;text-align:center;background:rgba(0,0,0,.8)}
.mp-error .mp-msg{display:grid}

@media (pointer:coarse){.mp-vol{display:none}}
@media (max-width:520px){.mp-dl span{display:none}.mp-dl{padding:.55rem}.mp-bar{gap:.25rem;padding:2rem .5rem .5rem}.mp-vol{display:none}.mp-big span{width:68px;height:68px}}
@media (prefers-reduced-motion:reduce){.mp *{transition:none!important}.mp-spin{animation-duration:2s}}