@font-face{font-family:"Syne Variable";src:url("/fonts/syne-latin-wght-normal.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap}
@font-face{font-family:Newsreader;src:url("/fonts/newsreader-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url("/fonts/ibm-plex-sans-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
:root{--brass:#f0b323;--bordeaux:#3b0d18;--cream:#f6ecd9;--blue:#1f4fd8;--vinyl:#170a0d;--display:"Syne Variable","Arial Black",system-ui,sans-serif;--serif:Newsreader,Georgia,"Times New Roman",serif;--ui:"IBM Plex Sans",system-ui,sans-serif;--pad:clamp(1.25rem,4.5vw,4.5rem);--top:4.25rem}
*{box-sizing:border-box}
html{background:var(--bordeaux);color:var(--bordeaux);scroll-behavior:smooth;scroll-padding-top:var(--top);-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--ui);font-size:1rem;line-height:1.5;background:var(--cream);overflow-x:clip}
::selection{background:var(--blue);color:var(--cream)}
a{color:inherit;text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
h1,h2,h3,p,ol,ul{margin:0}
ol,ul{padding:0;list-style:none}
.skip{position:absolute;left:1rem;top:1rem;transform:translateY(-300%);background:var(--bordeaux);color:var(--cream);padding:.7rem 1rem;z-index:20}
.skip:focus{transform:none}

.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:1.5rem;min-height:var(--top);padding:0 var(--pad);background:var(--brass);border-bottom:2px solid var(--bordeaux)}
.mark{font-family:var(--display);font-weight:800;font-size:1.25rem;letter-spacing:-.04em;text-decoration:none;white-space:nowrap;margin-right:auto;min-height:44px;display:inline-flex;align-items:center}
.top nav{display:flex;gap:clamp(1rem,2.5vw,2.25rem)}
.top nav a{text-decoration:none;font-size:.95rem;min-height:44px;display:inline-flex;align-items:center;border-bottom:2px solid transparent}
.top nav a:hover{border-bottom-color:var(--bordeaux)}
.book{background:var(--bordeaux);color:var(--cream);text-decoration:none;font-size:.95rem;padding:0 1.2rem;min-height:44px;display:inline-flex;align-items:center;border-radius:999px;white-space:nowrap}
.book:hover{background:var(--blue)}
.nav-toggle{display:none;width:44px;height:44px;border:2px solid var(--bordeaux);border-radius:50%;background:transparent;color:var(--bordeaux);cursor:pointer;position:relative;flex:none}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{content:"";display:block;width:18px;height:2px;background:currentColor;position:absolute;left:50%;transform:translateX(-50%);transition:transform .2s ease}
.nav-toggle span{top:50%;margin-top:-1px}
.nav-toggle span::before{top:-6px}
.nav-toggle span::after{top:6px}
.nav-toggle[aria-expanded="true"] span{background:transparent}
.nav-toggle[aria-expanded="true"] span::before{top:0;transform:translateX(-50%) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span::after{top:0;transform:translateX(-50%) rotate(-45deg)}

.btn{display:inline-flex;align-items:center;min-height:48px;padding:0 1.5rem;border:2px solid currentColor;border-radius:999px;text-decoration:none;font-size:1rem;transition:background-color .15s ease,color .15s ease}
.btn:hover{background:var(--bordeaux);color:var(--cream);border-color:var(--bordeaux)}
.btn.solid{background:var(--bordeaux);color:var(--cream);border-color:var(--bordeaux)}
.btn.solid:hover{background:var(--blue);border-color:var(--blue)}
.actions{display:flex;flex-wrap:wrap;gap:.75rem}

.hero{position:relative;background:var(--brass);min-height:calc(100svh - var(--top));display:grid;align-content:end;padding:var(--pad);overflow:hidden;isolation:isolate}
.hero-copy{position:relative;z-index:2;max-width:min(100%,56vw)}
.hero h1{font-family:var(--display);font-weight:800;font-size:clamp(4.5rem,11.2vw,13.5rem);line-height:.8;letter-spacing:-.065em;margin-left:-.05em}
.lede{font-family:var(--serif);font-size:clamp(1.2rem,1.9vw,1.6rem);line-height:1.35;max-width:30ch;margin-top:clamp(1.5rem,3vw,2.5rem)}
.hero .actions{margin-top:1.75rem}
.record{position:absolute;z-index:1;top:50%;right:calc(min(88svh,58vw) * -.28);width:min(88svh,58vw);aspect-ratio:1;translate:0 -50%;animation:slide 1.4s cubic-bezier(.2,.8,.2,1) both}
.record svg{display:block;width:100%;height:100%;animation:spin 7s linear infinite;filter:drop-shadow(-18px 14px 0 rgba(59,13,24,.22))}
.is-stopped .record svg{animation-play-state:paused}
.vinyl{fill:var(--vinyl)}
.grooves circle{fill:none;stroke:var(--cream);stroke-opacity:.13;stroke-width:.7}
.sheen{fill:var(--cream);fill-opacity:.07}
.label{fill:var(--blue)}
.label-ring{fill:none;stroke:var(--cream);stroke-opacity:.55;stroke-width:.8}
.label-name{font-family:var(--display);font-weight:800;font-size:15px;letter-spacing:-.02em;fill:var(--cream)}
.label-sub{font-family:var(--ui);font-size:6.6px;letter-spacing:.06em;fill:var(--cream)}
.label-side{font-family:var(--display);font-weight:800;font-size:17px;fill:var(--brass)}
.label-rpm{font-family:var(--ui);font-size:9px;fill:var(--cream)}
.hole{fill:var(--brass)}
.spin-toggle{position:absolute;z-index:3;right:var(--pad);bottom:var(--pad);font:inherit;font-size:.85rem;color:var(--cream);background:var(--bordeaux);border:0;border-radius:999px;min-height:44px;padding:0 1.1rem;cursor:pointer}
.spin-toggle:hover{background:var(--blue)}
@keyframes spin{to{rotate:360deg}}
@keyframes slide{from{translate:55% -50%}}

.band{padding:clamp(3.5rem,8vw,7.5rem) var(--pad)}
.head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem 2rem;align-items:end;margin-bottom:clamp(1.5rem,3vw,2.75rem)}
.head h2,.page-head h1{font-family:var(--display);font-weight:800;font-size:clamp(2.75rem,7.4vw,7.5rem);line-height:.84;letter-spacing:-.06em;margin-left:-.04em}
.head p{font-family:var(--serif);font-size:1.2rem;line-height:1.4;max-width:34ch;justify-self:end;text-align:right}

.rows{border-top:2px solid currentColor}
.rows li{border-bottom:1px solid currentColor}
.rows li>a,.rows li>div{display:grid;grid-template-columns:4.5rem minmax(0,1.6fr) minmax(0,1fr) minmax(0,.7fr);gap:.25rem 1.5rem;align-items:baseline;padding:1.05rem .25rem 1.1rem;text-decoration:none;min-height:56px}
.rows .no{font-family:var(--display);font-weight:700;font-size:1rem;font-variant-numeric:tabular-nums}
.rows .t{font-family:var(--display);font-weight:700;font-size:clamp(1.3rem,2.4vw,2.1rem);line-height:1.05;letter-spacing:-.035em}
.rows .k{font-family:var(--serif);font-size:1.05rem}
.rows .src{font-size:.9rem;text-align:right;overflow-wrap:anywhere}
.rows li>a{transition:background-color .12s ease,color .12s ease,padding .12s ease}
.rows li>a:hover,.rows li>a:focus-visible{background:var(--bordeaux);color:var(--cream);padding-left:1rem;padding-right:1rem}
.links .rows li>a{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,.9fr)}
.links .rows .no{display:none}
.links .rows li>a:hover,.links .rows li>a:focus-visible{background:var(--blue)}
.more{margin-top:2rem}
.tracks.alt{background:var(--brass)}

.wall{background:var(--bordeaux);color:var(--cream)}
.wall-label{font-family:var(--serif);font-size:1.2rem;color:var(--brass);margin-bottom:.4rem}
.names{font-family:var(--display);font-weight:700;font-size:clamp(1.9rem,5.6vw,5.25rem);line-height:.98;letter-spacing:-.045em;max-width:22ch;text-wrap:balance}
.names+.wall-label{margin-top:clamp(2rem,4vw,3.5rem)}

.notes{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:2rem}
.notes .head{grid-column:1/-1}
.notes-body{grid-column:1/9;columns:2;column-gap:2.5rem;font-family:var(--serif);font-size:1.2rem;line-height:1.55}
.notes-body p{break-inside:avoid;margin-bottom:1.1em;max-width:38ch}
.notes-body p:first-child::first-letter{font-family:var(--display);font-weight:800;font-size:4.2em;line-height:.74;float:left;padding:.08em .08em 0 0;letter-spacing:-.05em;color:var(--blue)}
.crew{grid-column:10/-1;border-top:2px solid currentColor;padding-top:1rem;align-self:start}
.crew h3{font-family:var(--display);font-weight:800;font-size:1.5rem;letter-spacing:-.04em;line-height:1}
.crew h3:not(:first-child){margin-top:2rem}
.crew p{display:flex;flex-direction:column;margin-top:.6rem}
.crew a{min-height:40px;display:inline-flex;align-items:center}

.dates{background:var(--brass)}
.dates .rows li>div{grid-template-columns:4.5rem minmax(0,1.6fr) minmax(0,1fr) minmax(0,.7fr)}

.cta{background:var(--blue);color:var(--cream)}
.cta h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.3rem,2.2vw,1.8rem);line-height:1.3;max-width:26ch}
.mailto{display:inline-block;font-family:var(--display);font-weight:800;font-size:clamp(1.5rem,4.1vw,5.25rem);line-height:1;letter-spacing:-.055em;text-decoration:none;margin:clamp(1rem,2.5vw,2rem) 0;border-bottom:.06em solid currentColor;padding-bottom:.06em}
.mailto:hover{color:var(--brass)}
.cta .btn:hover{background:var(--cream);color:var(--blue);border-color:var(--cream)}

.page-head{background:var(--brass)}
.page-head .lede{margin:1.5rem 0 1.75rem}
.page-head .mailto{color:var(--bordeaux)}
.page-head .mailto:hover{color:var(--blue)}

.foot{background:var(--bordeaux);color:var(--cream);padding:clamp(3rem,6vw,5rem) var(--pad) 2rem;overflow:hidden}
.foot-mark{font-family:var(--display);font-weight:800;font-size:clamp(2rem,8.8vw,11rem);line-height:.8;letter-spacing:-.065em;color:var(--brass);white-space:nowrap;margin-left:-.05em}
.foot-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem 2rem;margin-top:clamp(2rem,4vw,3.5rem);border-top:1px solid var(--cream);padding-top:1.25rem}
.foot-cols p:last-child{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;justify-content:flex-end}
.foot-cols a{display:inline-flex;align-items:center;min-height:40px}
.fine{font-size:.85rem;opacity:.75;margin-top:2rem}

@media (max-width:900px){
.notes-body{grid-column:1/-1;columns:1}
.crew{grid-column:1/-1;margin-top:2rem}
.rows li>a,.rows li>div,.dates .rows li>div{grid-template-columns:3.25rem minmax(0,1fr) auto}
.rows .k{grid-column:2/3}
.rows .src{grid-column:3/4;grid-row:1/2}
.links .rows li>a{grid-template-columns:minmax(0,1fr) auto}
.links .rows .k{grid-column:1/2}
.links .rows .src{grid-column:2/3}
}
@media (max-width:767px){
:root{--top:3.75rem}
.top{gap:.6rem}
.nav-toggle{display:block;order:3}
.top nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;background:var(--brass);border-bottom:2px solid var(--bordeaux);padding:.25rem var(--pad) 1rem}
.top.is-open nav{display:flex}
.top nav a{font-family:var(--display);font-weight:800;font-size:2rem;letter-spacing:-.04em;min-height:56px;border-bottom:1px solid var(--bordeaux)}
.book{padding:0 .9rem;font-size:.85rem}
.hero{align-content:start;padding-top:2.5rem;min-height:calc(100svh - var(--top))}
.hero-copy{max-width:100%}
.hero h1{font-size:clamp(3rem,16.6vw,9rem)}
.mark{font-size:1.05rem}
.lede{max-width:24ch}
.record{top:auto;bottom:-26vw;right:-30vw;width:104vw;translate:none;animation-name:rise}
.spin-toggle{right:auto;left:var(--pad)}
.head{grid-template-columns:1fr}
.head p{justify-self:start;text-align:left}
.rows .src{display:none}
.links .rows .src{display:block;font-size:.8rem}
.rows li>a,.rows li>div,.dates .rows li>div{grid-template-columns:2.75rem minmax(0,1fr)}
.foot-cols{grid-template-columns:1fr}
.mailto{font-size:clamp(1.6rem,7.6vw,3.5rem)}
.foot-cols p:last-child{justify-content:flex-start}
}
@keyframes rise{from{translate:0 45%}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.record,.record svg{animation:none}.spin-toggle{display:none}*{transition:none!important}}