@font-face{font-family:'Inter Tight';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/inter-tight-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/inter-tight-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:800;font-display:swap;src:url(/assets/fonts/inter-tight-latin-800-normal.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/jetbrains-mono-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/jetbrains-mono-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/noto-jp-500.woff2) format('woff2')}
@font-face{font-family:'Noto Sans JP';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/noto-jp-700.woff2) format('woff2')}
:root{
  --bg:#0A0A0A; --ink:#F4F2EE; --mute:#B8B4AC; --grey:#8A867F; --dim:#55524D;
  --line:#1E1E1E; --line2:#2A2A2A; --red:#E1251B;
  --pad:clamp(20px,4.45vw,64px);
  --sans:'Inter Tight',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --jp:'Noto Sans JP',sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{overflow-x:clip}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--mono);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:var(--ink);text-decoration:none;transition:color .2s}
a:hover{color:var(--grey)}
a:focus-visible,button:focus-visible{outline:1px solid var(--ink);outline-offset:4px}
h1,h2,h3,p{margin:0}
.vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0}
.skip:focus{left:16px;top:16px;background:var(--ink);color:var(--bg);padding:10px 14px;z-index:50}

.label{font-size:11px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--grey);line-height:1.4}
.label .jp{display:block;margin-top:10px;font-family:var(--jp);letter-spacing:.3em;color:var(--dim)}
.red{color:var(--red)}

/* header */
.site-header{position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:48px var(--pad) 0;font-size:11px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;line-height:1}
.site-header .home{color:var(--grey)}
.site-header nav{display:flex;gap:48px}
.site-header nav a[aria-current="page"]{color:var(--red)}
.home-page .site-header{position:absolute;left:0;right:0;top:0}

/* footer */
.site-footer{padding:0 var(--pad) 22px}
.site-footer .row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:32px;border-top:1px solid var(--line);font-size:10px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;line-height:1.4;color:var(--grey)}
.site-footer .legal{margin-top:24px;font-family:var(--sans);font-size:11px;line-height:1.5;color:var(--dim)}
.home-page .site-footer{position:absolute;left:0;right:0;bottom:0}
.home-page .site-footer .row{border-top:0;padding-top:0}
.home-page .site-footer .legal{margin-top:14px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;height:52px;padding:0 36px;border:1px solid var(--ink);background:transparent;color:var(--ink);font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;cursor:pointer;transition:background .25s,color .25s}
.btn:hover{background:var(--ink);color:var(--bg)}
.btn.solid{background:var(--ink);color:var(--bg)}
.btn.solid:hover{background:transparent;color:var(--ink)}
.arrow{width:14px;height:14px;flex:none}

/* HOME */
.home-page main{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:120px var(--pad) 120px;text-align:center}
.logo-wrap{--s:clamp(250px,24vw,340px);position:relative;width:var(--s);height:var(--s)}
.logo-svg{width:100%;height:100%}
.lockup{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--s)*.032);color:var(--ink)}
.lockup .k1{font-size:max(10px,calc(var(--s)*.032));font-weight:500;letter-spacing:.26em;text-shadow:0 1px 3px rgba(0,0,0,.7)}
.lockup h1{font-family:var(--sans);font-weight:800;font-size:calc(var(--s)*.153);line-height:1;letter-spacing:-.012em;word-spacing:.1em}
.lockup .k3{font-family:var(--jp);font-weight:700;font-size:max(10px,calc(var(--s)*.035));letter-spacing:.14em}
.home-line{margin-top:48px;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--grey)}
.home-cta{margin-top:32px}
.vert-jp{position:absolute;right:var(--pad);top:50%;transform:translateY(-50%);writing-mode:vertical-rl;font-family:var(--jp);font-weight:500;font-size:11px;letter-spacing:.4em;color:var(--dim)}

/* PAGE INTRO */
.page{padding:0 var(--pad)}
.intro{display:grid;grid-template-columns:376px 1fr;padding:148px 0 88px;align-items:end}
.intro h1{font-family:var(--sans);font-weight:500;font-size:clamp(52px,6.1vw,88px);line-height:.98;letter-spacing:-.04em}
.intro .lead{margin-top:40px;max-width:720px;font-family:var(--sans);font-size:clamp(19px,1.7vw,24px);line-height:1.45;letter-spacing:-.01em;color:var(--mute)}
.intro .lead strong{color:var(--ink);font-weight:500}
.intro-row{display:flex;align-items:flex-end;justify-content:space-between;gap:24px}

/* sections */
.sec{display:grid;grid-template-columns:376px 1fr;padding:72px 0;border-top:1px solid var(--line)}
.sec .body{max-width:720px}
.sec h2{margin-bottom:28px;font-family:var(--sans);font-weight:500;font-size:clamp(30px,2.8vw,40px);line-height:1.1;letter-spacing:-.025em}
.sec p{font-family:var(--sans);font-size:19px;line-height:1.6;color:var(--mute)}
.sec p+p{margin-top:22px}
.sec p strong{color:var(--ink);font-weight:500}
.sec .big{font-size:24px;line-height:1.45;letter-spacing:-.01em;color:var(--ink);font-weight:500}
.sec p a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--dim);text-underline-offset:4px}
.wide .sec{grid-template-columns:minmax(0,1fr) minmax(0,648px);column-gap:64px}

.grid2{display:grid;grid-template-columns:1fr 1fr;column-gap:56px;row-gap:48px}
.card{border-top:1px solid var(--line2);padding-top:22px}
.card .top{display:flex;justify-content:space-between;font-size:11px;font-weight:500;letter-spacing:.22em;color:var(--grey)}
.card .top .jp{font-family:var(--jp);color:var(--dim)}
.card h3{margin-top:16px;font-family:var(--sans);font-weight:500;font-size:24px;letter-spacing:-.02em}
.card p{margin-top:12px;font-size:16px}
.list{margin:18px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px;font-family:var(--sans);font-size:16px;line-height:1.5;color:var(--mute)}
.list li{display:flex;gap:14px}
.list li::before{content:"—";color:var(--dim)}
.faq{border-top:1px solid var(--line2);padding:24px 0}
.faq h3{font-family:var(--sans);font-weight:500;font-size:20px;letter-spacing:-.015em}
.faq p{margin-top:10px;font-size:16px}
.closer{border-top:1px solid var(--line);padding:120px 0 112px;display:flex;flex-direction:column;align-items:center;text-align:center}
.closer p.big{margin-top:22px;font-family:var(--sans);font-weight:500;font-size:clamp(34px,3.4vw,48px);line-height:1.05;letter-spacing:-.03em}
.closer .btn{margin-top:40px}

/* ROSTER */
.roster{border-top:1px solid var(--line2);margin-bottom:120px}
.r-row{display:grid;grid-template-columns:376px 1fr 220px 180px;align-items:center;padding:34px 0;border-bottom:1px solid var(--line);transition:background .25s}
a.r-row:hover{background:#111;color:var(--ink)}
.r-name{font-family:var(--sans);font-weight:500;font-size:clamp(34px,3.9vw,56px);line-height:1;letter-spacing:-.035em;color:var(--grey)}
.r-row.live .r-name{color:var(--ink)}
.r-genre{display:block;margin-top:10px}
.r-status{font-size:11px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--grey)}
.r-row.live .r-status{color:var(--ink)}
.r-act{display:flex;justify-content:flex-end;align-items:center;gap:18px;font-size:11px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}
.r-row.live .r-act{color:var(--ink)}

/* ARTIST */
.artist-top{display:grid;grid-template-columns:minmax(0,600px) minmax(0,648px);justify-content:space-between;column-gap:64px;padding:100px 0}
.photo{position:relative;margin:0;width:100%;aspect-ratio:2/3;background:#F4F4F2;overflow:hidden}
.photo img{width:100%;height:100%;object-fit:cover}
.photo figcaption{position:absolute;left:24px;bottom:24px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--grey)}
.photo .vjp{position:absolute;right:24px;top:24px;writing-mode:vertical-rl;font-family:var(--jp);font-weight:500;font-size:12px;letter-spacing:.4em;color:var(--grey)}
.a-info{display:flex;flex-direction:column}
.a-info h1{margin:36px 0 0 -6px;font-family:var(--sans);font-weight:500;font-size:clamp(88px,10.5vw,152px);line-height:.9;letter-spacing:-.05em}
.a-genre{margin-top:28px;font-family:var(--sans);font-weight:500;font-size:26px;letter-spacing:-.02em}
.stats{margin-top:52px;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #222}
.stat{padding:24px 24px 24px 0;border-bottom:1px solid #222}
.stat:nth-child(odd){border-right:1px solid #222}
.stat:nth-child(even){padding:24px 0 24px 24px}
.stat b{display:block;font-family:var(--sans);font-weight:500;font-size:48px;letter-spacing:-.04em;line-height:1}
.stat span{display:block;margin-top:12px;font-size:10px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;line-height:1.6;color:var(--grey)}
.a-cta{margin-top:auto;padding-top:48px;display:flex;align-items:center;gap:32px;flex-wrap:wrap}
.excl{margin-top:20px;display:flex;align-items:center;gap:10px;font-size:10px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--grey)}
.excl::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--red);flex:none}
.labels-h{font-size:10px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}
.labels{margin-top:12px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:16px;border-top:1px solid var(--line2)}
.labels+.labels-h{margin-top:40px}
.labels div{padding:20px 0;border-bottom:1px solid var(--line);font-family:var(--sans);font-weight:500;font-size:clamp(16px,1.5vw,21px);letter-spacing:-.015em;white-space:nowrap}
.rmx{border-top:1px solid var(--line2)}
.rmx div{display:flex;align-items:baseline;justify-content:space-between;gap:24px;padding:18px 0;border-bottom:1px solid var(--line)}
.rmx b{font-family:var(--sans);font-weight:500;font-size:22px;letter-spacing:-.015em;flex:none;max-width:55%}
.rmx span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);text-align:right}
.links{display:grid;grid-template-columns:repeat(3,1fr);column-gap:40px;border-top:1px solid var(--line2)}
.links a{display:flex;align-items:center;justify-content:space-between;padding:20px 0;border-bottom:1px solid var(--line);font-family:var(--sans);font-weight:500;font-size:20px;letter-spacing:-.015em}
.links a svg{color:var(--grey)}
.now{display:grid;grid-template-columns:1fr 1fr;column-gap:56px}
.now div{border-top:1px solid var(--line2);padding-top:22px}
.now b{display:block;margin-top:14px;font-family:var(--sans);font-weight:500;font-size:30px;letter-spacing:-.025em;line-height:1.1}
.now small{display:block;margin-top:10px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}

/* CONTACT */
.contact{display:grid;grid-template-columns:minmax(0,600px) 1fr;column-gap:64px;align-items:center;padding:100px 0 96px}
.contact h1{margin-top:24px;font-family:var(--sans);font-weight:500;font-size:clamp(48px,4.45vw,64px);line-height:1;letter-spacing:-.035em}
.contact .sub{margin-top:20px;font-family:var(--sans);font-weight:500;font-size:17px;line-height:1.5;color:var(--grey)}
.c-rows{margin-top:44px;border-top:1px solid #222}
.c-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:26px 0;border-bottom:1px solid #222}
.c-row b{font-family:var(--sans);font-weight:500;font-size:28px;letter-spacing:-.02em}
.c-row span{display:flex;align-items:center;gap:20px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--grey);text-align:right}
.c-row:hover span{color:var(--ink)}
.c-note{margin-top:22px;font-family:var(--sans);font-size:15px;line-height:1.5;color:var(--grey)}
.record-wrap{position:relative;justify-self:center;width:min(580px,100%);aspect-ratio:1}
.record-wrap .shadow,.record-wrap .sheen{position:absolute;inset:0;border-radius:50%;pointer-events:none}
.record-wrap .shadow{box-shadow:0 0 0 1px rgba(255,255,255,.05),0 0 80px rgba(225,37,27,.08)}
.record-wrap .sheen{background:conic-gradient(from 30deg,rgba(255,255,255,0) 0deg,rgba(255,255,255,.14) 24deg,rgba(255,255,255,0) 56deg,rgba(255,255,255,0) 180deg,rgba(255,255,255,.10) 204deg,rgba(255,255,255,0) 236deg)}
.record-svg{position:absolute;inset:0;width:100%;height:100%;cursor:grab;touch-action:none;transform-origin:50% 50%;user-select:none;-webkit-user-select:none}
.record-svg.held{cursor:grabbing}
.record-hint{margin-top:20px;text-align:center;font-size:10px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}

/* 404 */
.nf{min-height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:28px}
.nf h1{font-family:var(--sans);font-weight:500;font-size:64px;letter-spacing:-.04em}

/* motion */
@keyframes k-fade{from{opacity:0}to{opacity:1}}
@keyframes k-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes k-mask{from{opacity:0;clip-path:inset(0 0 100% 0);transform:translateY(28px)}to{opacity:1;clip-path:inset(0 0 -20% 0);transform:none}}
@keyframes k-reveal{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes k-logo{from{opacity:0;transform:rotate(-150deg) scale(.94)}to{opacity:1;transform:none}}
.a-fade{animation:k-fade 1.1s var(--ease) both}
.a-rise{animation:k-rise 1s var(--ease) both}
.a-mask{animation:k-mask 1.2s var(--ease) both}
.a-reveal{animation:k-reveal 1.4s cubic-bezier(.76,0,.24,1) both}
.a-logo{animation:k-logo 2s var(--ease) both;transform-origin:50% 50%}
.d1{animation-delay:.1s}.d2{animation-delay:.2s}.d3{animation-delay:.3s}.d4{animation-delay:.4s}.d5{animation-delay:.5s}.d6{animation-delay:.6s}.d7{animation-delay:.7s}.d8{animation-delay:.8s}.d9{animation-delay:.9s}.d10{animation-delay:1s}.d11{animation-delay:1.1s}.d12{animation-delay:1.2s}.d14{animation-delay:1.4s}.d16{animation-delay:1.6s}
.js .sr{opacity:0;transform:translateY(20px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.js .sr.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .a-fade,.a-rise,.a-mask,.a-reveal,.a-logo{animation:none!important}
  .js .sr{opacity:1;transform:none;transition:none}
}

/* responsive */
@media (max-width:1180px){
  .intro,.sec{grid-template-columns:240px 1fr}
  .wide .sec{grid-template-columns:240px minmax(0,1fr)}
  .r-row{grid-template-columns:120px 1fr 180px 150px}
  .artist-top{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:48px}
}
@media (max-width:900px){
  .site-header{padding-top:24px}
  .site-header nav{gap:24px}
  .intro{grid-template-columns:1fr;padding:96px 0 56px;gap:28px}
  .intro-row{flex-direction:column;align-items:flex-start}
  .sec,.wide .sec{grid-template-columns:1fr;gap:28px;padding:56px 0}
  .grid2,.now{grid-template-columns:1fr;row-gap:36px}
  .r-row{grid-template-columns:44px 1fr;row-gap:12px;padding:28px 0}
  .r-status{grid-column:2}
  .r-act{grid-column:2;justify-content:flex-start}
  .artist-top{grid-template-columns:1fr;padding:48px 0 64px;row-gap:40px}
  .a-info h1{margin-top:20px}
  .links{grid-template-columns:repeat(2,1fr);column-gap:24px}
  .labels{grid-template-columns:repeat(2,minmax(0,1fr))}
  .labels div{font-size:20px}
  .contact{grid-template-columns:1fr;padding:64px 0;row-gap:56px}
  .vert-jp{display:none}
}
@media (max-width:600px){
  .site-header{font-size:10px;letter-spacing:.18em}
  .site-header .home{display:none}
  .site-header{justify-content:center}
  .home-page main{padding:96px var(--pad) 72px}
  .home-page .site-footer .row{justify-content:center}
  .home-page .site-footer .legal{text-align:center}
  .btn{width:100%}
  .home-cta{width:100%}
  .stat b{font-size:36px}
  .stat{padding:18px 14px 18px 0}
  .stat:nth-child(even){padding:18px 0 18px 14px}
  .rmx div{flex-direction:column;gap:6px}
  .rmx span{text-align:left}
  .links{grid-template-columns:1fr}
  .c-row{flex-direction:column;align-items:flex-start;gap:8px}
  .c-row span{text-align:left}
  .site-footer .row{flex-direction:column;align-items:flex-start}
  .closer{padding:80px 0}
  .home-page .site-footer .row{align-items:center}
  .roster{margin-bottom:64px}
  .sec p{font-size:17px}
  .sec .big{font-size:21px}
  .intro .lead{font-size:18px}
  .record-wrap{width:100%}
}
