/* Skin: "wmp" — old Windows Media Player 6.4 (Win98). Grey beveled window,
   navy title bar, a small black display with a basic visualiser, classic
   Win9x transport buttons and trackbar, a status bar. MS Sans / Tahoma. */
.skin-wmp { background: #008080; }
.skin-wmp .winbar { display: none; }
.skin-wmp .winframe {
  max-width: 540px; margin: 28px auto 46px; padding: 2px;
  background: #c0c0c0; border: 2px solid; border-color: #ffffff #404040 #404040 #ffffff;
  box-shadow: 1px 1px 0 #808080, 0 12px 30px rgba(0,0,0,.5);
  font-family: Tahoma, "MS Sans Serif", Geneva, sans-serif;
}
/* Win9x navy title bar */
.skin-wmp .winframe::before {
  content: "\1F39A  Windows Media Player"; display: block;
  background: linear-gradient(90deg, #000080, #1084d0); color: #fff;
  font: bold 12px Tahoma; padding: 3px 6px;
}
/* Black display / visualiser, sunken */
.skin-wmp .masthead {
  position: relative; margin: 4px; padding: 18px 12px; background: #000; overflow: hidden;
  border: 2px solid; border-color: #404040 #ffffff #ffffff #404040; text-align: center;
}
.skin-wmp .brand { margin: 0; font: bold 15px Tahoma; color: #c4d2e0; }
.skin-wmp .tag { margin: 4px 0 0; color: #708ca6; font: 11px Tahoma; }
.skin-wmp .beta { display: none; }
.skin-wmp .masthead::after {
  content: ""; position: absolute; left: 50%; transform: translateX(-50%); bottom: 6px; width: 120px; height: 18px;
  background:
    linear-gradient(#19c46a 0 0) 0 bottom/4px 40% no-repeat,
    linear-gradient(#19c46a 0 0) 7px bottom/4px 70% no-repeat,
    linear-gradient(#19c46a 0 0) 14px bottom/4px 30% no-repeat,
    linear-gradient(#19c46a 0 0) 21px bottom/4px 85% no-repeat,
    linear-gradient(#19c46a 0 0) 28px bottom/4px 50% no-repeat,
    linear-gradient(#19c46a 0 0) 35px bottom/4px 65% no-repeat,
    linear-gradient(#19c46a 0 0) 42px bottom/4px 25% no-repeat,
    linear-gradient(#19c46a 0 0) 49px bottom/4px 75% no-repeat,
    linear-gradient(#19c46a 0 0) 56px bottom/4px 45% no-repeat,
    linear-gradient(#19c46a 0 0) 63px bottom/4px 60% no-repeat,
    linear-gradient(#19c46a 0 0) 70px bottom/4px 35% no-repeat,
    linear-gradient(#19c46a 0 0) 77px bottom/4px 80% no-repeat,
    linear-gradient(#19c46a 0 0) 84px bottom/4px 50% no-repeat,
    linear-gradient(#19c46a 0 0) 91px bottom/4px 68% no-repeat,
    linear-gradient(#19c46a 0 0) 98px bottom/4px 30% no-repeat,
    linear-gradient(#19c46a 0 0) 105px bottom/4px 55% no-repeat,
    linear-gradient(#19c46a 0 0) 112px bottom/4px 42% no-repeat;
}
/* Trackbar (seek) */
.skin-wmp .content { margin: 4px; background: #c0c0c0; padding: 0; border: 0; }
.skin-wmp .content::before {
  content: "\23EE  \25B6  \23F8  \23F9  \23ED            00:00 / \2014\2014:\2014\2014";
  display: block; white-space: pre; font: 12px Tahoma; color: #000; letter-spacing: 2px;
  background: #c0c0c0; border: 2px solid; border-color: #ffffff #404040 #404040 #ffffff;
  padding: 5px 8px; margin: 0 0 4px;
}
/* The "playlist"/info area, sunken white */
.skin-wmp .content { background: #fff; border: 2px solid; border-color: #404040 #ffffff #ffffff #404040; padding: 10px 12px; }
.skin-wmp .content p { font-size: 16px; line-height: 1.55; color: #000; margin: 0 0 1em; }
.skin-wmp .content h2 { font: bold 16px Tahoma; color: #000080; margin: 1.2em 0 .3em; }
.skin-wmp .content a, .skin-wmp .period-links a { color: #0000ee; }
.skin-wmp .period-links { font-size: 15px; margin: 0 0 10px; }
.skin-wmp .inline img, .skin-wmp .tile img { max-width: 100%; height: auto; display: block; border: 2px solid; border-color: #808080 #fff #fff #808080; }
.skin-wmp .inline figcaption, .skin-wmp .tile figcaption { font-size: 12px; color: #555; margin-top: 4px; }
.skin-wmp .period-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; margin-top: 10px; }
.skin-wmp .tile { margin: 0; }
/* Status bar */
.skin-wmp .period-foot {
  margin: 4px; padding: 3px 8px; background: #c0c0c0; color: #000; font: 11px Tahoma;
  border: 2px solid; border-color: #808080 #ffffff #ffffff #808080;
}
.skin-wmp .period-foot::before { content: "Playing  \00B7  "; }