/* Tactile listening controls shared by free previews and member recordings. */
.audio-card-icon,.practice-play-icon,.within-audio-dock .round,#player-play{display:inline-grid!important;place-items:center;flex:none;width:48px!important;height:48px!important;min-height:48px!important;padding:0!important;border-radius:50%;color:#fff8ef;background:radial-gradient(circle at 32% 20%,#8caac1 0%,#557c99 42%,#294962 100%)!important;border:1px solid #e5f5ffb0!important;box-shadow:inset 0 2px 3px #ffffffa0,inset 0 -4px 8px #152f4b60,0 5px 0 #233e5260,0 8px 16px #20364b30;line-height:1;transition:transform .25s,box-shadow .25s}
.audio-card-icon svg,.practice-play-icon svg,.round svg,.speaker-toggle svg,.art-open svg{width:24px!important;height:24px!important;display:block;flex:none}
.audio-card-button:hover .audio-card-icon,#detail-play:hover .practice-play-icon{transform:translateY(-2px)}
.audio-card-button:active .audio-card-icon,.round:active{transform:translateY(2px)}
.art-open span{display:grid;place-items:center}.art-open svg{margin:auto}
#detail-play{display:inline-flex;align-items:center;justify-content:center;gap:18px;padding:16px 24px;font:500 clamp(18px,2vw,23px)/1.4 Outfit,sans-serif;background:linear-gradient(125deg,#f8e8cc,#dfd5ed 60%,#cce3ed);color:#303d55;border:1px solid #fff9;box-shadow:inset 0 2px 1px #fff9,0 8px 24px #12283e20;border-radius:28px;margin:14px 0 20px;text-align:left}
#listening-dialog .listening-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 56px;gap:14px;width:100%;max-width:520px;margin:30px auto 6px;align-items:stretch}
#listening-dialog .listening-controls button{min-height:56px;min-width:0;margin:0;padding:12px 14px;font:500 18px/1.25 Outfit,sans-serif;border:1px solid #ffffff70;border-radius:20px;background:linear-gradient(145deg,#ffffff36,#b9d5e522);color:#faf5ed;box-shadow:inset 0 1px 1px #ffffff80,0 6px 16px #142c4522;transition:background .3s,color .3s,transform .3s}
#listening-dialog #listening-play[aria-pressed=true]{background:linear-gradient(135deg,#f5e6bd,#ead0c0);color:#3a4554}
#listening-dialog #listening-reset:hover,#listening-dialog #listening-reset.is-selected{background:linear-gradient(130deg,#ddcaec,#c5deec);color:#35445f}
.speaker-toggle{display:inline-grid;place-items:center;width:46px;min-height:46px;padding:10px;border-radius:50%;border:1px solid #ffffff75;background:#ffffff25;color:inherit}
.speaker-toggle[aria-pressed=true],#listening-dialog #listening-sound[aria-pressed=true]{background:linear-gradient(135deg,#d4e9d9,#b9d7e5);color:#304b5d}
#listening-dialog .listening-orb{position:relative;width:145px;height:145px;margin:44px auto 48px;background:radial-gradient(at 22% 20%,#fff4db,transparent 58%),radial-gradient(at 80% 25%,#d4bce9,transparent 60%),radial-gradient(at 20% 85%,#9fd6ce,transparent 65%),linear-gradient(125deg,#c2dcee,#eac9d7)!important;background-size:180% 180%!important;box-shadow:inset 10px 12px 24px #ffffff85,inset -12px -14px 26px #7486b83a,0 0 55px #d7c5ed45;animation:within-orb-flow 14s ease-in-out infinite alternate!important}
#listening-dialog .listening-orb:after{content:'';position:absolute;inset:-12px;border:1px solid #dcecff4d;border-radius:inherit;transform:rotate(18deg);box-shadow:0 0 28px #e5d3ec18}
@keyframes within-orb-flow{0%{border-radius:43% 57% 62% 38%/52% 40% 60% 48%;transform:translateY(3px) rotate(-9deg) scale(.94);background-position:0% 20%;filter:hue-rotate(-12deg)}50%{border-radius:60% 40% 43% 57%/40% 58% 42% 60%;transform:translateY(-7px) rotate(5deg) scale(1.06);background-position:100% 40%}100%{border-radius:48% 52% 37% 63%/60% 43% 57% 40%;transform:translateY(0) rotate(12deg) scale(.98);background-position:40% 100%;filter:hue-rotate(30deg)}}
#listening-dialog .listening-orb.is-resting,body.motion-paused #listening-dialog .listening-orb{animation-play-state:paused!important}
.player#player,.within-audio-dock{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);z-index:40;width:calc(100% - 40px);max-width:900px;padding:16px 20px;gap:16px;border-radius:28px;border:1px solid #ffffff8c;background:linear-gradient(125deg,#304d67ad,#55667fa6)!important;color:#fff8ef;backdrop-filter:blur(24px) saturate(135%);-webkit-backdrop-filter:blur(24px) saturate(135%);box-shadow:inset 0 1px 0 #ffffff45,0 14px 40px #19324726}
.within-audio-dock{display:grid;grid-template-columns:minmax(100px,1fr) 48px 46px 36px;align-items:center}
.within-audio-dock[hidden],.player#player[hidden]{display:none!important}
.dock-title{min-width:0;text-align:left;border:0;background:none;color:inherit;padding:0}
.dock-title strong{display:block;font:500 18px/1.3 Outfit,sans-serif}.dock-title small{display:block;margin-top:5px;color:#e2eaf2;font:12px Manrope,sans-serif}
.dock-close{font-size:27px;border:0;background:none;color:inherit;min-height:44px}.dock-progress{grid-column:1/-1;display:flex;gap:14px;align-items:center}.dock-progress input{flex:1;min-width:0;accent-color:#e4c9df;height:24px}.dock-progress span{font:12px Manrope,sans-serif;white-space:nowrap}.dock-status:empty{display:none}.dock-status{grid-column:1/-1;font-size:13px}
.player#player .player-title small,.player#player .player-progress span{color:#e2eaf2}.player#player #player-close{font-size:25px;min-width:34px}.player#player .player-title{flex:1;min-width:0}
@media(max-width:700px){.player#player,.within-audio-dock{bottom:calc(118px + env(safe-area-inset-bottom,0px));width:calc(100% - 28px);padding:15px;gap:10px;border-radius:25px}.within-audio-dock{grid-template-columns:minmax(0,1fr) 44px 44px 30px}.within-audio-dock .round,#player-play{width:44px!important;height:44px!important;min-height:44px!important}.player#player .player-art{display:none}.player#player .player-title{flex-basis:calc(100% - 150px)}.player#player .player-title strong,.dock-title strong{font-size:16px}.player#player .player-progress{flex-basis:100%;order:6}.speaker-toggle{width:44px;min-height:44px}.dock-title small{font-size:11px}#detail-play{width:100%;gap:14px;padding:16px;font-size:20px}#listening-dialog .listening-controls{gap:10px;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 52px}#listening-dialog .listening-controls button{font-size:16px;padding:12px 8px}}
@media(prefers-reduced-motion:reduce){#listening-dialog .listening-orb{animation:none!important}.audio-card-icon,.practice-play-icon,.round{transition:none!important}}
.audio-card-button:focus-visible .audio-card-icon,#detail-play:focus-visible .practice-play-icon{outline:2px solid #f4dc9c;outline-offset:4px}
.within-audio-dock button:focus-visible,.speaker-toggle:focus-visible{outline:2px solid #f4dc9c;outline-offset:3px}
