/* One player skin for both portrait and landscape. Screens own placement only. */
.prelude-player { box-sizing:border-box; display:flex; align-items:center; gap:12px; height:58px; min-width:0; padding:4px 10px; border:1px solid var(--player-border); border-radius:999px; background:linear-gradient(180deg,var(--surface-player-top),var(--surface-player-bottom)); box-shadow:inset 0 3px 8px var(--shadow),inset 0 1px 2px var(--shadow-deep),0 1px 0 var(--rim); color:var(--text); font:14px system-ui,sans-serif; }
.prelude-player .player-details { flex:1; min-width:0; display:grid; grid-template-rows:22px 22px; }
.prelude-player .player-heading { display:flex; align-items:center; gap:14px; min-width:0; }
.prelude-player .player-title { flex:1; min-width:0; font:650 14px system-ui,sans-serif; line-height:normal; letter-spacing:normal; margin:0; padding:0; border:0; background:transparent; color:inherit; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; cursor:pointer; touch-action:manipulation; }
.prelude-player .player-meta { flex:none; color:var(--text-muted); font-size:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.prelude-player .player-button { display:grid; place-items:center; flex:none; width:44px; height:44px; margin:0; padding:0; border:0; border-radius:50%; background:transparent; color:inherit; cursor:pointer; touch-action:manipulation; box-shadow:none; }
.prelude-player .player-button:active { background:var(--pressed); }
.prelude-player :focus-visible { outline:2px solid var(--focus); outline-offset:2px; }
.prelude-player .player-button:disabled,.prelude-player .player-seek:disabled { opacity:.35; cursor:default; }
.prelude-player svg { width:22px; height:22px; fill:currentColor; }
/* Thin scrub line; its invisible touch target stays larger. */
.prelude-player .player-seek { appearance:none; -webkit-appearance:none; width:100%; min-width:0; height:22px; padding:0; margin:0; border:0; border-radius:0; box-shadow:none; background:transparent; accent-color:var(--text); cursor:pointer; touch-action:none; }
.prelude-player .player-seek::-webkit-slider-runnable-track { height:2px; border-radius:2px; background:var(--scrubber); }
.prelude-player .player-seek::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; width:10px; height:10px; margin-top:-4px; border:0; border-radius:50%; background:var(--text); }
.prelude-player .player-seek::-moz-range-track { height:2px; border-radius:2px; background:var(--scrubber); }
.prelude-player .player-seek::-moz-range-thumb { width:10px; height:10px; border:0; border-radius:50%; background:var(--text); }
.prelude-player .player-clock { flex:none; font:11px ui-monospace,monospace; white-space:nowrap; color:var(--text-muted); font-variant-numeric:tabular-nums; }
@media(max-width:900px) {
  .prelude-player { gap:6px; padding-inline:6px; }
  .prelude-player .player-details { grid-template-rows:30px 16px; }
  .prelude-player .player-heading { display:block; }
  .prelude-player .player-title { font-size:12px; line-height:16px; }
  .prelude-player .player-meta { display:block; font-size:9px; line-height:14px; }
  .prelude-player .player-seek { height:16px; }
  .prelude-player .player-clock { font-size:10px; }
}
@media(max-height:330px) { .prelude-player { height:54px; } }