:root{
  color-scheme:dark;
  font-family:Arial,Helvetica,sans-serif;
  color:#f2f7fb;
  background:#02040a;
  --ink:#02040a;
  --panel:rgba(3,8,17,.78);
  --panel-deep:rgba(1,4,10,.92);
  --cyan:#52d9ff;
  --mint:#8ff4d7;
  --violet:#a56cff;
  --pink:#f35fc8;
  --edge:rgba(82,217,255,.38);
  --muted:#9db2c4;
}
html{scroll-behavior:smooth;overscroll-behavior-y:none}
*{box-sizing:border-box}
body{margin:0;min-width:280px;min-height:100svh;background:#02040a;color:#f2f7fb}
a{color:inherit}
button,a,input,select{-webkit-tap-highlight-color:transparent}
button,input,select{font:inherit;color:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--mint);outline-offset:4px}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:14px;top:12px;transform:translateY(-180%);z-index:100;padding:12px 15px;border:1px solid var(--mint);border-radius:12px;background:#020711;text-decoration:none}.skip-link:focus{transform:none}

.wallpaper{position:fixed;inset:0;z-index:-2;overflow:hidden;pointer-events:none;background:#02040a url('../../assets/smoke-wallpaper-v107.webp') center/cover no-repeat;isolation:isolate}
.wallpaper:before{content:'';position:absolute;inset:-7%;background:url('../../assets/smoke-wallpaper-v107.webp') center/cover no-repeat;opacity:.58;animation:smoke-flow 22s ease-in-out -7s infinite alternate;will-change:transform}
.wallpaper__cosmos{position:absolute;inset:-6%;background:url('../../assets/jackalos-cosmic-flow-v1.webp') center/cover no-repeat;opacity:.27;mix-blend-mode:screen;animation:cosmos-flow 30s ease-in-out -12s infinite alternate;will-change:transform}
.wallpaper__colour{position:absolute;inset:0;background:linear-gradient(118deg,rgba(243,95,200,.78) 0%,rgba(139,73,246,.82) 27%,rgba(41,96,230,.72) 55%,rgba(0,194,255,.62) 77%,rgba(24,242,181,.62) 100%);mix-blend-mode:color;opacity:.82}
.wallpaper__lift{position:absolute;inset:0;background:radial-gradient(circle at 50% -8%,rgba(174,103,255,.34),transparent 38%),radial-gradient(circle at 14% 42%,rgba(18,202,255,.12),transparent 30%),radial-gradient(circle at 88% 74%,rgba(255,63,185,.12),transparent 30%),linear-gradient(180deg,rgba(2,4,10,.12),rgba(2,4,10,.72) 76%,#02040a 100%)}
.wallpaper__energy{position:absolute;inset:0;opacity:.32;background:repeating-linear-gradient(112deg,transparent 0 13%,rgba(96,225,255,.06) 13.2% 13.35%,transparent 13.55% 26%);mask-image:linear-gradient(180deg,transparent 0,#000 18%,#000 70%,transparent 100%)}
@keyframes smoke-flow{from{transform:translate(-1.6%,1.2%) rotate(-1deg) scale(1.04)}to{transform:translate(1.7%,-1.4%) rotate(1deg) scale(1.08)}}
@keyframes cosmos-flow{from{transform:translate(1.9%,-1.4%) rotate(1.2deg) scale(1.05)}to{transform:translate(-2%,1.4%) rotate(-1.2deg) scale(1.1)}}

.page-shell{width:min(100%,1120px);min-height:100svh;margin:0 auto;padding:max(18px,env(safe-area-inset-top)) 18px max(42px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:18px}
.page-header,.glass{position:relative;border:1px solid var(--edge);background:linear-gradient(145deg,rgba(5,11,23,.88),rgba(1,4,10,.82));box-shadow:inset 0 1px 0 rgba(255,255,255,.045),inset 0 0 28px rgba(65,154,219,.035),0 18px 48px rgba(0,0,0,.38);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.page-header:after,.glass:after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(120deg,rgba(255,255,255,.035),transparent 30%,transparent 70%,rgba(108,70,255,.055));mix-blend-mode:screen}
.page-header{overflow:hidden;border-radius:30px;padding:20px clamp(18px,5vw,52px) 32px;text-align:center}
.page-header:before{content:'';position:absolute;left:12%;right:12%;top:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--pink),var(--cyan),var(--mint),transparent);box-shadow:0 0 20px var(--cyan)}
.header-actions{position:relative;z-index:2;display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:24px}
.nav-chip{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 16px;border:1px solid rgba(121,207,241,.34);border-radius:999px;background:rgba(2,7,14,.62);text-decoration:none;text-transform:uppercase;letter-spacing:.12em;font-size:.73rem;color:#dcebf5;transition:border-color .2s ease,background .2s ease,transform .2s ease}
.nav-chip:hover{border-color:rgba(143,244,215,.72);background:rgba(9,24,34,.72);transform:translateY(-1px)}
.eyebrow,.section-kicker{margin:0;color:#9bc8d5;text-transform:uppercase;letter-spacing:.22em;font-size:.68rem}
.page-header h1{position:relative;z-index:1;margin:8px 0 4px;font-size:clamp(3.1rem,10vw,6.4rem);line-height:.92;font-weight:200;letter-spacing:.12em;text-transform:uppercase;text-shadow:0 0 30px rgba(104,214,255,.24),0 0 55px rgba(185,89,255,.14)}
.intro{max-width:650px;margin:12px auto 0;color:#d8e6ef;font-size:clamp(.98rem,2vw,1.08rem);line-height:1.65}
.masthead-mark{display:flex;align-items:flex-end;justify-content:center;gap:5px;height:24px;margin:2px auto 14px;opacity:.86}
.masthead-mark span{display:block;width:3px;border-radius:99px;background:linear-gradient(180deg,var(--pink),var(--cyan));box-shadow:0 0 12px rgba(82,217,255,.62)}
.masthead-mark span:nth-child(1){height:9px}.masthead-mark span:nth-child(2){height:23px}.masthead-mark span:nth-child(3){height:14px}
.masthead-meta{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:18px;color:#a9bdcb;font-size:.72rem;text-transform:uppercase;letter-spacing:.12em}.masthead-meta i{display:block;width:4px;height:4px;border-radius:50%;background:var(--mint);box-shadow:0 0 10px var(--mint)}

.glass{border-radius:30px;overflow:hidden}
.listening-room{padding:clamp(18px,4vw,40px)}
.listening-room__stage{position:relative;z-index:1;display:grid;grid-template-columns:minmax(260px,.9fr) minmax(320px,1.1fr);gap:clamp(22px,4vw,48px);align-items:center}
.listening-room:before{content:'';position:absolute;inset:auto -12% -45% 32%;height:70%;background:radial-gradient(ellipse,rgba(62,206,255,.12),transparent 65%);pointer-events:none}
.hero-art{position:relative;z-index:1;min-width:0}
.hero-art__frame{position:relative;aspect-ratio:1;border-radius:26px;overflow:hidden;background:radial-gradient(circle at 34% 24%,rgba(156,93,255,.25),transparent 32%),linear-gradient(145deg,#08111f,#02050b 70%);border:1px solid rgba(108,208,245,.38);box-shadow:inset 0 0 40px rgba(86,52,181,.16),0 26px 55px rgba(0,0,0,.38)}
.hero-art__frame:after{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(255,255,255,.035);pointer-events:none}
.player__art{display:block;width:100%;height:100%;object-fit:cover}
.hero-art__placeholder{position:absolute;inset:0;display:grid;place-items:center;background:radial-gradient(circle at 50% 45%,rgba(89,111,255,.2),transparent 42%)}
.hero-art__jackal{width:44%;aspect-ratio:1;background:url('../../assets/jackalmuse-sign-transparent-v105.webp') center/contain no-repeat;filter:drop-shadow(0 0 18px rgba(88,222,255,.32));opacity:.7}
.hero-art__pulse{position:absolute;width:62%;aspect-ratio:1;border:1px solid rgba(92,219,255,.22);border-radius:50%;box-shadow:0 0 35px rgba(164,92,255,.12),inset 0 0 30px rgba(79,221,255,.08)}
.hero-art__label{display:block;margin:12px 4px 0;color:#8099aa;font-size:.64rem;text-transform:uppercase;letter-spacing:.18em;text-align:center}
.player-console{position:relative;z-index:1;min-width:0;padding:8px 0}
.now-kicker{margin:0;color:#7ce8ef;letter-spacing:.18em;text-transform:uppercase;font-size:.68rem}
.now-title{margin:9px 0 7px;font-size:clamp(1.9rem,4.8vw,3.35rem);line-height:1.04;font-weight:700;letter-spacing:-.012em}
.now-artist,.now-date,.now-description{margin:0;color:#aebdca}.now-artist{font-size:1rem;font-weight:500;letter-spacing:.025em}.now-date{margin-top:4px;color:#8fa8b9;font-size:.78rem;letter-spacing:.055em}.now-description{max-width:58ch;margin-top:9px;color:#b9cbd6;font-size:.86rem;line-height:1.48}.now-artist[hidden],.now-date[hidden],.now-description[hidden]{display:none}
.soundline{display:flex;align-items:center;gap:5px;height:34px;margin:25px 0 14px;overflow:hidden;opacity:.76}
.soundline i{display:block;flex:1;min-width:3px;max-width:7px;border-radius:99px;background:linear-gradient(180deg,var(--pink),var(--cyan),var(--mint));box-shadow:0 0 8px rgba(82,217,255,.3)}
.soundline i:nth-child(1),.soundline i:nth-child(12){height:8px}.soundline i:nth-child(2),.soundline i:nth-child(10){height:17px}.soundline i:nth-child(3),.soundline i:nth-child(9){height:26px}.soundline i:nth-child(4),.soundline i:nth-child(8){height:13px}.soundline i:nth-child(5),.soundline i:nth-child(11){height:30px}.soundline i:nth-child(6){height:20px}.soundline i:nth-child(7){height:34px}
.seek{display:grid;grid-template-columns:42px 1fr 42px;gap:10px;align-items:center;color:#8fa4b6;font-size:.72rem;font-variant-numeric:tabular-nums}
.seek input{width:100%;height:24px;margin:0;accent-color:var(--mint);cursor:pointer}.seek input:disabled{cursor:default;opacity:.42}
.transport{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:20px}
.transport button{display:grid;place-items:center;width:52px;height:52px;padding:0;border-radius:50%;border:1px solid rgba(91,188,226,.45);background:rgba(3,10,20,.8);font-size:1.55rem;cursor:pointer;box-shadow:inset 0 0 12px rgba(91,188,226,.04);transition:transform .18s ease,border-color .18s ease,background .18s ease}
.transport button:hover{transform:translateY(-1px);border-color:rgba(143,244,215,.72);background:rgba(8,22,30,.86)}.transport button:disabled{opacity:.34;cursor:default;transform:none;border-color:rgba(91,188,226,.22)}
.transport .transport__play{width:68px;height:68px;font-size:1.05rem;border-color:rgba(143,244,215,.86);background:radial-gradient(circle at 40% 35%,rgba(48,99,111,.9),rgba(3,11,18,.96));box-shadow:0 0 24px rgba(143,244,215,.16),inset 0 0 18px rgba(143,244,215,.08)}

.library{padding:clamp(18px,4vw,34px)}
.library--embedded{position:relative;z-index:1;margin-top:clamp(24px,4vw,38px);padding:clamp(22px,3vw,30px) 0 0;border-top:1px solid rgba(111,170,202,.2)}
.library-body{display:grid;grid-template-columns:minmax(240px,.82fr) minmax(0,1.18fr);gap:clamp(14px,2.5vw,24px);align-items:start}
.release-column{min-width:0}
.section-head{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:14px}
.section-head h2,.creator h2,.studio h2{margin:4px 0 0;font-weight:300;letter-spacing:.06em;text-transform:uppercase;font-size:clamp(1.35rem,3vw,2rem)}
#list-count{color:#9ab4c4;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}
.library-status{position:relative;z-index:1;margin:0 0 17px;padding:10px 13px;border-left:2px solid rgba(143,244,215,.56);background:linear-gradient(90deg,rgba(64,203,176,.075),transparent);color:#bdd0dc;font-size:.82rem;line-height:1.45}
.library-status.is-error{border-left-color:#f0ae63;color:#e8c9a7;background:linear-gradient(90deg,rgba(222,151,74,.08),transparent)}
.release-list{position:relative;z-index:1;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:11px}
.release{display:grid;grid-template-columns:70px 1fr 22px;gap:12px;align-items:center;width:100%;min-height:86px;padding:8px;border:1px solid rgba(83,143,188,.24);border-radius:18px;background:linear-gradient(135deg,rgba(7,15,28,.58),rgba(4,8,16,.7));text-align:left;cursor:pointer;transition:transform .18s ease,border-color .18s ease,background .18s ease}
.release:hover{transform:translateY(-1px);border-color:rgba(82,217,255,.48);background:linear-gradient(135deg,rgba(10,23,39,.7),rgba(5,9,19,.8))}
.release.is-selected{border-color:rgba(143,244,215,.72);box-shadow:inset 0 0 18px rgba(76,235,203,.055),0 0 20px rgba(78,207,255,.055)}
.release__art{display:block;width:70px;height:70px;border-radius:13px;overflow:hidden;background:linear-gradient(145deg,#10192b,#04070e);border:1px solid rgba(255,255,255,.055)}
.release__art img{display:block;width:100%;height:100%;object-fit:cover}
.release__fallback{display:block;width:100%;height:100%;background:url('../../assets/jackalmuse-sign-transparent-v105.webp') center/62% no-repeat,radial-gradient(circle,rgba(83,221,255,.14),transparent 68%)}
.release__copy{display:flex;flex-direction:column;gap:5px;min-width:0}.release__copy b{overflow:hidden;text-overflow:ellipsis;font-size:.94rem;font-weight:500;white-space:nowrap}.release__copy small{color:#88a8ba;text-transform:uppercase;letter-spacing:.1em;font-size:.62rem}.release__arrow{color:#78dff0;font-size:1.45rem}
.empty{position:relative;z-index:1;margin:14px 0 0;color:#bdd0dc}
.tracks-panel{position:relative;z-index:1;margin:0;padding:0 0 0 clamp(14px,2vw,22px);border-top:0;border-left:1px solid rgba(111,170,202,.16)}
.tracks-panel__head{display:flex;justify-content:space-between;gap:16px;margin-bottom:9px;color:#809aac;font-size:.65rem;text-transform:uppercase;letter-spacing:.14em}
#track-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
.track{display:grid;grid-template-columns:38px 1fr auto;gap:10px;align-items:center;width:100%;min-height:58px;padding:8px 12px;border:1px solid transparent;border-radius:15px;background:rgba(6,13,23,.34);text-align:left;cursor:pointer;transition:border-color .18s ease,background .18s ease}
.track:hover{border-color:rgba(89,180,217,.3);background:rgba(8,19,32,.56)}.track.is-current{border-color:rgba(143,244,215,.48);background:rgba(9,28,32,.5)}
.track__number{color:#6f8b9d;font-size:.68rem;font-variant-numeric:tabular-nums}.track__copy{display:flex;flex-direction:column;gap:3px;min-width:0}.track__copy b{overflow:hidden;text-overflow:ellipsis;font-size:.9rem;font-weight:500;white-space:nowrap}.track__copy small{color:#6f8b9d;font-size:.6rem;letter-spacing:.09em}.track__action{color:#84e7d2;font-size:.65rem;text-transform:uppercase;letter-spacing:.1em}
.track__copy .track__plays{color:#86a6ad;font-size:.6rem;letter-spacing:.02em;font-variant-numeric:tabular-nums}

.creator{display:grid;grid-template-columns:minmax(0,.82fr) minmax(320px,1.18fr);gap:26px;align-items:center;padding:clamp(18px,4vw,34px)}
.creator__copy{position:relative;z-index:1}.creator__copy p:not(.section-kicker){max-width:460px;margin:12px 0 0;color:#b8cad6;line-height:1.62;font-size:.92rem}
.profile-link{display:inline-flex;align-items:center;gap:8px;min-height:46px;margin-top:18px;padding:11px 17px;border:1px solid rgba(82,217,255,.42);border-radius:999px;background:linear-gradient(145deg,rgba(8,18,32,.84),rgba(1,7,14,.84));text-decoration:none;text-transform:uppercase;letter-spacing:.09em;font-size:.7rem;transition:border-color .18s ease,transform .18s ease}.profile-link:hover{border-color:var(--mint);transform:translateY(-1px)}
.creator__preview{position:relative;z-index:1;display:block;overflow:hidden;border:1px solid rgba(108,208,245,.32);border-radius:22px;background:#050811;text-decoration:none;box-shadow:0 20px 42px rgba(0,0,0,.32)}
.creator__preview img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;object-position:center 23%;opacity:.9;transition:transform .3s ease,opacity .3s ease}.creator__preview:hover img{transform:scale(1.015);opacity:1}
.creator__preview-label{position:absolute;left:12px;right:12px;bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 12px;border:1px solid rgba(255,255,255,.1);border-radius:13px;background:rgba(2,5,10,.78);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:.72rem}.creator__preview-label b{text-transform:uppercase;letter-spacing:.12em}.creator__preview-label span{color:#b7c7d2}

/* Shared form/release primitives retained for the private Studio. */
.player.glass,.playlist.glass,.studio.glass{padding:20px}
.player__art[hidden]{display:none!important}
.field{display:flex;flex-direction:column;gap:7px;margin:10px 0;color:#d7e5f1;font-size:.82rem}.field input,.field select{width:100%;min-height:48px;padding:0 12px;border:1px solid rgba(46,194,255,.34);border-radius:14px;background:#060b14;color:#edf3fb;font-size:16px}

@media(max-width:760px){
  .page-shell{padding-left:13px;padding-right:13px;gap:13px}
  .page-header,.glass{border-radius:24px}
  .page-header{padding:16px 16px 26px}
  .header-actions{margin-bottom:20px}
  .listening-room{padding:15px}
  .listening-room__stage{grid-template-columns:1fr;gap:22px}
  .hero-art{width:min(calc(100% + 28px),460px);margin-left:-14px;margin-right:-14px;justify-self:center}
  .player-console{padding:0 5px 7px}
  .release-list{grid-template-columns:1fr}
  .library-body{grid-template-columns:1fr;gap:18px}
  .tracks-panel{padding:18px 0 0;border-left:0;border-top:1px solid rgba(111,170,202,.16)}
  .creator{grid-template-columns:1fr;gap:20px;padding:18px}
  .creator__preview{order:-1}
}
@media(max-width:430px){
  .page-header h1{font-size:clamp(2.7rem,17vw,4.1rem)}
  .masthead-meta{font-size:.61rem}
  .release{grid-template-columns:62px 1fr 18px}.release__art{width:62px;height:62px}
  .track{grid-template-columns:30px 1fr auto;padding-inline:9px}
  .track__action{font-size:.59rem}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.wallpaper:before,.wallpaper__cosmos{animation:none}.nav-chip,.release,.track,.profile-link,.creator__preview img,.transport button{transition:none}}
