#notes{background: #eadfcd;}
#notes .notes-carousel{position: relative; margin-top: 85px; --note-gap: 20px;}
#notes .notes-track{display: flex; gap: var(--note-gap); margin-inline: 44px; padding-block: 18px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none;}
#notes .notes-track::-webkit-scrollbar{display: none;}
#notes .note-publication{container-type: inline-size; position: relative; flex: 0 0 calc((100% - 2 * var(--note-gap)) / 3); min-width: 0; aspect-ratio: 4 / 5; background: #efe6d7; box-shadow: 0 6px 15px #22232112; scroll-snap-align: start;}
#notes .note-inner{position: absolute; inset: 0; display: flex; flex-direction: column; padding: 5cqw;}
#notes .note-format{flex-shrink: 0; margin-bottom: 5cqw; font-size: max(10px, 2.7cqw); line-height: 1.3; letter-spacing: .1em; text-transform: uppercase;}
#notes .note-publication h3{flex-shrink: 0; margin: 0 0 4cqw; font-size: 12cqw; font-weight: 400; line-height: .95; letter-spacing: -.025em;}
#notes .note-excerpt{flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior-y: contain; scrollbar-width: thin; scrollbar-color: #777267 transparent; margin: 0; padding-right: 6px; font-size: max(13px, 3.8cqw); line-height: 1.4;}
#notes .note-excerpt em{font-family: "DM Sans Presentation", "DM Sans", sans-serif; font-style: italic;}
#notes .note-lyrics h3{margin-top: 5cqw; font-size: 13cqw;}
#notes .note-lyrics blockquote{margin: auto 0 5cqw; font-size: 4.8cqw; font-style: italic; line-height: 1.6; letter-spacing: -.015em;}
#notes .note-lyrics blockquote span{display: block; white-space: nowrap;}
#notes .note-signature{margin: 0; font-size: max(11px, 3cqw); line-height: 1.4;}
#notes .note-publication figure{display: flex; flex-direction: column; flex: 1; min-height: 0; margin: 0;}
#notes .note-publication figure img{display: block; flex: 1; min-height: 0; height: 0; width: 100%; object-fit: contain;}
#notes .note-publication figcaption{flex-shrink: 0; margin-top: 4cqw; font-size: max(10px, 2.9cqw); line-height: 1.4;}
#notes .note-lyrics .note-signature{margin-bottom: auto;}
#notes .note-excerpt::-webkit-scrollbar{width: 4px;}
#notes .note-excerpt::-webkit-scrollbar-thumb{background: #777267;}
#notes .note-excerpt:focus-visible{outline: 1px solid var(--accent); outline-offset: 3px;}
#notes .note-video{position: relative; flex: 1; min-height: 0;}
#notes .note-film .note-video img,#notes .note-film .note-video video{position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain;}
#notes .note-play{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: grid; place-items: center; width: 48px; height: 48px; padding: 0 0 0 3px; border: 1px solid #22232140; border-radius: 50%; background: #f3f0e8e6; color: var(--ink); font-size: 19px; cursor: pointer;}
#notes .note-play:focus-visible{outline: 2px solid var(--accent); outline-offset: 3px;}
#notes .notes-arrow{position: absolute; z-index: 1; top: 50%; transform: translateY(-50%); width: 38px; height: 44px; padding: 0; border: 0; border-radius: 0; color: var(--ink); background: transparent; font: 28px/1 "DM Sans", Arial, sans-serif; cursor: pointer;}
#notes .notes-prev{left: 0;}
#notes .notes-next{right: 0;}
#notes .notes-arrow:disabled{opacity: .24; cursor: default;}
#notes .notes-arrow:focus-visible,#notes .notes-track:focus-visible{outline: 2px solid var(--accent); outline-offset: -2px;}
@media (min-width: 651px) and (max-width: 1100px){#notes .note-publication{flex-basis: calc((100% - var(--note-gap)) / 2);}
}
@media (max-width: 650px){#notes{padding-bottom: 125px;}
#notes .notes-carousel{margin-top: 45px;}
#notes .notes-track{margin-inline: 0;}
#notes .note-publication{flex-basis: 100%;}
#notes .notes-arrow{top: auto; bottom: -52px; transform: none;}
}
#notes .sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0;}
