:root{
  --ink:#fff;
  --bg:#111116;
  --muted:rgba(255,255,255,.66);
  --line:rgba(255,255,255,.28);
  --release-accent:#f3b3a9;
  --cover-size:min(64vh, 700px, 58vw);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font-family:Helvetica,Arial,sans-serif}
body{overflow-x:hidden}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
#groove-bg{position:fixed;inset:0;width:100%;height:100%;z-index:0}
.grain{position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}
.stage{position:relative;z-index:2;min-height:100svh;display:grid;grid-template-rows:auto 1fr auto;padding:24px clamp(20px,3vw,46px) 18px}
.site-header,.footer{display:flex;align-items:center;justify-content:space-between;gap:20px}
.site-header{position:relative;z-index:4}
.brand{display:flex;align-items:center;gap:12px;letter-spacing:.18em;font-size:12px;font-weight:600}
.brand img{width:40px;height:40px;object-fit:contain;transition:transform .55s cubic-bezier(.2,.8,.2,1)}
.brand:hover img{transform:rotate(9deg) scale(1.04)}
.info-button,.close-info,.play-button,.catalog-button{appearance:none;border:0;background:none;color:inherit;cursor:pointer}
.info-button{font-size:12px;letter-spacing:.16em;font-weight:700;padding:10px 0}
.catalog-button{font-size:12px;letter-spacing:.2em;padding:10px 0;color:rgba(255,255,255,.82);text-shadow:0 1px 10px rgba(0,0,0,.34);cursor:default}
.catalog-button.has-info{cursor:pointer}
.catalog-button.has-info:hover{color:#fff}
.release{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:26px 0 34px;text-align:center}
.release-nav{width:min(720px,92vw);display:grid;grid-template-columns:56px 1fr 56px;align-items:center;margin-bottom:-2px}
.catalog{font-size:12px;letter-spacing:.2em;color:rgba(255,255,255,.82);text-shadow:0 1px 10px rgba(0,0,0,.34)}
.nav-arrow{font-family:Georgia,serif;font-size:36px;line-height:1;opacity:.74;transition:opacity .2s,transform .2s}
a.nav-arrow:hover{opacity:1;transform:scale(1.08)}
.nav-arrow.disabled{opacity:.18}
.cover-wrap{width:var(--cover-size);height:var(--cover-size);perspective:900px;display:block}
.cover{width:100%;height:100%;display:block;object-fit:cover;box-shadow:0 28px 70px rgba(0,0,0,.28);transition:transform .8s cubic-bezier(.18,.86,.2,1),box-shadow .8s;transform:translateZ(0)}
.cover-wrap:hover .cover{transform:rotateX(.9deg) rotateY(-1.2deg) scale(1.008);box-shadow:0 34px 80px rgba(0,0,0,.32)}
.cover-placeholder{display:grid;place-items:center;background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.12)}
.cover-placeholder img{width:30%;height:30%;object-fit:contain;opacity:.8}.empty-state .cover-placeholder{width:min(58vw,440px);height:min(58vw,440px)}
.release-meta{margin-top:7px}
.artist{font-size:15px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;text-shadow:0 1px 12px rgba(0,0,0,.42)}
.artist:not(.plain){display:inline-flex;align-items:center;gap:7px}
.artist:not(.plain)::after{content:"";display:inline-block;width:12px;height:12px;flex:0 0 12px;background:center/12px 12px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 9L9 3M5 3h4v4' fill='none' stroke='%23fff' stroke-width='1.5' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E");opacity:.88}
h1{margin:4px 0 0;font-size:clamp(22px,2.3vw,34px);font-weight:400;letter-spacing:-.025em}
.release-subline{margin-top:7px;font-size:12px;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.82);text-shadow:0 1px 10px rgba(0,0,0,.42)}
.player{width:min(620px,82vw);display:flex;align-items:center;gap:14px;margin-top:3px}.play-button{width:34px;height:34px;display:grid;place-items:center;padding:0;flex:0 0 34px}.play-icon{display:block;width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:10px solid currentColor;margin-left:2px}.play-button.is-playing .play-icon{width:10px;height:12px;border:0;margin-left:0;position:relative}.play-button.is-playing .play-icon::before,.play-button.is-playing .play-icon::after{content:"";position:absolute;top:0;bottom:0;width:3px;background:currentColor}.play-button.is-playing .play-icon::before{left:0}.play-button.is-playing .play-icon::after{right:0}.timeline-wrap{flex:1}.timeline{width:100%;height:1px;appearance:none;background:var(--line);outline:none;display:block}.timeline::-webkit-slider-thumb{appearance:none;width:8px;height:8px;border-radius:50%;background:#fff;cursor:pointer}.timeline::-moz-range-thumb{width:8px;height:8px;border:0;border-radius:50%;background:#fff;cursor:pointer}.time-row{display:flex;justify-content:space-between;margin-top:7px;font-size:11px;color:rgba(255,255,255,.82);font-variant-numeric:tabular-nums;text-shadow:0 1px 9px rgba(0,0,0,.4)}
.platforms{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin-top:4px}.platforms a{font-size:12px;letter-spacing:.13em;text-transform:uppercase;border-bottom:1px solid transparent;padding-bottom:3px;transition:border-color .2s;text-shadow:0 1px 10px rgba(0,0,0,.4)}.platforms a:hover{border-color:currentColor}
.footer{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.76);text-shadow:0 1px 10px rgba(0,0,0,.4)}
.info-panel{position:fixed;inset:0 0 0 auto;z-index:10;width:min(430px,100%);background:rgba(10,10,13,.94);backdrop-filter:blur(18px);transform:translateX(100%);transition:transform .55s cubic-bezier(.2,.8,.2,1);padding:28px;color:#fff}.info-panel.open{transform:translateX(0)}.close-info{position:absolute;right:24px;top:18px;font-size:31px;font-weight:200}.info-inner{height:100%;display:flex;flex-direction:column;justify-content:flex-end;gap:24px;font-size:15px;line-height:1.45}.info-inner.info-inner--center{justify-content:center}.info-logo{width:96px;height:96px;object-fit:contain;margin-bottom:auto}.info-inner p{margin:0}.legal{font-size:10px;letter-spacing:.08em;color:var(--muted)}
.release-info-meta{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0 0 14px}
.release-info-text p{margin:0 0 14px}.release-info-text p:last-child{margin-bottom:0}
code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em}
@media (max-width:700px){
  :root{--cover-size:min(74vw,48vh)}
  .stage{padding:16px 16px 14px}
  .brand img{width:36px;height:36px}
  .release{padding-top:14px;gap:13px}
  .release-nav{width:82vw}
  .catalog{font-size:11px}
  .artist{font-size:14px}
  h1{font-size:30px}
  .release-subline{font-size:11px;letter-spacing:.13em}
  .player{width:min(620px,86vw)}
  .platforms a{font-size:12px}
  .footer{font-size:10px}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}