/* 25 contextual effects, with all essential text visible without animation. */
@keyframes mx01-heart-beat{0%,62%,100%{transform:scale(1);opacity:1}70%{transform:scale(1.16);opacity:.6}78%{transform:scale(1)}86%{transform:scale(1.1);opacity:.82}}
@keyframes mx02-donation-halo{0%,100%{box-shadow:0 0 0 0 #9573c800}50%{box-shadow:0 0 0 5px #9573c818}}
@keyframes mx03-header-settle{from{translate:0 -5px}to{translate:0 0}}
@keyframes mx04-search-aura{50%{box-shadow:0 0 0 5px #a17bc51a}}
@keyframes mx05-clear-pop{from{scale:.75;rotate:-35deg}to{scale:1;rotate:0deg}}
@keyframes mx06-menu-step{from{translate:-12px 0}to{translate:0 0}}
@keyframes mx07-menu-reveal{from{transform:translateX(-28px)}to{transform:translateX(0)}}
@keyframes mx08-backdrop-soften{from{backdrop-filter:blur(0);background:#17132322}to{backdrop-filter:blur(3px);background:#17132375}}
@keyframes mx09-tab-spring{50%{translate:0 -4px;scale:1.06}}
@keyframes mx10-page-arrive{from{translate:0 9px}to{translate:0 0}}
@keyframes mx11-card-rise{from{translate:0 5px}to{translate:0 0}}
@keyframes mx12-cover-sheen{from{transform:translateX(-120%) skewX(-18deg)}to{transform:translateX(220%) skewX(-18deg)}}
@keyframes mx13-save-bloom{40%{scale:1.16;filter:drop-shadow(0 0 6px #ad6d9a66)}70%{scale:.97}}
@keyframes mx14-queue-tick{40%{rotate:-9deg;scale:.9}75%{rotate:4deg;scale:1.12}}
@keyframes mx15-play-press{35%{scale:.88}75%{scale:1.06}}
@keyframes mx16-listening-bars{0%,100%{scale:1 .45}50%{scale:1 1}}
@keyframes mx17-seek-glow{50%{filter:drop-shadow(0 0 4px #b79ada)}}
@keyframes mx18-speed-flip{from{transform:rotateX(-35deg)}to{transform:rotateX(0)}}
@keyframes mx19-player-rise{from{transform:translateY(32px)}to{transform:translateY(0)}}
@keyframes mx20-dialog-arrive{from{scale:.98;translate:0 10px}to{scale:1;translate:0 0}}
@keyframes mx21-toast-slide{from{translate:0 14px}to{translate:0 0}}
@keyframes mx22-field-line{from{box-shadow:inset 0 -2px #9872c000}to{box-shadow:inset 0 -2px #9872c099}}
@keyframes mx23-upload-flow{to{background-position:28px 0}}
@keyframes mx24-details-unfold{from{translate:0 -4px}to{translate:0 0}}
@keyframes mx25-rail-nudge{50%{border-bottom-color:#9d80c2}}

header .avatar{display:grid;place-items:center;border-radius:50%;background:#f1eaf8;color:#8d5988;border:1px solid #e0d2e5;width:44px;height:44px;flex-shrink:0;position:relative}
header .avatar svg{width:22px;height:22px;fill:#c99bbb42;stroke:currentColor;stroke-width:1.6;animation:mx01-heart-beat 4.2s ease-in-out infinite}
header>.donate-action{animation:mx02-donation-halo 5.5s ease-in-out 3!important}
header{animation:mx03-header-settle .4s ease-out}
header .search:focus-within{animation:mx04-search-aura .55s ease-out}
header .search{position:relative}
.mobile-search-clear{display:grid;place-items:center;width:40px;height:40px;min-width:40px;padding:0;margin:-10px -7px -10px 4px;background:transparent;border:0;border-radius:50%;font-size:25px;color:var(--muted);animation:mx05-clear-pop .2s ease-out}
.mobile-search-clear[hidden]{display:none}
header .search input::-webkit-search-cancel-button{display:none}
.mobile-share-action{display:flex;align-items:center;gap:12px;margin-top:16px;padding:12px 0;min-height:44px;color:inherit;font:inherit;background:transparent;border:0}
.mobile-share-action svg{width:22px;height:22px}
body.menu aside .nav a{animation:mx06-menu-step .32s var(--menu-step,0ms) backwards}
.fx-menu{animation:mx07-menu-reveal .28s ease-out!important}
body.menu .mobile-menu-backdrop{animation:mx08-backdrop-soften .25s ease-out}
.fx-tab{animation:mx09-tab-spring .38s ease-out!important}
#app.fx-page{animation:mx10-page-arrive .32s ease-out}
.fx-card{animation:mx11-card-rise .38s var(--arrival,0ms) backwards}
.catalog-art,.editors-card>a>.recording-cover,.bookproduct .realcover{position:relative;isolation:isolate;overflow:hidden}
.catalog-art:after,.editors-card .recording-cover:after{content:'';position:absolute;inset:0;width:55%;background:linear-gradient(90deg,transparent,#ffffff66,transparent);transform:translateX(-120%) skewX(-18deg);pointer-events:none}
.catalog-art:active:after,.editors-card:active .recording-cover:after{animation:mx12-cover-sheen .55s ease-out}
.fx-save{animation:mx13-save-bloom .45s ease-out!important}
.fx-queue{animation:mx14-queue-tick .38s ease-out!important}
.fx-play{animation:mx15-play-press .3s ease-out!important}
.listening-equalizer{display:none;gap:4px;position:absolute;bottom:12px;right:12px;background:#211b35a8;padding:10px;border-radius:10px;height:40px;align-items:center}
.audio-is-playing .listening-equalizer{display:flex}
.listening-equalizer i{display:block;width:3px;height:18px;border-radius:3px;background:#fff;transform-origin:50% 100%;animation:mx16-listening-bars .85s ease-in-out infinite}
.listening-equalizer i:nth-child(2){animation-delay:-.2s}.listening-equalizer i:nth-child(3){animation-delay:-.5s}.listening-equalizer i:nth-child(4){animation-delay:-.3s}
input[type=range]:active{animation:mx17-seek-glow .55s ease-out}
.fx-speed{animation:mx18-speed-flip .3s ease-out!important;display:inline-block}
.listening-sheet{animation:mx19-player-rise .34s cubic-bezier(.2,.7,.2,1)!important}
#overlay .drawer{animation:mx20-dialog-arrive .25s ease-out}
.toast.show{animation:mx21-toast-slide .22s ease-out}
input:focus,textarea:focus,select:focus{animation:mx22-field-line .25s both}
.batch-item progress[value]:not([value="0"]):not([value="100"])::-webkit-progress-value{background:repeating-linear-gradient(110deg,#8d6abd 0 10px,#b79bdb 10px 20px);background-size:28px 100%;animation:mx23-upload-flow 1s linear infinite}
.fx-details> :not(summary){animation:mx24-details-unfold .25s ease-out}
.fx-rail{border-bottom:1px solid transparent;animation:mx25-rail-nudge .7s ease-out}

.listening-backdrop{overflow-y:auto!important;overscroll-behavior:contain;padding:24px 14px!important;display:flex!important;align-items:flex-start!important;background:#1c1729a8!important;backdrop-filter:blur(12px);height:100dvh;box-sizing:border-box}
.listening-sheet{width:min(100%,540px)!important;min-width:0;margin:auto;padding:24px!important;border-radius:26px!important;background:var(--bg,#f5f5fa);color:var(--ink,#212441);box-sizing:border-box;text-align:center;max-height:none!important;height:auto!important;overflow:visible!important}
.listening-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.listening-top button{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--line);background:transparent;border-radius:50%;color:inherit;font-size:27px}
.listening-top button svg,.listening-tool svg,.listening-volume svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.6}
.listening-cover{position:relative;width:190px;margin:0 auto 18px}
.listening-cover>.recording-cover{width:190px!important;height:170px!important;min-height:170px!important;border-radius:16px!important}
.listening-category{font-size:12px;color:var(--accent);display:inline-block;padding:6px}
.listening-sheet h2{font-size:clamp(22px,4vw,30px)!important;line-height:1.28!important;margin:6px 0 10px!important;overflow-wrap:anywhere}
.listening-speaker{font-size:12px!important;color:var(--muted);margin:0 0 15px}
.listening-sheet .listening-timeline{display:flex!important;position:static!important;gap:10px!important;width:100%;margin:0 0 8px!important;color:var(--muted)}
.listening-timeline span{display:inline!important;min-width:34px;font-size:10px;font-variant-numeric:tabular-nums}
.listening-timeline input{min-width:0;flex:1;min-height:44px;accent-color:#8463b5;touch-action:pan-y}
.listening-sheet .listening-transport{display:flex;justify-content:space-between;align-items:center;margin:0 0 20px;gap:8px}
.listening-transport button{width:48px;min-width:44px!important;height:48px;display:grid;place-items:center;color:inherit;background:transparent;border-radius:50%;padding:6px}
.listening-transport .mainplay{width:64px!important;min-width:64px!important;height:64px!important;background:#7b61ab!important;color:white!important;box-shadow:0 6px 16px #70569a22!important}
.listening-transport .mainplay svg{width:28px!important;height:28px!important}
.listening-tools{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;padding:16px 0;border-block:1px solid var(--line)}
.listening-tool{min-width:0;min-height:58px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:6px 2px!important;color:inherit;background:transparent;border-radius:12px;font-size:10px}
.listening-tool>span:first-child{font-size:22px;line-height:24px;min-height:24px}
.listening-tool>span[data-speed-control]{font-size:15px;font-weight:700}
.listening-tool[aria-pressed=true]{background:#9976c51a;color:#8c5289}
.listening-options{display:grid;grid-template-columns:1fr 1fr;gap:18px;text-align:left;padding:18px 0;align-items:end}
.listening-options label{display:grid;gap:7px;font-size:11px;color:var(--muted)}
.listening-options select{width:100%;max-width:100%;padding:10px!important;margin:0!important;min-height:44px;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px}
.listening-volume{display:flex;align-items:end;gap:8px}.listening-volume label{min-width:0;flex:1}.listening-volume button{width:44px;min-width:44px;height:44px;background:transparent;color:inherit}.listening-volume input{width:100%;min-height:44px;accent-color:#8463b5}
.listening-links{display:flex;gap:12px;justify-content:space-between;font-size:12px;flex-wrap:wrap}.listening-links a{min-height:44px;display:flex;align-items:center;color:var(--accent)}
.listening-hint{font-size:11px!important;line-height:1.6;margin:8px 0 0!important;color:var(--muted)}
.share-link-dialog label{display:grid;gap:8px;margin:20px 0}.share-link-dialog input{width:100%;min-height:44px;font-size:16px;padding:10px;border:1px solid var(--line);border-radius:10px}
body.overlay-open{overflow:hidden}
#overlay{position:relative;z-index:300}
input,select,textarea{max-width:100%;box-sizing:border-box}
#app{overflow-wrap:break-word}
button:disabled{cursor:not-allowed;opacity:.55}
.motion-paused *,.motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important}
body.dark .listening-sheet{background:#272334;color:#eee8f5}body.dark header .avatar{background:#40334e;color:#efbedf;border-color:#625070}
body.dark main>header{background:#211d2df5!important;border-color:#44384f!important;color:#eee8f5}
body.dark header>.donate-action,body.dark header .book-selection{background:#40334e!important;border-color:#625070!important;color:#e4d1f0!important}

@media(hover:hover){.catalog-art:hover:after,.editors-card:hover .recording-cover:after{animation:mx12-cover-sheen .65s ease-out}.listening-tool:hover{background:#9976c518}}
@media(min-width:761px) and (max-width:1050px){
 main>header{padding-inline:20px;gap:12px}
 header .search{min-width:0;flex:1}
 header .search input{min-width:0;width:100%}
}
@media(max-width:760px){
 header{grid-template-columns:44px minmax(0,1fr) 44px 94px!important;column-gap:5px!important}
 header>.topright{display:flex!important;justify-content:space-between!important;width:94px!important;min-width:94px!important;gap:6px!important}
 header .topright>a.avatar{display:grid!important;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;line-height:1!important}
 header .book-selection{animation:none!important;transform:none!important}
 header>.mobilebrand{font-size:15px!important;letter-spacing:-.5px;white-space:nowrap}
 header .key{display:none!important}
 header .search input{width:100%;min-width:0;flex:1;font-size:16px!important}
 main{padding-bottom:calc(88px + env(safe-area-inset-bottom))!important}
 body.has-recording main{padding-bottom:calc(218px + env(safe-area-inset-bottom))!important}
 .content{padding-left:16px!important;padding-right:16px!important}
 .mobiletabs{display:flex!important;position:fixed!important;inset:auto 0 0!important;z-index:65!important;justify-content:space-around!important;padding-bottom:env(safe-area-inset-bottom);height:calc(62px + env(safe-area-inset-bottom))!important;box-sizing:border-box;backdrop-filter:blur(18px);background:var(--bg,#f5f5fa)!important;border-top:1px solid var(--line)}
 .mobiletabs a{min-height:50px;min-width:44px;font-size:10px!important;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;position:relative;color:var(--muted)}
 .mobiletabs a.active{color:#7f5caf!important;background:#a385c815;border-radius:12px}
 .mobiletabs a.active:after{content:'';width:15px;height:3px;border-radius:3px;background:currentColor;position:absolute;bottom:2px}
 .reference-player{bottom:calc(62px + env(safe-area-inset-bottom))!important;min-height:126px!important;padding:9px 12px!important;border-radius:18px 18px 0 0;box-shadow:0 -6px 24px #24193418}
 .reference-player .extra{height:44px!important;gap:10px!important;justify-content:space-around!important}
 .reference-player .extra>button,.reference-player .volume-control button{min-height:44px!important;min-width:38px!important;font-size:12px!important;padding:5px!important}
 .reference-player .extra svg{width:21px!important;height:21px!important}
 .reference-player .extra .volume-control input{display:none!important}
 .reference-player .track{min-height:46px;outline-offset:3px}
 .reference-player .track strong{font-size:12px!important;line-height:1.35!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal!important}
 .reference-player .track small{font-size:10px!important}
 .reference-player .timeline{display:none!important}
 .listening-backdrop{padding:10px 8px calc(10px + env(safe-area-inset-bottom))!important}
 .listening-sheet{padding:18px 16px!important;border-radius:22px!important}
 .listening-top{margin-bottom:14px}.listening-cover{width:160px;margin-bottom:12px}.listening-cover>.recording-cover{width:160px!important;height:140px!important;min-height:140px!important}
 .listening-tools{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:12px 0}
 .listening-tool{flex-direction:row;gap:9px;min-height:48px;font-size:11px}.listening-tool>span:first-child{font-size:20px}
 .listening-options{gap:12px}.listening-options select{font-size:16px!important}
 #overlay .drawer{max-height:100dvh!important;padding:22px 18px calc(24px + env(safe-area-inset-bottom))!important;overflow-y:auto!important;overscroll-behavior:contain}
 .drawer .catalog-row{grid-template-columns:1fr}.drawer .catalog-actions{grid-column:auto}
 .staff-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-bottom:18px;overflow:visible}
 .staff-tabs button{white-space:normal;min-height:48px;text-align:left;font-size:12px}
 .staff-header-actions{display:grid;grid-template-columns:1fr 1fr}.staff-header-actions button{min-height:46px}
 .staff-account-list article,.manage-item{flex-wrap:wrap;align-items:flex-start;gap:12px}
 .staff-row-actions{width:100%}.staff-row-actions button{min-height:44px;flex:1}
 .staff-filter{align-items:stretch}.staff-filter label{min-width:0!important;flex-basis:100%!important}
 .batch-item-actions button{min-height:44px}.batch-drop{padding:20px 12px}.batch-drop input{min-width:0;width:100%}
 .staff-photo-preview{flex-wrap:wrap}.staff-workspace .admin-card{padding:18px!important}.staff-login{padding:24px 18px;margin-top:15px}
 .sectionhead{gap:12px;flex-wrap:wrap}.sectionhead>a,.sectionhead>button{min-height:44px;display:inline-flex;align-items:center}
 .catalog-actions button,.editors-card>.secondary{min-width:44px;min-height:44px}
 .editors-card>.secondary{width:44px;height:44px;top:32px}
 .chips .chip{min-height:44px;display:inline-flex;align-items:center}
 footer{line-height:2}footer a{display:inline-flex;align-items:center;min-height:44px}
 .scrolltop{bottom:calc(84px + env(safe-area-inset-bottom))!important}body.has-recording .scrolltop{bottom:calc(204px + env(safe-area-inset-bottom))!important}
 .toast{bottom:calc(88px + env(safe-area-inset-bottom))!important;max-width:calc(100vw - 32px)!important}body.has-recording .toast{bottom:calc(214px + env(safe-area-inset-bottom))!important}
 .producthero,.bookdetail,.biography-layout,.admin-layout{min-width:0}.producthero>*{min-width:0}.buyactions{flex-wrap:wrap}.buyactions>*{min-height:44px}
 body.menu aside{z-index:200!important;padding-bottom:calc(36px + env(safe-area-inset-bottom))!important}
 body.menu .mobile-menu-backdrop{z-index:190!important}
}
@media(max-width:350px){header>.mobilebrand{font-size:13px!important}.listening-options{grid-template-columns:1fr}.reference-player .extra{gap:4px!important}.content{padding-inline:12px!important}.listening-transport{gap:3px!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.listening-equalizer i{scale:1 .65}.fx-card,#app.fx-page,.fx-menu{translate:none!important;transform:none!important}header .avatar svg{opacity:1;transform:none}}