:root{--ink:#0c0b0f;--paper:#f5f0e7;--accent:#c5a268;--muted:#b2aeb8}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--ink);color:var(--paper);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}a,button,input,select{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #e5c58e;outline-offset:6px}header{height:96px;padding:20px 4.5%;display:flex;align-items:center;justify-content:space-between;background:#0c0b0fee;position:absolute;z-index:3;width:100%;border-bottom:1px solid #ffffff20}.brand{font-size:24px;line-height:.83;font-weight:950;letter-spacing:-1.7px;display:inline-block}.brand>span{display:block}.dot{color:var(--accent);font-size:13px;vertical-align:middle;margin-left:5px}nav{display:flex;gap:35px;font-size:13px}nav a:hover,.text-link:hover{color:var(--accent)}.header-note,.eyebrow,.hero-bottom,.ticker,.results,.archive-note,footer,.year{font-family:'Courier New',monospace;font-size:11px;letter-spacing:1.4px}.header-note{color:var(--muted)}.hero{height: min(940px,100svh);min-height:740px;position:relative;isolation:isolate;overflow:hidden}.hero-photo{position:absolute;height:100%;width:76%;right:0;object-fit:cover;object-position:50% 35%;z-index:-3}.hero-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#100b11 1%,#17130fd9 26%,#0b081138 63%,#0b081108),linear-gradient(0deg,#0c0b0f,transparent 32%),linear-gradient(120deg,#a8803520,transparent 60%)}.hero-copy{position:absolute;left:7%;top:23%}.eyebrow{font-size:11px;letter-spacing:2px}.live-dot{display:inline-block;width:6px;height:6px;background:var(--accent);border-radius:50%;margin-right:8px;box-shadow:0 0 15px var(--accent)}h1,h2{font-family:Impact,'Arial Narrow',Arial,sans-serif;font-stretch:condensed;letter-spacing:-3px;line-height:.94;font-weight:900}h1{font-size:clamp(80px,9.5vw,150px);margin:29px 0 26px}em{font-style:normal;color:var(--accent)}h1 em{display:inline-block}.intro{font-size:16px;line-height:1.7;color:#ded6da}.button{display:inline-flex;gap:40px;align-items:center;background:var(--accent);color:#17130d;padding:18px 22px;margin-top:19px;font-size:13px;font-weight:bold;transition:background .2s,transform .2s}.button:hover{background:#d6b781;transform:translateY(-3px)}.hero-bottom{position:absolute;bottom:35px;left:4.5%;right:4.5%;display:flex;justify-content:space-between;color:#e1d9d6;font-size:10px}.hero-bottom>a:first-of-type{color:#c3b9bb}.ticker{overflow:hidden;white-space:nowrap;background:var(--accent);color:#17130d;padding:17px 0;font-weight:bold;font-size:15px;letter-spacing:4px;word-spacing:15px}.ticker span{padding:0 35px}.section{padding:110px 7%}.work{background:radial-gradient(ellipse at 90% 20%,#33203a66,transparent 60%),#100e14}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:44px;gap:25px}.section-heading .eyebrow{color:var(--accent);margin:0 0 24px}h2{font-size:clamp(42px,5.1vw,76px);margin:0}h2 span{color:#8e8794}.section-heading>p{font-size:14px;color:var(--muted);line-height:1.8;margin-bottom:4px}.portfolio{display:grid;grid-template-columns:1fr 1fr;gap:35px 24px}.photo-card{border:0;padding:0;background:transparent;color:inherit;text-align:left;cursor:pointer;min-width:0}.photo-card:first-child{grid-column:1/-1}.photo-wrap{overflow:hidden;position:relative;background:#211b26;aspect-ratio:1.5}.photo-card:first-child .photo-wrap{aspect-ratio:2.1}.photo-wrap img{width:100%;height:100%;object-fit:cover;transition:transform .65s,filter .65s}.photo-card:hover img{transform:scale(1.035);filter:brightness(1.1)}.expand{position:absolute;right:18px;bottom:18px;width:40px;height:40px;border:1px solid #ffffff70;display:grid;place-items:center;border-radius:50%;background:#08080b55;font-size:24px}.photo-label{display:flex;justify-content:space-between;align-items:center;padding-top:15px;gap:15px}.photo-label strong{font-size:20px;font-weight:500}.photo-label span{color:var(--muted);font:10px 'Courier New',monospace;letter-spacing:1px;white-space:nowrap}.interlude{min-height:420px;background:linear-gradient(90deg,#260c21dc,#240b2880),url('assets/concert-2.jpg') center 40%/cover;display:flex;align-items:center;justify-content:space-between;padding:70px 7%;gap:30px}.statement{font-size:clamp(34px,4.5vw,66px);font-weight:700;letter-spacing:-2px;line-height:1.12;margin:28px 0}.statement em{color:#e0a0f1}.interlude>span{writing-mode:vertical-rl;font:10px 'Courier New',monospace;letter-spacing:3px}.archive{background:radial-gradient(ellipse at 0 50%,#30261b66,transparent 65%),#100d10}.filters{display:flex;border-bottom:1px solid #ffffff50;padding:18px 0;gap:25px}.search{flex:1;display:flex;align-items:center;gap:18px}.search>span{font-size:30px;color:var(--accent)}input{background:none;border:0;color:var(--paper);width:100%;font-size:17px;min-width:0}input::placeholder{color:#a49aa5}.year{display:flex;align-items:center;gap:12px}select{background:#211920;color:var(--paper);padding:10px;border:1px solid #ffffff25}.results{color:var(--muted);margin:25px 0}.archive-row{display:grid;grid-template-columns:100px 1fr 140px 70px 25px;align-items:center;gap:24px;padding:20px 0;border-bottom:1px solid #ffffff1e;transition:padding .2s,background .2s}.archive-row:hover{background:#ffffff06;padding-left:10px}.archive-row img{width:100px;height:68px;object-fit:cover}.no-photo{width:100px;height:68px;display:grid;place-items:center;background:#261a25;font-size:10px;color:var(--muted)}.archive-row h3{font-size:21px;font-weight:500;margin:0}.archive-row .meta{font:11px 'Courier New',monospace;color:var(--muted)}.archive-row .arrow{color:var(--accent);font-size:24px}.archive-note{color:var(--muted);font-size:10px;line-height:1.8;margin-top:30px}.archive-note a{text-decoration:underline;text-underline-offset:4px}.about{background:var(--paper);color:#181217}.about>.eyebrow{color:#806238;margin-bottom:44px}.about-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:70px}.about-lead{font-size:26px;line-height:1.3;margin-top:0}.about-grid p:not(.about-lead){font-size:15px;line-height:1.8;color:#645b60;max-width:440px}.text-link{display:inline-block;border-bottom:1px solid;padding-bottom:8px;margin-top:24px;font-weight:bold;font-size:14px}footer{padding:45px 7%;display:flex;justify-content:space-between;align-items:center;gap:30px;color:var(--muted);font-size:10px;line-height:1.9}footer .brand{color:var(--paper);line-height:.83}dialog{background:#100e13;color:var(--paper);border:1px solid #ffffff30;padding:55px 25px 25px;width:min(1160px,96vw);max-height:96svh}dialog::backdrop{background:#050407f5}.close{position:absolute;right:17px;top:8px;font-size:34px;background:none;border:0;color:white;cursor:pointer}.viewer{display:flex;align-items:center;justify-content:space-between;gap:15px}.viewer img{max-width:calc(100% - 100px);max-height:65svh;object-fit:contain}.viewer button{border:1px solid #ffffff40;background:transparent;color:white;font-size:22px;cursor:pointer;width:36px;height:42px}.caption{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:20px 45px 0}.caption h3{margin:8px 0;font-size:22px}.caption a{font-size:12px;color:#d6b781}.caption .eyebrow{color:var(--muted)}.empty{padding:40px 0;color:var(--muted)}@media(min-width:1500px){.hero-copy{top:25%}}@media(max-width:800px){header{height:85px}.header-note{display:none}nav{gap:20px;font-size:12px}.hero{min-height:720px}.hero-photo{width:100%;object-position:60%}.hero-shade{background:linear-gradient(90deg,#17130fde,#17130f44),linear-gradient(0deg,#0c0b0f,transparent 70%)}.hero-copy{top:24%}h1{font-size:clamp(70px,13vw,105px)}.hero-bottom>a:first-of-type{display:none}.section{padding:75px 6%}.section-heading{display:block}.section-heading>p{margin-top:25px}.photo-label{display:block}.photo-label span{display:block;margin-top:8px}.photo-card:first-child .photo-wrap{aspect-ratio:1.5}.photo-label strong{font-size:17px}.interlude{min-height:330px}.archive-row{grid-template-columns:70px 1fr 40px 20px;gap:13px}.archive-row img,.no-photo{width:70px;height:55px}.archive-row h3{font-size:16px}.archive-row .venue{display:none}.archive-row .meta{font-size:10px}.about-grid{grid-template-columns:1fr;gap:35px}footer{flex-wrap:wrap}.year{font-size:0;gap:0}.year select{font-size:12px}.search input{font-size:14px}.caption{margin:18px 0 0;align-items:start}.caption h3{font-size:17px}.caption a{max-width:100px;line-height:1.7}}@media(max-width:450px){nav{gap:13px;font-size:10px}.brand{font-size:21px}.portfolio{gap:28px 15px}.photo-wrap{aspect-ratio:1}.hero-copy{left:6%}.hero-bottom{font-size:8px}.hero{min-height:690px}.intro{font-size:14px}.viewer{gap:5px}.viewer img{max-width:calc(100% - 70px)}.viewer button{width:28px}.filters{gap:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* Fine film grain and worn paper, confined to the background. */
body{isolation:isolate}
.work,.archive,.about,.interlude,.hero{position:relative;isolation:isolate}
.work::before,.archive::before,.about::before,.interlude::before,.hero::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;background-image:url("assets/grain.svg");background-size:180px 180px;opacity:.15;mix-blend-mode:soft-light}
.work::after,.archive::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;background:repeating-linear-gradient(113deg,transparent 0 93px,#d8c49c07 94px,transparent 95px 227px),repeating-linear-gradient(4deg,transparent 0 71px,#ffffff03 72px,transparent 73px 191px);opacity:.7}
.about::before{mix-blend-mode:multiply;opacity:.07}
.hero::before{z-index:-1;opacity:.12}
.interlude::before{opacity:.2}

/* Visible charcoal-paper texture, behind section content. */
.work::before,.archive::before,.about::before,.interlude::before,.hero::before{z-index:0;mix-blend-mode:normal;opacity:.2}
.work::after,.archive::after{z-index:0;opacity:1;background:repeating-linear-gradient(113deg,transparent 0 93px,#d8c49c12 94px,transparent 96px 227px),repeating-linear-gradient(4deg,transparent 0 71px,#ffffff08 72px,transparent 74px 191px)}
.work>*,.archive>*,.about>*,.interlude>*{position:relative;z-index:1}
.about::before{mix-blend-mode:multiply;opacity:.14}
.hero::before{opacity:.1}
.hero-copy,.hero-bottom{z-index:1}

/* Textured charcoal menu with clear navigation above the grain. */
header{isolation:isolate;background:#121116}
header::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url("assets/grain.svg") repeat; background-size:150px 150px;opacity:.24}
header::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(110deg,transparent 0 105px,#d8c49c12 106px,transparent 108px 260px),linear-gradient(90deg,#c5a2680a,transparent 45%,#50395d20);border-bottom:1px solid #c5a26830}
.hero-photo{width:100%;object-position:62% 40%}
.hero-shade{background:linear-gradient(90deg,#100e16eb 0%,#100e16b8 27%,#0c102435 63%,#0b102010),linear-gradient(0deg,#0c0b0f,transparent 38%)}
@media(max-width:800px){.hero-photo{object-position:60% 40%}.hero-shade{background:linear-gradient(90deg,#100e16dc,#100e1630),linear-gradient(0deg,#0c0b0f,transparent 70%)}}

/* Keep the main photograph clean; texture belongs to the surrounding site. */
.hero::before{display:none}
.hero-photo{filter:none;image-rendering:auto}
.hero-shade{background:linear-gradient(90deg,#100e16d9 0%,#100e1699 25%,#0c102412 55%,transparent 75%),linear-gradient(0deg,#0c0b0f,transparent 27%)}
@media(max-width:800px){.hero-shade{background:linear-gradient(90deg,#100e16bf,#100e1610),linear-gradient(0deg,#0c0b0f,transparent 45%)}}

/* Irregular distressed charcoal: no ruled or diagonal lines. */
.work::after,.archive::after{background:url("assets/grunge.svg") repeat;background-size:600px 600px;mix-blend-mode:soft-light;opacity:.75}
.work::before,.archive::before{opacity:.23}
header::after{background:url("assets/grunge.svg") repeat;background-size:420px 420px;mix-blend-mode:soft-light;opacity:.65;border:0}
header{border-bottom:1px solid #c5a26825}
header::before{opacity:.27}
.about::before{background-image:url("assets/grunge.svg");background-size:600px;opacity:.1}

.article{padding-top:150px;min-height:80vh;background:radial-gradient(ellipse at top right,#33203a66,transparent 70%),#100e14}.article h1{font-size:clamp(38px,6vw,80px);line-height:1.08;letter-spacing:-1px;max-width:1100px;overflow-wrap:anywhere}.article-body{max-width:1060px;line-height:1.85;font-size:17px}.article-body img{display:block;max-width:100%;height:auto;margin:22px auto}.article-body a{color:#d6b781;text-decoration:underline;overflow-wrap:anywhere}.article-body table{max-width:100%;display:block;overflow:auto}.recovered-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:35px 0}.recovered-gallery figure{margin:0}.recovered-gallery img{width:100%;height:230px;object-fit:cover;margin:0;transition:opacity .2s}.recovered-gallery a:hover img{opacity:.85}.recovery-note,.missing-photo{font-size:13px;color:#b2aeb8}.article-cover{margin:35px 0}.article-cover img{max-height:720px;object-fit:contain}.archive-row img{background:#211920}#load-more{border:0;cursor:pointer}#load-more[hidden]{display:none}#article-viewer{width:min(1400px,96vw);padding:55px 55px 30px;text-align:center}#viewer-img{max-width:100%;height:70svh;object-fit:contain}#viewer-close,#viewer-prev,#viewer-next{position:absolute;background:#17131bdd;color:#f5f0e7;border:1px solid #ffffff40;cursor:pointer;font-size:27px;padding:5px 10px}#viewer-close{right:10px;top:8px}#viewer-prev{left:5px;top:45%}#viewer-next{right:5px;top:45%}#viewer-count{font:12px 'Courier New',monospace;color:#b2aeb8}@media(max-width:650px){.recovered-gallery{grid-template-columns:1fr 1fr;gap:10px}.recovered-gallery img{height:150px}.article{padding-top:125px}.article-body{font-size:16px}#article-viewer{padding:55px 35px 20px}.article h1{font-size:42px}}

/* Distressed charcoal texture for concert article backgrounds. */
.article{position:relative;isolation:isolate}
.article::before,.article::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none}
.article::before{background:url("assets/grunge.svg") repeat;background-size:700px 700px;mix-blend-mode:soft-light;opacity:.95}
.article::after{background:url("assets/grain.svg") repeat;background-size:160px 160px;opacity:.23}
.article-body{position:relative}

/* Typewritten concert journal, with quiet music-inspired details. */
.article{font-family:'American Typewriter','Courier Prime','Courier New',monospace}
.article h1{font-family:'American Typewriter','Courier Prime','Courier New',monospace;font-weight:700;letter-spacing:-2px;font-size:clamp(34px,4.5vw,64px);line-height:1.14}
.article-body{font-family:'American Typewriter','Courier Prime','Courier New',monospace;font-size:17px;line-height:1.95}
.article .eyebrow{letter-spacing:2px;color:#c5a268}
.music-motif{display:flex;align-items:center;gap:18px;margin:35px 0 22px;color:#c5a268;font-family:'Courier New',monospace;font-size:10px;letter-spacing:3px;text-transform:uppercase}
.music-motif::before{content:"";display:block;width:88px;height:25px;background:linear-gradient(#c5a268,#c5a268) 0 50%/3px 6px no-repeat,linear-gradient(#c5a268,#c5a268) 8px 50%/3px 14px no-repeat,linear-gradient(#c5a268,#c5a268) 16px 50%/3px 23px no-repeat,linear-gradient(#c5a268,#c5a268) 24px 50%/3px 11px no-repeat,linear-gradient(#c5a268,#c5a268) 32px 50%/3px 18px no-repeat,linear-gradient(#c5a268,#c5a268) 40px 50%/3px 25px no-repeat,linear-gradient(#c5a268,#c5a268) 48px 50%/3px 15px no-repeat,linear-gradient(#c5a268,#c5a268) 56px 50%/3px 8px no-repeat,linear-gradient(#c5a268,#c5a268) 64px 50%/3px 19px no-repeat,linear-gradient(#c5a268,#c5a268) 72px 50%/3px 12px no-repeat,linear-gradient(#c5a268,#c5a268) 80px 50%/3px 5px no-repeat;opacity:.7}
.article .music-end{margin-top:55px;padding-top:22px;border-top:1px dashed #c5a26840;font:11px 'Courier New',monospace;letter-spacing:3px;color:#c5a268}
@media(max-width:650px){.article h1{font-size:34px;letter-spacing:-1px}.article-body{font-size:15px}.music-motif{letter-spacing:2px}}

/* Vintage typewriter lettering for the navigation menu. */
header nav a{font-family:'American Typewriter','Courier New',Courier,monospace;font-weight:700;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;text-shadow:.35px 0 currentColor,-.2px .3px currentColor;line-height:1.5}
header nav{gap:30px}
@media(max-width:800px){header nav{gap:18px}header nav a{font-size:11px;letter-spacing:1px}}
@media(max-width:450px){header nav{gap:12px}header nav a{font-size:9px;letter-spacing:.5px}}

/* Original Three Songs identity, with its natural proportions. */
a.brand{display:inline-flex;align-items:center;flex-shrink:0;line-height:1;letter-spacing:normal}
.brand img{display:block;width:164px;height:auto;max-height:70px;object-fit:contain}
footer .brand img{width:150px;max-height:none}
@media(max-width:800px){.brand img{width:137px;max-height:59px}}
@media(max-width:450px){.brand img{width:113px;max-height:49px}footer .brand img{width:140px}}

/* Distressed typewriter menu, inspired by worn ink on paper. */
header nav a{font-family:'Courier New',Courier,monospace;font-weight:900;font-size:18px;letter-spacing:1px;text-transform:none;text-shadow:.6px 0 currentColor,-.5px .3px currentColor,.2px -.35px currentColor;filter:url('#typewriter-ink');line-height:1.5}
header nav a:nth-child(1){transform:rotate(-.7deg)}
header nav a:nth-child(2){transform:rotate(.4deg)}
header nav a:nth-child(3){transform:rotate(-.4deg)}
.ink-filter-definitions{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
@media(max-width:800px){header nav a{font-size:14px;letter-spacing:.4px}header nav{gap:18px}}
@media(max-width:450px){header nav a{font-size:11px;letter-spacing:0}header nav{gap:11px}}

/* Rock details: amplifier grille, record label and concert-ticket edges. */
header{background-image:radial-gradient(ellipse at center,#ffffff0a 1px,transparent 1.6px);background-size:5px 4px}
.rock-strip{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:0 0 42px;padding:14px 0;border-top:1px dashed #c5a26845;border-bottom:1px dashed #c5a26845;font:11px 'Courier New',monospace;letter-spacing:2px;color:#c5a268}
.rock-strip span{display:flex;align-items:center;gap:12px}
.rock-pick{display:inline-grid;place-items:center;width:26px;height:30px;background:#c5a268;color:#181219;clip-path:polygon(12% 0,88% 0,100% 20%,85% 65%,50% 100%,15% 65%,0 20%);font-style:normal;font-weight:bold;font-size:12px;letter-spacing:0}
.about{overflow:hidden}.about-grid{position:relative;z-index:1}.about::after{content:"";position:absolute;width:340px;height:340px;right:-125px;bottom:-150px;border-radius:50%;background:radial-gradient(circle,#f5f0e7 0 5px,#a17f49 6px 36px,#17141a 37px 42px,transparent 43px),repeating-radial-gradient(circle,#17141a 0 2px,#302931 3px 4px);opacity:.14;z-index:0;pointer-events:none}
.button{position:relative;clip-path:polygon(0 0,100% 0,100% 35%,98% 42%,100% 50%,100% 100%,0 100%,0 65%,2% 58%,0 50%)}
.rock-tagline{font:11px 'Courier New',monospace;letter-spacing:2px;color:#c5a268;margin-top:30px;display:flex;gap:12px;align-items:center}.rock-tagline::before{content:"✦";font-size:22px}
@media(max-width:650px){.rock-strip{font-size:9px;letter-spacing:1px;gap:12px}.rock-strip>span:last-child{display:none}.rock-tagline{font-size:10px;letter-spacing:1px}}

/* Two flat background tones: charcoal and warm off-white. */
body,header,.work,.archive,.article,footer{background:#121116;background-image:none}
.about{background:#f5f0e7;background-image:none}
header::before,header::after,.work::before,.work::after,.archive::before,.archive::after,.article::before,.article::after,.about::before,.about::after,.interlude::before{display:none}
.interlude{background:#f5f0e7;color:#181217}
.interlude .statement em{color:#8a6a39}
.interlude .eyebrow,.interlude>span{color:#6c5b45}

/* Larger menu lettering with responsive spacing. */
header nav a{font-size:23px;letter-spacing:1.1px}
header nav{gap:34px}
@media(max-width:1000px){header .header-note{display:none}header nav a{font-size:21px}header nav{gap:26px}}
@media(max-width:650px){header nav a{font-size:16px;letter-spacing:.3px}header nav{gap:16px}}
@media(max-width:450px){header nav a{font-size:13px;letter-spacing:0}header nav{gap:12px}}
@media(max-width:360px){header nav a{font-size:12px}header nav{gap:9px}.brand img{width:100px}}