/* A compact silver receiver faceplate, inspired by the owner's Rotel.
   Existing dock dimensions, source links and embedded player are unchanged. */
.listening-dock{
 position:relative;isolation:isolate;
 background:repeating-linear-gradient(0deg,#c5c3b9 0px,#d8d5cb 1px,#bab9b1 2px,#d4d1c7 3px)!important;
 border-top:1px solid #f3eee0!important;
 box-shadow:inset 0 -2px 2px #53534d,0 -3px 12px #0005;
}
.listening-dock::before{
 content:'';position:absolute;inset:4px 6px 5px;z-index:-1;pointer-events:none;border-radius:3px;
 background:linear-gradient(110deg,#030d08,#0c2017 50%,#051009);
 border:1px solid #64685e;box-shadow:inset 0 1px 6px #000,0 1px 0 #f4eddb9c;
}
.listening-dock::after{
 content:'';position:absolute;left:18px;right:18px;top:7px;height:4px;pointer-events:none;z-index:-1;opacity:.65;
 background:linear-gradient(90deg,transparent 63%,#ff982e 63%,#ff982e calc(63% + 2px),transparent calc(63% + 2px)),repeating-linear-gradient(90deg,#47e56c 0 1px,transparent 1px 7px);
 border-bottom:1px solid #2e8c47;
}
.listening-dock header{color:#6af989!important;text-shadow:0 0 7px #38ed6580;letter-spacing:.12em;font-family:Arial,sans-serif!important;margin:0!important}
.listening-dock #start,.listening-dock #toggle-player{
 background:linear-gradient(#173e27,#092414)!important;color:#86ff9f!important;
 border:1px solid #588167!important;border-radius:3px!important;
 box-shadow:inset 0 1px 0 #b3e7b638,0 1px 2px #0009;
 text-shadow:0 0 5px #30db4e66;font-family:Arial,sans-serif!important;letter-spacing:.045em;
}
.listening-dock #external,.listening-dock #spotify-link{
 color:#fffaf0!important;background:transparent!important;letter-spacing:.07em;
 font-family:Arial,sans-serif!important;font-weight:600!important;text-shadow:0 1px 2px #000;
}
.listening-dock #start:hover,.listening-dock #toggle-player:hover{background:#1b4d2c!important}
.listening-dock::before{box-shadow:inset 0 0 18px #42ef5933,inset 0 1px 6px #000,0 0 8px #50e76b33}
.listening-dock::after{filter:drop-shadow(0 0 3px #5cff7c);opacity:.9}
.listening-dock #external,.listening-dock #spotify-link{display:flex!important;align-items:center!important;justify-content:center!important;align-self:center!important;height:40px!important;min-height:40px!important;margin:0!important;padding:0 8px!important;line-height:1!important;box-sizing:border-box;transform:none!important}
.receiver-mix{color:#8bffa3;font:8px/1.1 Arial,sans-serif;letter-spacing:.12em;text-shadow:0 0 6px #40ff68;white-space:nowrap}
.listening-dock::before{box-shadow:inset 0 0 22px #42ef5945,inset 0 1px 6px #000,0 0 10px #50e76b45}
.listening-dock::after{animation:receiver-tube-flicker 11s linear infinite;filter:drop-shadow(0 0 4px #5cff7c)}
.receiver-mix{animation:receiver-label-glow 11s linear infinite}
@keyframes receiver-tube-flicker{0%,38%,41%,76%,79%,100%{opacity:.92}39%{opacity:.72}40%{opacity:.86}77%{opacity:.76}78%{opacity:.9}}
@keyframes receiver-label-glow{0%,38%,41%,76%,79%,100%{text-shadow:0 0 7px #40ff68,0 0 12px #40ff6840}39%,77%{text-shadow:0 0 3px #40ff6855}40%,78%{text-shadow:0 0 6px #40ff68}}
@media(prefers-reduced-motion:reduce){.listening-dock::after,.receiver-mix{animation:none!important}}
.listening-dock #start:focus-visible,.listening-dock #toggle-player:focus-visible,.listening-dock a:focus-visible{outline:2px solid #ffad50;outline-offset:2px}
@media(max-width:760px){
 .listening-dock::before{bottom:calc(5px + env(safe-area-inset-bottom))}
 .listening-dock::after{left:20px;right:20px;top:6px}
 .listening-dock #external,.listening-dock #spotify-link{font-size:10px!important}
 .listening-dock{padding-top:16px!important;padding-bottom:calc(8px + env(safe-area-inset-bottom))!important}
 .listening-dock .receiver-mix{position:absolute;top:5px;left:50%;transform:translateX(-50%);font-size:7px;background:#0a2013;padding:0 8px;z-index:1}
}