/* Editorial layout. The existing hero photography and motion remain intact. */
:root {
  --bg: #eef0eb;
  --paper: #f5f4f0;
  --surface: #e8ece7;
  --surface2: #fff;
  --ink: #242923;
  --text: #292e29;
  --muted: #626a62;
  --border: #d2d7cf;
  --gold: #796246;
}
html { scrollbar-gutter: stable; }
section, footer { scroll-margin-top: 76px; }
button, input, select, textarea { font: inherit; }
button, summary { cursor: pointer; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid #867049; outline-offset: 5px; }
.skip-link { position: fixed; top: -80px; left: 1rem; z-index: 500; padding: 0.75rem; background: #fff; color: #222; }
.skip-link:focus { top: 0.5rem; }
.header__menu-btn { width: 44px; height: 44px; justify-content: center; align-items: center; }
.header__nav-list a { display: inline-flex; align-items: center; min-height: 44px; color: #e3e4dd; }
.hero { min-height: calc(100svh - 24px); }
.hero__inner { grid-template-columns: minmax(0, 1fr) 300px; gap: 2.5rem; }
.hero__title-line { width: auto; white-space: normal; }
.hero__title-word { display: inline-block; white-space: nowrap; }
.hero__title-char { vertical-align: baseline; }
.hero__release { min-height: 148px; }
.hero-release__card { grid-template-columns: 96px minmax(0, 1fr); min-height: 148px; padding: 0.8rem; gap: 0.8rem; }
.hero-release__title { font-size: 0.88rem; }
.hero--fallback-title .hero__title { font-family: Georgia, 'Times New Roman', serif; font-size: 3.6rem; line-height: 1.06; }
.hero--fallback-ui :is(.hero__lead, .hero__sub, .hero__listen-btn, .hero__text-link, .hero-release__title, .hero-release__eyebrow, .hero-release__caption) { font-family: system-ui, sans-serif; }
.hero--returning :is(.hero__logo-img, .hero__sub, .hero__title-char, .hero__lead, .hero__actions, .hero__release, .hero__scroll) {
  animation-duration: 0.7s;
  animation-delay: 0.1s;
}
.hero--returning .hero__bg-img { transition-duration: 1.2s; }
.section {
  --paper: #f6f3ec;
  --text: #242623;
  --muted: #656760;
  --border: #d5d6ce;
  --accent: #9b3e34;
  --heading-shadow: 0 3px 10px rgba(36,38,35,0.12);
  --font-classic: 'Libre Baskerville', Baskerville, 'Palatino Linotype', Georgia, serif;
  --font-literary: 'Yu Mincho', 'Hiragino Mincho ProN', 'Noto Serif JP', serif;
  padding: 5.5rem 0;
}
.section, .footer { position: relative; isolation: isolate; }
.header { isolation: isolate; }
.section::before, .footer::before, .header::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: url('assets/img/film-grain.webp') repeat 0 0 / 512px 512px;
  mix-blend-mode: multiply;
  opacity: 0.22;
}
.section.live::before, .footer::before, .header::before { mix-blend-mode: screen; filter: invert(1); opacity: 0.16; }
/* Texture covers the typography; original media and editable fields stay clean. */
.music__art, .music__selection > img, .disc__item-img, .live__flyer,
.profile__img, .works__image,
.form__group input, .form__group select, .form__group textarea { position: relative; z-index: 3; }
.section__title {
  margin-bottom: 2.5rem;
  color: var(--text);
  font: 400 3rem/1.2 var(--font-classic);
  gap: 1.5rem;
  flex-wrap: wrap;
}
.section__title > span { font-style: normal; }
.section__title,
.music__story h3,
.live__information h3,
.profile__name,
.works__selection h3,
.works__archive h3,
.works__archive > summary,
.disc__archive > summary { text-shadow: var(--heading-shadow); }
.section__title::after { flex: 0 0 40px; background: var(--accent); }
.section.news { background: var(--paper); padding: 3rem 0 1rem; }
.news .section__inner { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 0 2rem; }
.news .section__title { align-self: start; margin: 0; font-size: 1.7rem; }
.news .section__title::after { display: none; }
.news__list { border-top: 0; }
.news .archive { grid-column: 2; }
.news__item { border-bottom: 1px solid var(--border); }
.news__item a { display: grid; grid-template-columns: 90px 76px minmax(0, 1fr) 16px; align-items: center; gap: 0.75rem; padding: 0.9rem 0; }
.news__item-date, .news__item-cat { color: var(--muted); font-size: 0.7rem; }
.news__item-date { font-family: var(--font-en); }
.news__item-title { font-size: 0.8rem; line-height: 1.8; }
.archive { border-top: 1px solid var(--border); margin-top: 2rem; }
.archive > summary { padding: 1rem 0; min-height: 48px; font-size: 0.8rem; font-weight: 500; width: fit-content; max-width: 100%; }
.archive[open] > summary { margin-bottom: 1rem; }
.news .archive { margin-top: 0; border-top: 0; }
.news .archive > summary { padding-bottom: 0; }
.section.discography { background: var(--paper); }
.eyebrow { font-family: var(--font-en), var(--font-ja); font-size: 0.7rem; font-weight: 500; color: var(--muted); }
.music__feature { display: grid; grid-template-columns: minmax(0, 480px) minmax(0, 1fr); gap: 4rem; align-items: center; }
.music__art { border: 0; background: transparent; aspect-ratio: 1; width: 100%; text-align: left; box-shadow: 0 0 18px 3px #fff3d238, 0 4px 8px #24262324, 0 20px 34px -12px #24262361; transition: transform 0.5s ease, box-shadow 0.5s ease; }
.music__art img { width: 100%; height: 100%; object-fit: cover; }
.music__story { padding-block: 1.5rem; }
.music__story .eyebrow { color: var(--accent); }
.music__story h3 { font: 400 2.1rem/1.65 var(--font-literary); margin: 1.5rem 0; overflow-wrap: anywhere; }
.music__format { color: var(--muted); font-family: var(--font-en); font-size: 0.8rem; }
.music__services { display: flex; flex-wrap: wrap; gap: 0.2rem 1.5rem; margin-top: 2rem; }
.music__services a { display: inline-flex; align-items: center; gap: 0.6rem; min-height: 44px; font-size: 0.8rem; border-bottom: 1px solid var(--border); }
.music__services svg { width: 16px; height: 16px; fill: currentColor; }
.music__selections { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.65fr); gap: 4rem; margin-top: 4rem; align-items: end; }
.music__selection { display: block; background: none; color: var(--text); border: none; text-align: left; min-width: 0; }
.music__selection > img { width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; box-shadow: 0 4px 8px #2426231f, 0 16px 28px -10px #24262352; }
.music__selection > span { display: block; margin-top: 1rem; }
.music__selection--record { width: 100%; max-width: 248px; justify-self: end; }
.music__selection--record > img { aspect-ratio: 1; object-fit: contain; }
.music__selection strong { display: block; font: 400 1.45rem/1.5 var(--font-literary); margin: 0.3rem 0; }
.music__selection--record strong { font-family: var(--font-classic); font-size: 1.3rem; }
.music__selection > span > span:last-child { color: var(--muted); font-size: 0.75rem; }
.disc__item { display: block; width: 100%; border: none; background: none; color: var(--text); text-align: left; }
.disc__item > span { display: block; }
.disc__item-img { box-shadow: none; }
.disc__tab { min-height: 44px; }
.disc__archive { margin-top: 3rem; border-top: 1px solid #83887c; scroll-margin-top: 92px; }
.disc__archive[open] > summary { margin-bottom: 1.5rem; }
.section.live { background: #252925; color: #f5f5ef; --text: #f5f5ef; --muted: #b8bdb4; --border: #51584e; --gold: #ddd1b8; --accent: #c58476; }
.section.live { --heading-shadow: 0 3px 12px rgba(0,0,0,0.22); }
.live__list { display: grid; gap: 0; }
.live__row { display: grid; grid-template-columns: 116px minmax(0, 1fr) auto; gap: 2rem; align-items: center; padding: 1.8rem 0; border-top: 1px solid var(--border); }
.live__row:last-child { border-bottom: 1px solid var(--border); }
.live__flyer { display: block; background: #fff; width: 116px; height: 154px; box-shadow: 0 4px 8px #00000042, 0 16px 24px -8px #00000099; }
.live__flyer img { width: 100%; height: 100%; object-fit: contain; }
.live__information h3 { font: 400 1.3rem/1.7 var(--font-literary); margin: 0.5rem 0; }
.live__card-date { font: italic 500 1.1rem/1.5 var(--font-serif); color: #ddd1b8; }
.live__card-venue, .live__card-perform { font-size: 0.76rem; color: var(--muted); margin-top: 0.5rem; }
.live__ticket { min-height: 44px; padding: 0.5rem 0; border-bottom: 1px solid var(--border); font-family: var(--font-en), var(--font-ja); font-size: 0.8rem; white-space: nowrap; }
.live__ticket span { margin-left: 1rem; }
.live__sns-note { font-size: 0.78rem; color: var(--muted); margin-top: 1.5rem; }
.live__sns-note a { text-decoration: underline; text-underline-offset: 4px; }
.section.profile { background: var(--paper); padding-bottom: 3rem; }
.profile__wrap { grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: 3.5rem; align-items: start; }
.profile__img { aspect-ratio: 16/9; background: transparent; box-shadow: 0 0 18px 3px #fff3d238, 0 4px 8px #24384a14, 0 20px 32px -14px #24384a52; }
.profile__img picture { display: block; width: 100%; height: 100%; }
.profile__img img { object-position: center; }
.profile__text { padding-top: 3rem; }
.profile__name { font: 400 1.5rem/1.6 var(--font-literary); }
.profile__bio { font-size: 0.8rem; margin-bottom: 1.5rem; color: var(--muted); line-height: 2.1; }
.profile__bio > p:first-child { font: 400 1.05rem/1.9 var(--font-literary); color: var(--text); }
.profile__more { margin-top: 1.25rem; }
.social-link { width: 44px; height: 44px; flex-shrink: 0; }
.section.works { background: var(--paper); }
.works__intro { font-size: 0.86rem; color: var(--muted); margin: -0.7rem 0 2rem; }
.works__selected { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.8fr); gap: 2.5rem 4rem; align-items: start; }
.works__selection { display: block; min-width: 0; }
.works__selection:first-child { grid-row: 1 / span 2; align-self: center; }
.works__selection:nth-child(2) { margin-top: 3rem; }
/* Keep linked thumbnails on one layer, without filtered image copies. */
.works__image { display: block; aspect-ratio: 16/9; overflow: hidden; background: var(--surface); box-shadow: 0 0 18px 3px #fff3d238, 0 4px 8px #2426231f, 0 18px 30px -10px #24262359; }
.works__image img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.works__selection .eyebrow { margin-top: 1rem; }
.works__selection h3 { font: 400 1.5rem/1.6 var(--font-literary); margin: 0.25rem 0; }
.works__selection:first-child h3 { font-size: 2rem; }
.works__selection h3 > span { font-family: system-ui, sans-serif; font-size: 0.85rem; vertical-align: middle; margin-left: 0.5rem; color: var(--accent); }
.works__selection > p:last-child { color: var(--muted); font-size: 0.78rem; }
.works__footer { margin-top: 3rem; }
.works__archive { margin: 0; border-top: 1px solid #83887c; scroll-margin-top: 92px; }
.works__archive > summary, .disc__archive > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  min-height: 84px;
  padding: 1.25rem 0.25rem;
  border-bottom: 1px solid #83887c;
  font: 400 1.4rem/1.7 var(--font-literary);
  list-style: none;
  transition: color 0.25s ease, border-color 0.25s ease;
}
.works__archive > summary::-webkit-details-marker, .disc__archive > summary::-webkit-details-marker { display: none; }
.works__archive > summary:hover, .disc__archive > summary:hover { color: var(--accent); border-bottom-color: var(--accent); }
.works__archive[open] > summary { margin-bottom: 0; }
.works__archive-indicator, .disc__archive-indicator { width: 32px; height: 32px; flex: 0 0 32px; color: var(--accent); text-align: center; font: 300 1.75rem/32px system-ui, sans-serif; }
.works__archive-indicator::before, .disc__archive-indicator::before { content: '+'; }
.works__archive[open] .works__archive-indicator::before, .disc__archive[open] .disc__archive-indicator::before { content: '\2212'; }
.works__archive h3 { font: 400 1.3rem/1.6 var(--font-classic); margin: 2rem 0 1rem; }
.works__archive li a { display: grid; grid-template-columns: 160px minmax(0, 1fr) minmax(0, 1fr) 16px; align-items: center; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--border); font-size: 0.84rem; }
.works__archive li span { color: var(--muted); }
.works__archive li strong { font: 400 1.1rem/1.7 var(--font-literary); }
.text-link { display: inline-flex; gap: 1rem; min-height: 44px; align-items: center; font-size: 0.8rem; text-decoration: underline; text-underline-offset: 5px; }
.works__contact { margin-top: 1rem; }
.section.contact { background: #eceee8; padding-bottom: 3.5rem; border-top: 1px solid var(--border); }
.contact .section__title { font-size: 2rem; gap: 1rem; }
.contact .section__title > span { font-style: normal; }
.contact .section__title::after { flex-basis: 24px; }
.contact__identity { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.72rem 0.82rem; margin-bottom: 0.72rem; }
.contact__form { border-radius: 6px; background: rgba(255,255,255,0.5); box-shadow: 0 3px 8px rgba(30,40,28,0.05), 0 14px 28px -10px rgba(30,40,28,0.19); }
.contact__type-card { min-height: 40px; }
.contact__type-card:has(input:focus-visible) { outline: 2px solid #796246; outline-offset: -2px; }
.contact__type-note { color: #626a62; }
.form__group label { font-size: 0.75rem; }
.form__tag { color: #76552f; background: #f2e9d9; }
.form__tag--optional { color: #626a62; background: #e7eae3; }
.form__group input, .form__group select, .form__group textarea { border-radius: 3px; font-size: 0.88rem; background: #f9faf7; }
.contact__panel.is-active { animation-fill-mode: backwards; }
.form__group input, .form__group select { line-height: 1.4; }
.form__group textarea { line-height: 1.65; }
.contact__submit { border: 1px solid #354b40; border-radius: 3px; background: #354b40; color: #fff; font: 500 0.8rem var(--font-ja); min-height: 44px; }
.contact__submit:hover { background: #263c31; }
.contact__submit:disabled { opacity: 0.55; cursor: progress; }
.contact__privacy { font-size: 0.67rem; color: var(--muted); margin-top: 0.8rem; text-align: center; }
.contact__status { font-size: 0.8rem; line-height: 1.8; margin-top: 0.8rem; }
.contact__status:empty { display: none; }
.contact__status[data-state="success"] { color: #285338; }
.contact__status[data-state="error"] { color: #9e302c; }
.contact__status[data-state="notice"] { color: #715925; }
.floating-social__link { width: 36px; height: 36px; }
.floating-social.is-obscured, .menu-open .floating-social { visibility: hidden; pointer-events: none; }
.footer__social { flex-wrap: wrap; gap: 0.5rem; }
.footer .social-link svg { fill: #dfdfd5; }
.footer .social-link { border-color: #666b60; }
.footer__journal-links { color: #a7ae9f; }
body.player-open { overflow: hidden; }
dialog.player-panel { top: auto; width: 100%; max-width: none; max-height: 85dvh; margin: 0; border: 1px solid #5a6056; }
dialog.player-panel[open] { display: block; }
dialog.player-panel::backdrop { background: rgba(15,22,17,0.7); backdrop-filter: blur(4px); }
.player-panel__close { width: 44px; height: 44px; top: 0.5rem; right: 0.5rem; color: #ddd; }
.player-panel__info { padding-right: 2rem; }
.player-panel__type, .player-panel__year, .embed-label { color: #b6bda9; }
.player-panel iframe { width: 100%; border: 0; }
.player__direct { display: inline-flex; align-items: center; min-height: 44px; font-size: 0.78rem; text-decoration: underline; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .music__art:hover { transform: translateY(-4px); box-shadow: 0 0 18px 3px #fff3d238, 0 6px 10px #24262329, 0 26px 40px -12px #24262370; }
  .works__selection:hover, .music__selection:hover { opacity: 1; }
  .works__selection:hover .works__image img { transform: scale(1.025); }
  .music__selection:hover strong, .works__selection:hover h3 { color: var(--accent); }
}
@media (max-width: 1100px) {
  .hero__title { font-size: 3.75rem; }
  .music__feature { gap: 2.5rem; grid-template-columns: minmax(0, 430px) minmax(0, 1fr); }
}
@media (max-width: 980px) {
  .hero__inner { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .hero__release { justify-self: start; max-width: 320px; }
  .hero__title { font-size: 4rem; }
  .contact__form { max-width: 600px; }
  .contact__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: 2rem; }
  .live__row { grid-template-columns: 88px minmax(0, 1fr); gap: 1rem; }
  .live__flyer { width: 88px; height: 116px; grid-row: span 2; }
  .live__ticket { grid-column: 2; justify-self: start; }
}
@media (max-width: 768px) {
  .section { padding: 3.5rem 0; }
  .section__inner { padding: 0 1.25rem; }
  .section__title { font-size: 2rem; margin-bottom: 1.8rem; gap: 1rem; }
  .section__title::after { flex-basis: 24px; }
  .section.news { padding: 2rem 0 0.5rem; }
  .news .section__inner { display: block; }
  .news .section__title { margin-bottom: 0.7rem; font-size: 1.5rem; }
  .header__inner { padding: 0 1rem; }
  .header__nav { bottom: auto; height: calc(100dvh - 60px); overflow: auto; }
  .hero { padding: 6rem 0 3rem; min-height: calc(100svh - 24px); }
  .hero__inner { width: calc(100% - 2.5rem); gap: 1.5rem; }
  .hero__title, .hero--fallback-title .hero__title { font-size: 3.25rem; }
  .hero__lead { font-size: 0.84rem; }
  .hero__actions { margin-top: 1.4rem; }
  .hero__release { min-height: 132px; max-width: 360px; }
  .hero-release__card { min-height: 132px; grid-template-columns: 88px minmax(0, 1fr); }
  .news__item a { grid-template-columns: 92px minmax(0, 1fr) 16px; gap: 0.3rem 0.6rem; }
  .news__item-title { grid-column: 1 / 3; }
  .news__item a > span:last-child { grid-row: 1 / 3; grid-column: 3; }
  .news__item-cat { font-size: 0.65rem; }
  .music__feature { grid-template-columns: minmax(0, 1fr); gap: 1.7rem; }
  .music__art { max-width: 420px; }
  .music__story { padding: 0; }
  .music__story h3 { font-size: 1.65rem; margin: 0.8rem 0; }
  .music__services { margin-top: 1rem; gap: 0.2rem 1.2rem; }
  .music__selections { grid-template-columns: minmax(0, 1fr); gap: 2rem; margin-top: 2.5rem; }
  .music__selection--record { display: grid; grid-template-columns: 112px minmax(0, 1fr); align-items: center; gap: 1rem; max-width: none; }
  .music__selection--record > span { margin-top: 0; }
  .music__selection--record strong { font-size: 1.15rem; }
  .disc__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
  .live__information h3 { font-size: 0.98rem; }
  .live__card-date { font-size: 0.96rem; }
  .profile__wrap { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .profile__img { aspect-ratio: 16/9; }
  .profile__text { padding: 0; }
  .works__selected { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .works__selection:first-child { grid-row: auto; }
  .works__selection:nth-child(2) { margin-top: 0; }
  .works__selection:not(:first-child) { width: 90%; }
  .works__selection:nth-child(2) { justify-self: end; }
  .works__selection:first-child h3 { font-size: 1.65rem; }
  .works__archive > summary, .disc__archive > summary { min-height: 76px; font-size: 1.1rem; gap: 0.75rem; }
  .works__archive-indicator, .disc__archive-indicator { width: 28px; flex-basis: 28px; }
  .works__archive li a { grid-template-columns: minmax(0, 1fr) 16px; gap: 0.25rem; }
  .works__archive li strong, .works__archive li span { grid-column: 1; }
  .works__archive li span:last-child { grid-column: 2; grid-row: 1 / 4; }
  .contact__inner { grid-template-columns: minmax(0, 1fr); }
  .contact__text br { display: none; }
  .form__group input, .form__group select, .form__group textarea { font-size: 16px; min-height: 42px; padding: 0.45rem 0.6rem; }
  .contact__type-card { min-height: 44px; }
  .floating-social { padding: 0.3rem; gap: 0.15rem; right: 0.75rem; bottom: max(0.75rem, env(safe-area-inset-bottom)); }
  .floating-social__label { display: none; }
  .floating-social__link { width: 44px; height: 44px; }
  .floating-social__link svg { width: 16px; height: 16px; }
  .footer__journal-links a { display: block; min-height: 36px; }
  .footer__journal-sep { display: none; }
  .footer { padding-bottom: 6rem; }
}
@media (max-width: 640px) {
  .contact__identity { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 360px) {
  .section__title { font-size: 1.875rem; }
  .hero__title, .hero--fallback-title .hero__title { font-size: 2.75rem; }
  .hero__sub { font-size: 0.62rem; }
  .hero__actions { gap: 0.75rem; }
  .hero__listen-btn { padding-inline: 1rem; }
  .live__row { grid-template-columns: 68px minmax(0, 1fr); }
  .live__flyer { width: 68px; height: 92px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .hero__title-char, .hero__lead, .hero__actions, .hero__release { opacity: 1; filter: none; }
}
