.music-player { --music-bg: #252440; --music-ink: #e6e8ff; --music-line: #65617e; --music-accent: #4ff0ff; display: inline-flex; flex: none; align-items: center; color: var(--music-ink); font: 12px/1.3 system-ui, sans-serif; }
.music-player--travel { --music-bg: #14202b; --music-ink: #ecce8b; --music-line: #806a3d; --music-accent: #edcc80; }
.music-player--camping { --music-bg: var(--paper-2); --music-ink: var(--ink); --music-line: var(--line); --music-accent: var(--caramel); }
.music-player .music-toggle { display: grid; grid-template-columns: 14px auto; align-items: center; justify-content: center; column-gap: 4px; min-width: 56px; min-height: 44px; margin: 0; padding: 4px 6px; border: 1px solid var(--music-line); border-radius: 8px; background: var(--music-bg); color: inherit; font: inherit; cursor: pointer; white-space: nowrap; }
.music-player svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.music-development { grid-column: 1 / -1; font-size: 9px; line-height: 12px; opacity: .8; }
.music-player [aria-pressed="true"] { border-color: var(--music-accent); box-shadow: inset 0 0 0 1px var(--music-accent); }
.music-player[data-state="error"] button { border-color: #e68f9d; }
.music-player button:disabled { opacity: .6; cursor: wait; }
.music-player button:focus-visible { outline: 2px solid var(--music-accent); outline-offset: 3px; }
.music-player .music-message, .music-player .music-error { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.music-player [hidden] { display: none !important; }