.jnmp-player{--jnmp-purple:#9c68ff;--jnmp-deep:#6935df;width:min(100%,590px);overflow:hidden;padding:17px;color:#fff;text-align:left;background:radial-gradient(circle at 50% 24%,rgba(156,104,255,.16),transparent 35%),linear-gradient(150deg,#18151e,#0d0c10);border:1px solid rgba(255,255,255,.13);border-radius:11px;box-shadow:0 24px 55px -32px #000,0 0 38px -25px rgba(139,80,255,.75);font-family:"Poppins",sans-serif;-webkit-font-smoothing:antialiased}
.jnmp-player *{box-sizing:border-box}
.jnmp-player button,.jnmp-player input{font:inherit}
.jnmp-player [hidden]{display:none!important}
.jnmp-vinyl-stage{position:relative;width:100%;display:flex;align-items:center;justify-content:center;gap:clamp(16px,4vw,28px);margin:3px auto 0}
.jnmp-vinyl-wrap{position:relative;flex:0 1 auto;width:min(56vw,210px);aspect-ratio:1;display:grid;place-items:center}
.jnmp-vinyl-wrap::before{content:"";position:absolute;z-index:3;inset:3px;pointer-events:none;background:conic-gradient(from 25deg,transparent 0 9%,rgba(255,255,255,.13) 13%,transparent 19% 58%,rgba(255,255,255,.09) 63%,transparent 69%);border-radius:50%;mix-blend-mode:screen}
.jnmp-vinyl{position:relative;width:100%;height:100%;display:grid;place-items:center;padding:15px;overflow:hidden;background:repeating-radial-gradient(circle,#24202c 0 2px,#0b0a0e 3px 6px);border:2px solid #40364e;border-radius:50%;box-shadow:inset 0 0 0 3px #0b0910,inset 0 0 22px rgba(255,255,255,.06),0 22px 38px -23px #000,0 0 38px rgba(156,104,255,.22)}
.jnmp-vinyl::after{content:"";position:absolute;z-index:2;inset:0;pointer-events:none;background:radial-gradient(circle,transparent 0 37%,rgba(255,255,255,.045) 38%,transparent 41% 72%,rgba(255,255,255,.08) 73%,transparent 75%);border-radius:50%}
.jnmp-vinyl img{position:relative;z-index:1;width:72%;height:72%;object-fit:cover;border:6px solid #0d0b10;border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 0 24px rgba(156,104,255,.14)}
.jnmp-vinyl-fallback{position:relative;z-index:1;width:72%;height:72%;display:grid;place-items:center;color:#fff;background:radial-gradient(circle at 40% 30%,#ae71ff,#6b35dc 60%,#301552);border:6px solid #0d0b10;border-radius:50%;font-family:"Bebas Neue",sans-serif;font-size:44px}
.jnmp-player.is-playing .jnmp-vinyl{animation:jnmp-spin 9s linear infinite}
.jnmp-play{position:absolute;z-index:4;width:54px;height:54px;display:grid;place-items:center;padding:0;color:#fff;cursor:pointer;background:linear-gradient(135deg,#a46eff,#6935df);border:4px solid #17131d;border-radius:50%;box-shadow:0 0 20px rgba(139,80,255,.35);transform:scale(1);transform-origin:center;transition:transform .28s cubic-bezier(.2,.75,.25,1),box-shadow .28s ease;will-change:transform}
.jnmp-play-icon{width:13px;height:16px;margin-left:3px;background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%)}
.jnmp-player.is-playing .jnmp-play-icon{width:13px;height:16px;margin:0;clip-path:none;background:linear-gradient(90deg,currentColor 0 35%,transparent 35% 65%,currentColor 65%)}
.jnmp-nav{flex:0 0 45px;width:45px;height:45px;display:grid;place-items:center;padding:0;color:rgba(255,255,255,.72);cursor:pointer;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.16);border-radius:50%;transition:color .2s ease,background .2s ease,border-color .2s ease}
.jnmp-nav svg{width:16px;height:16px;display:block}
.jnmp-now-playing{margin:19px 0 17px;display:flex;flex-direction:column;gap:3px;text-align:center}
.jnmp-player .jnmp-now-playing h3{margin:0!important;padding:0!important;color:#fff;font-family:"Bebas Neue",sans-serif;font-size:36px;font-weight:400;line-height:1!important}
.jnmp-player .jnmp-now-playing em{display:block;margin:0!important;padding:0!important;color:rgba(255,255,255,.82);font-size:15px;font-style:normal;font-weight:400;line-height:1!important;letter-spacing:.06em;transform:none}
.jnmp-progress-row{display:grid;grid-template-columns:34px 1fr 34px;gap:8px;align-items:center;margin-bottom:17px}
.jnmp-time{color:rgba(255,255,255,.5);font-size:10px;font-variant-numeric:tabular-nums;text-align:center}
.jnmp-seek{width:100%;height:3px;accent-color:var(--jnmp-purple);cursor:pointer}
.jnmp-playlist{max-height:192px;overflow-x:hidden;overflow-y:auto;border-top:1px solid rgba(255,255,255,.09);scrollbar-width:thin;scrollbar-color:rgba(156,104,255,.55) rgba(255,255,255,.04)}
.jnmp-playlist::-webkit-scrollbar{width:5px}
.jnmp-playlist::-webkit-scrollbar-track{background:rgba(255,255,255,.04)}
.jnmp-playlist::-webkit-scrollbar-thumb{background:rgba(156,104,255,.55);border-radius:5px}
.jnmp-track{position:relative;width:100%;min-height:64px;display:grid;grid-template-columns:29px minmax(0,1fr) 120px;grid-template-rows:auto auto;align-content:center;align-items:start;column-gap:6px;row-gap:2px;padding:8px 5px 8px 8px;color:rgba(255,255,255,.62);text-align:left;cursor:pointer;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.065)}
.jnmp-track:last-child{border-bottom:0}
.jnmp-track>*{position:relative;z-index:1}
.jnmp-track-copy{display:contents}
.jnmp-track-number{grid-column:1;grid-row:1;align-self:center;display:block;margin:0;transform:none;color:rgba(255,255,255,.33);font-family:"Bebas Neue",sans-serif;font-size:14px;font-weight:400;font-variant-numeric:tabular-nums;line-height:1;text-align:center}
.jnmp-track strong{grid-column:2;grid-row:1;align-self:center;position:relative;z-index:1;color:rgba(255,255,255,.9);font-family:"Bebas Neue",sans-serif;font-size:16px;font-weight:400;line-height:1;letter-spacing:.015em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jnmp-track small{grid-column:2;grid-row:2;position:relative;z-index:1;margin:0;color:rgba(255,255,255,.43);font-size:10px;font-weight:500;line-height:1.2}
.jnmp-track-artist{grid-column:3;grid-row:1/span 2;align-self:center;min-width:0;padding-right:6px;color:rgba(255,255,255,.5);font-size:10px;font-weight:500;text-align:right;white-space:nowrap}
.jnmp-track.is-active::before{content:"";position:absolute;z-index:0;inset:0;background:linear-gradient(90deg,rgba(156,104,255,.1),transparent)}
.jnmp-track.is-active .jnmp-track-number,.jnmp-track.is-active small{color:var(--jnmp-purple)}
.jnmp-error{padding:12px 14px;color:#fff;background:#641f2e;border-radius:8px;font:500 14px/1.5 "Poppins",sans-serif}
@keyframes jnmp-spin{to{transform:rotate(360deg)}}
.jnmp-player .jnmp-vinyl-wrap{width:min(100%,270px)}
.jnmp-vinyl-wrap::before,.jnmp-vinyl::after{display:none}
.jnmp-vinyl,.jnmp-player.is-playing .jnmp-vinyl{padding:0;border:1px solid rgba(255,255,255,.15);border-radius:11px;background:#17121e;animation:none;transform:none;box-shadow:0 18px 30px rgba(0,0,0,.33)}
.jnmp-vinyl img,.jnmp-vinyl-fallback{width:100%;height:100%;border:0;border-radius:10px;box-shadow:none;object-fit:cover}
.jnmp-transport{display:flex;align-items:center;justify-content:center;gap:24px;margin:20px 0 26px}
.jnmp-progress-row{margin-bottom:20px}
.jnmp-transport .jnmp-play{position:relative;width:66px;height:66px;flex-shrink:0}
.jnmp-play-icon,.jnmp-player.is-playing .jnmp-play-icon{width:16px;height:20px}
@media(hover:hover){.jnmp-play:hover{transform:scale(1.09);box-shadow:0 0 27px rgba(139,80,255,.5)}
.jnmp-nav:hover{color:#fff;background:rgba(156,104,255,.13);border-color:rgba(156,104,255,.45)}
.jnmp-track:hover{background:rgba(255,255,255,.025)}}
@media(max-width:480px){.jnmp-player{width:100%;padding:14px;border-radius:11px}
.jnmp-vinyl-stage{gap:16px}
.jnmp-vinyl-wrap{width:min(56vw,200px)}
.jnmp-nav{width:42px;height:42px;flex-basis:42px}
.jnmp-player .jnmp-now-playing h3{font-size:34px}
.jnmp-track{grid-template-columns:26px minmax(0,1fr) 112px;column-gap:6px;row-gap:2px;padding-left:8px}}
@media(max-width:340px){.jnmp-vinyl-stage{gap:12px}
.jnmp-vinyl-wrap{width:min(54vw,182px)}
.jnmp-nav{width:38px;height:38px;flex-basis:38px}
.jnmp-player .jnmp-now-playing h3{font-size:31px}
.jnmp-track-artist{font-size:10px}}
@media(prefers-reduced-motion:reduce){.jnmp-player *{animation:none!important;transition:none!important}}
/* Distribución compacta aprobada: portada, título, controles, tiempo y playlist. */
.jnmp-player{box-sizing:border-box;padding:30px 20px}
.jnmp-player .jnmp-vinyl-stage{margin:0 auto}
.jnmp-player .jnmp-now-playing{margin:15px 0 0;gap:0}
.jnmp-player .jnmp-now-playing h3{font-size:36px;line-height:1.08!important}
.jnmp-player .jnmp-now-playing em{margin-top:0!important;line-height:1.7!important;letter-spacing:.04em;color:#ffffffcc}
.jnmp-player .jnmp-transport{margin:19px 0 10px;gap:24px;position:relative;top:-3px}
.jnmp-player .jnmp-nav{width:45px;height:45px;flex-basis:45px}
.jnmp-player .jnmp-progress-row{margin-bottom:0;grid-template-columns:34px minmax(0,1fr) 34px}
.jnmp-player .jnmp-time{color:#aaa4b5}
.jnmp-player .jnmp-seek{appearance:none;-webkit-appearance:none;background:transparent;border:0;box-shadow:none;width:100%;height:20px;margin:0;padding:0}
.jnmp-seek::-webkit-slider-runnable-track{height:3px;background:#eee;border:0;border-radius:2px}
.jnmp-seek::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;margin-top:-6.5px;border:0;border-radius:50%;background:#9c68ff}
.jnmp-seek::-moz-range-track{height:3px;background:#eee;border:0;border-radius:2px}
.jnmp-seek::-moz-range-thumb{width:16px;height:16px;border:0;border-radius:50%;background:#9c68ff}
.jnmp-player .jnmp-playlist{margin-top:17px}
.jnmp-player .jnmp-track:last-child{min-height:0;padding-bottom:0}
@media(max-width:480px){.jnmp-player{padding:30px 16px}.jnmp-player .jnmp-now-playing h3{font-size:32px}}