.music-flow {
  --music-ink: #24100e;
  --music-light: #f5e1b9;
  --music-gold: #ebc974;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: var(--music-ink);
  background: linear-gradient(#c17b48, #d58a49 28%, #c66538 44%, #4b1e32 68%, #170f20 90%, #100906);
  scroll-margin-top: 84px;
}
.music-paint { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.music-paint canvas { display: block; width: 100%; height: 100%; }
.music-content { width: calc(100% - var(--story-inset) * 2); margin-inline: auto; padding-block: 128px 112px; }
.music-intro { display: grid; grid-template-columns: 1fr 1.12fr; align-items: center; gap: 36px; margin-bottom: 144px; }
.music-intro-copy { position: relative; z-index: 1; min-width: 0; }
.music-kicker { display: flex; align-items: center; gap: 24px; margin: 0 0 28px; font-size: .875rem; line-height: 1.5; text-transform: uppercase; letter-spacing: 0; }
.music-kicker span { position: relative; display: block; width: 160px; max-width: 40%; height: 1px; background: linear-gradient(currentColor, currentColor) left center / calc(100% - 14px) 1px no-repeat; opacity: .5; }
.music-kicker span::after { content: "\2726"; position: absolute; right: 0; top: 50%; width: 12px; height: 16px; transform: translateY(-50%); font-family: "Libre Baskerville", serif; font-size: 16px; font-weight: 400; line-height: 1; text-align: center; }
.music-intro h2 { margin: 0; font-family: Cfont, "Libre Baskerville", serif; font-size: 76px; font-weight: 400; line-height: .98; letter-spacing: 0; }
.music-intro h2 span { display: block; white-space: nowrap; }
.music-intro h2 em { display: block; white-space: nowrap; color: #60231c; font-weight: 400; }
.music-description { margin: 26px 0 0; font-size: 1rem; line-height: 1.75; letter-spacing: 0; }
.music-image { min-width: 0; position: relative; border: 1px solid rgba(242, 221, 182, .22); background: rgba(243, 218, 175, .07); overflow: hidden; }
.music-image img, .music-image video { display: block; width: 100%; height: 100%; object-fit: cover; }
.music-image--portrait {
  width: calc(100% + min(160px, var(--story-inset) * .6)); height: min(76vh, 680px); min-height: 440px; border: 0;
  transform: translateX(min(40px, var(--story-inset) * .2));
  background: transparent;
  mix-blend-mode: multiply;
  opacity: calc(var(--portrait-opacity, .76) * var(--memory-loop-opacity, 1));
  --video-edge-x:linear-gradient(90deg,transparent 2%,rgba(0,0,0,.06) 5%,rgba(0,0,0,.4) 10%,#000 20%,#000 80%,rgba(0,0,0,.4) 90%,rgba(0,0,0,.06) 95%,transparent 98%);
  --video-edge-y:linear-gradient(180deg,transparent 2%,rgba(0,0,0,.04) 6%,rgba(0,0,0,.18) 13%,rgba(0,0,0,.48) 19%,rgba(0,0,0,.8) 27%,#000 34%,#000 66%,rgba(0,0,0,.8) 73%,rgba(0,0,0,.48) 81%,rgba(0,0,0,.18) 87%,rgba(0,0,0,.04) 94%,transparent 98%);
  isolation: isolate;
  clip-path: inset(2px);
  -webkit-mask-image: var(--video-edge-x), var(--video-edge-y);
  mask-image: var(--video-edge-x), var(--video-edge-y);
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}
.music-image--release { width: 84%; aspect-ratio: 1; justify-self: start; border-color: rgba(74, 39, 24, .18); background: rgba(117, 58, 34, .055); }
.music-image--live { aspect-ratio: 1.72; }
.music-image--live img { position: absolute; inset: 0; object-position: 50% 25%; }
.music-image--sets { aspect-ratio: 1.82; }
.music-image--sets img { position: absolute; inset: 0; object-position: 50% 50%; }
.music-chapter { display: grid; grid-template-columns: 1fr 1.12fr; align-items: center; gap: 36px; margin: 0; }
.music-chapter + .music-chapter { margin-top: 144px; }
.music-chapter-copy { min-width: 0; container-type: inline-size; --music-title-size: 84px; }
.music-number { margin: 0 0 12px; font-size: .875rem; line-height: 1.5; letter-spacing: 0; }
.music-chapter h3 { margin: 0 0 30px; font-family: Cfont, "Libre Baskerville", serif; font-size: min(var(--music-title-size), var(--music-title-fit, 14cqi)); font-weight: 400; line-height: .98; letter-spacing: 0; white-space: nowrap; }
.music-chapter-description { margin: 0 0 30px; font-size: 1rem; line-height: 1.75; color: var(--night-text, var(--music-light)); }
.music-chapter--live .music-chapter-copy { --music-title-fit: 9.5cqi; }
.music-chapter--live { grid-template-columns: 1.45fr .9fr; color: var(--music-light); }
.music-chapter--sets { grid-template-columns: .78fr 1.22fr; color: var(--music-light); }
.music-chapter--live .music-number, .music-chapter--sets .music-number { color: var(--music-gold); }
.music-player { display: flex; align-items: center; gap: 24px; width: 100%; max-width: none; color: var(--music-gold); }
.music-player audio { display: none; }
.music-play { display: grid; place-items: center; flex: 0 0 88px; width: 88px; height: 88px; padding: 0; border: 1px solid currentColor; border-radius: 50%; color: inherit; background: transparent; cursor: pointer; }
.music-play:disabled { opacity: 1; cursor: default; }
.music-play:not(:disabled):hover { background: rgba(235, 201, 116, .10); }
.music-play:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
.music-play-icon { display: block; width: 25px; height: 25px; margin-left: 3px; object-fit: contain; filter: brightness(0) saturate(100%) invert(88%) sepia(36%) saturate(676%) hue-rotate(342deg) brightness(98%) contrast(88%); }
.music-timeline { flex: 1; min-width: 0; }
.music-times { display: flex; justify-content: space-between; gap: 16px; height: 24px; padding-top: 4px; font-size: .875rem; line-height: 20px; font-variant-numeric: tabular-nums; }
.music-times span { min-width: 6ch; white-space: nowrap; }
.music-times [data-remaining] { text-align: right; }
.music-waveform { position: relative; flex: 1; min-width: 0; height: 64px; }
.music-waveform canvas { display: block; width: 100%; height: 100%; }
.music-waveform input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.music-waveform input:disabled { cursor: default; }
.music-waveform:focus-within { outline: 1px solid currentColor; outline-offset: 5px; }
.music-caption { display: flex; align-items: center; gap: 16px; margin: 26px 0 0; color: var(--music-gold); font-size: .875rem; line-height: 1.5; text-transform: uppercase; letter-spacing: 0; }
.music-caption::before { content: ""; width: 54px; height: 1px; background: currentColor; flex: 0 0 54px; opacity: .65; }
@media (max-width: 1100px) {
  .music-chapter-copy { --music-title-size: 56px; }
  .music-player { gap: 20px; }
  .music-play { width: 68px; height: 68px; flex-basis: 68px; }
}
@media (max-width: 800px) {
  .music-content { padding-block: 120px 80px; }
  .music-intro, .music-chapter { gap: 24px; }
  .music-chapter-copy { --music-title-size: 44px; }
  .music-description br { display: none; }
  .music-play { width: 60px; height: 60px; flex-basis: 60px; }
  .music-player { gap: 16px; }
  .music-caption { gap: 12px; }
  .music-caption::before { width: 30px; flex-basis: 30px; }
}
@media (max-width: 600px) {
  .music-intro, .music-chapter, .music-chapter--live, .music-chapter--sets { grid-template-columns: minmax(0,1fr); }
  .music-content { padding-block: 96px 72px; }
  .music-intro { gap: 20px; margin-bottom: 96px; }
  .music-image--portrait { height: 380px; min-height: 0; }
  .music-image--release { width: 82%; justify-self: start; }
  .music-chapter { gap: 28px; }
  .music-chapter + .music-chapter { margin-top: 96px; }
  .music-chapter--live .music-image, .music-chapter--sets .music-image { grid-row: 1; }
  .music-chapter-copy { --music-title-size: 48px; }
  .music-chapter h3 { margin-bottom: 24px; }
  .music-chapter--live { color: var(--music-light); }
}
@media (max-width: 380px) {
  .music-chapter-copy { --music-title-size: 42px; }
}

.music-play[data-playing="true"] .music-play-icon{margin-left:0}


.music-image--portrait img, .music-image--portrait video { position: absolute; inset: 0; object-position: 54% 45%; filter: sepia(.16) saturate(.75) contrast(.96) brightness(1.16); }

.music-image--portrait video { object-position: 51% center; }

.music-image--portrait::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .58; background: linear-gradient(145deg,rgba(107,45,151,.58),rgba(230,72,133,.42) 52%,rgba(244,170,56,.28)); mix-blend-mode: color; }
.music-intro.cloud-pending .music-intro-copy, :is(.music-chapter, .invitation-copy, .invitation-footer).entry-pending { opacity: 0; transform: translateY(18px); }
.music-intro.cloud-pending.copy-visible .music-intro-copy, :is(.music-chapter, .invitation-copy, .invitation-footer).entry-pending.entry-visible { opacity: 1; transform: none; transition: opacity 1.4s ease-in-out, transform 1.4s cubic-bezier(.22,.61,.36,1); }
@media (prefers-reduced-motion: reduce) { .music-intro.cloud-pending.copy-visible .music-intro-copy, :is(.music-chapter, .invitation-copy, .invitation-footer).entry-pending.entry-visible { transition: none; } }

@media (max-width: 1279px) { .music-intro h2 { font-size: 62px; } }
@media (max-width: 1024px) { .music-intro h2 { font-size: 48px; } }
@media (min-width: 601px) and (max-width: 740px) { .music-intro h2 { font-size: 38px; } }
@media (max-width: 380px) { .music-intro h2 { font-size: 42px; } }

.music-caption--release { display: block; text-transform: none; line-height: 1.9; }
.music-caption--release::before { content: none; }
.music-caption--release > span:first-child { white-space: nowrap; }
.music-caption-star { margin-inline: 9px; font-family: "Libre Baskerville", serif; font-size: 16px; }
.music-caption--release a { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; vertical-align: middle; text-decoration: underline; text-underline-offset: 3px; }
.music-caption--release a:hover { text-decoration-thickness: 2px; }
.music-caption--release a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.music-caption--release img { flex: 0 0 18px; filter: brightness(0) saturate(100%) invert(88%) sepia(36%) saturate(676%) hue-rotate(342deg) brightness(98%) contrast(88%); }

@media print { :is(.music-chapter, .invitation-copy, .invitation-footer).entry-pending { opacity: 1; transform: none; transition: none; } }
