/* Restored V13/V21 transport craftsmanship, adapted to the current case cards.
   The green signal is the original player's functional display colour. */
.selected-player {
 --player-metal: radial-gradient(ellipse at 8% 0,color-mix(in srgb,var(--mist) 18%,transparent),transparent 52%),radial-gradient(ellipse at 92% 90%,color-mix(in srgb,var(--coral) 11%,transparent),transparent 42%),repeating-conic-gradient(from 200deg at 50% 0,#ffffff04 0deg .35deg,#0000000d .35deg .7deg),linear-gradient(165deg,color-mix(in srgb,var(--storm) 75%,var(--mist)),color-mix(in srgb,var(--ink) 45%,var(--storm)) 32%,color-mix(in srgb,var(--storm) 95%,var(--mist)) 65%,color-mix(in srgb,var(--ink) 70%,var(--storm)));
 --player-green:#b5ff68; --player-green-deep:#60ea94; --seek:0%;
}
/* Space outside each card keeps its 2px ring and 5px outline offset visible. */
.selected-player .portfolio-grid { padding:12px 12px 28px; scroll-padding:12px; }
.selected-player .portfolio-cover { position:relative; flex:none; aspect-ratio:8/5; overflow:hidden; }
.selected-player .portfolio-cover img {
 position:absolute; inset:0; width:100%; height:100%; max-width:100%;
 object-fit:contain; object-position:center top;
}
.selected-player :is(#workCurrent,#carouselAnnounce) { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.selected-player .work-player__transport {
 position:relative; isolation:isolate; display:grid; grid-template-columns:auto minmax(0,1fr) 65px;
 gap:clamp(20px,3vw,46px); align-items:center; margin-top:24px; padding:20px clamp(20px,3vw,44px) 22px;
 border:1px solid color-mix(in srgb,var(--storm) 65%,var(--mist)); border-top:2px solid color-mix(in srgb,var(--storm) 40%,var(--mist));
 border-radius:18px; color:var(--frost); background:var(--player-metal);
 box-shadow:inset 0 2px 2px color-mix(in srgb,var(--mist) 45%,transparent),inset 0 -5px 8px #101a2280,
  0 5px 0 -3px color-mix(in srgb,var(--ink) 35%,var(--storm)),
  0 12px 26px color-mix(in srgb,var(--storm) 22%,transparent);
}
.selected-player .work-player__transport::before {
 content:''; position:absolute; inset:3px 2% auto; height:28%; border-radius:50%; pointer-events:none;
 background:linear-gradient(180deg,#ffffff30,transparent);
}
.selected-player .work-player__buttons { display:flex; align-items:center; gap:9px; z-index:1; }
.selected-player .player-control {
 --glint-x:35%; --glint-y:20%; position:relative; flex:none; display:grid; place-items:center;
 width:52px; height:52px; padding:0; border-radius:50%; border:2px solid color-mix(in srgb,var(--storm) 15%,var(--mist));
 color:var(--frost); cursor:pointer; touch-action:manipulation;
 background:radial-gradient(circle at 30% 16%,color-mix(in srgb,var(--mist) 40%,var(--frost)),color-mix(in srgb,var(--storm) 45%,var(--mist)) 25%,color-mix(in srgb,var(--storm) 90%,var(--mist)) 52%,color-mix(in srgb,var(--ink) 65%,var(--storm)) 74%,color-mix(in srgb,var(--storm) 65%,var(--mist)));
 box-shadow:0 3px 6px #101a2299,inset 0 2px 3px #e1ebe988,inset 0 -3px 4px #101a22aa;
 transition:transform 170ms ease,box-shadow 170ms ease,background 170ms ease;
}
.selected-player .player-control::before {
 content:''; position:absolute; inset:6px; border-radius:50%; pointer-events:none;
 background:radial-gradient(circle at 35% 19%,color-mix(in srgb,var(--storm) 85%,var(--mist)),color-mix(in srgb,var(--ink) 65%,var(--storm)) 70%,color-mix(in srgb,var(--ink) 85%,var(--storm)));
 box-shadow:inset 0 2px 6px var(--ink),0 1px 1px var(--mist);
}
.selected-player .player-control::after {
 content:''; position:absolute; inset:3px; border-radius:50%; pointer-events:none;
 border:1px solid color-mix(in srgb,var(--mist) 45%,transparent);
 background:radial-gradient(ellipse at var(--glint-x) var(--glint-y),#ffffff50,transparent 68%); transition:opacity 170ms ease;
}
.selected-player .player-control:not(:disabled):is(:hover,:focus-visible) {
 transform:translateY(2px) scale(.987); box-shadow:inset 0 5px 9px #101a2299,inset 0 -2px 3px #a8c8c277,0 1px 2px #101a2266;
}
.selected-player .player-control:not(:disabled):is(:active,.is-fully-pressed) {
 transform:translateY(5px) scale(.968); background:linear-gradient(color-mix(in srgb,var(--ink) 65%,var(--storm)),var(--storm));
 box-shadow:inset 0 8px 14px #101a22cc,inset 0 -3px 6px #a8c8c255,0 1px 1px #101a2266;
}
.selected-player .player-control:is(:hover,.is-fully-pressed)::after { opacity:.35; }
.selected-player .player-control:disabled { opacity:.42; cursor:default; }
.selected-player .player-control:focus-visible { outline:2px solid var(--frost); outline-offset:4px; }
.selected-player #workVisualToggle { width:58px; height:58px; }
.selected-player .player-icon { position:relative; z-index:2; display:block; width:23px; height:23px; }
.selected-player .player-icon svg { display:block; width:100%; height:100%; fill:currentColor; }
.selected-player .player-pause,.selected-player [aria-pressed=true] .player-play { display:none; }
.selected-player [aria-pressed=true] .player-pause { display:block; }
.selected-player .work-player__seek-area { min-width:0; position:relative; z-index:1; }
.selected-player .work-player__seek-labels { display:flex; justify-content:space-between; gap:12px; margin-bottom:3px; color:var(--frost); font:500 10px/1.4 var(--body); letter-spacing:.12em; text-transform:uppercase; }
/* A generous input hit area surrounds the recessed 9px physical rail. */
.selected-player #workSeek { appearance:none; -webkit-appearance:none; display:block; width:100%; height:30px; margin:0; padding:0; cursor:ew-resize; border:0; background:transparent; border-radius:999px; }
.selected-player #workSeek::-webkit-slider-runnable-track { height:9px; border:1px solid var(--mist); border-radius:999px; background:linear-gradient(to right,var(--player-green-deep),var(--player-green) var(--seek),var(--storm) var(--seek),var(--storm)); box-shadow:inset 0 2px 3px #101a2280,0 1px 1px #ffffff66; }
.selected-player #workSeek::-moz-range-track { height:7px; border:1px solid var(--mist); border-radius:999px; background:linear-gradient(to right,var(--player-green-deep),var(--player-green) var(--seek),var(--storm) var(--seek),var(--storm)); box-shadow:inset 0 2px 3px #101a2280,0 1px 1px #ffffff66; }
.selected-player #workSeek::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; width:19px; height:25px; margin-top:-9px; border:1px solid color-mix(in srgb,var(--storm) 40%,var(--mist)); border-radius:7px; background:linear-gradient(105deg,var(--white),var(--frost) 27%,var(--mist) 58%,var(--white)); box-shadow:0 2px 4px #101a2277,inset 0 1px var(--white); }
.selected-player #workSeek::-moz-range-thumb { width:17px; height:23px; border:1px solid var(--mist); border-radius:7px; background:linear-gradient(105deg,var(--white),var(--frost) 27%,var(--mist) 58%,var(--white)); box-shadow:0 2px 4px #101a2277,inset 0 1px var(--white); }
.selected-player #workSeek:focus-visible { outline:2px solid var(--frost); outline-offset:5px; }
.selected-player .work-player__visualizer { display:flex; align-items:flex-end; justify-content:center; gap:4px; width:65px; height:30px; z-index:1; border-bottom:2px solid #a8c8c266; }
.selected-player .work-player__visualizer i { display:block; width:4px; height:22%; border-radius:2px; background:linear-gradient(0deg,var(--player-green),var(--player-green-deep)); box-shadow:0 0 5px #60ea9438; animation:player47-equalize 1.8s ease-in-out infinite alternate; animation-play-state:paused; }
.selected-player .work-player__visualizer i:nth-child(2n) { height:46%; animation-delay:-.65s; }
.selected-player .work-player__visualizer i:nth-child(3n) { height:70%; animation-delay:-.26s; }
.selected-player .work-player__visualizer i:nth-child(4n) { height:35%; animation-delay:-.82s; }
.selected-player.is-visible:is(:hover,:focus-within,.is-playing) .work-player__visualizer i { animation-play-state:running; }
@keyframes player47-equalize { 0%{height:24%}28%{height:76%}50%{height:40%}75%{height:100%}100%{height:33%} }
@media(max-width:600px) {
 .selected-player .work-player__transport { grid-template-columns:minmax(0,1fr) 55px; grid-template-areas:'seek seek' 'buttons visualizer'; padding:18px 20px 22px; gap:13px 16px; }
 .selected-player .work-player__seek-area { grid-area:seek; }
 .selected-player .work-player__buttons { grid-area:buttons; }
 .selected-player .work-player__visualizer { grid-area:visualizer; width:55px; gap:3px; }
 .selected-player .player-control { width:46px; height:46px; }
 .selected-player #workVisualToggle { width:52px; height:52px; }
 .selected-player .work-player__seek-labels { font-size:9px; }
}
@media(prefers-reduced-motion:reduce) {
 .selected-player .player-control,.selected-player .player-control::after { transition:none; }
 .selected-player .work-player__visualizer i { animation:none; }
}
@media(forced-colors:active) {
 .selected-player .player-control { border-color:ButtonText; }
 .selected-player #workSeek { appearance:auto; background:Canvas; }
 .selected-player .player-control::before,.selected-player .player-control::after { display:none; }
}