:root{--bg:#10110e;--panel:#1a1c17;--ink:#f3f2e8;--muted:#a5a79c;--line:#35382f;--acid:#d5ff54;--orange:#f69e68;--hero-photo:url('theme-art/nightlife-reference-scene.webp');--vinyl-photo:url('theme-art/hifi-turntable-luxury.webp');--gig-photo:url('theme-art/manga-concert-scene.webp');--record-photo:url('theme-art/hifi-reference-scene.webp');--discover-photo:url('theme-art/bristol-reference-scene.webp')}
html[data-theme="manga"]{--hero-photo:url('theme-art/manga-concert-scene.webp');--vinyl-photo:url('theme-art/manga-vinyl-scene.webp')}
html[data-theme="hifi"]{--hero-photo:url('theme-art/hifi-reference-scene.webp');--vinyl-photo:url('theme-art/hifi-turntable-luxury.webp')}
html[data-theme="retro"]{--hero-photo:url('theme-art/retro-reference-scene.webp')}
html[data-theme="signal"]{--hero-photo:url('theme-art/signal-reference-scene.webp')}
html[data-theme="grunge"]{--hero-photo:url('theme-art/grunge-reference-scene.webp')}
html[data-theme="bristol"]{--hero-photo:url('theme-art/bristol-reference-scene.webp')}
html[data-theme="nightlife"]{--hero-photo:url('theme-art/nightlife-reference-scene.webp')}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}a:focus-visible{outline:3px solid var(--acid);outline-offset:4px}.skip{position:absolute;top:-100px;left:1rem;background:var(--acid);color:#111;padding:1rem;z-index:10}.skip:focus{top:1rem}.welcome-wrap{max-width:1800px;margin:auto}.welcome-header{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:25px clamp(20px,4vw,76px);border-bottom:1px solid var(--line)}.logo{font-size:clamp(19px,2vw,29px);font-weight:950;letter-spacing:-.085em;white-space:nowrap}.logo span{color:var(--acid)}.welcome-header nav{display:flex;align-items:center;gap:28px;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.nav-login:hover,.secondary-btn:hover{color:var(--acid)}.nav-join{background:var(--acid);color:#111;padding:14px 19px}.nav-join:hover,.primary-btn:hover{filter:brightness(.9)}.welcome-hero{display:grid;grid-template-columns:52% 48%;min-height:670px;overflow:hidden}.hero-copy{padding:clamp(60px,8vw,135px) clamp(24px,5vw,88px) 75px;position:relative;z-index:1}.eyebrow,.feature-number,.micro,.visual-tag{font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}.eyebrow{color:var(--acid);display:flex;align-items:center;gap:10px}.pulse{width:8px;height:8px;border-radius:50%;background:var(--acid);box-shadow:0 0 14px var(--acid)}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(57px,6.5vw,116px);letter-spacing:-.075em;line-height:.99;margin:31px 0 32px;font-weight:900}h1 em,h2 em,.statement em{color:var(--acid);font-style:normal}.lead{max-width:550px;color:var(--muted);font-size:clamp(17px,1.45vw,22px);line-height:1.55}.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin:35px 0}.primary-btn{display:inline-flex;align-items:center;justify-content:center;gap:30px;background:var(--acid);color:#111;padding:19px 25px;font-weight:900;font-size:13px;text-transform:uppercase;letter-spacing:.09em}.secondary-btn{font-size:13px;font-weight:800}.micro{max-width:480px;color:var(--muted);line-height:1.7;letter-spacing:.05em;font-weight:500}.hero-visual{position:relative;min-height:610px;background:#171713;isolation:isolate}.visual-main{position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(0,0,0,.28),transparent 40%),var(--hero-photo);background-size:cover;background-position:center;filter:saturate(.85)}.visual-vinyl{position:absolute;right:-5%;bottom:-12%;width:55%;aspect-ratio:1;border:10px solid var(--bg);border-radius:50%;background-image:var(--vinyl-photo);background-position:center;background-size:cover;box-shadow:0 20px 70px #0009;transform:rotate(-12deg)}.visual-tag{position:absolute;padding:13px 16px;background:var(--acid);color:#151515}.tag-top{top:36px;left:-25px;transform:rotate(-4deg)}.tag-bottom{bottom:48px;left:30px;background:var(--bg);color:var(--ink)}.ticker{overflow:hidden;background:var(--acid);color:#10110e;white-space:nowrap;padding:19px 20px;font-size:clamp(16px,2vw,29px);font-weight:950;letter-spacing:.11em}.ticker div{text-align:center}.ticker span{margin:0 19px}.features{padding:110px clamp(20px,4vw,76px)}.section-heading{display:grid;grid-template-columns:1.2fr .8fr;column-gap:50px;align-items:end;margin-bottom:50px}.section-heading .eyebrow{grid-column:1/-1}.section-heading h2{font-size:clamp(44px,5vw,78px);letter-spacing:-.065em;line-height:1.04;margin:14px 0 0}.section-heading>p:last-child{max-width:400px;color:var(--muted);line-height:1.6;font-size:19px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-card{background:var(--panel);border:1px solid var(--line);padding:14px 14px 32px}.feature-image{height:clamp(180px,22vw,330px);background-size:cover;background-position:center}.gig-image{background-image:var(--gig-photo)}.record-image{background-image:var(--record-photo)}.discover-image{background-image:var(--discover-photo)}.feature-number{color:var(--acid);margin:25px 12px 12px}.feature-card h3{font-size:clamp(24px,2.6vw,38px);letter-spacing:-.045em;margin:0 12px 12px}.feature-card p{color:var(--muted);line-height:1.6;font-size:16px;margin:0 12px}.statement{text-align:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:100px 20px 110px}.statement .eyebrow{justify-content:center}.statement>p:nth-child(2){max-width:920px;margin:25px auto 40px;font-size:clamp(43px,6vw,92px);font-weight:900;line-height:1.04;letter-spacing:-.065em}footer{padding:35px clamp(20px,4vw,76px);display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--muted);font-size:13px}footer .logo{color:var(--ink)}@media(max-width:900px){.welcome-hero{grid-template-columns:1fr}.hero-copy{padding:65px 28px}.hero-visual{min-height:440px}.tag-top{left:15px}.section-heading{grid-template-columns:1fr}.feature-grid{grid-template-columns:1fr 1fr}.feature-card:last-child{grid-column:1/-1}}@media(max-width:600px){.welcome-header{padding:20px}.welcome-header nav{gap:12px;font-size:11px}.nav-join{padding:11px}.welcome-hero h1{font-size:clamp(50px,13vw,80px)}.hero-visual{min-height:350px}.visual-vinyl{width:49%}.ticker div{font-size:14px}.ticker span{margin:0 4px}.features{padding:70px 20px}.feature-grid{grid-template-columns:1fr}.feature-card:last-child{grid-column:auto}.feature-image{height:250px}footer{flex-wrap:wrap}}
