:root{--paper:#f5f2e9;--ink:#252b25;--muted:#62675e;--accent:#8a462f;--line:#d6d6c9}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.7 Arial,sans-serif}a{color:inherit;text-underline-offset:5px}a:hover{color:var(--accent)}a:focus-visible{outline:3px solid var(--accent);outline-offset:6px}header,footer,main{max-width:1320px;margin:auto}header{display:flex;align-items:center;justify-content:space-between;padding:28px 56px;border-bottom:1px solid var(--line)}.wordmark{font:bold 32px Georgia,serif;letter-spacing:-1.5px;text-decoration:none}.wordmark span{color:var(--accent)}nav{display:flex;gap:32px}nav a{text-decoration:none;font-size:14px}.intro{position:relative;padding:80px 56px 64px;max-width:1100px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:600;text-decoration:none;color:var(--muted)}h1,h2{font-family:Georgia,serif;font-weight:400;line-height:1.08;letter-spacing:-2px}h1{font-size:clamp(46px,6.4vw,84px);margin:22px 0 26px}h1 em{color:var(--accent);font-weight:400}.lede{max-width:500px;color:var(--muted);font-size:18px;line-height:1.7}.text-link{display:inline-block;font-size:13px;margin-top:16px;text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:7px}.text-link span{margin-left:36px}.intro-number{position:absolute;right:0;bottom:66px;color:var(--muted);font-size:11px;letter-spacing:2px}.artists{padding:0 56px 90px;display:grid;grid-template-columns:1fr 1fr;gap:42px}.artist{text-decoration:none}.portrait{height:390px;overflow:hidden;background:#d4d1c6}.portrait img{width:100%;height:100%;object-fit:cover;object-position:center 38%;transition:transform .4s;filter:saturate(.8)}.artist:hover img{transform:scale(1.025)}.artist-meta{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.7px;margin:22px 0 12px}.artist h2{font-size:40px;letter-spacing:-1px;margin:0 0 14px}.artist p{color:var(--muted);max-width:410px;margin:0}.together{background:#e6e7dc;padding:58px 56px 64px;border-top:1px solid var(--line)}.together h2{font-size:54px;margin:20px 0}.together p{max-width:470px;color:var(--muted)}.pill{display:inline-flex;gap:40px;padding:13px 24px;background:var(--ink);color:var(--paper);text-decoration:none;font-size:13px;margin-top:16px}.pill:hover{background:var(--accent);color:white}footer{display:flex;align-items:center;justify-content:space-between;padding:42px 56px;gap:25px}footer p{font-size:12px;color:var(--muted)}footer nav{gap:20px}.page{padding:58px 56px 70px;min-height:65vh}.page-heading{border-bottom:1px solid var(--line);margin-bottom:36px;padding-bottom:16px}.page h1{font-size:64px}.content{max-width:860px;margin:auto}.content p{margin:28px 0 18px}.content img{max-width:100%;height:auto;display:block;margin:auto}.content figure{margin:28px 0}.content figcaption{font-size:13px;color:var(--muted);margin-top:10px}.content iframe{width:100%;border:0;display:block;aspect-ratio:16/9;height:auto;background:#e6e7dc}.content iframe[src*="soundcloud"]{aspect-ratio:auto;height:300px}.content blockquote{margin:30px 0;border-left:2px solid var(--accent);padding-left:24px}.content h2{font-size:42px;margin-top:52px}.legacy-nav{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:40px}.legacy-nav a{display:block;border:1px solid var(--line);padding:8px 18px;text-decoration:none;font-size:13px}.legacy-nav a:hover{background:var(--ink);color:var(--paper)}.skip{position:absolute;top:-100px}.skip:focus{top:5px;left:5px;background:white;padding:12px;z-index:5}@media(max-width:700px){header{padding:22px 24px}nav{gap:20px}.intro{padding:48px 24px}.intro-number{display:none}.artists{padding:0 24px 52px;grid-template-columns:1fr;gap:44px}.portrait{height:340px}.artist h2{font-size:36px}.together{padding:40px 24px}.together h2{font-size:42px}footer{padding:32px 24px;align-items:flex-start;flex-wrap:wrap}footer p{display:none}footer nav{flex-wrap:wrap;gap:16px}.page{padding:40px 24px}.page h1{font-size:46px}.content iframe[src*="soundcloud"]{height:230px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.portrait img{transition:none}}
/* Consistent media and touch-friendly layouts across screen sizes. */
.content,.content>div,.artist{min-width:0}.content{overflow-wrap:anywhere}.content iframe{max-width:100%}.content .twitter-tweet{width:100%!important;max-width:550px;margin:28px auto!important}.content .twitter-tweet iframe{aspect-ratio:auto;background:transparent}.music-collection{max-width:720px;margin:auto}.content .recording{padding:28px 0 36px;border-bottom:1px solid var(--line)}.content .recording-title{font:400 25px/1.4 Georgia,serif;letter-spacing:-.3px;margin:0 0 20px}.content .recording figure{margin:0}.recording img{width:100%;max-height:420px;object-fit:contain;background:#e6e7dc}.recording iframe[src*="soundcloud"]{height:auto;aspect-ratio:16/9}.legacy-nav a,header nav a,footer nav a{min-height:44px;display:inline-flex;align-items:center}.legacy-nav{gap:8px}footer{border-top:1px solid var(--line)}
@media(min-width:701px) and (max-width:1024px){header{padding:24px 32px}.intro{padding:56px 32px}.intro-number{right:32px}.artists{padding:0 32px 64px;gap:28px}.portrait{height:320px}.artist h2{font-size:32px}.page{padding:48px 32px}.page h1{font-size:56px}footer{padding:32px;flex-wrap:wrap}}
@media(max-width:700px){.content .recording{padding:20px 0 28px}.content .recording-title{font-size:23px}.content .recording iframe[src*="soundcloud"]{height:230px;aspect-ratio:auto}.page-heading{margin-bottom:24px}.legacy-nav{margin-bottom:24px}.portrait{height:auto;aspect-ratio:4/3}.portrait img{aspect-ratio:4/3}.content h2{font-size:32px}}
@media(max-width:380px){header{padding:16px}.wordmark{font-size:28px}header nav{gap:14px}.intro,.page{padding-left:16px;padding-right:16px}.artists{padding-left:16px;padding-right:16px}h1{font-size:42px}.page h1{font-size:40px}.legacy-nav a{padding:8px 13px}footer{padding:24px 16px}}
/* The original keyboard artwork, set beside the opening quotation. */
.intro{max-width:none;isolation:isolate;overflow:hidden;margin-bottom:48px;min-height:520px;padding-top:72px;padding-bottom:64px}.intro h1{font-size:clamp(46px,5.5vw,74px);max-width:760px}.intro .lede{max-width:470px}.intro h1 em{white-space:nowrap}.piano-art{position:absolute;inset:0 0 0 43%;z-index:-1;background:linear-gradient(90deg,var(--paper),transparent 48%),linear-gradient(0deg,var(--paper),transparent 20%),url('/assets/2014/07/cropped-Piano-Background1.jpg') center bottom/cover no-repeat;opacity:.65}.intro>.eyebrow,.intro>h1,.intro>.lede,.intro>.text-link{position:relative}.intro .lede{background:linear-gradient(90deg,var(--paper) 70%,transparent)}
@media(max-width:1024px){.intro h1{font-size:clamp(46px,6.5vw,66px)}.piano-art{left:40%;opacity:.45}}
@media(max-width:700px){.intro{min-height:0;padding-top:42px;padding-bottom:170px;margin-bottom:32px}.intro h1{font-size:clamp(42px,8.5vw,58px)}.piano-art{inset:auto 0 0;height:150px;opacity:.65;background:linear-gradient(180deg,var(--paper),transparent 35%),linear-gradient(0deg,var(--paper),transparent 18%),url('/assets/2014/07/cropped-Piano-Background1.jpg') center 85%/cover no-repeat}.intro .lede{background:none}}
.home-link{font-size:14px;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}.music-note{display:inline-flex;align-items:baseline;white-space:nowrap;color:var(--accent);font-family:Georgia,'Times New Roman',serif;font-style:normal;font-weight:400;letter-spacing:0}.flat-sign{font-family:'Apple Symbols','Segoe UI Symbol','Noto Music','DejaVu Sans',serif;font-style:normal;font-size:.85em;line-height:1;margin-left:-.06em;position:relative;top:-.06em}footer{justify-content:space-between}footer p{margin:0}@media(max-width:700px){footer{justify-content:flex-end}}
/* Navigation styled like a small set of piano keys. */
header nav{gap:8px}header nav a,.home-link{padding:9px 20px;border:1px solid #c9c9ba;border-bottom:3px solid #b8b9aa;border-radius:7px;background:#fffdf6;color:var(--ink);font-size:13px;font-weight:600;letter-spacing:.2px;transition:background .18s,color .18s,transform .18s;min-height:46px}header nav a:hover,.home-link:hover{background:#e8e7db;transform:translateY(-2px)}header a[aria-current="page"]{background:var(--ink);color:var(--paper);border-color:var(--ink);border-bottom-color:#111810}.legacy-nav{padding:12px;background:#eae9df;border-radius:10px;gap:8px}.legacy-nav a{background:#fffdf6;border:1px solid #cecec0;border-bottom:3px solid #bebfb1;border-radius:6px;padding:10px 18px;font-weight:600;min-height:46px;transition:background .18s,color .18s}.legacy-nav a:hover{background:var(--accent);border-color:var(--accent);color:#fff}.legacy-nav a:active,header nav a:active,.home-link:active{transform:translateY(1px)}@media(max-width:700px){header{gap:12px}header nav{gap:6px}header nav a,.home-link{padding:9px 13px}.legacy-nav{padding:10px}.legacy-nav a{padding:9px 13px}}@media(max-width:380px){header{gap:8px}header nav{gap:5px}header nav a,.home-link{padding:9px 10px;font-size:12px}}@media(prefers-reduced-motion:reduce){header nav a,.home-link,.legacy-nav a{transition:none}}
