/* ===========================================================
   WINDOWS MEDIA PLAYER (XP) LAYOUT
===========================================================*/
.wmp-container{ display:flex; flex-direction:column; height:100%; }
.wmp-menu-bar{ display:flex; gap:16px; padding:4px 8px; background:#dde6f6; border-bottom:1px solid #9fb3d9; color:#000; }
.wmp-body{ display:flex; gap:8px; flex:1; padding:8px; background:#eef3ff; color:#000; }
.wmp-sidebar{ width:160px; background:#c9daf8; border:2px inset #9fb3d9; }
.wmp-sidebar ul{ list-style:none; margin:0; padding:6px; }
.wmp-sidebar li{ padding:6px; border-radius:2px; cursor:pointer; }
.wmp-sidebar li.active{ background:#99b8f4; }
.wmp-main{ flex:1; display:flex; flex-direction:column; }
.wmp-top-info{ padding:6px; background:#fff; border:2px inset #9fb3d9; }
.wmp-main-section{ display:flex; gap:8px; flex:1; padding:8px 0; }
.wmp-video-area{ flex:1; min-height:180px; background:#000; border:2px inset #9fb3d9; display:grid; place-items:center; position:relative; }
.wmp-drop-notice{ color:#fff; opacity:.6; position:absolute; bottom:6px; left:6px; font-size:12px; }
.wmp-right-panel{ width:240px; display:flex; flex-direction:column; gap:6px; }
.wmp-album-art{ height:180px; background:#fff; border:2px inset #9fb3d9; display:grid; place-items:center; }
.wmp-track-list{ list-style:none; margin:0; padding:0; background:#fff; border:2px inset #9fb3d9; max-height:180px; overflow:auto; }
.wmp-track-list li{ padding:6px; border-bottom:1px solid #e6eefc; cursor:pointer; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.wmp-total-time{ text-align:right; font-size:12px; color:#333; }
.wmp-bottom-controls{ padding:6px; background:#dde6f6; border-top:1px solid #9fb3d9; display:flex; flex-direction:column; gap:6px; }
.wmp-controls-row{ display:flex; gap:6px; }
.wmp-controls-row button{ padding:6px 8px; }
.wmp-progress-container{ display:grid; grid-template-columns:60px 1fr 60px; align-items:center; gap:6px; }
.wmp-progress{ width:100%; }
.wmp-volume-container{ display:flex; align-items:center; gap:6px; }
.wmp-volume{ width:120px; }