.audio-dock{position:fixed;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));z-index:20;width:360px;max-width:calc(100vw - 32px);padding:7px 12px;background:rgba(12,9,17,.94);border:1px solid rgba(244,238,235,.23);border-radius:3px;box-shadow:0 8px 32px #0006;color:#f4eeeb;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);font-family:Arial,Helvetica,sans-serif}
.audio-dock-controls{display:flex;align-items:center;gap:10px;min-width:0}
.audio-dock-label{display:flex;align-items:center;gap:6px;font-size:9px;text-transform:uppercase;letter-spacing:.12em;white-space:nowrap;color:#b6acb7}
.audio-dock-light{width:5px;height:5px;border-radius:50%;background:#776c7a;flex:none}
.audio-dock[data-state=playing] .audio-dock-light{background:#8ad5e8;box-shadow:0 0 9px #8ad5e85c}
.audio-dock[data-state=loading] .audio-dock-light{background:#eba9c9}
.audio-dock button{border:0;background:none;color:inherit;font:inherit;cursor:pointer;min-height:44px;flex:none}
.audio-dock button:hover{color:#eba9c9}
.audio-dock-toggle{display:flex;align-items:center;justify-content:center;gap:7px;min-width:66px;padding:0 4px;font-size:10px!important;letter-spacing:.06em;text-transform:uppercase}
.audio-dock-symbol{font-size:11px;width:12px;text-align:center}
.audio-dock-next{font-size:20px!important;letter-spacing:-.14em;width:36px;padding:0 5px}
.audio-dock-volume{display:flex;align-items:center;gap:9px;min-width:0;flex:1}
.audio-dock input[type=range]{display:block;width:100%;min-width:36px;max-width:110px;margin:0;min-height:32px;accent-color:#eba9c9;background:transparent;cursor:pointer}
.audio-dock-volume-value{min-width:26px;font-size:9px;line-height:1;color:#b6acb7;font-variant-numeric:tabular-nums;text-align:right}
.audio-dock button:focus-visible,.audio-dock input:focus-visible{outline:2px solid #8ad5e8;outline-offset:2px;border-radius:2px}
.audio-dock-feedback{font-size:10px;line-height:1.5;margin:0;padding:4px 2px 6px;color:#eba9c9}
.audio-dock-feedback[hidden]{display:none}
.audio-dock-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
body:has(.audio-dock) footer{padding-bottom:105px}
body:has(.audio-dock) .toast{bottom:100px}
@media(max-width:600px){.audio-dock{right:max(16px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));width:340px;padding:5px 10px}.audio-dock-controls{gap:8px}.audio-dock-label{font-size:8px;gap:5px}.audio-dock-toggle{min-width:60px;font-size:9px!important}.audio-dock-next{width:32px}.audio-dock-volume{gap:6px}.audio-dock input[type=range]{max-width:none}.audio-dock-volume-value{font-size:8px;min-width:24px}}
@media(prefers-reduced-transparency:reduce){.audio-dock{background:#0c0911;backdrop-filter:none;-webkit-backdrop-filter:none}}

.audio-dock {
  width: 340px;
  border-radius: 0;
  border-color: #f4eeeb30;
  background: #09070df0;
  box-shadow: 0 8px 25px #0004;
  font-family: var(--text-face, "Arial Narrow", Arial, sans-serif);
}
.audio-dock-controls { gap: 12px; }
.audio-dock-label { letter-spacing: .14em; }
.audio-dock-toggle, .audio-dock-next {
  font-family: inherit !important;
  font-size: 9px !important;
  font-weight: 400;
  letter-spacing: .12em;
  line-height: 1;
  text-transform: uppercase;
  padding: 0 5px;
  border-radius: 0;
  transition: color .2s ease, background .2s ease, transform .15s ease;
}
.audio-dock-toggle { min-width: 52px; }
.audio-dock-next { width: 40px; }
.audio-dock button:hover { background: #f4eeeb08; color: var(--paper, #f4eeeb); }
.audio-dock button:active { transform: translateY(1px); color: #eba9c9; }
.audio-dock input[type=range] { accent-color: #b9adb7; }
.audio-dock button:focus-visible, .audio-dock input:focus-visible {
  border-radius: 0;
  outline-width: 1px;
}
@media (max-width: 600px) {
  .audio-dock { width: 320px; }
  .audio-dock-controls { gap: 8px; }
  .audio-dock-toggle { min-width: 48px; }
  .audio-dock-next { width: 38px; }
}
@media (prefers-reduced-motion: reduce) {
  .audio-dock button { transition: none; }
  .audio-dock button:active { transform: none; }
}
