:root { 
	--bg:#080808; 
	--ink:#e8e8e8; 
	--muted:#777; 
	--wine:#5a0808; 
	--red:#8b1010; 
}
* { 
	box-sizing:border-box; 
}
html { 
	background:var(--bg); 
	scroll-behavior:smooth; 
}
body { 
	margin:0; 
	color:var(--ink); 
	background:var(--bg); 
	font-family:'Shippori Mincho', 'Noto Sans JP' ; 
	font-weight:300; 
	overflow-x:hidden; 
}
a { 
	color:inherit; 
}
.ambient, .grain { 
	position:fixed; 
	pointer-events:none; 
	inset:0; 
	z-index:0; 
}
.ambient { 
	overflow:hidden; 
	opacity:.72; 
}
.ambient i { 
	position:absolute; 
	width:135vmax; 
	height:1px; 
	background:linear-gradient(90deg, transparent 15%, rgba(139,16,16,.04), rgba(139,16,16,.65), rgba(90,8,8,.08), transparent 78%); transform:rotate(-25deg); 
	transform-origin:center; 
	filter:blur(.25px); 
	animation:thread 22s ease-in-out infinite alternate; 
}
.ambient i:nth-child(1) { 
	top:18%; left:-38%; 
} 
.ambient i:nth-child(2) {
	top:53%; left:-12%; 
	animation-duration:30s; 
	animation-delay:-8s; opacity:.42; 
	transform:rotate(18deg); 
} 
.ambient i:nth-child(3) { 
	top:84%; left:-50%; 
	animation-duration:26s; 
	animation-delay:-16s; 
	opacity:.25; 
}
.grain { 
	z-index:10; 
	opacity:.035; 
	background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' 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='.7'/%3E%3C/svg%3E"); 
}
main, footer { 
	position:relative; 
	z-index:1; 
}
.hero { 
	min-height:46svh; 
	display:block; 
	position:relative; 
	padding:clamp(5.2rem, 15vh, 8rem) 1.5rem 2rem; 
}
.hero-content { 
	text-align:center; 
	animation:intro .7s .65s both; 
}
h1 { 
	margin:0; 
	font-size:clamp(2.7rem, 11vw, 5.2rem); 
	font-weight:300; letter-spacing:.12em; 
	text-indent:.12em; line-height:1.25; 
}
.roman, .footer-name { 
	margin:1.35rem 0 0; 
	font:300 clamp(.54rem, 2.2vw, .75rem)/1 "Outfit", sans-serif; 
	letter-spacing:.25em; color:#a4a4a4; 
}
.hero-copy { 
	margin:2.6rem 0 0; 
	color:#b4b4b4; 
	font-size:clamp(.85rem, 3.2vw, 1.05rem); 
	line-height:2.15; letter-spacing:.1em; 
	animation:intro .8s 1.35s both; 
}
.hero-line { 
	position:absolute; 
	top:clamp(3.3rem, 10vh, 5.4rem);
	left:50%; width:min(70vw, 380px); 
	height:1px; background:var(--red); 
	opacity:0; 
	transform:translateX(-50%) scaleX(.35); 
	animation:line-in .65s .2s forwards; 
}
.scroll-mark { display:none; }
.section { width:min(100%, 900px); margin:auto; padding:clamp(7rem, 17vw, 11rem) clamp(1.5rem, 7vw, 4rem); }
.music { padding-top:1rem; }
.eyebrow { margin:0 0 1.4rem; font:400 .6rem/1 "Outfit", sans-serif; letter-spacing:.25em; color:#8e8e8e; }.section h2 { margin:0; font-size:clamp(1.4rem, 5vw, 2.1rem); font-weight:300; letter-spacing:.08em; }
.stream-list { margin-top:1.7rem; border-top:1px solid #282020; }.stream-link { min-height:5.65rem; display:flex; align-items:center; gap:1.2rem; border-bottom:1px solid #282020; text-decoration:none; position:relative; transition:border-color .35s ease, padding .35s ease; }.stream-link::before { content:""; position:absolute; left:0; bottom:-1px; width:0; height:1px; background:var(--red); transition:width .45s ease; }.index { align-self:flex-start; padding-top:1.4rem; font:300 .55rem "Outfit",sans-serif; color:#666; }.service { font:300 clamp(1.05rem, 4vw, 1.45rem)/1.2 "Outfit",sans-serif; letter-spacing:.055em; }.service small { display:block; margin-top:.62rem; font-size:.49rem; letter-spacing:.18em; color:#777; }.arrow { margin-left:auto; opacity:0; transform:translateX(-8px); color:#a51b1b; transition:opacity .35s ease, transform .35s ease; }.stream-link:hover, .stream-link:focus-visible { padding-left:.45rem; border-color:#542121; outline:0; }.stream-link:hover::before, .stream-link:focus-visible::before { width:100%; }.stream-link:hover .arrow, .stream-link:focus-visible .arrow { opacity:1; transform:none; }
.jacket { padding-top:clamp(9rem, 22vw, 15rem); }.jacket-intro { text-align:center; margin-bottom:4.5rem; }.jacket-frame { width:min(100%, 520px); margin:0 auto; position:relative; aspect-ratio:1; overflow:hidden; background:#0b0909; box-shadow:0 0 0 1px rgba(139,16,16,.13), 0 25px 75px rgba(0,0,0,.55); }.jacket-frame img { position:relative; z-index:2; width:100%; height:100%; display:block; object-fit:cover; opacity:0; transition:opacity 2.1s ease, transform 5s ease; transform:scale(1.04); }.jacket-frame.loaded img { opacity:1; transform:scale(1); }.jacket-fallback { position:absolute; inset:0; z-index:1; display:grid; place-items:center; background:radial-gradient(circle at 65% 35%, #420606 0, #160909 24%, #080808 67%); color:#bdb2ad; font:300 clamp(1.5rem, 6vw, 2.6rem)/1.05 "Outfit",sans-serif; letter-spacing:.27em; text-indent:.27em; text-align:center; }.jacket-wash { position:absolute; z-index:3; inset:0; pointer-events:none; background:linear-gradient(130deg, #080808 5%, transparent 50%, rgba(90,8,8,.35)); opacity:.9; transition:opacity 2.2s ease; }.jacket-frame.loaded .jacket-wash { opacity:.12; }.release-info { max-width:520px; margin:1.1rem auto 0; display:flex; justify-content:space-between; gap:1rem; font:400 .53rem "Outfit", sans-serif; letter-spacing:.14em; color:#777; }.release-info span:last-child { color:#5d5d5d; }
.listen { min-height:70svh; display:flex; flex-direction:column; justify-content:center; }.listen-copy p:last-child { margin:2rem 0 0; color:#888; font-size:.78rem; letter-spacing:.1em; }.listen-nav { margin-top:4.5rem; display:grid; border-top:1px solid #282020; }.listen-nav a { padding:1.25rem 0; border-bottom:1px solid #282020; text-decoration:none; font:300 .72rem "Outfit",sans-serif; letter-spacing:.18em; transition:color .3s ease, padding .3s ease; }.listen-nav a span { float:right; color:var(--red); opacity:0; transition:opacity .3s; }.listen-nav a:hover, .listen-nav a:focus-visible { color:#d0d0d0; padding-left:.35rem; outline:0; }.listen-nav a:hover span, .listen-nav a:focus-visible span { opacity:1; }
footer { text-align:center; padding:clamp(8rem, 20vw, 13rem) 1.5rem 3rem; }.footer-copy { margin:0; font-size:clamp(1rem, 3.7vw, 1.3rem); line-height:2.15; letter-spacing:.12em; }.footer-name { margin-top:4rem; }.footer-name + small { display:block; margin-top:2rem; color:#555; font:300 .53rem "Outfit",sans-serif; letter-spacing:.15em; }
.reveal { opacity:0; transform:translateY(16px); transition:opacity .85s ease, transform .85s ease; }.reveal.visible { opacity:1; transform:none; }.reveal-jacket { opacity:0; transform:translateY(18px); transition:opacity 1.5s ease, transform 1.5s ease; }.reveal-jacket.visible { opacity:1; transform:none; }
@keyframes intro { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } } @keyframes line-in { to { opacity:.75; transform:translateX(-50%) scaleX(1); } } @keyframes thread { to { transform:rotate(-22deg) translate(4vw, 5vh); } }
@media (min-width:700px) { .hero { min-height:48vh; padding-top:clamp(7rem, 16vh, 10rem); }.hero-copy { margin-top:3rem; }.music { padding-top:1.5rem; }.stream-list { margin-top:2rem; }.stream-link { min-height:6.2rem; }.jacket { padding-top:15rem; }.listen { min-height:80vh; } }
@media (prefers-reduced-motion:reduce) { *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }.ambient { display:none; } }