/* English Uccellina audiobook: the same night palette as the café, gold only as an accent. */
.audiobook-page{min-height:100svh;background:radial-gradient(ellipse 70% 45% at 50% -8%,#c5ac8317,transparent 70%),radial-gradient(ellipse 60% 40% at 100% 100%,#6c4a2214,transparent 70%),var(--night)}
.audiobook-page.ab-bar-visible{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
.audiobook-header{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.2rem clamp(1.25rem,4vw,4rem)}
.audiobook-back{font-size:.875rem;min-height:44px;display:inline-flex;align-items:center;gap:.7rem;letter-spacing:.06em}
.audiobook-back:hover{color:#e0c6a2}
.audiobook-main{width:min(100% - 2.5rem,46rem);margin:0 auto;padding:clamp(1.5rem,5vw,4rem) 0 clamp(3rem,7vw,5rem)}
.ab-intro h1{font:clamp(3.4rem,10vw,6.5rem)/1.05 var(--serif);letter-spacing:-.035em;margin:0;font-weight:400}
.ab-subtitle{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;margin:.9rem 0 1.6rem;font:italic clamp(1.35rem,3vw,1.7rem)/1.3 var(--serif);color:#e0c6a2}
.ab-subtitle .audio-language-badge{font-style:normal;color:var(--gold)}
.ab-lead{color:#c8c5bd;font-size:1.0625rem;line-height:1.8;margin:0 0 .6rem;max-width:36rem}
.ab-small{color:var(--muted);font-size:.875rem;margin:0}
.ab-notice{margin:2.2rem 0 2rem;padding:1.2rem 1.4rem;border-left:2px solid var(--gold);background:#c4ad830c;font-size:.9375rem;line-height:1.7;color:#ddd6ca}
.ab-notice h2{display:flex;align-items:center;gap:.75rem;font:600 .75rem/1.4 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin:0 0 .8rem}
.ab-age{display:inline-block;padding:.15rem .45rem;border:1px solid #e6cca0;border-radius:2px;color:#e6cca0;letter-spacing:.06em}
.ab-notice p{margin:0 0 .6rem}.ab-notice .ab-note-main{color:var(--ink)}
.ab-notice .ab-ai{margin:.9rem 0 0;padding-top:.8rem;border-top:1px solid #c5ac8330;font-style:italic;color:#e0c6a2}
.ab-noscript{color:var(--muted)}
.ab-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* Player card */
.ab-card{position:relative;padding:clamp(1.3rem,4vw,2.2rem);border:1px solid #c5ac8342;border-radius:12px;background:linear-gradient(180deg,#141b1e,#0f1416);box-shadow:0 24px 80px #0008,inset 0 1px 0 #ffffff08;scroll-margin:1.5rem}
.ab-now{display:flex;flex-direction:column;gap:.3rem;margin:0 0 1.3rem;min-height:3.6rem}
.ab-now-label{font:600 .6875rem/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.ab-now-title{font:clamp(1.55rem,4vw,2rem)/1.2 var(--serif)}
.ab-timeline{margin:0 0 1rem}
.ab-seek{--ab-progress:0%;-webkit-appearance:none;appearance:none;display:block;width:100%;height:44px;margin:0;background:transparent;cursor:pointer;touch-action:pan-y}
.ab-seek::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--gold) var(--ab-progress),#eee7dc2e var(--ab-progress))}
.ab-seek::-moz-range-track{height:4px;border-radius:2px;background:#eee7dc2e}
.ab-seek::-moz-range-progress{height:4px;border-radius:2px;background:var(--gold)}
.ab-seek::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;margin-top:-7px;border-radius:50%;background:#e6d4b0;border:0;box-shadow:0 0 0 4px #c5ac8333}
.ab-seek::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#e6d4b0;border:0;box-shadow:0 0 0 4px #c5ac8333}
.ab-seek:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:4px}
.ab-times{display:flex;justify-content:space-between;font-size:.8125rem;color:var(--muted);font-variant-numeric:tabular-nums;margin-top:-.35rem}
.ab-controls{display:flex;align-items:center;justify-content:center;gap:clamp(.5rem,3vw,1.4rem);margin:1rem 0 1.4rem}
.ab-button,.ab-play,.ab-bar-play{display:inline-grid;place-items:center;border:1px solid #c5ac8355;border-radius:50%;background:transparent;color:var(--ink);padding:0;transition:background .2s,border-color .2s,transform .15s}
.ab-button{position:relative;width:52px;height:52px}
.ab-button svg{width:22px;height:22px;fill:currentColor}
.ab-jump svg{width:30px;height:30px;opacity:.9}
.ab-jump span{position:absolute;top:50%;left:50%;transform:translate(-50%,-38%);font:700 .5625rem/1 var(--sans);letter-spacing:.02em}
.ab-button:hover:not(:disabled){background:#c5ac831c;border-color:var(--gold)}
.ab-button:disabled{opacity:.3;cursor:default}
.ab-play{width:76px;height:76px;background:#d7c39c;border-color:#d7c39c;color:#1b1f1b;box-shadow:0 10px 34px #c5ac8333}
.ab-play svg,.ab-bar-play svg{width:32px;height:32px;fill:currentColor}
.ab-play:hover{background:#e6d4b0}.ab-play:active{transform:scale(.97)}
.ab-icon-pause,[data-state=playing]>.ab-icon-play{display:none}[data-state=playing]>.ab-icon-pause{display:block}
[aria-disabled=true].ab-play,[aria-disabled=true].ab-bar-play{opacity:.45;cursor:default}
.ab-card :focus-visible,.ab-bar :focus-visible,.ab-chapters :focus-visible{outline:2px solid #eee7dc;outline-offset:3px}
.ab-player.is-waiting .ab-play{animation:ab-wait 1.2s ease-in-out infinite}
@keyframes ab-wait{50%{box-shadow:0 0 0 8px #c5ac8326}}
.ab-options{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem 1.5rem;padding-top:1.1rem;border-top:1px solid #eee7dc1a}
.ab-speed{display:inline-flex;align-items:center;gap:.7rem;font-size:.875rem;color:var(--muted)}
.ab-speed select{min-height:44px;padding:.4rem 2rem .4rem .8rem;border:1px solid #c5ac8355;border-radius:4px;color:var(--ink);font:inherit;background:#0b0e10 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23c5ac83'/%3E%3C/svg%3E") no-repeat right .7rem center/.6rem;-webkit-appearance:none;appearance:none}
.ab-text-button{min-height:44px;padding:.5rem 0;border:0;background:none;color:var(--ink);font-size:.875rem;text-decoration:underline;text-decoration-color:#c5ac8399;text-underline-offset:.3em}
.ab-text-button:hover{color:#e0c6a2}
.ab-resume{display:block;width:100%;min-height:50px;margin:1.2rem 0 0;padding:.8rem 1rem;border:1px solid var(--gold);border-radius:4px;background:#c5ac8314;color:var(--ink);font:inherit;font-size:.9375rem;text-align:center}
.ab-resume:hover{background:#c5ac8326}
.ab-status{margin:.9rem 0 0;font-size:.8125rem;color:var(--muted);min-height:1.2em}
.ab-status:empty{margin:0;min-height:0}
.ab-end{margin:1.3rem 0 0;padding:1.4rem 1rem 1.2rem;text-align:center;border-top:1px solid #c5ac8340;border-bottom:1px solid #c5ac8340}
.ab-end span{display:block;color:var(--gold);font-size:1.1rem;margin-bottom:.6rem}
.ab-end p{margin:0;font:clamp(1.2rem,3.4vw,1.45rem)/1.4 var(--serif);color:var(--ink)}
/* Chapter list */
.ab-chapters-nav{margin:2.4rem 0 0}
.ab-chapters-nav h2{font:600 .75rem/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin:0 0 .6rem}
.ab-chapters{list-style:none;margin:0;padding:0;border-top:1px solid #eee7dc1f}
.ab-chapter{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%;min-height:60px;padding:.8rem .9rem .8rem 1.1rem;border:0;border-bottom:1px solid #eee7dc1f;border-left:2px solid transparent;background:none;color:var(--ink);text-align:left;transition:background .2s}
.ab-chapter:hover{background:#c5ac830d}
.ab-chapter-name{font:1.2rem/1.3 var(--serif)}
.ab-chapter-time{font-size:.8125rem;color:var(--muted);font-variant-numeric:tabular-nums}
/* 2026-10-15: badge on the chapters of the latest release */
.ab-chapter-new{margin-left:auto;padding:.15rem .55rem;border:1px solid #c5ac8366;border-radius:999px;font:600 .625rem/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);white-space:nowrap}
.ab-chapter[aria-current=true]{border-left-color:var(--gold);background:#c5ac8312}
.ab-chapter[aria-current=true] .ab-chapter-name{color:#e6cca0}
.ab-storage-note{margin:1.8rem 0 0;font-size:.8125rem;line-height:1.65;color:var(--muted)}
.ab-storage-note p{margin:0}
/* Compact bar while the full player is scrolled away. It reserves its own space (body padding). */
.ab-bar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;align-items:center;gap:.9rem;padding:.6rem clamp(.9rem,4vw,2rem) calc(.6rem + env(safe-area-inset-bottom));background:#0d1214f2;border-top:1px solid #c5ac8340;box-shadow:0 -12px 40px #0008}
@supports (backdrop-filter:blur(6px)){.ab-bar{background:#0d1214d9;backdrop-filter:blur(10px)}}
.ab-bar-progress{position:absolute;left:0;right:0;top:-1px;height:2px;background:transparent}
.ab-bar-progress span{display:block;height:100%;width:0;background:var(--gold)}
.ab-bar-play{flex:none;width:52px;height:52px;background:#d7c39c;border-color:#d7c39c;color:#1b1f1b}
.ab-bar-play svg{width:26px;height:26px}
.ab-bar-text{flex:1;min-width:0;display:flex;flex-direction:column;margin:0;font-size:.8125rem;color:var(--muted);font-variant-numeric:tabular-nums}
.ab-bar-text span:first-child{font:1.05rem/1.25 var(--serif);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ab-bar-link{flex:none;min-height:44px;padding:.4rem .2rem;border:0;background:none;color:var(--gold);font-size:.8125rem;text-decoration:underline;text-underline-offset:.3em}
/* Footer */
.audiobook-footer{margin-top:1rem}
.ab-footer-links{display:flex;flex-wrap:wrap;align-items:center;gap:.2rem 1.4rem}
.ab-footer-links a{min-height:44px;display:inline-flex;align-items:center}
.ab-footer-links .text-menu-button{color:var(--muted)}
@media(max-width:600px){
 .audiobook-header{padding:1rem 1.1rem}
 .audiobook-main{width:calc(100% - 2rem);padding-top:1rem}
 .ab-notice{padding:1rem 1.1rem;font-size:.9rem}
 .ab-card{padding:1.2rem 1rem 1.3rem;border-radius:10px}
 .ab-controls{gap:.35rem}
 .ab-button{width:46px;height:46px}
 .ab-play{width:66px;height:66px}
 .ab-options{flex-direction:column;align-items:flex-start;gap:.4rem}
 .ab-chapter{padding-left:.8rem}
 .ab-footer-links{gap:.1rem 1rem}
}
@media(max-width:350px){.ab-button{width:42px;height:42px}.ab-play{width:58px;height:58px}.ab-controls{gap:.15rem}}
@media(prefers-contrast:more){.ab-card,.ab-chapter{border-color:#eee7dc88}.ab-times,.ab-chapter-time,.ab-storage-note{color:var(--ink)}}
@media(forced-colors:active){.ab-play,.ab-bar-play{border:2px solid ButtonText}.ab-seek{appearance:auto;-webkit-appearance:auto}}
