@font-face { font-family: "Big Shoulders Display"; src: url("/assets/fonts/BigShouldersDisplay-ExtraBold.088f423f09.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Big Shoulders Display"; src: url("/assets/fonts/BigShouldersDisplay-Black.65f2c36803.woff2") format("woff2"); font-weight: 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/assets/fonts/Barlow-Regular.b0a8ad37ac.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/assets/fonts/Barlow-Italic.7a306c56f6.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/assets/fonts/Barlow-Medium.cd759df8ef.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("/assets/fonts/Barlow-Bold.2d797dd8b3.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Big Shoulders Fallback Narrow"; src: local("Arial Narrow Bold"), local("ArialNarrow-Bold"), local("Arial Narrow"); size-adjust: 78.82%; ascent-override: 124.33%; descent-override: 26.64%; line-gap-override: 0%; }
@font-face { font-family: "Big Shoulders Fallback Impact"; src: local("Impact"); size-adjust: 88.74%; ascent-override: 110.44%; descent-override: 23.67%; line-gap-override: 0%; }
@font-face { font-family: "Big Shoulders Fallback Arial"; src: local("Arial Bold"), local("Arial-BoldMT"), local("Liberation Sans Bold"), local("LiberationSans-Bold"), local("Arimo Bold"), local("Arimo-Bold"), local("Arial"); size-adjust: 64.63%; ascent-override: 151.63%; descent-override: 32.49%; line-gap-override: 0%; }
@font-face { font-family: "Big Shoulders Fallback Roboto"; src: local("Roboto"), local("Roboto-Regular"); size-adjust: 70.83%; ascent-override: 138.36%; descent-override: 29.65%; line-gap-override: 0%; }
@font-face { font-family: "Barlow Fallback"; src: local("Arial"), local("ArialMT"), local("Liberation Sans"), local("LiberationSans"), local("Arimo"), local("Arimo-Regular"); size-adjust: 97.02%; ascent-override: 103.07%; descent-override: 20.61%; line-gap-override: 0%; }
@font-face { font-family: "Barlow Fallback Roboto"; src: local("Roboto"), local("Roboto-Regular"); size-adjust: 98.17%; ascent-override: 101.86%; descent-override: 20.37%; line-gap-override: 0%; }
:root {
--font-display: "Big Shoulders Display", "Big Shoulders Fallback Narrow", "Big Shoulders Fallback Impact", "Big Shoulders Fallback Arial", "Big Shoulders Fallback Roboto", "Arial Narrow", Impact, sans-serif;
--font-text: Barlow, "Barlow Fallback", "Barlow Fallback Roboto", "Helvetica Neue", Arial, sans-serif;
--space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
--space-6: 24px; --space-8: 32px; --space-12: 48px; --space-16: 64px;
--radius-none: 0px; --radius-sm: 2px; --radius-full: 999px;
}
:root, .ht-paper {
--ground: #eee9df; --ground-raised: #ffffff;
--ink: #000000; --ink-muted: #5a544b;
--line: #cdc6b8; --line-strong: #7b7468;
--ember: #e8500c; --on-ember: #000000; --ember-text: #a83800;
color-scheme: light;
}
.ht-stage {
--ground: #000000; --ground-raised: #1c1a17;
--ink: #eee9df; --ink-muted: #b0aa9e;
--line: #3a362f; --line-strong: #8f887b;
--ember: #e8500c; --on-ember: #000000; --ember-text: #ff7a33;
color-scheme: dark;
}
:root {
--section-pad: clamp(var(--space-12), 4.5vw, var(--space-16));
}
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--ground); -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; overflow-wrap: break-word; }
main { flex: 1 0 auto; display: block; }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
ul[role="list"], ol[role="list"] { list-style: none; padding: 0; }
picture { display: contents; }
source { display: none; }
button, input, textarea, select { font: inherit; color: inherit; }
[hidden] { display: none !important; }
html { scroll-padding-block: var(--space-2); }
:target { scroll-margin-top: var(--space-2); }
body { margin: 0; font-family: var(--font-text); font-size: 16px; line-height: 24px; background: var(--ground); color: var(--ink); }
.ht-demo { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; padding: var(--space-6); }
.ht-demo--col { display: block; }
:root:not([data-theme="stage"]) .ht-only-stage { display: none; }
:root[data-theme="stage"] .ht-only-paper { display: none; }
.ht-logos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); margin: 0; padding: var(--space-6); }
.ht-logo-tile { display: flex; align-items: center; justify-content: center; box-sizing: border-box; aspect-ratio: 3 / 2; margin: 0; border: 2px solid var(--ink); border-radius: var(--radius-none); background: var(--ground); }
.ht-logo-tile--ember { background: var(--ember); border-color: var(--ember); }
.ht-logo-tile--ink { background: var(--ink); }
.ht-logo { display: block; width: auto; height: 68%; }
.ht-logo--htb { height: 54%; }
.ht-btn { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; height: var(--space-12); padding: 0 var(--space-6); border: 2px solid var(--ink); border-radius: var(--radius-sm); background: var(--ink); color: var(--ground); font-family: var(--font-display); font-weight: 800; font-size: 20px; line-height: 1; letter-spacing: .04em; text-transform: uppercase; text-decoration: none; white-space: nowrap; cursor: pointer; }
.ht-btn--ember { background: var(--ember); border-color: var(--ember); color: var(--on-ember); }
.ht-btn--outline { background: transparent; color: var(--ink); }
.ht-btn--sm { height: calc(var(--space-12) - var(--space-3)); padding: 0 var(--space-4); font-size: 16px; }
.ht-btn:hover { background: var(--ground); border-color: var(--ink); color: var(--ink); }
.ht-btn--ember:hover, .ht-btn--outline:hover { background: var(--ink); border-color: var(--ink); color: var(--ground); }
.ht-btn:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }
.ht-btn[disabled] { background: var(--ground-raised); border-color: var(--line-strong); color: var(--ink-muted); cursor: not-allowed; }
.ht-tag { display: inline-flex; align-items: center; box-sizing: border-box; height: var(--space-6); padding: 0 var(--space-2); border: 2px solid var(--ink); border-radius: var(--radius-sm); color: var(--ink); font-family: var(--font-display); font-weight: 800; font-size: 16px; line-height: 1; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.ht-tag--solid { background: var(--ink); color: var(--ground); }
.ht-tag--muted { border-color: var(--line-strong); color: var(--ink-muted); }
.ht-show { display: grid; grid-template-columns: var(--space-16) minmax(0, 1fr) auto; gap: var(--space-4); align-items: center; padding: var(--space-4) 0; border-bottom: 2px solid var(--ink); }
.ht-show:first-child { border-top: 2px solid var(--ink); }
.ht-show__date { display: flex; flex-direction: column; align-items: center; justify-content: center; box-sizing: border-box; width: var(--space-16); height: var(--space-16); border: 2px solid var(--ink); border-radius: var(--radius-full); background: var(--ink); color: var(--ground); font-family: var(--font-display); text-transform: uppercase; }
.ht-show--tonight .ht-show__date { background: var(--ember); border-color: var(--ember); color: var(--on-ember); }
.ht-show__date--tba { background: transparent; color: var(--ink); }
.ht-show__mon { font-weight: 800; font-size: 16px; line-height: 14px; letter-spacing: .04em; }
.ht-show__day { font-weight: 900; font-size: 30px; line-height: 26px; }
.ht-show__date--tba .ht-show__day { font-size: 24px; line-height: 22px; }
.ht-show__venue { margin: 0; font-family: var(--font-display); font-weight: 800; font-size: 24px; line-height: 1.1; letter-spacing: .02em; text-transform: uppercase; }
.ht-show__meta { margin: var(--space-1) 0 0; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.ht-show__act { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--space-3); align-items: center; }
.ht-poster { container-type: inline-size; display: grid; grid-template-rows: minmax(0, 1fr) auto; box-sizing: border-box; aspect-ratio: 4 / 5; overflow: hidden; border: 2px solid var(--ink); border-radius: var(--radius-none); background: var(--ground); color: var(--ink); }
.ht-poster--square { aspect-ratio: 1 / 1; }
.ht-poster--tabloid { aspect-ratio: 11 / 17; }
.ht-poster__top { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 6cqw 6cqw 5cqw; }
.ht-poster__mark { display: block; width: 22cqw; height: auto; }
.ht-poster--tabloid .ht-poster__mark { width: 32cqw; }
.ht-poster__where { margin-top: auto; }
.ht-poster__venue { margin: 0; font-family: var(--font-display); font-weight: 900; font-size: 12cqw; line-height: .88; text-transform: uppercase; }
.ht-poster__details { margin: 2cqw 0 0; font-weight: 500; font-size: 4cqw; line-height: 1.3; }
.ht-poster__bill { margin: 1.4cqw 0 0; font-family: var(--font-display); font-weight: 800; font-size: 4.6cqw; line-height: 1.1; letter-spacing: .02em; text-transform: uppercase; }
.ht-poster__base { position: relative; padding: 4.5cqw 6cqw; background: var(--ink); color: var(--ground); }
.ht-poster__name { margin: 0; font-family: var(--font-display); font-weight: 900; font-size: 25.6cqw; text-transform: uppercase; white-space: nowrap; }
.ht-poster__name span { display: block; line-height: .86; }
.ht-poster__name span:last-child { margin-top: 2.4cqw; }
.ht-poster__date { position: absolute; right: 6cqw; bottom: 5.36cqw; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 1em; height: 1em; font-size: 21.4cqw; border-radius: var(--radius-full); background: var(--ember); color: var(--on-ember); font-family: var(--font-display); text-transform: uppercase; }
.ht-poster__mon { font-weight: 800; font-size: .21em; line-height: 1; letter-spacing: .04em; }
.ht-poster__day { font-weight: 900; font-size: .56em; line-height: .86; }
.ht-poster__date--tba .ht-poster__day { font-size: .36em; }
.ht-setlist { box-sizing: border-box; width: 100%; max-width: 720px; padding: var(--space-6); border: 2px solid var(--ink); border-radius: var(--radius-none); background: var(--ground-raised); color: var(--ink); }
.ht-setlist__head { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--space-4); padding-bottom: var(--space-3); border-bottom: 2px solid var(--ink); font-size: 14px; line-height: 20px; }
.ht-setlist__set { font-family: var(--font-display); font-weight: 900; font-size: 40px; line-height: .86; text-transform: uppercase; }
.ht-setlist__list { list-style: none; margin: 0; padding: 0; counter-reset: ht-song; }
.ht-setlist__row { counter-increment: ht-song; display: grid; grid-template-columns: var(--space-8) minmax(0, 1fr) auto; gap: var(--space-4); align-items: baseline; padding: var(--space-1) 0; border-bottom: 1px solid var(--line); font-weight: 700; font-size: 30px; line-height: 40px; }
.ht-setlist__row::before { content: counter(ht-song); font-weight: 400; color: var(--ink-muted); font-variant-numeric: tabular-nums; }
.ht-setlist__cue { display: inline-block; margin-left: var(--space-3); padding: 0 var(--space-2); border: 2px solid var(--ink); font-size: 14px; line-height: 20px; vertical-align: middle; }
.ht-setlist__break { margin-top: var(--space-3); padding: var(--space-1) var(--space-2); background: var(--ink); color: var(--ground); font-weight: 700; font-size: 14px; line-height: 20px; }
.ht-stage .ht-on-paper { display: none !important; }
.ht-paper .ht-on-stage { display: none !important; }
.ht-page { background: var(--ground); color: var(--ink); font-family: var(--font-text); font-size: 16px; line-height: 24px; }
.ht-measure { width: 100%; max-width: 1296px; margin-inline: auto; padding-inline: clamp(24px, 3.4vw, 48px); }
.ht-page a:focus-visible, .ht-page button:focus-visible, .ht-page input:focus-visible,
.ht-page textarea:focus-visible, .ht-page select:focus-visible, .ht-page summary:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }
.ht-lockup { container-type: inline-size; position: relative; width: 100%; }
.ht-lockup__name { margin: 0; font-family: var(--font-display); font-weight: 900; font-size: min(25vw, 100px); font-size: 29.09cqw; text-transform: uppercase; white-space: nowrap; }
.ht-lockup__name span { display: block; line-height: .86; }
.ht-lockup__name span:last-child { margin-top: 2.73cqw; }
.ht-lockup__disc { position: absolute; right: 0; bottom: 0; bottom: .98cqw; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 1em; height: 1em; font-size: min(21vw, 84px); font-size: 24.32cqw; border-radius: var(--radius-full); background: var(--ember); color: var(--on-ember); font-family: var(--font-display); text-transform: uppercase; text-decoration: none; }
.ht-lockup__mon { font-weight: 800; font-size: .21em; line-height: 1; letter-spacing: .04em; }
.ht-lockup__day { font-weight: 900; font-size: .56em; line-height: .86; }
.ht-nav { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-6); }
.ht-nav a { display: inline-flex; align-items: center; min-height: 44px; color: var(--ink); font-family: var(--font-display); font-weight: 800; font-size: 20px; line-height: 1; letter-spacing: .04em; text-transform: uppercase; text-decoration: none; border-bottom: 2px solid var(--ground); }
.ht-nav a:hover, .ht-nav a[aria-current="page"] { border-bottom-color: var(--ink); }
.ht-label { display: block; margin-bottom: var(--space-2); font-weight: 700; font-size: 14px; line-height: 20px; color: var(--ink); }
.ht-field { display: block; width: 100%; min-height: var(--space-12); padding: calc(var(--space-3) - 2px) var(--space-4); border: 2px solid var(--ink); border-radius: var(--radius-sm); background: var(--ground-raised); color: var(--ink); font-family: var(--font-text); font-size: 16px; line-height: 24px; }
.ht-field::placeholder { color: var(--ink-muted); opacity: 1; }
textarea.ht-field { min-height: 144px; resize: vertical; }
.ht-table { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 20px; }
.ht-table th { padding: var(--space-3) var(--space-4) var(--space-3) 0; border-top: 2px solid var(--ink); border-bottom: 2px solid var(--ink); text-align: left; font-weight: 700; }
.ht-table td { padding: var(--space-3) var(--space-4) var(--space-3) 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.ht-table tr:last-child td { border-bottom: 2px solid var(--ink); }
.ht-num { text-align: right !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ht-scroll-x { overflow-x: auto; }
.ht-btn { height: auto; min-height: var(--space-12); }
.ht-btn--sm { min-height: calc(var(--space-12) - var(--space-3)); }
.ht-tag { height: auto; min-height: var(--space-6); padding-block: 2px; }
.ht-show { grid-template-columns: auto minmax(0, 1fr) auto; }
.ht-show__date { width: 4em; height: 4em; font-size: 16px; }
.ht-btn[aria-disabled="true"] { background: var(--ground-raised); border-color: var(--line-strong); color: var(--ink-muted); cursor: not-allowed; }
a { color: var(--ember-text); }
a:hover { color: var(--ink); }
.hp-header { container-type: inline-size; }
.hp-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: var(--space-4); row-gap: var(--space-1); padding-block: 10px; border-bottom: 2px solid var(--ink); }
.hp-head__logo { grid-column: 1; grid-row: 1; display: inline-flex; justify-self: start; min-width: 44px; color: var(--ink); font: 800 16px/1 var(--font-display); text-transform: uppercase; text-decoration: none; }
.hp-head__logo img { display: block; height: 68px; width: auto; }
.hp-head__tools { grid-column: 2; grid-row: 1; display: flex; align-items: center; gap: var(--space-4); }
.hp-head__nav { grid-column: 1 / -1; grid-row: 2; }
.ht-nav.hp-head__nav { flex-wrap: nowrap; }
@container (min-width: 1240px) {
.hp-head { grid-template-columns: calc((100% - var(--space-12)) / 3) minmax(0, 1fr) auto; column-gap: var(--space-12); }
.hp-head__nav { grid-column: 2; grid-row: 1; }
.hp-head__tools { grid-column: 3; }
}
@container (max-width: 1239.98px) {
.hp-head { padding-top: var(--space-2); padding-bottom: 0; row-gap: 0; }
.ht-nav.hp-head__nav a { min-height: var(--space-12); padding-bottom: var(--space-1); }
}
@container (max-width: 480px) {
.ht-nav.hp-head__nav { justify-content: flex-start; gap: 0 var(--space-4); }
.ht-nav.hp-head__nav a { min-width: 44px; font-size: 18px; }
}
@container (max-width: 379.98px) {
.hp-wide { position: absolute; width: 1px; height: 1px; margin: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ht-nav.hp-head__nav { gap: 0 var(--space-2); }
}
@container (max-width: 339.98px) {
.ht-nav.hp-head__nav { gap: 0 2px; }
.ht-nav.hp-head__nav a { justify-content: center; padding-inline: 3px; font-size: 16px; }
.ht-nav.hp-head__nav a:first-child { justify-content: flex-start; padding-left: 0; }
.hp-head { padding-top: var(--space-4); row-gap: var(--space-1); }
.hp-head__logo img { height: 48px; }
.hp-head__tools { gap: var(--space-2); }
}
.hp-theme { display: none; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; font-size: 14px; line-height: 20px; }
.hp-js .hp-theme { display: inline-flex; }
.hp-skip { position: absolute; left: -9999px; top: 0; }
.hp-skip:focus { position: static; align-self: flex-start; display: inline-flex; align-items: center; min-height: 44px; margin-left: calc(max(0px, (100% - 1296px) / 2) + clamp(24px, 3.4vw, 48px) - var(--space-2)); padding-inline: var(--space-2); }
.ht-page .hp-skip:focus-visible { outline-offset: -3px; }
#main:focus { outline: 0; }
.hp-link { color: var(--ink); font-weight: 700; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.hp-link:hover { background-color: var(--ink); color: var(--ground); }
button.hp-link { padding: 0; border: 0; border-radius: 0; background-color: var(--ground); font-family: var(--font-text); text-align: left; cursor: pointer; }
button.hp-link:hover { background-color: var(--ink); }
.hp-tap { display: inline-flex; align-items: center; min-height: 44px; }
.hp-link--small { font-size: 14px; line-height: 20px; }
.hp-link--tight, button.hp-link--tight { padding-block: 6px; background-clip: content-box; }
.hp-tight-row { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--space-4); margin-block: -10px; }
.hp-link--cell { display: inline-flex; align-items: center; min-height: 44px; margin-block: calc(var(--space-3) * -1); padding-block: var(--space-3); background-clip: content-box; }
.ht-page .hp-link--tight:focus-visible, .ht-page .hp-link--cell:focus-visible { margin-inline: calc(var(--space-2) * -1); padding-inline: var(--space-2); outline-offset: -6px; }
.hp-ink { background: var(--ink); color: var(--ground); }
.hp-ink .hp-link { color: var(--ground); }
.hp-ink .hp-link:hover { background-color: var(--ground); color: var(--ink); }
.hp-ink button.hp-link { background-color: var(--ink); }
.hp-ink button.hp-link:hover { background-color: var(--ground); }
.hp-ink .ht-nav a { color: var(--ground); border-bottom-color: var(--ink); }
.hp-ink .ht-nav a:hover, .hp-ink .ht-nav a[aria-current="page"] { color: var(--ground); border-bottom-color: var(--ground); }
.ht-page .hp-ink a:focus-visible, .ht-page .hp-ink button:focus-visible { outline-color: var(--ground); }
.hp-shows { width: 100%; border-top: 2px solid var(--ink); }
.hp-shows .ht-show, .hp-shows .ht-show:first-child { border-top: 0; }
@media (max-width: 560px) {
.hp-shows .ht-show { grid-template-columns: auto minmax(0, 1fr); align-items: start; }
.hp-shows .ht-show__act { grid-column: 2; justify-content: flex-start; }
}
.hp-bw .hp-photo { filter: grayscale(1) contrast(1.12); }
.hp-foot { padding-block: var(--space-12); }
.hp-foot__about { display: flex; flex-direction: column; gap: var(--space-1); }
.hp-foot__lists { display: flex; flex-direction: column; gap: var(--space-4); }
.hp-foot__row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0; }
.hp-foot__label { flex: 0 0 8rem; font-weight: 700; font-size: 14px; line-height: 20px; }
.hp-foot__links { flex: 1 1 285px; min-width: 0; }
.ht-nav.hp-foot__links { gap: 0 var(--space-6); }
.hp-foot__pair { display: flex; flex-wrap: nowrap; align-items: center; gap: inherit; }
.hp-foot__members { flex: 1 1 285px; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--space-4); }
@media (max-width: 339.98px) {
.ht-nav.hp-foot__links { gap: 0 var(--space-4); }
}
.hp-cq { container-type: inline-size; }
.hp-cols { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--space-4) var(--space-12); }
.hp-cols--gap-0 { row-gap: 0; }
.hp-cols--gap-2 { row-gap: var(--space-2); }
.hp-cols--gap-3 { row-gap: var(--space-3); }
.hp-cols--gap-8 { row-gap: var(--space-8); }
.hp-cols--stretch { align-items: stretch; }
.hp-cols--baseline { align-items: baseline; }
.hp-cols--last-baseline { align-items: last baseline; }
.hp-cols--center { align-items: center; }
.hp-cols--reverse { flex-direction: row-reverse; }
.hp-col-label { flex: 4 1 280px; min-width: 0; }
.hp-col-content { flex: 8 1 560px; min-width: 0; }
.hp-section { padding-bottom: var(--section-pad); }
.hp-section--top { padding-top: var(--section-pad); }
.hp-pagehead { padding-top: var(--space-6); }
.hp-rule { padding-top: var(--space-4); border-top: 2px solid var(--ink); }
.hp-ink .hp-rule { border-top-color: var(--ground); }
@container (max-width: 887.98px) {
.hp-rule--wide { padding-top: 0; border-top: 0; }
.hp-drop-rule { border-top: 0 !important; }
}
.hp-stack { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.hp-stack--fill { align-items: stretch; }
.hp-gap-1 { gap: var(--space-1); }
.hp-gap-2 { gap: var(--space-2); }
.hp-gap-3 { gap: var(--space-3); }
.hp-gap-4 { gap: var(--space-4); }
.hp-gap-6 { gap: var(--space-6); }
.hp-gap-8 { gap: var(--space-8); }
.hp-gap-12 { gap: var(--space-12); }
.hp-links { display: flex; flex-wrap: wrap; gap: 0 var(--space-6); }
.hp-acts { display: flex; flex-wrap: wrap; gap: var(--space-3); }
@media (max-width: 359.98px) { .pg-notsent .hp-links { flex-direction: column; align-items: flex-start; } }
.hp-h1 { font-family: var(--font-display); font-weight: 900; font-size: clamp(44px, 12vw, 64px); line-height: .92; text-transform: uppercase; }
.hp-h1--pull { margin-left: -.03em; }
.hp-title { font-family: var(--font-display); font-weight: 800; font-size: 40px; line-height: 1; text-transform: uppercase; text-wrap: balance; }
.hp-subhead { font-family: var(--font-display); font-weight: 800; font-size: 24px; line-height: 1.1; letter-spacing: .02em; text-transform: uppercase; }
.hp-lead { font-weight: 500; font-size: 20px; line-height: 30px; }
.hp-note { max-width: 20em; color: var(--ink-muted); }
.hp-small, .hp-cap { font-size: 14px; line-height: 20px; }
.hp-label { font-weight: 700; font-size: 14px; line-height: 20px; }
.hp-bold { font-weight: 700; }
.hp-muted { color: var(--ink-muted); }
.hp-nowrap { display: inline-block; max-width: 100%; }
.hp-block { display: block; }
.hp-balance { text-wrap: balance; }
.hp-pretty { text-wrap: pretty; }
.hp-full { width: 100%; }
.hp-mw-18 { max-width: 18em; }
.hp-mw-20 { max-width: 20em; }
.hp-mw-22 { max-width: 22em; }
.hp-mw-24 { max-width: 24em; }
.hp-mw-28 { max-width: 28em; }
.hp-mw-30 { max-width: 30em; }
.hp-mw-34 { max-width: 34em; }
.hp-mw-38 { max-width: 38em; }
.hp-vh { position: absolute; width: 1px; height: 1px; margin: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.hp-plain { list-style: none; margin: 0; padding: 0; }
.hp-photo { display: block; width: 100%; height: auto; object-fit: cover; border: 0; }
.hp-fig { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.hp-frame { border-block: 2px solid var(--ink); }
@container (max-width: 601.98px) {
.hp-bleed { margin-inline: calc(-1 * var(--space-6)); }
}
.hp-p-100-50{object-position:100% 50%}
.hp-p-50-100{object-position:50% 100%}
.hp-p-50-44{object-position:50% 44%}
.hp-p-50-45{object-position:50% 45%}
.hp-p-50-50{object-position:50% 50%}
.hp-p-50-52{object-position:50% 52%}
.hp-p-50-56{object-position:50% 56%}
.hp-p-50-59{object-position:50% 59%}
.hp-p-50-60{object-position:50% 60%}
.hp-p-50-62{object-position:50% 62%}
.hp-p-50-78{object-position:50% 78%}
.hp-p-50-84{object-position:50% 84%}
.hp-p-50-85{object-position:50% 85%}
.hp-p-50-88{object-position:50% 88%}
.hp-p-50-90{object-position:50% 90%}
.hp-p-50-92{object-position:50% 92%}
.hp-p-53-50{object-position:53% 50%}
.hp-r-14x5{aspect-ratio:14 / 5}
.hp-r-16x9{aspect-ratio:16 / 9}
.hp-r-2000x1130{aspect-ratio:2000 / 1130}
.hp-r-2x1{aspect-ratio:2 / 1}
.hp-r-3x2{aspect-ratio:3 / 2}
.hp-r-4x3{aspect-ratio:4 / 3}
.hp-r-5x2{aspect-ratio:5 / 2}
.hp-r-9x4{aspect-ratio:9 / 4}
@container (min-width: 888px) {
.hp-wp-50-46{object-position:50% 46%}
.hp-wp-50-48{object-position:50% 48%}
.hp-wp-50-58{object-position:50% 58%}
.hp-wp-50-86{object-position:50% 86%}
.hp-wr-21x8{aspect-ratio:21 / 8}
}
.ht-table.hp-rows th, .ht-table.hp-facts th { border-top: 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.ht-table.hp-rows tr:last-child th, .ht-table.hp-facts tr:last-child th { border-bottom: 2px solid var(--ink); }
.ht-table.hp-rows--narrow th { width: 5rem; }
.ht-table.hp-facts { border-top: 2px solid var(--ink); }
.ht-table.hp-facts th { width: 8rem; }
.ht-table.hp-facts tr:first-child th, .ht-table.hp-facts tr:first-child td { padding-top: var(--space-4); }
@media (max-width: 560px) {
.ht-table.hp-facts, .ht-table.hp-facts tbody, .ht-table.hp-facts tr, .ht-table.hp-facts th, .ht-table.hp-facts td { display: block; }
.ht-table.hp-facts th, .ht-table.hp-facts tr:last-child th { width: auto; padding-bottom: 0; border-bottom: 0; }
.ht-table.hp-facts td, .ht-table.hp-facts tr:first-child td { padding-top: var(--space-1); padding-right: 0; }
}
.hp-places { width: 100%; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); column-gap: var(--space-12); overflow: hidden; border-top: 2px solid var(--ink); border-bottom: 2px solid var(--ink); }
.hp-places > li { display: flex; flex-direction: column; margin-bottom: -1px; padding-block: calc(var(--space-4) + var(--space-1)) var(--space-4); border-bottom: 1px solid var(--line); }
.hp-places__name { font-weight: 700; }
.hp-places__city { color: var(--ink-muted); font-size: 14px; line-height: 20px; }
.hp-places__label { padding-block: var(--space-4) var(--space-3); border-top: 2px solid var(--ink); }
.hp-fields { width: 100%; display: flex; flex-wrap: wrap; gap: var(--space-6); }
.hp-field { flex: 1 1 260px; min-width: 0; }
.hp-field--full { flex: 1 1 100%; grid-column: 1 / -1; }
.hp-fields--grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); }
.hp-error { margin-top: var(--space-2); font-weight: 700; font-size: 14px; line-height: 20px; }
.hp-form__alert { font-weight: 700; font-size: 14px; line-height: 20px; }
.hp-form__alert:not(:empty) { margin-bottom: var(--space-3); }
.hp-sent:focus, .hp-sent [tabindex="-1"]:focus { outline: 0; }
.hp-sent__title { font-weight: 700; font-size: 16px; line-height: 24px; }
.hp-hint { margin-top: var(--space-2); font-size: 14px; line-height: 20px; color: var(--ink-muted); text-wrap: balance; }
.hp-trap { position: absolute; width: 1px; height: 1px; margin: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; visibility: hidden; }
.hp-none { width: 100%; padding-bottom: var(--space-2); }
.hp-signup { max-width: 560px; }
.hp-signup__row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-3); }
.hp-signup__field { flex: 1 1 260px; min-width: 0; }
.hp-signup .hp-error { margin-top: 0; text-wrap: balance; }
.hp-signup .hp-error:not(:empty) { padding-top: var(--space-2); }
.hp-signup .hp-hint { margin-top: var(--space-3); text-wrap: balance; }
.hp-signup .hp-hint .hp-link { position: relative; display: inline-block; }
.hp-signup .hp-hint .hp-link::after { content: ""; position: absolute; inset: calc(-1 * var(--space-3)) 0; }
.ht-page .hp-signup .hp-hint .hp-link:focus-visible, .ht-page.pg-listsent .hp-small .hp-link:focus-visible { outline-offset: 0; }
.ht-field[aria-invalid="true"] { border-color: var(--ink); }
.ht-field:-webkit-autofill { -webkit-text-fill-color: var(--ink); caret-color: var(--ink); box-shadow: 0 0 0 100px var(--ground-raised) inset; }
.ht-field:autofill { -webkit-text-fill-color: var(--ink); caret-color: var(--ink); box-shadow: 0 0 0 100px var(--ground-raised) inset; }
.pg-home .hp-head { border-bottom: 0; }
.hm-name .ht-lockup__name { font-size: min(25vw, 100px); font-size: 29.86cqw; margin-left: -1.2cqw; }
.hm-filmbox { position: relative; }
.hm-film { height: clamp(220px, 28vw, 620px); border-top: 2px solid var(--ink); }
.hm-film__video { position: absolute; left: 0; top: 0; }
@media (max-width: 600px) { .hm-film { height: max(220px, calc(56.25vw + 2px)); } }
@container (min-width: 558px) { .hm-name { max-width: calc(100% * 2 / 3 - 32px); } }
@media (min-width: 1257px) and (max-height: 1009.98px) { .hm-film { height: min(28vw, 540px); } }
@media (min-width: 1257px) and (max-height: 929.98px) { .hm-film { height: min(28vw, 480px); } }
@media (min-width: 1257px) and (max-height: 869.98px) { .hm-film { height: min(28vw, 420px); } }
@media (min-width: 1240px) and (max-height: 809.98px) { .hm-name { max-width: 456px; } }
@media (min-width: 1257px) and (max-height: 779.98px) { .hm-film { height: min(28vw, 400px); } }
@media (min-width: 1257px) and (max-height: 749.98px) { .hm-film { height: min(28vw, 370px); } }
@media (min-width: 1257px) and (max-height: 719.98px) { .hm-film { height: min(28vw, 340px); } }
@media (min-width: 1257px) and (max-height: 689.98px) { .hm-film { height: min(28vw, 320px); } }
@media (min-width: 1257px) and (max-height: 659.98px) { .hm-film { height: 290px; } }
@media (min-width: 1257px) and (max-height: 629.98px) { .hm-film { height: 260px; } }
@media (min-width: 1257px) and (max-height: 599.98px) { .hm-film { height: 230px; } }
@media (min-width: 1257px) and (max-height: 569.98px) { .hm-film { height: 220px; } }
@media (min-width: 953px) and (max-width: 1256.98px) and (max-height: 799.98px) { .hm-film { height: min(28vw, 260px); } }
@media (min-width: 953px) and (max-width: 1256.98px) and (max-height: 679.98px) { .hm-film { height: 220px; } }
@media (min-width: 953px) { .hm-film { object-position: 50% max(calc(100% + 6.8vw), -17vw); } }
.hm-card { padding-block: var(--space-6) var(--space-4); overflow: hidden; }
.hm-card__row { display: flex; flex-wrap: wrap; align-items: stretch; gap: var(--space-4) var(--space-12); }
.hm-lede { flex: 4 1 280px; min-width: 0; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; gap: var(--space-2); }
.hm-film-ctl { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--space-6); }
.hm-cap { min-width: 0; display: flex; flex-direction: column; }
.hm-lede__text { margin: auto 0 0; }
.hm-namebox { flex: 8 1 560px; min-width: 0; display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-end; gap: var(--space-4) var(--space-12); }
.hm-name { flex: 8 1 340px; min-width: 0; }
@container (min-width: 1104px) { .hm-name { align-self: flex-start; } }
.hm-next { flex: 4 1 170px; min-width: 0; align-self: stretch; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-4); }
.hm-next__words { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-1); margin: auto 0 1px; }
.hm-next__venue { font-weight: 700; line-height: 24px; }
.hm-next__facts { font-size: 14px; line-height: 22px; }
.hm-next__disc { flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 1em; height: 1em; order: -1; font-size: 96px; font-size: clamp(84px, 8.5cqw, 104px); border-radius: var(--radius-full); background: var(--ember); color: var(--on-ember); font-family: var(--font-display); text-transform: uppercase; text-decoration: none; }
.hm-next__disc .ht-lockup__mon { font-size: max(16px, .21em); }
.hm-next__disc:hover { background: var(--ground); color: var(--ink); }
@media (min-width: 1240px) and (max-height: 689.98px) {
.hm-card { padding-top: var(--space-4); }
.hm-film-ctl .hp-link:focus-visible { margin-inline: -5px; padding-inline: 5px; background-clip: content-box; outline-offset: -3px; }
}
@container (min-width: 888px) {
.hm-lede { order: 2; position: relative; left: min(0px, (100cqw - 936px) / 3); }
.hm-film-ctl { margin-top: -15px; margin-bottom: calc(var(--space-2) * -1); }
.hm-film-ctl, .hm-cap, .hm-lede__text { min-width: 296px; }
.hm-cap { margin-bottom: var(--space-2); }
}
@container (max-width: 887.98px) {
.hm-lede { display: contents; }
.hm-lede > p { flex: 0 0 100%; order: 1; }
.hm-lede > .hm-cap { flex: 0 0 100%; order: 2; }
.hm-film-ctl { flex: 0 0 100%; margin-top: calc(var(--space-4) * -1); }
.hm-next__facts { line-height: 20px; }
.hm-next { gap: var(--space-3); }
.hm-next__disc { font-size: clamp(60px, 14.2cqw - 20px, 84px); }
}
@container (min-width: 558px) and (max-width: 887.98px) {
.hm-next { justify-content: flex-end; }
.hm-next__words { margin-top: 0; }
}
@container (min-width: 558px) and (max-width: 589.98px) { .hm-next__facts { line-height: 18px; } }
@container (max-width: 557.98px) {
.hm-next { flex-direction: row; align-items: center; gap: var(--space-4); }
.hm-next__words { margin: 0; }
.hm-next__disc { font-size: 88px; }
}
.hm-rule-tight { padding-top: calc(var(--space-4) - 2px); }
section:has([data-show-none]:not([hidden])) #hm-shows-title + .hp-note { display: none; }
.ht-table.hm-facts tr:first-child th { padding-top: calc(var(--space-4) - 2px); }
@media (min-width: 560.02px) {
.ht-table.hm-facts tr:first-child td { padding-top: calc(var(--space-4) - 2px); }
}
@container (min-width: 592px) {
.hm-players { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(4, auto); grid-auto-flow: column; gap: var(--space-2) var(--space-12); }
}
@media (max-width: 423.98px) {
.hm-acts { flex-direction: column; align-items: stretch; }
.hm-acts .ht-btn { width: 100%; }
}
.hm-band { display: flex; flex-wrap: wrap; gap: 2px; background: var(--ink); border-block: 2px solid var(--ink); }
.hm-band__lead { flex: 2 1 400px; width: auto; min-width: 0; min-height: 0; height: clamp(220px, 28vw, 620px); }
.hm-band__side { flex: 1 1 200px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.hm-band__side .hp-photo { flex: 0 0 auto; min-width: 0; min-height: 0; height: calc(clamp(220px, 28vw, 620px) / 2 - 1px); }
@container (max-width: 1239.98px) {
.hm-band__lead { height: auto; aspect-ratio: 16 / 9; }
.hm-band__side .hp-photo { height: auto; aspect-ratio: 16 / 9; }
}
@container (max-width: 601.98px) {
.hm-band__lead { aspect-ratio: 1 / 1; }
.hm-band__side .hp-photo { aspect-ratio: 2000 / 1017; }
}
.hm-band__words { padding-top: var(--space-4); }
.hm-band__caps { margin-top: -3px; }
.sh-head { padding-bottom: var(--space-12); }
.sh-head__label { padding-top: var(--space-6); }
@container (min-width: 888px) {
.sh-list { border-top: 0; }
}
@container (min-width: 888px) {
.sh-none { padding-top: var(--space-6); }
}
.sh-head:has([data-show-none]:not([hidden])) .hp-lead { display: none; }
#sh-up-title:has(+ [data-show-list][hidden]) { display: none; }
.sh-fig { border-top: 2px solid var(--ink); }
@container (max-width: 432px) {
.sh-bleed { margin-inline: calc(-1 * var(--space-6)); }
}
.hp-bw .sh-lift { filter: grayscale(1) contrast(1.2) brightness(1.08); }
.sh-facts { border-top: 2px solid var(--ink); }
@container (min-width: 888px) {
.sh-facts .ht-table tr:first-child th, .sh-facts .ht-table tr:first-child td { padding-top: var(--space-4); }
}
.sh-map { margin-top: 0; }
.ab-wide { border-top: 2px solid var(--ink); }
.ab-wide__photo { height: clamp(280px, 50.85vw, 760px); }
.ab-wide__cap { padding-top: var(--space-3); }
.ab-players { padding-block: clamp(var(--space-8), 4vw, var(--space-12)); }
.ab-roster { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: var(--space-12); }
.ab-roster__list { min-width: 0; display: flex; flex-direction: column; border-bottom: 2px solid var(--ground); }
.ab-roster__list > li { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-1) var(--space-12); min-height: var(--space-16); padding-block: var(--space-4); border-top: 2px solid var(--ground); }
.ab-roster__name, .ab-roster__plays { flex: 1 1 280px; min-width: 0; }
.ab-roster__photo { width: 100%; }
@container (min-width: 608px) and (max-width: 887.98px) {
.ab-roster__photo { max-width: calc((100% - var(--space-12)) / 2); }
}
@container (min-width: 888px) {
.ab-roster { grid-template-columns: calc((100% - var(--space-12)) / 3) minmax(0, 1fr); grid-template-rows: calc(var(--space-16) * 2) 1fr; column-gap: var(--space-12); row-gap: 0; }
.ab-roster__list { grid-column: 2; grid-row: 1 / span 2; }
.ab-roster__list > li { flex-wrap: nowrap; }
.ab-roster__name { white-space: nowrap; }
.ab-roster__photo { grid-column: 1; grid-row: 2; align-self: start; }
.ab-roster__photo .hp-photo { height: calc(var(--space-16) * 3); }
}
@container (min-width: 1050px) {
.ab-roster__photo .hp-photo { height: calc(var(--space-16) * 4); }
}
.hp-bw .ab-roster__photo .hp-photo { filter: grayscale(1) contrast(1.05) brightness(1.12); }
.ab-drums { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6) var(--space-12); container-type: inline-size; }
.ab-drums__words { order: -1; }
.hp-bw .ab-drums__photo .hp-photo { filter: grayscale(1) contrast(1.05) brightness(1.15); }
.ab-drums__photo { position: relative; }
.ab-drums__switch { align-self: flex-start; cursor: pointer; }
.ab-drums__to-bw { display: none; }
.ab-drums__photo .ab-drums__color:checked ~ picture .hp-photo { filter: none; }
.ab-drums__color:checked ~ .ab-drums__switch .ab-drums__to-color { display: none; }
.ab-drums__color:checked ~ .ab-drums__switch .ab-drums__to-bw { display: inline; }
.ab-drums__color:focus-visible ~ .ab-drums__switch { outline: 3px solid var(--ink); outline-offset: 2px; }
@container (min-width: 600px) {
.ab-drums { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.ab-drums__words { order: 0; }
}
.ph-head { padding-bottom: var(--space-8); }
.ph-place { padding-bottom: var(--space-16); }
.ph-place--tap { padding-bottom: calc(var(--space-16) - var(--space-2)); }
.ph-under { padding-top: var(--space-6); }
.ph-switch { display: none; min-height: 44px; }
.hp-js .ph-switch { display: flex; }
.ph-switch__bw { display: none; }
.hp-color .ph-switch__color { display: none; }
.hp-color .ph-switch__bw { display: inline; }
.ph-leadbox { height: clamp(340px, 46vw, 760px); overflow: hidden; }
.ph-lead { width: max(100%, 760px); max-width: none; height: 100%; margin-left: min(0px, calc((100% - 760px) / 2)); }
.ph-strip { height: clamp(180px, 25vw, 440px); }
@container (max-width: 887.98px) {
.ph-last { order: 1; }
.ph-last:has(> .hp-tap) { margin-bottom: calc(-1 * var(--space-2)); }
}
.ph-pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-6) 0; }
.ph-seam { border-left: 2px solid var(--ink); }
.ph-seam-cap { padding-left: 2px; }
.ht-paper .ph-seam--club { border-left-color: var(--ground); }
.ht-stage .ph-seam:not(.ph-seam--club) { border-left-color: var(--ground); }
@container (max-width: 601.98px) {
.ph-pair { grid-template-columns: minmax(0, 1fr); }
.ph-seam { border-left: 0; }
.ph-seam-cap { padding-left: 0; }
}
.hp-bw .ph-lift { filter: sepia(1) grayscale(1) brightness(1.7) contrast(1.1); }
.hp-bw .ph-room { filter: grayscale(1) contrast(1.2) brightness(1.2); }
.ph-book-text { padding-top: var(--space-1); }
.vp-feature { padding-top: var(--space-6); }
.vp-title { margin-top: -3px; }
@container (max-width: 887.98px) {
.vp-photo { order: -1; }
}
.vp-frame { position: relative; aspect-ratio: 16 / 9; overflow: hidden; }
.vp-still { display: block; }
.vp-player { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 0; }
.vp-zoom { transform: scale(1.6); transform-origin: 41% 83%; }
.bk-head { padding-bottom: var(--space-8); }
.bk-next { padding-bottom: var(--space-12); }
.bk-strip { background: var(--ink); }
.bk-strip--clip { overflow: hidden; }
@media (max-width: 600px) {
.bk-lead { width: 170%; max-width: none; margin-left: -35%; aspect-ratio: 34 / 15; object-position: 50% 90%; }
}
.bk-cap { padding-block: var(--space-3); }
.bk-room { min-height: 220px; }
.bk-roomcap { padding-top: var(--space-3); }
.bk-acts { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-6); }
.bk-pair { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); align-items: baseline; gap: 0 var(--space-6); }
.bk-pair--facts { width: 100%; align-items: start; gap: var(--space-4) var(--space-6); }
.bk-player { padding-left: 1em; text-indent: -1em; }
@media (max-width: 600px) {
.ht-table.bk-facts, .ht-table.bk-facts tbody, .ht-table.bk-facts tr, .ht-table.bk-facts th, .ht-table.bk-facts td { display: block; }
.ht-table.bk-facts th, .ht-table.bk-facts tr:last-child th { width: auto; padding-right: 0; padding-bottom: 0; border-bottom: 0; }
.ht-table.bk-facts td, .ht-table.bk-facts tr:first-child td { padding-top: var(--space-1); padding-right: 0; }
.ht-table.bk-facts tr:last-child td { padding-bottom: 0; border-bottom: 0; }
}
@container (max-width: 887.98px) {
.ht-table.bk-facts tr:last-child th, .ht-table.bk-facts tr:last-child td { padding-bottom: 0; border-bottom: 0; }
}
.bk-mail { position: relative; display: inline-block; }
.bk-mail::after { content: ""; position: absolute; inset: calc(-1 * var(--space-3)) 0; }
textarea.bk-about { resize: none; }
#bk-date-error:not([hidden]) + .hp-hint { display: none; }
.ct-head { padding-bottom: var(--space-6); }
textarea.ct-message { min-height: 192px; resize: none; }
.ct-word { min-width: 44px; }