:root{--ink:#170b2b;--ink2:#22123f;--plum:#9b1d6a;--orange:#e8731f;--gold:#f0b43a;--teal:#1f6f78;--cream:#f6ead2;--muted:#c9b8d6}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--cream);font:400 17px/1.6 "DM Sans",system-ui,sans-serif;overflow-x:hidden}
a{color:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.grain{position:fixed;inset:0;pointer-events:none;z-index:50;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
h1,h2,.brand{font-family:Shrikhand,Georgia,serif;font-weight:400;letter-spacing:.01em}
.top{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:14px 28px;background:rgba(23,11,43,.82);backdrop-filter:blur(10px);border-bottom:1px solid rgba(240,180,58,.15)}
.brand{text-decoration:none;font-size:22px;color:var(--gold)}
.top nav a{margin-left:24px;text-decoration:none;font-size:14px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.top nav a:hover{color:var(--gold)}
.hero{position:relative;overflow:hidden;padding:72px 24px 88px}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:200px;background:linear-gradient(transparent,var(--ink));pointer-events:none}
.hero-inner{z-index:1}
.rays{position:absolute;left:50%;top:40%;width:2400px;height:2400px;transform:translate(-50%,-50%);background:repeating-conic-gradient(from 0deg,rgba(232,115,31,.16) 0 6deg,transparent 6deg 12deg,rgba(155,29,106,.18) 12deg 18deg,transparent 18deg 24deg);-webkit-mask:radial-gradient(circle,#000 8%,transparent 42%);mask:radial-gradient(circle,#000 8%,transparent 42%);animation:spin 240s linear infinite}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.hero-inner{position:relative;max-width:1120px;margin:0 auto;display:grid;grid-template-columns:minmax(0,440px) 1fr;gap:56px;align-items:center}
.logo img{width:100%;height:auto;border-radius:50%;box-shadow:0 0 0 8px var(--ink2),0 0 0 12px var(--gold),0 30px 80px rgba(0,0,0,.6)}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:500 13px "DM Mono",monospace;letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.dot{width:10px;height:10px;border-radius:50%;background:#ff4b3e;box-shadow:0 0 0 0 rgba(255,75,62,.6);animation:pulse 1.8s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(255,75,62,0)}100%{box-shadow:0 0 0 0 rgba(255,75,62,0)}}
h1{font-size:clamp(54px,8vw,104px);line-height:.95;margin:14px 0 16px;color:var(--orange);text-shadow:3px 3px 0 var(--plum),6px 6px 0 var(--teal)}
.slogan{font-size:clamp(19px,2vw,24px);color:var(--cream);max-width:30ch;margin-bottom:34px}
.player{display:flex;gap:22px;align-items:center;padding:22px 26px;border-radius:28px;background:linear-gradient(135deg,#2a1450,#1c0e35);border:2px solid var(--gold);box-shadow:8px 8px 0 var(--plum),0 20px 60px rgba(0,0,0,.45);max-width:560px}
.play{flex:none;width:96px;height:96px;border-radius:50%;border:0;cursor:pointer;background:radial-gradient(circle at 35% 30%,#ffc85a,var(--orange) 60%,#c2550f);box-shadow:inset 0 -4px 0 rgba(0,0,0,.2),0 8px 24px rgba(232,115,31,.45);display:grid;place-items:center;transition:transform .15s}
.play:hover{transform:scale(1.05)}.play:active{transform:scale(.97)}
.play:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.play svg{width:44px;height:44px;fill:var(--ink)}
.i-pause,.playing .i-play{display:none}.playing .i-pause{display:block}
.player-body{flex:1;min-width:0}
.player-label{font-weight:500;font-size:15px;color:var(--muted)}
.live-tag{display:inline-block;font:500 12px "DM Mono",monospace;letter-spacing:.15em;background:#ff4b3e;color:#fff;padding:3px 9px;border-radius:6px;margin-right:6px}
.np{margin-top:6px;font-weight:700;color:var(--cream);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.np-k{font:500 11px "DM Mono",monospace;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);margin-right:6px}
.eq{display:flex;gap:4px;height:26px;align-items:flex-end;margin:12px 0}
.eq i{width:6px;height:5px;border-radius:3px;background:var(--gold)}
.eq i:nth-child(2n){background:var(--orange)}.eq i:nth-child(3n){background:#d04a9a}
.playing .eq i{animation:bar .9s ease-in-out infinite alternate}
.eq i:nth-child(2){animation-delay:-.3s}.eq i:nth-child(3){animation-delay:-.6s}.eq i:nth-child(4){animation-delay:-.15s}.eq i:nth-child(5){animation-delay:-.45s}.eq i:nth-child(6){animation-delay:-.75s}
@keyframes bar{0%{height:5px}100%{height:26px}}
.vol{display:flex;align-items:center;gap:10px}
.vol svg{width:20px;fill:var(--muted);flex:none}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;max-width:220px;height:6px;border-radius:3px;background:linear-gradient(90deg,var(--gold) var(--v,80%),#3d2766 var(--v,80%));cursor:pointer}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--cream);border:3px solid var(--orange)}
input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--cream);border:3px solid var(--orange)}
.say{margin-top:26px;font-size:14px;color:var(--muted)}
.say em{color:var(--gold);font-style:normal}
.h-sm{font-size:28px;color:var(--gold);margin-bottom:18px}
.recent{padding:0 0 64px}
.recent ol{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.recent li{display:flex;gap:14px;align-items:center;padding:12px;border-radius:16px;background:var(--ink2);border:1px solid rgba(240,180,58,.15)}
.recent img{width:56px;height:56px;border-radius:10px;flex:none;object-fit:cover}
.recent b{display:block;line-height:1.3}.recent small{color:var(--muted)}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding-bottom:96px}
.card{position:relative;padding:44px 40px;border-radius:28px;overflow:hidden;min-height:300px}
.card h2{font-size:clamp(34px,4vw,46px);line-height:1.05;margin:10px 0 16px}
.card p{font-size:18px;max-width:42ch}
.c-orange{background:var(--orange);color:var(--ink)}
.c-plum{background:var(--plum);color:var(--cream)}
.card::after{content:"";position:absolute;right:-70px;bottom:-70px;width:220px;height:220px;border-radius:50%;background:repeating-radial-gradient(circle,rgba(0,0,0,.22) 0 2px,transparent 2px 6px);opacity:.55}
.kicker{font:500 12px "DM Mono",monospace!important;letter-spacing:.2em;text-transform:uppercase;opacity:.85}
.clock{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}
.clock span{font:500 14px "DM Mono",monospace;padding:7px 14px;border-radius:999px;background:rgba(23,11,43,.35)}
.listen{text-align:center;padding-bottom:96px}
.listen .kicker{color:var(--gold)}
.listen h2,.contact h2{font-size:clamp(36px,5vw,56px);color:var(--cream);margin:8px 0 12px}
.listen>p{color:var(--muted);max-width:52ch;margin:0 auto 30px}
.links{display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.pill{display:flex;flex-direction:column;gap:4px;text-decoration:none;padding:18px 26px;border-radius:20px;border:2px solid var(--teal);background:rgba(31,111,120,.15);transition:.2s;min-width:0;max-width:100%}
.pill:hover{background:var(--teal);transform:translateY(-3px)}
.pill span{font-weight:700;color:var(--gold)}
.pill code{font:500 14px "DM Mono",monospace;color:var(--cream);overflow-wrap:anywhere}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding-bottom:96px}
.contact .kicker{color:var(--gold)}.contact p{color:var(--muted)}
.contact-box{padding:36px;border-radius:28px;background:var(--ink2);border:2px solid var(--gold);box-shadow:8px 8px 0 var(--teal)}
.mail{font:700 clamp(18px,2.4vw,26px) "DM Sans",sans-serif;color:var(--orange);text-decoration:none;overflow-wrap:anywhere}
.mail:hover{text-decoration:underline}
.addr{margin-top:8px;color:var(--cream)!important}
.foot{text-align:center;padding:0 24px 40px;color:var(--muted);font-size:14px}
.stripes{display:flex;flex-direction:column;gap:6px;margin:0 -24px 32px}
.stripes i{height:8px}.stripes i:nth-child(1){background:var(--gold)}.stripes i:nth-child(2){background:var(--orange)}.stripes i:nth-child(3){background:var(--plum)}.stripes i:nth-child(4){background:var(--teal)}
@media (max-width:860px){
 .hero{padding:40px 20px 64px}
 .hero-inner{grid-template-columns:1fr;gap:34px;text-align:center}
 .logo{max-width:300px;margin:0 auto}
 .slogan{margin-left:auto;margin-right:auto}
 .player{margin:0 auto;text-align:left}
 .cards,.contact{grid-template-columns:1fr}
 .top nav{display:none}
}
@media (max-width:440px){
 .player{padding:18px;gap:16px;border-radius:22px}
 .play{width:76px;height:76px}.play svg{width:36px;height:36px}
 .card{padding:34px 26px;min-height:0}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}