@import "https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Source+Sans+3:wght@400;500;600&display=swap";:root{--bg:#0a0806;--bg-elevated:#14100c;--ink:#e8e0d4;--ink-muted:#a89880;--ink-faint:#6b5e4e;--ivory:#f3ebe0;--gold:#c9a227;--gold-dim:#8a7340;--border:#c9a2272e;--font-display:"Cormorant Garamond", "Times New Roman", serif;--font-body:"Source Sans 3", system-ui, sans-serif;font-family:var(--font-body);color:var(--ink);background-color:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:1.5}*,:before,:after{box-sizing:border-box}html{background:var(--bg)}body{background:radial-gradient(ellipse 120% 80% at 50% 0%, #1a1510 0%, var(--bg) 55%), var(--bg);min-height:100svh;margin:0}#root{min-height:100svh}button{-webkit-tap-highlight-color:transparent}::selection{color:var(--ivory);background:#c9a22759}.app{max-width:1120px;min-height:100svh;color:var(--ink);margin:0 auto;padding:1.25rem 1.25rem 3.5rem;position:relative}.vignette{pointer-events:none;z-index:0;background:radial-gradient(80% 50% at 50% -10%,#b48c501f,#0000 55%),radial-gradient(60% 40% at 50% 100%,#281e1480,#0000 50%),radial-gradient(100% 100%,#0000 40%,#0000008c 100%);position:fixed;inset:0}.stage-lights{pointer-events:none;z-index:0;background-image:radial-gradient(circle at 20% 0,#ffdca00a,#0000 25%),radial-gradient(circle at 80% 0,#ffdca00a,#0000 25%);position:fixed;inset:0}.app>*{z-index:1;position:relative}.hero{text-align:center;margin-bottom:1.25rem;padding-top:.35rem}.eyebrow{font-family:var(--font-display);letter-spacing:.22em;text-transform:uppercase;color:var(--gold-dim);margin:0 0 .4rem;font-size:.7rem}.hero h1{font-family:var(--font-display);letter-spacing:.04em;color:var(--ivory);text-shadow:0 2px 40px #0009;margin:0 0 .4rem;font-size:clamp(1.9rem,5vw,2.75rem);font-weight:500}.lede{max-width:28rem;color:var(--ink-muted);margin:0 auto;font-size:1rem;line-height:1.45}.lede em{color:var(--gold);font-style:italic}.section-label{font-family:var(--font-display);letter-spacing:.18em;text-transform:uppercase;color:var(--gold-dim);margin:0 0 .75rem;font-size:.8rem;font-weight:500}.section-hint{color:var(--ink-muted);max-width:48rem;margin:0 0 1.25rem;font-size:.95rem;line-height:1.6}.section-hint strong{color:var(--ivory);font-weight:500}.era-timeline{border:1px solid var(--border);background:linear-gradient(#1e1812b3,#120e0a80);border-radius:12px;margin-top:.5rem;margin-bottom:2rem;padding:1.5rem;box-shadow:inset 0 1px #ffffff0a}.era-row{grid-template-columns:repeat(3,1fr);gap:1rem;display:grid}@media (width<=720px){.era-row{grid-template-columns:1fr}}.era-card{background:#00000040;border:1px solid #ffffff0d;border-radius:8px;padding:1rem 1.1rem}.era-years{letter-spacing:.12em;text-transform:uppercase;color:var(--gold-dim);margin-bottom:.35rem;font-size:.7rem}.era-card h3{font-family:var(--font-display);color:var(--ivory);margin:0 0 .35rem;font-size:1.15rem;font-weight:500}.era-composers{color:var(--gold);margin:0 0 .5rem;font-size:.85rem}.era-idea{color:var(--ink-muted);margin:0;font-size:.85rem;line-height:1.45}.gallery{margin-bottom:1.5rem}.gallery-heading{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.35rem 1rem;margin-bottom:.65rem;display:flex}.gallery-heading .section-label{margin:0}.cta-hint{color:var(--gold);letter-spacing:.02em;margin:0;font-size:.85rem}.gallery-grid{grid-template-columns:repeat(5,1fr);gap:.85rem;display:grid}@media (width<=960px){.gallery-grid{grid-template-columns:repeat(3,1fr)}}@media (width<=600px){.gallery-grid{grid-template-columns:1fr 1fr}}.composer-card{text-align:left;border:1px solid var(--border);background:linear-gradient(165deg, var(--accent-soft), transparent 55%), linear-gradient(180deg, #1c1610, #100c09);min-height:10.25rem;color:inherit;cursor:pointer;font:inherit;border-radius:10px;flex-direction:column;align-items:flex-start;padding:1rem .9rem .9rem;transition:border-color .2s,transform .2s,box-shadow .2s;display:flex;position:relative;overflow:hidden}.composer-card:hover{border-color:color-mix(in srgb, var(--accent) 55%, transparent);transform:translateY(-3px);box-shadow:0 12px 40px #00000073}.composer-card.selected{border-color:var(--accent);box-shadow:0 0 0 1px color-mix(in srgb, var(--accent) 40%, transparent), 0 16px 48px #00000080}.composer-card.generating{animation:1.2s ease-in-out infinite card-pulse}@keyframes card-pulse{0%,to{box-shadow:0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent)}50%{box-shadow:0 0 24px color-mix(in srgb, var(--accent) 45%, transparent)}}.card-glow{background:radial-gradient(ellipse, var(--accent-soft), transparent 70%);pointer-events:none;height:60%;position:absolute;inset:auto -20% -40%}.card-top{letter-spacing:.08em;text-transform:uppercase;justify-content:space-between;gap:.5rem;width:100%;margin-bottom:.75rem;font-size:.65rem;display:flex}.era-badge{color:var(--accent);font-weight:600}.years{color:var(--ink-faint)}.composer-name{font-family:var(--font-display);color:var(--ivory);letter-spacing:.03em;margin:0 0 .25rem;font-size:1.45rem;font-weight:500}.tagline{color:var(--ink-muted);margin:0 0 .5rem;font-size:.8rem;font-style:italic}.essence{color:var(--ink-faint);margin:0 0 auto;font-size:.72rem;line-height:1.4}.card-cta{border-top:1px solid #ffffff0f;width:100%;margin-top:1rem;padding-top:.65rem}.cta-text{letter-spacing:.06em;text-transform:uppercase;color:var(--accent);font-size:.75rem}.note-icon{opacity:.9}.pulse{animation:1s ease-in-out infinite text-pulse}@keyframes text-pulse{50%{opacity:.5}}.main-split{grid-template-columns:1.2fr .9fr;gap:1.25rem;margin-bottom:1.75rem;display:grid}@media (width<=800px){.main-split{grid-template-columns:1fr}}.player{border:1px solid var(--border);background:linear-gradient(145deg, var(--accent-soft), transparent 40%), linear-gradient(180deg, #1a1410, #0e0b08);border-radius:12px;overflow:hidden;box-shadow:inset 0 1px #ffffff0a}.player.is-playing{border-color:color-mix(in srgb, var(--accent) 50%, transparent)}.player-inner{padding:1.5rem}.empty-player .player-placeholder{color:var(--ink-muted);text-align:center;margin:0;padding:2rem 1rem;font-style:italic}.now-label{letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:.4rem;font-size:.7rem;display:block}.piece-title{font-family:var(--font-display);color:var(--ivory);margin:0 0 .5rem;font-size:1.65rem;font-weight:500}.piece-sub{color:var(--ink-muted);margin:0 0 .75rem;font-size:.85rem;line-height:1.5}.piece-sub strong{color:var(--gold);font-weight:500}.dot{opacity:.4;margin:0 .4rem}.piece-blurb{color:var(--ink);margin:0 0 1.25rem;font-size:.95rem;line-height:1.55}.player-controls{flex-wrap:wrap;gap:.65rem;margin-bottom:1.25rem;display:flex}.btn{font:inherit;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;border:1px solid #0000;border-radius:6px;padding:.65rem 1.15rem;font-size:.85rem;transition:background .15s,border-color .15s,color .15s}.btn.primary{background:var(--accent);color:#0c0a08;font-weight:600}.btn.primary:hover{filter:brightness(1.08)}.btn.ghost{border-color:var(--border);color:var(--ink-muted);background:0 0}.btn.ghost:hover{border-color:var(--gold-dim);color:var(--ivory)}.techniques .subhead,.style-panel .subhead{letter-spacing:.14em;text-transform:uppercase;color:var(--gold-dim);margin:0 0 .5rem;font-size:.7rem;font-weight:500}.techniques ul{color:var(--ink-muted);margin:0;padding:0 0 0 1.1rem;font-size:.9rem;line-height:1.55}.eq-bars{align-items:flex-end;gap:4px;height:28px;margin-top:1.25rem;display:flex}.eq-bars span{background:var(--accent);opacity:.55;border-radius:2px;flex:1;height:30%;animation:.6s ease-in-out infinite alternate eq}@keyframes eq{to{opacity:.9;height:100%}}.style-panel{border:1px solid var(--border);background:linear-gradient(#16120e,#0c0a08);border-radius:12px;padding:1.5rem;box-shadow:inset 0 1px #ffffff08}.style-panel.empty .muted{color:var(--ink-muted);margin:0;font-size:.95rem;line-height:1.55}.style-summary{color:var(--ink);margin:0 0 1.15rem;font-size:.95rem;line-height:1.6}.hallmarks,.listen-for{color:var(--ink-muted);margin:0 0 1.15rem;padding:0 0 0 1.1rem;font-size:.88rem;line-height:1.55}.hallmarks li::marker{color:var(--accent)}.listen-for li::marker{color:var(--accent)}.vs-others{color:var(--ink-muted);border-left:2px solid var(--accent);background:var(--accent-soft);border-radius:0 6px 6px 0;margin:0 0 1.15rem;padding:.85rem;font-size:.88rem;line-height:1.55}.bible-footer{color:var(--ink-faint);border-top:1px solid #ffffff0f;flex-direction:column;gap:.25rem;padding-top:.75rem;font-size:.75rem;display:flex}.history{margin-bottom:2.5rem}.history ul{flex-direction:column;gap:.4rem;margin:0;padding:0;list-style:none;display:flex}.history-item{text-align:left;width:100%;font:inherit;color:inherit;cursor:pointer;background:#00000040;border:1px solid #0000;border-radius:8px;justify-content:space-between;align-items:baseline;gap:1rem;padding:.7rem 1rem;display:flex}.history-item:hover{border-color:var(--border);background:#ffffff08}.h-title{color:var(--ivory);font-size:.95rem}.h-meta{color:var(--ink-faint);white-space:nowrap;font-size:.8rem}.footer{text-align:center;border-top:1px solid #ffffff0f;padding-top:1.5rem}.footer p{color:var(--ink-faint);margin:0;max-width:36rem;margin-inline:auto;font-size:.8rem;line-height:1.5}.footer-meta{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;display:flex;margin-top:.85rem!important}.footer-meta a{color:var(--gold-dim);text-decoration:none}.footer-meta a:hover{color:var(--gold);text-decoration:underline}.visit-badge{vertical-align:middle;opacity:.9;height:18px}.status-banner{color:var(--gold);text-align:center;letter-spacing:.04em;background:#c9a2271f;border:1px solid #c9a22759;border-radius:8px;margin-bottom:1rem;padding:.75rem 1rem;font-size:.9rem}.error-banner{color:#f0c0c0;background:#a0282840;border:1px solid #dc505066;border-radius:8px;margin-bottom:1rem;padding:.75rem 1rem;font-size:.9rem}