:root{--navy:#040b22;--navy2:#0a1a46;--blue:#59b8ff;--glow:#2f8cff;--silver:#d8e4f5;--muted:#9fb3d6;--gold:#e9b54d;--gold2:#ffd98a}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:80px;background:#020615}
body{margin:0;min-height:100vh;color:var(--silver);font:16px/1.6 "Segoe UI",system-ui,-apple-system,Roboto,"Noto Sans",sans-serif;background:radial-gradient(1200px 700px at 70% -10%,#16357e 0%,transparent 60%),radial-gradient(900px 600px at 0% 30%,#0d2a6b 0%,transparent 55%),linear-gradient(180deg,#050d2a,#020615 70%);background-attachment:fixed;overflow-x:hidden}
#stars{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.smoke{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;filter:blur(40px);opacity:.55}
.smoke i{position:absolute;width:60vmax;height:60vmax;border-radius:50%;background:radial-gradient(circle,rgba(47,140,255,.35),transparent 65%);animation:drift 38s ease-in-out infinite alternate}
.smoke i:nth-child(1){left:-15vmax;top:10vh}
.smoke i:nth-child(2){right:-20vmax;top:-10vh;background:radial-gradient(circle,rgba(89,184,255,.28),transparent 65%);animation-duration:46s}
.smoke i:nth-child(3){left:20vw;bottom:-30vmax;background:radial-gradient(circle,rgba(233,181,77,.12),transparent 60%);animation-duration:52s}
@keyframes drift{to{transform:translate(8vw,-6vh) scale(1.15) rotate(20deg)}}
a{color:var(--blue)}
img{max-width:100%;display:block}
h1,h2,h3{line-height:1.3;margin:0;overflow-wrap:anywhere}
.nav{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:18px;padding:12px clamp(16px,4vw,48px);background:rgba(4,11,34,.72);backdrop-filter:blur(12px);border-bottom:1px solid rgba(89,184,255,.15)}
.brand{display:flex;align-items:center;gap:10px;color:var(--silver);text-decoration:none;font-weight:600;letter-spacing:.3px;white-space:nowrap}
.brand img{border-radius:8px;box-shadow:0 0 14px rgba(47,140,255,.6)}
.brand b{color:var(--gold2)}
.nav nav{display:flex;gap:clamp(10px,2vw,26px);margin-left:auto;flex-wrap:wrap}
.nav nav a{color:var(--muted);text-decoration:none;font-size:14px}
.nav nav a:hover{color:var(--gold2)}
.lang{font:600 13px/1 inherit;color:var(--gold2);background:rgba(16,34,80,.8);border:1px solid rgba(233,181,77,.5);border-radius:999px;padding:7px 12px;cursor:pointer}
main{max-width:1180px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
.hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,5vw,64px);align-items:center;padding:clamp(40px,8vw,96px) 0 clamp(30px,5vw,60px)}
.eyebrow{text-transform:uppercase;letter-spacing:.22em;font-size:12px;color:var(--blue);margin:0 0 12px}
.hero h1{font-size:clamp(40px,7vw,84px);font-weight:700;letter-spacing:-.5px;line-height:1.12}
.hero h1 span{background:linear-gradient(100deg,#fff6dc 0%,var(--gold2) 30%,var(--gold) 55%,#cfe3ff 90%);-webkit-background-clip:text;background-clip:text;color:transparent;padding:.06em .04em .12em 0;-webkit-box-decoration-break:clone;box-decoration-break:clone;filter:drop-shadow(0 0 22px rgba(233,181,77,.35))}
.by{font-size:clamp(18px,2.2vw,24px);color:var(--silver);margin:6px 0 18px;letter-spacing:.5px}
.lead{font-size:clamp(16px,1.6vw,19px);color:var(--muted);max-width:640px;margin:0 0 28px}
.cta{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.btn{display:inline-flex;align-items:center;gap:12px;padding:12px 22px;border-radius:14px;text-decoration:none;font-weight:600;transition:.2s;line-height:1.25}
.btn.gold{background:linear-gradient(135deg,#ffe3a1,#e9b54d 55%,#b9822a);color:#1b1205;box-shadow:0 0 0 1px rgba(255,230,170,.6) inset,0 10px 40px rgba(233,181,77,.35)}
.btn.gold:hover{transform:translateY(-2px);box-shadow:0 0 0 1px rgba(255,230,170,.8) inset,0 14px 50px rgba(233,181,77,.55)}
.btn.big{padding:14px 26px;font-size:18px}
.btn .ico{font-size:26px;line-height:1.25}
.btn small{display:block;font-weight:500;font-size:12.5px;opacity:.75}
.btn.ghost{color:var(--silver);border:1px solid rgba(89,184,255,.45);background:rgba(16,34,80,.55)}
.btn.ghost:hover{border-color:var(--blue);box-shadow:0 0 24px rgba(47,140,255,.4)}
.fine{font-size:13px;color:#7f93b8;margin:14px 0 0}
.hero-art{position:relative;justify-self:center;width:min(440px,100%)}
.hero-art img{position:relative;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:22px;border:1px solid rgba(233,181,77,.45);box-shadow:0 30px 80px rgba(0,0,0,.6)}
.halo{position:absolute;inset:-8%;border-radius:50%;background:radial-gradient(circle,rgba(47,140,255,.55),transparent 65%);filter:blur(30px);animation:pulse 6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.55;transform:scale(1.05)}}
.sec{padding:clamp(40px,7vw,80px) 0}
.sec h2{font-size:clamp(28px,4vw,44px);text-align:center;color:#f3f7ff;text-shadow:0 0 30px rgba(47,140,255,.45)}
.sub{text-align:center;color:var(--muted);max-width:720px;margin:12px auto 36px}
.center{text-align:center;margin-top:28px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.card{background:linear-gradient(160deg,rgba(22,48,110,.55),rgba(8,18,50,.6));border:1px solid rgba(89,184,255,.2);border-radius:18px;padding:22px;transition:.25s}
.card:hover{border-color:rgba(233,181,77,.5);transform:translateY(-3px);box-shadow:0 12px 40px rgba(47,140,255,.2)}
.ci{font-size:28px;margin-bottom:8px}
.card h3{color:var(--gold2);font-size:19px;margin-bottom:6px}
.card p{margin:0;color:var(--muted);font-size:15px}
.shots{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.shot{margin:0;background:rgba(8,18,50,.6);border:1px solid rgba(89,184,255,.25);border-radius:16px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.shot.main{grid-column:1/-1}
.shot img{width:100%;height:auto}
.shot figcaption{padding:10px 16px;font-size:14px;color:var(--muted)}
.album{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:28px;align-items:start}
.acover{width:100%;height:auto;border-radius:16px;border:1px solid rgba(233,181,77,.4);box-shadow:0 0 50px rgba(47,140,255,.35)}
.tracks{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tracks li{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:14px;align-items:center;padding:12px 16px;border-radius:14px;background:rgba(12,28,72,.6);border:1px solid rgba(89,184,255,.18)}
.tracks li.on{border-color:rgba(233,181,77,.6);background:rgba(40,40,60,.55)}
.play{width:44px;height:44px;border-radius:50%;border:1px solid rgba(233,181,77,.55);background:radial-gradient(circle,#2a4f9e,#0f2258);color:var(--gold2);font-size:16px;cursor:pointer;flex:none}
.tt{min-width:0}
.tt b{display:block;color:#f3f7ff;font-weight:600;overflow-wrap:anywhere}
.tt small{display:block;color:#8ea4cc;font-size:12.5px;overflow-wrap:anywhere}
.bar{height:4px;border-radius:2px;background:rgba(89,184,255,.15);margin-top:7px;overflow:hidden;cursor:pointer}
.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--gold2))}
.dur{color:var(--muted);font-variant-numeric:tabular-nums}
.pill{display:inline-flex;align-items:center;padding:7px 14px;border-radius:999px;border:1px solid rgba(89,184,255,.45);background:rgba(16,34,80,.75);color:#d8e9ff;text-decoration:none;font-size:13px;white-space:nowrap}
.pill:hover{border-color:var(--gold2);color:var(--gold2)}
.dlbox{max-width:760px;margin:0 auto;text-align:center;padding:clamp(28px,5vw,48px);border-radius:24px;background:linear-gradient(160deg,rgba(25,55,125,.6),rgba(6,14,40,.75));border:1px solid rgba(233,181,77,.35);box-shadow:0 0 80px rgba(47,140,255,.25)}
.dlbox>img{margin:0 auto 14px;border-radius:20px;box-shadow:0 0 30px rgba(47,140,255,.6)}
.dlbox p{color:var(--muted)}
.hash{font:12px/1.4 ui-monospace,Consolas,monospace;color:#6f84aa;overflow-wrap:anywhere;margin-top:16px}
.req{margin-top:26px;text-align:left;border-top:1px solid rgba(89,184,255,.2);padding-top:20px}
.req h3{color:var(--gold2);font-size:18px;margin-bottom:8px}
.req ul,.log ul{margin:0;padding-left:20px}
.req li,.log li{margin:4px 0;color:var(--muted)}
.log{display:grid;gap:16px;max-width:860px;margin:0 auto}
.log article{padding:18px 22px;border-radius:16px;background:rgba(12,28,72,.5);border:1px solid rgba(89,184,255,.18)}
.log h3{color:var(--gold2);font-size:20px;margin-bottom:6px}
.log h3 small{color:#7f93b8;font-size:13px;font-weight:400;margin-left:8px}
.foot{text-align:center;padding:40px 20px 50px;border-top:1px solid rgba(89,184,255,.15);color:var(--muted)}
.foot p{margin:4px 0}
.foot b{color:var(--gold2)}
@media (max-width:860px){
  .hero{grid-template-columns:1fr;text-align:left}
  .hero-art{order:-1;width:min(340px,86%)}
  .album{grid-template-columns:1fr}
  .acover{width:min(260px,70%);margin:0 auto}
  .shots{grid-template-columns:1fr}
}
@media (max-width:640px){
  .nav{flex-wrap:wrap;gap:8px 14px}
  .nav nav{order:3;width:100%;margin-left:0;justify-content:space-between;gap:8px}
  .nav nav a{font-size:13px}
  .lang{margin-left:auto}
  .tracks li{grid-template-columns:auto minmax(0,1fr) auto;padding:12px}
  .tracks li .pill{grid-column:2/4;justify-self:start}
  .btn.big{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){.smoke i,.halo{animation:none}}