/* Scoped to the Japanese gateway so PJAX arrivals share the same presentation. */
.jp-gateway { --jp-ink:#edf3e8; --jp-muted:#b7c9c7; --jp-gold:#e2cfa0; max-width:1440px; margin:auto; padding:20px 64px 100px; color:var(--jp-ink); font-family:'Noto Sans JP',sans-serif; line-height:1.8; }
html:has(.jp-gateway),body:has(.jp-gateway) { background:#081a1e !important; background-image:none !important; }
body:has(.jp-gateway) { padding-top:var(--header-height,64px); }
[data-page-type="japanese-gateway"] { position:relative; isolation:isolate; width:100%; max-width:none; margin:0; border:0; background:radial-gradient(ellipse at 82% 19%,#213d3f88,transparent 44%),radial-gradient(ellipse at 0 58%,#193b343d,transparent 50%),#081a1e; box-shadow:none; overflow:clip; }
body:has(.jp-gateway) .site-header { background:#081a1ee8; border-bottom:1px solid #d2dfcd24; box-shadow:none; backdrop-filter:blur(20px); }
body:has(.jp-gateway) .site-header:before,body:has(.jp-gateway) .site-header:after { content:none; }
body:has(.jp-gateway) .logo-text { color:#d6e8d8; }
body:has(.jp-gateway) .logo-sub { color:#a4bfb2; }
body:has(.jp-gateway) .nav-link { color:#d3dfd7; }
body:has(.jp-gateway) .nav-link:hover { color:#f0dcaf; }
body:has(.jp-gateway) .nav-link--contact { border-color:#a5bda454; }
body:has(.jp-gateway) .nav-submenu { background:#10272bf5; border-color:#d1dfc538; }
body:has(.jp-gateway) .nav-submenu__link { color:#d6e2da; }
body:has(.jp-gateway) .nav-submenu__link:hover { background:#d4e3cb16; }
body:has(.jp-gateway) .site-footer { background:#06171b; border-top:1px solid #cddccd22; }
.jp-gateway * { box-sizing:border-box; }
.jp-gateway a { color:inherit; text-decoration:none; }
.jp-gateway a:hover { color:#fff3cc; }
.jp-gateway a:focus-visible,.jp-gateway button:focus-visible,.jp-gateway summary:focus-visible { outline:2px solid var(--jp-gold); outline-offset:5px; }
.jp-gateway p { margin:0 0 20px; }
.jp-gateway[data-jp-language="en"] h1,.jp-gateway[data-jp-language="en"] h2,.jp-gateway[data-jp-language="en"] h3 { letter-spacing:.015em; }
.jp-gateway[data-jp-language="en"] .jp-hero__phrase { font-size:22px; }
.jp-gateway[data-jp-language="en"] .jp-scene h3 { font-size:21px; }
.jp-gateway[data-jp-language="en"] .jp-index a { font-size:12px; }
.jp-crumb { position:relative; z-index:2; display:flex; gap:16px; font-size:11px; color:var(--jp-muted); padding:0 0 6px; }
.jp-hero { position:relative; isolation:isolate; min-height:560px; display:flex; align-items:center; }
.jp-hero__image { position:absolute; top:-65px; left:50%; width:100vw; max-width:none; height:calc(100% + 110px); object-fit:cover; object-position:center 52%; transform:translateX(-50%); z-index:-3; mask-image:linear-gradient(#000 75%,transparent); }
.jp-hero:before { content:''; position:absolute; top:-65px; bottom:-45px; left:50%; width:100vw; transform:translateX(-50%); background:linear-gradient(90deg,#081a1ef5 0%,#081a1eb8 30%,#081a1e22 68%,#081a1e30),linear-gradient(0deg,#081a1e,transparent 35%); z-index:-2; pointer-events:none; }
.jp-hero__body { padding:48px 0 70px; max-width:720px; }
.jp-eyebrow { color:var(--jp-gold); font-size:10px; letter-spacing:.19em; font-weight:500; }
.jp-hero .jp-eyebrow span { display:inline-block; margin-left:15px; color:#c8d8cc; font-size:9px; }
.jp-hero .genre-hero__title { font-family:'Noto Serif JP',serif; font-size:clamp(32px,4vw,56px); font-weight:500; letter-spacing:.06em; color:#f4f3e6; margin:30px 0 8px; line-height:1.5; }
.jp-gateway .jp-hero__phrase { font-family:'Noto Sans JP',sans-serif; font-size:25px; line-height:1.6; letter-spacing:.05em; margin:0 0 26px; color:#f4f3e6; }
.jp-hero__intro { color:#d5e1df; font-size:15px; line-height:2.1; }
.jp-hero__actions { display:flex; gap:12px; flex-wrap:wrap; margin:28px 0 18px; }
.jp-gateway .jp-button { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:54px; padding:14px 25px; border:1px solid #d6e3c45c; border-radius:3px; background:linear-gradient(130deg,#dce8df24,#b6d2c608); backdrop-filter:blur(16px); font-size:14px; color:#f4f2df; box-shadow:inset 0 1px 0 #fff2,0 8px 30px #0002; transition:background .2s,transform .2s; }
.jp-gateway .jp-button:hover { transform:translateY(-2px); }
.jp-gateway .jp-button--primary { background:linear-gradient(120deg,#f1e8c8ef,#cfdebbdb); color:#213c2f; border-color:#f1e7bc; }
.jp-hero .genre-track__link:before { content:none; }
.jp-button small { font-size:10px; padding-left:10px; border-left:1px solid #274f3730; }
.jp-hero__note { font-size:10px; color:#bdcdc0; }
.jp-hero__note span { margin-left:14px; }
.jp-hero__collection { position:absolute; right:0; bottom:75px; display:flex; flex-direction:column; width:300px; padding:24px 26px; border:1px solid #d6e3d34a; border-radius:32px 3px 3px 3px; background:linear-gradient(135deg,#c2e0d32a,#c2e0d308); backdrop-filter:blur(18px); box-shadow:inset 0 1px 0 #fff2,0 18px 50px #0002; }
.jp-hero__collection p { font-size:16px; color:#f0ddb2; margin:0 0 12px; }
.jp-hero__collection ol { list-style:none; margin:0 0 12px; padding:0; }
.jp-hero__collection li { display:flex; align-items:center; gap:12px; border-bottom:1px solid #dce9d329; }
.jp-hero__collection li>span { font-family:serif; font-size:24px; color:var(--jp-gold); }
.jp-hero__collection .genre-track__link { display:flex; flex:1; align-items:center; justify-content:space-between; gap:8px; padding:12px 0; font-size:12px; }
.jp-hero__collection .genre-track__link b { font-size:9px; }
.jp-hero__collection>a { font-size:11px; }
.jp-popular { padding:32px; border:1px solid #e2cfa04a; background:linear-gradient(120deg,#e2cfa010,#b6d8ca09); border-radius:5px; box-shadow:0 22px 55px #0002; }
.jp-section.jp-popular { margin-top:36px; }
.jp-popular .jp-section__heading { margin-bottom:22px; }
.jp-popular__updated { font-size:11px; color:var(--jp-muted); white-space:nowrap; }
.jp-popular__list { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:0 0 24px; padding:0; list-style:none; }
.jp-popular__item { display:flex; align-items:center; gap:10px; padding:14px 16px; background:#d9e6d60a; border:1px solid #d5e2c52b; border-radius:3px; min-width:0; }
.jp-popular__rank { font-family:serif; font-size:30px; color:var(--jp-gold); flex:none; width:36px; }
.jp-popular__item .genre-track__link { flex:1; min-width:0; display:grid; grid-template-columns:24px minmax(0,1fr); align-items:center; gap:2px 8px; padding:6px 0; }
.jp-popular__item .genre-track__link:before,.jp-hero__collection .genre-track__link:before { content:none; }
.jp-popular__play { grid-column:1; grid-row:1 / 4; color:var(--jp-gold); font-size:12px; }
.jp-popular__item .genre-track__title,.jp-popular__item .genre-track__title-en,.jp-popular__item .genre-track__duration { grid-column:2; }
.jp-popular__item .genre-track__title { font-size:16px; }
.jp-popular__item .genre-track__title-en { font-size:10px; }
.jp-popular__item .genre-track__duration { font-size:10px; }
.jp-popular__item .genre-track__detail,.jp-popular__item .genre-track__download { min-width:32px; font-size:11px; }
.jp-popular__item:first-child { background:linear-gradient(115deg,#d4bc7c26,#d4bc7c08); border-color:#e2cfa063; }
.jp-popular__item:first-child .jp-popular__rank { color:#ffe4a6; }
[data-jp-reveal] { opacity:1; transform:translateY(0); transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1); }
[data-jp-reveal].jp-reveal-pending { opacity:0; transform:translateY(24px); }
@media(prefers-reduced-motion:reduce) {
  [data-jp-reveal],[data-jp-reveal].jp-reveal-pending { opacity:1; transform:none; transition:none; }
  .jp-gateway .jp-button { transition:none; }
  .jp-gateway .jp-button:hover { transform:none; }
}
.jp-hero__collection>span { font-size:10px; letter-spacing:.12em; color:#d5e5dc; }
.jp-hero__collection strong { font-family:serif; font-weight:400; font-size:56px; line-height:1.6; color:var(--jp-gold); }
.jp-hero__collection small { font-family:'Noto Serif JP',serif; font-size:15px; margin-left:10px; }
.jp-hero__collection b { float:right; font-size:16px; font-weight:400; }
.jp-index { position:relative; display:grid; grid-template-columns:repeat(4,1fr); border-block:1px solid #d4e1c42c; padding:26px 0; gap:18px; background:linear-gradient(90deg,#d1e0d609,#d1e0d600); }
.jp-index a { font-size:13px; text-align:center; }
.jp-index span { margin-right:12px; font-family:serif; color:var(--jp-gold); }
.jp-section { margin-top:110px; scroll-margin-top:100px; }
.jp-section__heading { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:28px; }
.jp-gateway h2 { font-family:'Noto Serif JP',serif; font-size:clamp(23px,2.7vw,33px); line-height:1.7; letter-spacing:.08em; font-weight:500; color:#f0f1df; margin:0 0 10px; border:0; padding:0; }
.jp-section__heading p { font-size:13px; color:var(--jp-muted); margin:0; }
.jp-section__heading .jp-eyebrow { color:var(--jp-gold); font-size:10px; margin:0 0 13px; }
.jp-scenes__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; align-items:start; }
.jp-scene { min-width:0; overflow:hidden; border-radius:3px 65px 3px 3px; border:1px solid #dce6c444; background:linear-gradient(135deg,#b1cfb729,#bfdbbc0a); box-shadow:0 20px 40px #0002,inset 0 1px 0 #fff2; }
.jp-scene:nth-child(2) { margin-top:32px; }
.jp-scene:nth-child(3) { margin-top:64px; }
.jp-scene__art { position:relative; height:240px; isolation:isolate; display:flex; justify-content:flex-end; flex-direction:column; padding:28px; }
.jp-scene__art img { position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; }
.jp-scene__art:after { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,#071e1bf5,transparent 95%); }
.jp-scene__number { font-family:serif; font-size:12px; letter-spacing:.17em; color:#e8d8b6; }
.jp-gateway .jp-scene h3 { margin:9px 0 7px; font-family:'Noto Serif JP',serif; font-size:23px; font-weight:500; letter-spacing:.06em; color:#f5f1df; }
.jp-scene__art p { font-size:13px; line-height:1.9; color:#d1ded1; margin:0; }
.jp-scene ul { list-style:none; padding:6px 22px 15px; margin:0; }
.jp-scene li { display:flex; align-items:center; gap:8px; border-bottom:1px solid #e0ebd01c; min-height:58px; }
.jp-scene li:last-child { border-bottom:0; }
.jp-gateway .jp-scene .genre-track__link { display:flex; align-items:center; gap:12px; flex:1; min-width:0; padding:15px 0; border:0; font-size:14px; color:#e8efdf; }
.jp-scene .genre-track__link:before { content:none; }
.jp-scene .genre-track__link span { color:var(--jp-gold); font-size:10px; }
.jp-scene__detail { padding:12px 0 12px 6px; font-size:10px; white-space:nowrap; color:var(--jp-muted); }
.jp-story { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:65px; padding:35px 0; }
.jp-story__image { position:relative; aspect-ratio:4/5; }
.jp-story__letter { display:flex; flex-direction:column; justify-content:center; padding:50px; background:radial-gradient(ellipse at 15% 20%,#7b9a8640,transparent 65%),linear-gradient(150deg,#1d3639,#0b2227); border:1px solid #d8e2c834; border-radius:3px 100px 3px 3px; box-shadow:inset 0 0 80px #07191e88; }
.jp-story__letter:before { content:''; position:absolute; inset:17px; border:1px solid #cdddc322; border-radius:0 80px 0 0; pointer-events:none; }
.jp-story__letter>p { font-family:'Noto Serif JP',serif; font-size:clamp(25px,3vw,38px); line-height:2; letter-spacing:.09em; color:#e5e9d8; margin:35px 0; }
.jp-story__image.jp-story__letter>.jp-eyebrow { position:static; font-size:9px; letter-spacing:.14em; color:var(--jp-gold); }
.jp-story__signature { font-family:'Noto Serif JP',serif; font-size:22px; letter-spacing:.16em; }
.jp-story__signature small { display:block; font-family:serif; font-size:10px; margin-top:10px; letter-spacing:.13em; color:var(--jp-muted); }
.jp-story__image.jp-story__letter>.jp-story__seal { position:absolute; bottom:36px; right:40px; left:auto; padding:3px 9px; font-family:'Noto Serif JP',serif; font-size:26px; border:1px solid #b9896a80; color:#c99674; }
.jp-story__image img { width:100%; height:100%; object-fit:cover; border-radius:5px 110px 5px 5px; mask-image:linear-gradient(#000 65%,#0009); }
.jp-story__image span { position:absolute; bottom:24px; left:28px; font-size:9px; letter-spacing:.18em; text-shadow:0 1px 8px #000; }
.jp-story__body p { font-size:15px; color:#c8d8cd; line-height:2.2; }
.jp-story__body .jp-eyebrow { font-size:10px; color:var(--jp-gold); }
.jp-story__body h2 { font-size:32px; margin-bottom:25px; }
.jp-text-link { font-size:12px; border-bottom:1px solid #b6d2b757; padding-bottom:5px; }
.jp-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; padding:28px 32px; background:linear-gradient(130deg,#c2dbb816,#bddac309); border:1px solid #cce1cb2c; border-radius:6px; }
.jp-number { font-family:serif; font-size:28px; color:#d8cba4; }
.jp-gateway h3 { font-size:15px; font-weight:500; letter-spacing:.04em; margin:8px 0 12px; }
.jp-steps p,.jp-policy p,.jp-credit p { font-size:14px; line-height:2; color:#c6d6ca; }
.jp-steps a,.jp-policy a { font-size:11px; text-decoration:underline; text-underline-offset:5px; }
.jp-policy { display:grid; grid-template-columns:1fr 1fr; gap:36px; padding:35px 0 20px; }
.jp-policy article { padding-left:20px; border-left:1px solid #cce0be4a; }
.jp-credit { border-block:1px solid #d0e4c32c; padding:16px 0; }
.jp-credit summary { cursor:pointer; font-size:12px; padding:6px 0; }
.jp-credit p { margin:14px 0; }
.jp-credit code { font-size:11px; white-space:normal; }
.jp-catalog__intro { font-size:12px; color:var(--jp-muted); }
.jp-gateway .genre-section-title { background:none; }
.jp-gateway .genre-hero__count { background:none; border:0; padding:0; }
.jp-gateway .genre-track-list { margin:0; padding:0; list-style:none; border:0; background:#b8d2bb08; }
.jp-gateway .genre-track__title { color:#e5efdf; font-family:inherit; font-weight:400; }
.jp-gateway .genre-track { display:flex; align-items:center; gap:8px; background:transparent; border:0; border-bottom:1px solid #dbe5ce20; padding:3px 0; min-height:53px; }
.jp-gateway .genre-track .genre-track__link { flex:1; min-width:0; display:grid; grid-template-columns:1fr 1fr 45px; align-items:center; gap:15px; padding:10px 8px; color:#e2eddf; font-size:12px; border:0; background:none; }
.jp-gateway .genre-track .genre-track__link:hover { background:#bdd4b315; }
.jp-gateway .genre-track__title-en { font-size:10px; color:#a1baa9; }
.jp-gateway .genre-track__duration { font-size:11px; color:#bacdbe; }
.jp-gateway .genre-track__detail,.jp-gateway .genre-track__download { display:flex; align-items:center; justify-content:center; min-height:44px; min-width:44px; padding:8px; font-size:11px; color:#d5dfca; }
.jp-gateway .genre-track__fav { position:static; flex:none; min-width:44px; width:44px; height:44px; background:transparent; border:1px solid #cddcbd30; border-radius:50%; color:#e3d3b0; font-size:18px; cursor:pointer; }
.jp-gateway .genre-track__fav-on,.jp-gateway .genre-track__fav.is-fav .genre-track__fav-off { display:none; }
.jp-gateway .genre-track__fav.is-fav .genre-track__fav-on { display:inline; color:#e6c78f; }
.jp-gateway .genre-track__fav:hover { background:#cddcbd16; }
.jp-classic-link { display:flex; justify-content:space-between; gap:16px; margin-top:24px; padding:20px 0; border-block:1px solid #c9dfbe30; font-size:12px; color:var(--jp-muted); }
.jp-classic-link span { color:var(--jp-gold); }
.jp-closing { text-align:center; padding:85px 15px 20px; }
.jp-closing>p:not(.jp-eyebrow) { font-size:12px; line-height:2.2; color:var(--jp-muted); }
.jp-closing__links { display:flex; flex-wrap:wrap; justify-content:center; gap:24px; margin-top:32px; font-size:11px; color:var(--jp-muted); }
#scene-selection,#all-tracks { scroll-margin-top:100px; }
@media(max-width:800px) {
  .jp-gateway { padding:18px 28px 90px; }
  .jp-hero { min-height:520px; }
  .jp-hero__body { padding:42px 0 60px; }
  .jp-hero:before { background:linear-gradient(90deg,#081a1eef,#081a1e5a),linear-gradient(0deg,#081a1e,transparent 50%); }
  .jp-hero .jp-eyebrow span { display:block; margin:5px 0 0; }
  .jp-hero__collection { display:none; }
  .jp-section { margin-top:58px; }
  .jp-section__heading { align-items:flex-start; flex-direction:column; gap:10px; }
  .jp-scenes__grid { grid-template-columns:1fr; gap:24px; }
  .jp-scene:nth-child(n) { margin-top:0; }
  .jp-scene { display:grid; grid-template-columns:1fr 1fr; border-radius:45px 5px 5px 5px; }
  .jp-scene__art { height:230px; padding:24px; }
  .jp-scene ul { align-self:center; padding:10px 18px; }
  .jp-story { gap:30px; }
  .jp-story__body h2 { font-size:25px; }
  .jp-steps { gap:18px; padding:24px; }
  .jp-index { gap:8px; }
  .jp-index span { margin-right:6px; }
  .jp-popular { padding:24px; }
  .jp-popular__list { grid-template-columns:1fr; }
}
@media(min-width:801px) and (max-width:1150px) {
  .jp-hero__body { max-width:calc(100% - 290px); }
  .jp-hero__collection { width:270px; }
  .jp-hero .genre-hero__title { font-size:38px; }
}
@media(max-width:540px) {
  .jp-gateway { padding-inline:22px; }
  .jp-hero { min-height:490px; }
  .jp-hero__image { object-position:84% center; }
  .jp-hero__body { padding:28px 0 42px; }
  .jp-hero .genre-hero__title { font-size:32px; letter-spacing:.025em; }
  .jp-gateway .jp-hero__phrase { font-size:18px; letter-spacing:.025em; }
  .jp-gateway[data-jp-language="en"] .jp-hero__phrase { font-size:18px; }
  .jp-gateway[data-jp-language="en"] .jp-hero .genre-hero__title { font-size:30px; }
  .jp-gateway[data-jp-language="en"] .jp-story__body h2 { font-size:25px; }
  .jp-hero__intro { font-size:13px; }
  .jp-hero__actions { flex-direction:column; align-items:flex-start; gap:10px; margin-top:24px; }
  .jp-gateway .jp-button { min-height:46px; padding:11px 18px; }
  .jp-hero__note span { display:block; margin:3px 0 0; }
  .jp-index { grid-template-columns:1fr 1fr; gap:14px 4px; padding:22px 0; }
  .jp-index a { text-align:left; padding-left:8px; }
  .jp-scene { display:block; border-radius:45px 45px 6px 6px; }
  .jp-scene__art { height:220px; }
  .jp-scene ul { padding:5px 22px 12px; }
  .jp-story { grid-template-columns:1fr; padding:0; }
  .jp-story__image { aspect-ratio:4/3; }
  .jp-story__letter { padding:40px 30px; }
  .jp-story__body h2 { font-size:29px; }
  .jp-steps,.jp-policy { grid-template-columns:1fr; }
  .jp-steps article+article { padding-top:16px; border-top:1px solid #d0e4c320; }
  .jp-policy { gap:22px; }
  .jp-gateway .genre-track .genre-track__link { grid-template-columns:1fr 35px; gap:8px; padding:9px 0; }
  .jp-gateway .genre-track__title-en { display:none; }
  .jp-gateway .genre-track { gap:3px; }
  .jp-gateway .genre-track__link:before { content:none; }
  .jp-gateway .genre-track__detail,.jp-gateway .genre-track__download { min-width:36px; padding:7px 4px; }
  .jp-gateway .genre-track__fav { min-width:36px; width:36px; height:36px; }
  .jp-classic-link { flex-direction:column; gap:7px; }
  .jp-popular { margin-inline:-6px; padding:22px 14px; }
  .jp-popular__item { display:grid; grid-template-columns:28px minmax(0,1fr) 36px 36px 36px; gap:6px 8px; padding:12px; }
  .jp-popular__item .genre-track__link { grid-column:2 / -1; grid-row:1; }
  .jp-popular__item .genre-track__detail { grid-column:3; grid-row:2; }
  .jp-popular__item .genre-track__download { grid-column:4; grid-row:2; }
  .jp-popular__item .genre-track__fav { grid-column:5; grid-row:2; }
  .jp-popular__rank { width:28px; font-size:26px; }
  .jp-popular__item .genre-track__title { font-size:14px; }
  .jp-popular__item .genre-track__fav { margin-left:auto; }
}

/* The collection has explicit, equivalent language destinations. */
.jp-gateway-languages { display:flex; align-items:center; gap:2px; padding:4px 7px; border:1px solid #d6e3d32b; border-radius:30px; white-space:nowrap; }
.jp-gateway-languages a { font-size:11px; padding:4px 6px; color:#b7c9c7; text-decoration:none; }
.jp-gateway-languages a[aria-current] { color:#f3e5bb; background:#d6e3d314; border-radius:20px; }
@media(max-width:540px) { .jp-gateway-languages { padding:4px; } .jp-gateway-languages a { font-size:10px; padding:4px; } }