:root{--bg-primary:#0A0A0A;--bg-secondary:#1C1C1C;--bg-elevated:#242424;--accent-amber:#FFB300;--accent-red:#E53935;--accent-blue:#1E88E5;--accent-gold:#FFD54F;--era-prerock:#8D6E63;--era-explosion:#BDBDBD;--era-invasion:#AB47BC;--era-evolution:#26A69A;--era-present:#FFFFFF;--text-primary:rgba(255,255,255,0.95);--text-secondary:rgba(255,255,255,0.75);--text-muted:rgba(255,255,255,0.55);--text-faint:rgba(255,255,255,0.35);--font-display:"Oswald","Bebas Neue",sans-serif;--font-quote:"Playfair Display",Georgia,serif;--font-body:"Source Serif Pro","Merriweather",Georgia,serif;--font-mono:"IBM Plex Mono",monospace;--font-caption:"Source Sans Pro",sans-serif;--font-size-hero:2.75rem;--font-size-chapter:1.75rem;--font-size-section:1.5rem;--font-size-body:18px;--line-height-body:1.65;--section-padding:4rem 1.25rem;--content-max-width:720px;--duration-fast:150ms;--duration-medium:300ms;--duration-slow:600ms;--duration-reveal:800ms;--duration-era:1200ms;--ease-amplify:cubic-bezier(0.16,1,0.3,1);--ease-groove:cubic-bezier(0.4,0,0.2,1);--ease-impact:cubic-bezier(0.34,1.56,0.64,1)}@media (min-width:768px){:root{--font-size-hero:5rem;--font-size-chapter:2.75rem;--font-size-section:2rem;--font-size-body:20px;--section-padding:6rem 2rem}}.rock-and-roll-essay{background:var(--bg-primary);color:var(--text-primary);font-family:var(--font-body);font-size:var(--font-size-body);line-height:var(--line-height-body);min-height:100vh;overflow-x:hidden;position:relative;touch-action:pan-y;-webkit-overflow-scrolling:touch}.rock-and-roll-essay *{box-sizing:border-box}.vinyl-progress{position:fixed;left:0;top:0;bottom:0;width:52px;z-index:100;pointer-events:none;padding:1rem 0;background:linear-gradient(90deg,rgba(0,0,0,.5),transparent)}.vinyl-progress,.vinyl-shell{display:flex;flex-direction:column;align-items:center}.vinyl-shell{position:relative;width:44px;height:100%}.vinyl-tracks{position:absolute;top:5%;bottom:5%;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;justify-content:space-between;align-items:center}.vinyl-track{width:22px;height:2px;background:rgba(255,255,255,.12);transition:background var(--duration-medium) var(--ease-groove);position:relative;border-radius:1px}.vinyl-track.passed{background:var(--accent-amber)}.vinyl-track:before{content:attr(data-track);position:absolute;left:28px;top:50%;transform:translateY(-50%);font-family:var(--font-mono);font-size:.5625rem;color:var(--text-faint);white-space:nowrap;opacity:0;transition:opacity var(--duration-medium)}.vinyl-track:hover:before{opacity:1}.vinyl-track[data-era=prerock].passed{background:var(--era-prerock)}.vinyl-track[data-era=explosion].passed{background:var(--accent-amber)}.vinyl-track[data-era=invasion].passed{background:var(--era-invasion)}.vinyl-track[data-era=evolution].passed{background:var(--era-evolution)}.vinyl-track[data-era=present].passed{background:var(--era-present)}.vinyl-needle{width:14px;height:14px;border-radius:50%;background:var(--accent-red);box-shadow:0 0 12px var(--accent-red),0 0 24px rgba(229,57,53,.4);transition:top .1s linear}.vinyl-fill,.vinyl-needle{position:absolute;left:50%;transform:translateX(-50%)}.vinyl-fill{top:5%;width:4px;background:linear-gradient(to bottom,var(--era-prerock) 0,var(--accent-amber) 20%,var(--era-invasion) 50%,var(--era-evolution) 75%,var(--era-present) 100%);transition:height .1s linear;border-radius:2px}@media (max-width:767px){.vinyl-progress{display:none}.vinyl-progress-mobile{display:block;position:fixed;bottom:0;left:0;right:0;height:calc(4px + env(safe-area-inset-bottom, 0px));padding-bottom:env(safe-area-inset-bottom,0);z-index:100;background:rgba(255,255,255,.06)}.vinyl-progress-mobile .vinyl-fill{position:absolute;top:0;left:0;height:100%;background:linear-gradient(to right,var(--era-prerock) 0,var(--accent-amber) 20%,var(--era-invasion) 50%,var(--era-evolution) 75%,var(--era-present) 100%)}}.hero-section{position:relative;height:100vh;height:100dvh;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;overflow:hidden;background:var(--bg-primary)}.rock-and-roll-essay .hero-background{position:absolute;inset:0;background:var(--bg-primary);transition:background .3s ease}.rock-and-roll-essay .hero-background--with-image{background-size:cover;background-position:center 40%;background-repeat:no-repeat;filter:brightness(.3) saturate(.6) sepia(.2)}.rock-and-roll-essay .hero-background:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 60%,rgba(255,179,0,.15) 0,transparent 50%);transition:opacity .3s ease}.rock-and-roll-essay .hero-background:after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");opacity:.12;pointer-events:none;mix-blend-mode:overlay}.rock-and-roll-essay .hero-content{position:relative;z-index:10;max-width:900px;padding:0 2rem;display:flex;flex-direction:column;align-items:center;text-align:center;transition:opacity var(--duration-era) var(--ease-amplify),transform var(--duration-era) var(--ease-amplify)}.hero-overline{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.25em;text-transform:uppercase;color:var(--accent-amber);margin-bottom:1.5rem}.rock-and-roll-essay .hero-title{font-family:var(--font-display);font-size:var(--font-size-hero);font-weight:400;line-height:1;margin:0 0 .75rem;text-transform:uppercase;letter-spacing:.02em;background:linear-gradient(135deg,var(--accent-amber) 0,var(--accent-red) 50%,var(--accent-amber) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{font-family:var(--font-quote);font-size:1.25rem;font-style:italic;color:var(--text-secondary);margin-bottom:0}@media (min-width:768px){.hero-subtitle{font-size:1.75rem}}.hero-section--scroll-lock{position:relative;min-height:100vh;min-height:100dvh}.hero-text-phase{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:2rem;z-index:15;pointer-events:none}.hero-phase-text{font-family:var(--font-quote);font-size:1.25rem;font-style:italic;color:var(--text-secondary);margin:0 0 1rem;max-width:600px}.hero-phase-question{font-size:clamp(1.75rem,5vw,3rem);color:var(--text-primary)}.hero-phase-question,.hero-phase-revelation{font-family:var(--font-display);font-weight:400;margin:0;text-transform:uppercase;letter-spacing:.02em}.hero-phase-revelation{font-size:clamp(1.5rem,4vw,2.5rem);color:var(--accent-amber)}.hero-content--final{z-index:20;transition:opacity .3s ease,transform .3s ease}.hero-tagline{font-family:var(--font-quote);font-size:1.125rem;font-style:italic;color:var(--accent-amber);margin-top:1.5rem}.hero-convergence{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:5}.convergence-stream{width:100px;height:100px;border-radius:50%;background-size:cover;background-position:50%;filter:grayscale(.4) brightness(.9) sepia(.2);box-shadow:0 0 30px rgba(255,179,0,.3);border:2px solid rgba(255,179,0,.4)}@media (min-width:768px){.convergence-stream{width:140px;height:140px}}.convergence-stream--gospel{background:radial-gradient(circle at 30% 30%,#FFD54F 0,#8B4513 60%,#2D1810 100%)}.convergence-stream--boogie{background:radial-gradient(circle at 70% 30%,#F5DEB3 0,#654321 60%,#1A1A1A 100%)}.convergence-stream--blues{background:radial-gradient(circle at 40% 40%,#4169E1 0,#1E3A5F 60%,#0A0A0A 100%)}.convergence-stream--jump{background:radial-gradient(circle at 60% 40%,#FF6B35 0,#8B2500 60%,#1A0A0A 100%)}.convergence-stream--rnb{background:radial-gradient(circle at 50% 30%,#9932CC 0,#4B0082 60%,#1A0A1A 100%)}.convergence-burst{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(255,179,0,.6) 0,rgba(229,57,53,.4) 30%,transparent 70%);pointer-events:none;transition:opacity .2s ease}.hero-progress-indicator{position:absolute;bottom:3rem;left:50%;transform:translateX(-50%);width:200px;height:3px;background:rgba(255,255,255,.1);border-radius:2px;overflow:hidden;z-index:25}.hero-progress-bar{height:100%;background:linear-gradient(90deg,var(--accent-amber),var(--accent-red));transform-origin:left center;transition:transform .1s ease-out}.hero-skip-button{position:absolute;bottom:2rem;right:2rem;padding:.5rem 1rem;font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text-muted);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.15);border-radius:4px;cursor:pointer;z-index:30;transition:all .2s ease;animation:skip-fade-in .5s ease forwards}@keyframes skip-fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.hero-skip-button:hover{color:var(--text-primary);background:rgba(255,255,255,.1);border-color:rgba(255,179,0,.4)}.hero-skip-button:focus{outline:2px solid var(--accent-amber);outline-offset:2px}@media (max-width:767px){.hero-skip-button{bottom:calc(1.5rem + env(safe-area-inset-bottom, 0px));right:1rem}}.hero-scroll-indicator{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;transition:opacity .5s ease;z-index:10}.scroll-text{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted)}.scroll-line{width:1px;height:40px;background:linear-gradient(to bottom,var(--accent-amber),transparent);animation:scroll-pulse 2s ease-in-out infinite}@keyframes scroll-pulse{0%,to{opacity:.3;transform:scaleY(1)}50%{opacity:1;transform:scaleY(1.2)}}.hero-attribution{position:absolute;bottom:1rem;left:1.5rem;font-family:var(--font-mono);font-size:.5625rem;color:var(--text-faint);opacity:.6;z-index:10;max-width:50%}@media (min-width:768px){.hero-attribution{font-size:.625rem}}.chapter-section{position:relative;padding:var(--section-padding);min-height:100dvh;display:flex;flex-direction:column;justify-content:center}.chapter-section:before{content:"";position:absolute;inset:0;opacity:0;transition:opacity var(--duration-era) var(--ease-amplify);pointer-events:none}.chapter-section.visible:before{opacity:1}.chapter-section[data-era=prerock]:before{background:radial-gradient(ellipse at 50% 50%,rgba(141,110,99,.08) 0,transparent 70%)}.chapter-section[data-era=explosion]:before{background:radial-gradient(ellipse at 50% 50%,rgba(255,179,0,.08) 0,transparent 70%)}.chapter-section[data-era=invasion]:before{background:radial-gradient(ellipse at 50% 50%,rgba(171,71,188,.08) 0,transparent 70%)}.chapter-section[data-era=evolution]:before{background:radial-gradient(ellipse at 50% 50%,rgba(38,166,154,.08) 0,transparent 70%)}.chapter-section[data-era=present]:before{background:radial-gradient(ellipse at 50% 50%,rgba(255,255,255,.04) 0,transparent 70%)}.chapter-content{max-width:var(--content-max-width);margin:0 auto;width:100%}.chapter-image-container{margin:0 0 2.5rem;padding:0;opacity:0;transform:translateY(20px);transition:all var(--duration-slow) var(--ease-amplify);transition-delay:.2s}.chapter-section.visible .chapter-image-container{opacity:1;transform:translateY(0)}.chapter-image{width:100%;height:auto;max-height:420px;object-fit:cover;border-radius:4px}.chapter-section[data-era=prerock] .chapter-image{filter:sepia(.4) saturate(.8) brightness(.9) contrast(1.1)}.chapter-section[data-era=explosion] .chapter-image{filter:grayscale(.85) contrast(1.2) brightness(.95)}.chapter-section[data-era=invasion] .chapter-image{filter:saturate(1.15) brightness(1)}.chapter-section[data-era=evolution] .chapter-image{filter:contrast(1.05) saturate(.95)}.chapter-section[data-era=present] .chapter-image{filter:none}.chapter-image-attribution{font-family:var(--font-mono);font-size:.5625rem;color:var(--text-faint);margin-top:.75rem;opacity:.7;text-align:center}.chapter-header{margin-bottom:3rem;opacity:0;transform:translateY(30px);transition:all var(--duration-era) var(--ease-amplify)}.chapter-section.visible .chapter-header{opacity:1;transform:translateY(0)}.chapter-number{font-family:var(--font-mono);font-size:.6875rem;letter-spacing:.3em;text-transform:uppercase;color:var(--chapter-accent,var(--accent-amber));margin-bottom:.75rem;display:block}.chapter-title{font-family:var(--font-display);font-size:var(--font-size-chapter);font-weight:400;text-transform:uppercase;letter-spacing:.01em;line-height:1.1;margin:0 0 .5rem;color:var(--text-primary)}.chapter-subtitle{margin:0 0 1rem}.chapter-epigraph,.chapter-subtitle{font-family:var(--font-quote);font-size:1.125rem;font-style:italic;color:var(--text-muted)}.chapter-epigraph{padding-left:1rem;border-left:2px solid var(--chapter-accent,var(--accent-amber))}.chapter-epigraph cite{display:block;font-style:normal;font-size:.875rem;margin-top:.5rem;color:var(--text-faint)}.figure-profile{background:var(--bg-elevated);border:1px solid rgba(255,255,255,.06);border-radius:8px;padding:2rem 1.5rem;margin-bottom:2rem;opacity:0;transform:translateY(30px);transition:all var(--duration-slow) var(--ease-amplify)}.chapter-section.visible .figure-profile{opacity:1;transform:translateY(0)}.figure-profile.featured{border-color:var(--figure-accent,var(--accent-amber));border-width:1px 1px 1px 3px}.figure-profile.has-image{display:grid;gap:1.5rem}@media (min-width:768px){.figure-profile.has-image{grid-template-columns:180px 1fr}}.figure-image-container{position:relative;overflow:hidden;border-radius:4px}.figure-image{width:100%;height:auto;max-height:260px;object-fit:cover;transition:filter .3s ease}.chapter-section[data-era=prerock] .figure-image{filter:sepia(.35) saturate(.8) contrast(1.1)}.chapter-section[data-era=explosion] .figure-image{filter:grayscale(.7) contrast(1.15)}.chapter-section[data-era=invasion] .figure-image{filter:saturate(1.1) brightness(1)}.figure-profile:hover .figure-image{filter:grayscale(0) contrast(1.05) saturate(1.05)}.figure-image-attribution{font-family:var(--font-mono);font-size:.5rem;color:var(--text-faint);margin-top:.5rem;opacity:.7}.figure-text{display:flex;flex-direction:column}.figure-name{font-family:var(--font-display);font-size:1.4rem;font-weight:400;text-transform:uppercase;letter-spacing:.02em;color:var(--figure-accent,var(--accent-amber));margin:0 0 .25rem}.figure-epithet{font-family:var(--font-quote);font-size:1rem;font-style:italic;color:var(--text-muted);margin-bottom:1rem}.figure-meta{font-family:var(--font-mono);font-size:.75rem;color:var(--text-faint);margin-bottom:1rem}.figure-domains{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}.figure-domain{font-family:var(--font-mono);font-size:.625rem;letter-spacing:.1em;text-transform:uppercase;padding:.25rem .75rem;background:rgba(255,255,255,.05);border-radius:100px;color:var(--text-secondary)}.figure-description{font-size:var(--font-size-body);color:var(--text-secondary);line-height:var(--line-height-body);margin-bottom:1.5rem}.figure-quote{font-family:var(--font-quote);font-style:italic;color:var(--text-muted);padding-left:1rem;border-left:2px solid var(--figure-accent,var(--accent-amber))}.narrative-block{margin-bottom:2rem;opacity:0;transform:translateY(20px);transition:all var(--duration-slow) var(--ease-amplify)}.chapter-section.visible .narrative-block{opacity:1;transform:translateY(0)}.narrative-block p{font-size:var(--font-size-body);color:var(--text-secondary);line-height:var(--line-height-body);margin-bottom:1.5rem}.narrative-block p:last-child{margin-bottom:0}.narrative-block.has-dropcap p:first-of-type:first-letter{font-family:var(--font-display);font-size:4rem;float:left;line-height:.8;padding-right:.75rem;padding-top:.25rem;color:var(--chapter-accent,var(--accent-amber))}.quote-monument{padding:4rem 1.5rem;margin:3rem 0;text-align:center;position:relative;opacity:0;transform:scale(.95);transition:all var(--duration-era) var(--ease-amplify)}.chapter-section.visible .quote-monument{opacity:1;transform:scale(1)}.quote-monument:before{content:'"';font-family:var(--font-display);font-size:6rem;color:var(--chapter-accent,var(--accent-amber));opacity:.15;position:absolute;top:0;left:50%;transform:translateX(-50%);line-height:1}.quote-monument blockquote{font-family:var(--font-quote);font-size:1.5rem;font-style:italic;color:var(--text-primary);line-height:1.5;max-width:600px;margin:0 auto 1.5rem}@media (min-width:768px){.quote-monument blockquote{font-size:2rem}}.quote-monument cite{font-family:var(--font-mono);font-size:.875rem;font-style:normal;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}.transition-divider{height:1px;margin:4rem auto;max-width:200px;position:relative;overflow:hidden}.transition-divider:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--divider-color,var(--accent-amber)),transparent);opacity:.5}.transition-divider[data-era=prerock]{--divider-color:var(--era-prerock)}.transition-divider[data-era=explosion]{--divider-color:var(--accent-amber)}.transition-divider[data-era=invasion]{--divider-color:var(--era-invasion)}.transition-divider[data-era=evolution]{--divider-color:var(--era-evolution)}.transition-divider[data-era=present]{--divider-color:var(--era-present)}.chapter-section.visible .figure-profile:first-child{transition-delay:.1s}.chapter-section.visible .figure-profile:nth-child(2){transition-delay:.2s}.chapter-section.visible .figure-profile:nth-child(3){transition-delay:.3s}.chapter-section.visible .figure-profile:nth-child(4){transition-delay:.4s}.chapter-section.visible .narrative-block:first-child{transition-delay:.1s}.chapter-section.visible .narrative-block:nth-child(2){transition-delay:.15s}.chapter-section.visible .narrative-block:nth-child(3){transition-delay:.2s}.sources-section{padding:4rem 1.5rem;background:linear-gradient(135deg,#0A0A0A,#050505);border-top:1px solid rgba(255,255,255,.06)}.sources-content{max-width:var(--content-max-width);margin:0 auto}.sources-title{font-family:var(--font-display);font-size:1.5rem;font-weight:400;text-transform:uppercase;color:var(--text-primary);margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid rgba(255,179,0,.3)}.sources-category{margin-bottom:2rem}.sources-category-title{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;color:var(--accent-amber);margin-bottom:1rem}.sources-list{list-style:none;padding:0;margin:0}.sources-list li{margin-bottom:.75rem;padding-left:1.5rem;position:relative}.sources-list li:before{content:">";font-family:var(--font-mono);position:absolute;left:0;color:var(--accent-amber)}.sources-list a{font-size:.9375rem;color:var(--text-muted);text-decoration:none;transition:color .2s ease}.sources-list a:hover{color:var(--accent-amber);text-decoration:underline}.sources-note{font-size:.8125rem;font-style:italic;color:var(--text-faint);padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.06)}.epilogue-section{min-height:70vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:var(--section-padding);position:relative}.epilogue-text{font-family:var(--font-quote);font-size:1.25rem;font-style:italic;color:var(--text-secondary);max-width:560px;line-height:1.65;margin:0}@media (min-width:768px){.epilogue-text{font-size:1.5rem}}.epilogue-closing{font-family:var(--font-display);font-size:1rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-amber);margin-top:2rem}.content-warning{background:rgba(229,57,53,.1);border-left:3px solid var(--accent-red);padding:1rem 1.5rem;margin:1.5rem 0;font-size:.875rem}.content-warning-label{font-family:var(--font-mono);font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--accent-red);margin-bottom:.5rem}.scroll-lock-container{position:relative;height:300vh}.scroll-lock-sticky{position:sticky;top:0;height:100vh;overflow:hidden}.scroll-lock-content,.scroll-lock-sticky{display:flex;align-items:center;justify-content:center}.scroll-lock-content{position:relative;width:100%;height:100%}.comparison-container{position:relative;width:100%;max-width:600px;margin:2rem auto}.comparison-side{padding:1.5rem;background:var(--bg-elevated);border-radius:8px;margin-bottom:1rem}.comparison-side--left{border-left:3px solid var(--accent-amber)}.comparison-side--right{border-left:3px solid var(--era-invasion)}.comparison-title{font-family:var(--font-display);font-size:1rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.scroll-line{animation:none}.chapter-section:before,.rock-and-roll-essay .hero-content{transition-duration:.01ms}}.rock-and-roll-essay a:focus-visible,.rock-and-roll-essay button:focus-visible{outline:2px solid var(--accent-amber);outline-offset:2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.glossary-term{position:relative;border-bottom:1px dotted var(--text-muted);cursor:help}.glossary-term:focus:after,.glossary-term:hover:after{content:attr(data-definition);position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:var(--bg-elevated);border:1px solid rgba(255,255,255,.1);border-radius:4px;padding:.75rem 1rem;font-size:.8125rem;font-style:normal;color:var(--text-secondary);white-space:normal;width:max-content;max-width:280px;z-index:50;box-shadow:0 4px 12px rgba(0,0,0,.4)}