/* Music in Details — self-hosted design system. No frameworks or external fonts. */
:root{--ink:#172329;--muted:#59616a;--paper:#faf8f2;--white:#fffefa;--wine:#522744;--wine2:#71304a;--coral:#e77b5d;--lemon:#f1dba0;--border:#e7e1d6;--gray:#f1ede5;--wide:1160px;--radius:16px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;line-height:1.65}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}a:hover{color:#a73b57}a:focus-visible,button:focus-visible{outline:3px solid var(--coral);outline-offset:4px}
.shell{width:min(calc(100% - 44px),var(--wide));margin-inline:auto}.skip{position:absolute;left:-9999px;top:10px;z-index:20;background:#fff;padding:8px}.skip:focus{left:10px}
header.top{background:var(--ink);color:#fff;position:relative;z-index:4}.toprow{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:20px}.logo{display:flex;align-items:center;gap:12px;color:#fff!important}.logoicon{width:43px;height:43px;border:1px solid #836b77;border-radius:50%;display:grid;place-items:center;font-size:25px;color:var(--coral)}.logotext{font-family:Georgia,serif;font-size:25px;line-height:1.08;font-weight:700}.logosub{font:10px system-ui,sans-serif;display:block;letter-spacing:.17em;text-transform:uppercase;color:#c0b9b5;margin-top:6px}.nav{display:flex;align-items:center;gap:25px;flex-wrap:wrap}.nav a{font-size:13px;letter-spacing:.05em;text-transform:uppercase;color:#e5ddd9;font-weight:750}.nav a[aria-current='page'],.nav a:hover{color:var(--lemon)}.headernote{border-top:1px solid #ffffff24;color:#baacb5;font-size:11px;padding:9px 0;letter-spacing:.04em}
.eyebrow,.eyebrow a{font-size:12px;letter-spacing:.17em;font-weight:800;text-transform:uppercase;color:#a54961}.subnav{display:flex;gap:12px;flex-wrap:wrap;padding:16px 0 3px}.subnav a{border:1px solid var(--border);background:#fff;color:#51414a;border-radius:99px;font-size:13px;padding:7px 14px;font-weight:700}
.front{background:#281d29;color:#fff;position:relative;overflow:hidden}.front:before{content:'';position:absolute;width:590px;height:590px;right:-150px;top:-220px;background:radial-gradient(circle,#863b56a8,transparent 70%);pointer-events:none}.front .shell{position:relative}.frontgrid{display:grid;grid-template-columns:1.03fr .97fr;align-items:center;gap:44px;padding:70px 0 78px}.front .eyebrow{color:#f6c3a1}.front h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(49px,6.5vw,92px);line-height:.99;font-weight:500;letter-spacing:-.045em;max-width:780px;margin:22px 0 28px}.front h1 em{color:#f0bc85;font-weight:400}.frontlead{font-size:18px;color:#e2d6d9;max-width:650px;line-height:1.72}.herofig{aspect-ratio:5/4;min-height:290px;overflow:hidden;border-radius:180px 180px 16px 16px;position:relative;background:#71304a;box-shadow:26px 26px 0 #cf705a31}.herofig img{height:100%;width:100%;object-fit:cover;filter:saturate(.88) contrast(1.07)}.herofig:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 55%,#23151fb8)}.stamp{position:absolute;z-index:2;left:22px;bottom:24px;font-size:12px;text-transform:uppercase;letter-spacing:.15em;font-weight:700;color:#fff}.tagrow{display:flex;gap:10px;flex-wrap:wrap;margin-top:27px}.tagrow span{border:1px solid #ffffff4a;border-radius:50px;padding:6px 13px;color:#efe2dd;font-size:12px;font-weight:700}
.button{display:inline-flex;align-items:center;gap:10px;background:var(--coral);color:#231e24;border-radius:7px;padding:13px 19px;font-size:13px;text-transform:uppercase;letter-spacing:.06em;font-weight:900;margin-top:23px}.button:hover{background:var(--lemon);color:#231e24}.button:after{content:'↗';font-size:17px}
.section{padding:64px 0}.section.alt{background:#f2eee6}.sectiontitle{font-family:Georgia,serif;font-size:clamp(30px,4vw,50px);font-weight:500;line-height:1.16;letter-spacing:-.022em;margin:10px 0 26px}.headrow{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:12px}.alllink{font-size:13px;font-weight:750;border-bottom:1px solid #9d6b67;white-space:nowrap;margin-bottom:32px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.cardlink{display:block;background:var(--white);border:1px solid var(--border);border-radius:14px;overflow:hidden;box-shadow:0 2px 8px #342b210a;transition:transform .2s,box-shadow .2s}.cardlink:hover{transform:translateY(-4px);box-shadow:0 13px 25px #342b2115}.cardpic{aspect-ratio:1.5;position:relative;overflow:hidden;background:#51304c}.cardpic img{height:100%;width:100%;object-fit:cover;transition:transform .3s}.cardlink:hover img{transform:scale(1.035)}.cardcopy{padding:23px 23px 26px}.cardcopy small{font-size:11px;text-transform:uppercase;letter-spacing:.13em;font-weight:800;color:#a23e5f}.cardcopy h3{font:500 25px/1.18 Georgia,serif;letter-spacing:-.02em;margin:11px 0}.cardcopy p{font-size:14px;color:var(--muted);line-height:1.57;margin:0}.cardmore{display:inline-block;margin-top:17px;font-size:12px;letter-spacing:.07em;font-weight:800;text-transform:uppercase;color:#843950}
.introbanner{display:grid;grid-template-columns:1.3fr .7fr;gap:45px;padding:30px 0;border-block:1px solid var(--border);align-items:center}.introbanner blockquote{font:italic 29px/1.35 Georgia,serif;color:#48394a;margin:0}.introbanner p{margin:0;color:var(--muted);font-size:15px}
.breadcrumbs{padding:24px 0 17px;font-size:12px;color:#727179;display:flex;gap:9px;align-items:center;flex-wrap:wrap}.breadcrumbs a{text-decoration:underline;text-underline-offset:3px}.detailhero{display:grid;grid-template-columns:1.12fr .88fr;gap:58px;align-items:center;padding:39px 0 62px}.detailhero h1{font:500 clamp(42px,5vw,68px)/1.08 Georgia,serif;letter-spacing:-.035em;margin:16px 0 22px}.intro{font-size:19px;line-height:1.73;color:#504e52;margin:0}.cover{aspect-ratio:1.15;border-radius:15px;overflow:hidden;position:relative;background:#5a344e;box-shadow:16px 18px 0 #ddd6c8}.cover img{width:100%;height:100%;object-fit:cover}.cover .credit{position:absolute;bottom:14px;right:15px;background:#17181aca;color:#fff;padding:3px 9px;font-size:10px;border-radius:4px}.contentwrap{display:grid;grid-template-columns:minmax(0,730px) 1fr;gap:67px;align-items:start;padding:13px 0 85px}.article h2{font:500 clamp(28px,3vw,38px)/1.18 Georgia,serif;letter-spacing:-.02em;margin:54px 0 20px}.article p{font-size:17px;line-height:1.85;color:#35393b;margin:0 0 20px}.article section:first-of-type h2{margin-top:5px}.article a:not(.cardlink){color:#8b354d;text-decoration:underline;text-underline-offset:4px}.aside{border-top:4px solid #6d3850;padding-top:18px;position:sticky;top:20px}.aside h3{font:500 26px Georgia,serif;margin:0 0 20px}.aside a{display:block;border-bottom:1px solid var(--border);padding:13px 0;font-size:14px;font-weight:700;line-height:1.48}.aside .note{background:#ece6df;margin-top:25px;padding:21px;font-size:13px;color:#51434b;border-radius:9px;line-height:1.6}.sources{border-top:1px solid var(--border);padding-top:19px;margin-top:53px}.sources h2{font-size:25px;margin:0 0 15px}.sources ul{padding-left:20px;color:#555}.sources li{font-size:14px;margin-bottom:10px}.sources a{word-break:break-word}.creditlist{padding:20px;background:var(--gray);border-radius:9px;font-size:13px;color:#615963}.creditlist a{color:#82374e;text-decoration:underline}
footer{background:var(--ink);color:#cbd1cf;padding:46px 0 27px}.footgrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:50px}.footbrand{font:500 29px Georgia,serif;color:#fff;margin-bottom:12px}.footdesc{font-size:13px;max-width:440px;line-height:1.75}.footlinks a{display:block;font-size:13px;padding:3px 0;color:#d3d5d2}.foottitle{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#e6ae9b;font-weight:800;margin-bottom:14px}.footbase{border-top:1px solid #ffffff26;margin-top:36px;padding-top:17px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:11px;color:#b6bbba}
.pill{display:inline-block;background:#efe8df;border:1px solid #e4dbcc;border-radius:80px;font-size:11px;color:#79546a;font-weight:800;letter-spacing:.11em;text-transform:uppercase;padding:7px 13px}.timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}.timecard{border-top:3px solid #b45963;padding-top:13px}.timecard strong{font:500 32px Georgia,serif}.timecard span{display:block;color:#656268;font-size:13px;margin-top:7px}.listing{margin-top:20px}
@media(max-width:940px){.nav{gap:13px}.nav a{font-size:11px}.frontgrid{gap:22px}.detailhero{gap:28px}.contentwrap{grid-template-columns:minmax(0,1fr) 220px;gap:28px}.cards{gap:14px}.cardcopy{padding:17px}.cardcopy h3{font-size:22px}}
@media(max-width:700px){.shell{width:min(calc(100% - 30px),var(--wide))}.toprow{padding:18px 0;align-items:start;flex-wrap:wrap}.logo{margin-bottom:5px}.nav{width:100%;justify-content:space-between;gap:14px}.nav a{font-size:11px}.headernote{font-size:10px}.frontgrid{grid-template-columns:1fr;padding:50px 0 60px}.front h1{font-size:clamp(48px,12vw,73px)}.frontlead{font-size:16px}.herofig{width:min(90%,430px);justify-self:center;min-height:260px}.cards{grid-template-columns:1fr 1fr}.section{padding:44px 0}.headrow{align-items:start}.introbanner{grid-template-columns:1fr;gap:13px}.detailhero{grid-template-columns:1fr;padding:20px 0 37px}.detailhero h1{font-size:clamp(39px,9vw,60px)}.cover{aspect-ratio:1.55;box-shadow:7px 8px 0 #ddd6c8}.contentwrap{display:flex;flex-direction:column-reverse;gap:28px;padding:10px 0 52px}.aside{position:static;width:100%}.aside .note{display:none}.aside h3{font-size:22px}.article h2{margin:36px 0 14px}.article p{font-size:16px}.footgrid{grid-template-columns:1fr 1fr;gap:20px}.footgrid>div:first-child{grid-column:1/-1}}
@media(max-width:470px){.logotext{font-size:21px}.nav{overflow:auto;white-space:nowrap;justify-content:flex-start;padding-bottom:5px}.nav a{flex:0 0 auto}.cards{grid-template-columns:1fr}.cardpic{aspect-ratio:1.8}.headrow{display:block}.alllink{display:inline-block;margin-bottom:20px}.timeline{grid-template-columns:1fr}.front h1{font-size:46px}.introbanner blockquote{font-size:25px}.footgrid{grid-template-columns:1fr}.footgrid>div:first-child{grid-column:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cardlink,.cardpic img{transition:none}}

/* Table of contents and editorial contextual reading links */
.inpage{background:#f4eee7;border:1px solid var(--border);border-left:4px solid #a95b69;border-radius:12px;padding:20px 24px;margin-bottom:32px}.inpage-label{display:block;color:#74415a;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;margin-bottom:9px}.inpage ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px 20px}.inpage a{display:block;font-size:14px;line-height:1.55;padding:5px 0;text-decoration:none!important;color:#30333a!important;border-bottom:1px dashed #d4c9c4}.inpage a:hover{color:#8b354d!important}.article p.contextual{padding:16px 22px;margin:21px 0 29px;border-left:3px solid #a65b67;background:#fffdfa;border-radius:0 8px 8px 0;color:#394149}.article p.contextual a{font-weight:650;text-decoration:underline;text-underline-offset:3px}@media(max-width:570px){.inpage ul{grid-template-columns:1fr}.inpage{padding:16px 18px}.article p.contextual{padding:13px 16px}}
