/* PATIENCE's reading navigation, in the tape's own type and palette. */
.reading-dialog { --reading-inset:30px; --reading-top:24px; --reading-body-size:14px; --reading-body-leading:1.8; --reading-height:calc(100dvh - 44px); }
.reading-dialog[open] { height:var(--reading-height); max-height:var(--reading-height); }
.reading-dialog>.close-dialog { position:absolute; top:24px; right:18px; z-index:3; width:42px; height:42px; border:1px solid #ffffff13; border-radius:50%; background:#ffffff08; -webkit-backdrop-filter:blur(1px); backdrop-filter:blur(1px); }
.reading-dialog>.close-dialog:hover { color:var(--paper); background:#ffffff14; border-color:#ffffff29; }
.reading-dialog .dialog-header { border-bottom:0; }
.reading-dialog .dialog-heading { width:100%; min-width:0; padding-bottom:12px; border-bottom:1px solid #ffffff18; font:16px/normal var(--display); color:var(--paper); }
.reading-dialog .dialog-heading>.eyebrow { display:block; font:8px/1.5 var(--mono); letter-spacing:.14em; margin:0; }
.reading-dialog .dialog-heading>.eyebrow,.reading-dialog .dialog-heading>h2 { padding-right:42px; }
.reading-dialog .dialog-heading>h2 { font:400 clamp(30px,7vw,44px)/1 var(--display); margin:4px 0 10px; white-space:nowrap; }
.dialog-subtitle-row { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:12px; margin:12px 0 6px; }
.reading-dialog .dialog-subtitle-row .dialog-hint { flex:1 1 210px; min-width:0; margin:0; text-wrap:balance; }
.dialog-reading-nav { display:flex; flex:none; align-items:baseline; gap:8px; margin-left:auto; }
.reading-dialog .dialog-switch { display:inline-flex; flex:none; align-items:center; justify-content:center; min-height:36px; padding:14px 21px 10px; border:0; border-radius:999px; background:rgb(6 4 8 / 25%); color:var(--muted); font:700 11px/1 var(--mono); letter-spacing:.1em; white-space:nowrap; text-transform:uppercase; transition:background .25s,color .25s; }
.reading-dialog .dialog-switch span { display:block; line-height:1; text-indent:.1em; }
.reading-dialog .dialog-switch:is(:hover,:focus-visible,[aria-current="page"]) { background:rgb(6 4 8 / 45%); color:var(--paper); }
.reading-dialog .dialog-switch:hover { color:var(--pink-soft); }
#lyrics-dialog .dialog-header { padding:var(--reading-top) var(--reading-inset) 0; border-bottom:1px solid #ffffff18; scrollbar-gutter:stable both-edges; overflow:hidden; }
#lyrics-dialog .dialog-heading { border-bottom:0; }
#lyrics-dialog .dialog-body { padding-inline:var(--reading-inset); scrollbar-gutter:stable both-edges; }
#lyrics-dialog .transcript button { font:400 var(--reading-body-size)/var(--reading-body-leading) var(--mono); }
/* Only the article scrolls, so its header moves and its sibling close stays pinned. */
#lyrics-dialog,#liner-notes-dialog { width:min(660px,calc(100vw - 28px)); }
.liner-notes-content { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; padding:var(--reading-top) var(--reading-inset) 28px; scroll-padding-block:18px; scrollbar-color:#614457 transparent; scrollbar-gutter:stable both-edges; font:400 var(--reading-body-size)/var(--reading-body-leading) var(--mono); color:#ded3dc; }
.liner-notes-content:focus { outline:none; }
.liner-notes-content .dialog-header { padding:0; }
.liner-notes-prose p { display:flow-root; margin:1.1em 0; }
.liner-notes-prose>p:first-child { margin-top:27px; }
.liner-notes-prose>p:not(:first-child) { text-indent:1.5em; }
.liner-notes-prose>p:first-child::first-letter { float:left; font:700 3em/1.12 var(--display); margin:calc(.02em - 1px) .18em 0 0; padding:0 .24em; background:var(--pink); color:#100c12; }
.liner-notes-content strong { color:var(--paper); font-weight:600; }
.liner-refs { float:right; margin-left:.65em; position:relative; top:6px; font:11px var(--mono); line-height:inherit; white-space:nowrap; text-align:right; text-indent:0; color:var(--muted); }
.liner-refs a { display:inline-block; min-height:24px; padding:0 3px; color:var(--pink-soft); text-decoration:none; border-radius:3px; transition:color .18s,background .18s; }
.liner-refs a:hover { color:var(--paper); background:#f92f9717; }
.liner-notes-sources { margin-top:34px; padding-top:22px; border-top:1px solid #ffffff18; font:400 15px/1.75 var(--display); }
.liner-notes-sources h3 { margin:0 0 18px; font:400 25px/1.25 var(--display); color:var(--paper); text-wrap:balance; }
.liner-notes-sources a { color:var(--paper); text-decoration-color:#fa59ac88; text-underline-offset:3px; overflow-wrap:anywhere; transition:color .2s; }
.liner-notes-sources a:hover { color:var(--pink-soft); }
.liner-notes-sources>p { color:var(--muted); }
.liner-note { border-bottom:1px solid #cba9bc38; scroll-margin-top:18px; }
.liner-note summary { min-height:50px; padding:12px 4px; display:grid; grid-template-columns:22px 1fr 14px; align-items:baseline; gap:8px; font:14px/1.5 var(--display); color:var(--muted); list-style:none; cursor:pointer; transition:color .2s; }
.liner-note summary::-webkit-details-marker { display:none; }
.liner-note summary:hover,.liner-note[open] summary { color:var(--paper); }
.liner-note summary:focus-visible { outline:none; color:var(--paper); }
.liner-note-number { font:11px/1.5 var(--mono); color:var(--pink-soft); }
.liner-note-toggle { align-self:center; position:relative; width:10px; height:10px; }
.liner-note-toggle::before,.liner-note-toggle::after { content:""; position:absolute; top:50%; left:0; width:10px; height:1px; background:currentColor; }
.liner-note-toggle::after { transform:rotate(90deg); transition:transform .3s; }
.liner-note[open] .liner-note-toggle::after { transform:rotate(0); }
.liner-note-body { overflow:hidden; }
.liner-note-content { padding:0 4px 18px 34px; font-size:14px; line-height:1.7; }
.liner-note-content p { margin:0 0 12px; }
.liner-note-explanation { font:400 14px/1.75 var(--mono); }
.liner-disclaimer { font:400 13px/1.7 var(--mono); text-wrap:balance; }
.liner-notes-sources .liner-backlink { color:var(--pink-soft); font-size:12px; }
@media(max-width:699px) and (orientation:portrait) {
  .reading-dialog { --reading-inset:24px; --reading-top:20px; --reading-body-leading:1.75; }
  .reading-dialog>.close-dialog { top:20px; right:16px; }
  .reading-dialog .dialog-subtitle-row .dialog-hint { flex-basis:100%; }
  .reading-dialog .dialog-switch { padding-inline:12px; font-size:10px; }
  .liner-notes-content { padding-bottom:24px; }
  .liner-note-content { padding-left:4px; }
}
@media(orientation:landscape) and (max-height:599px) {
  .reading-dialog { --reading-height:calc(100dvh - 20px); --reading-top:12px; }
  .reading-dialog>.close-dialog { top:12px; }
  .reading-dialog .dialog-subtitle-row { margin-top:8px; }
}
@media(prefers-reduced-motion:reduce){html:not([data-motion="full"]) .reading-dialog .dialog-switch,html:not([data-motion="full"]) .liner-note-toggle::after{ transition:none; } }