/* Inner pages: the booklet's chapter title page + inside pages. Extends styles.css. */
.bar__nav a[aria-current="page"] { color: #fff; background-size: 100% 1px; }

.leaf-cover { position: relative; background: var(--cover); color: var(--on-cover); padding: 0 var(--g); isolation: isolate; }
.leaf-cover::before { content: ""; position: absolute; inset: clamp(10px, 1.4vw, 18px) clamp(10px, 1.4vw, 18px) 0; border: 1px solid rgba(217,180,90,.28); border-bottom: 0; pointer-events: none; z-index: -1; }
.leaf-cover__in { max-width: 1360px; margin: 0 auto; padding: 0 clamp(0px, 2vw, 24px) clamp(40px, 6vw, 72px); }
.crumbs { display: flex; flex-wrap: wrap; gap: 6px 12px; padding-top: 26px; font: 600 12px/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--foil); }
html:lang(ja) .crumbs { letter-spacing: .06em; }
.crumbs a { color: var(--on-cover-2); text-decoration: none; }
.crumbs a:hover { color: #fff; }
.crumbs span[aria-hidden] { color: rgba(186,196,222,.5); }
.crumbs .folio { margin-left: auto; font-family: var(--serif); font-size: 14px; letter-spacing: .04em; }
.leaf-cover h1 { margin-top: clamp(40px, 6vw, 80px); font: 600 clamp(38px, 5vw, 72px)/1.06 var(--serif); letter-spacing: -.02em; color: var(--foil); max-width: 18ch; }
html:lang(ja) .leaf-cover h1 { letter-spacing: .02em; line-height: 1.25; }
.leaf-cover__ja { margin-top: 14px; font: 600 clamp(16px, 1.6vw, 20px)/1.5 var(--mincho); letter-spacing: .14em; color: var(--on-cover-2); }
html:lang(ja) .leaf-cover__ja { display: none; }
.leaf-cover__lede { margin-top: 22px; max-width: 58ch; font-size: clamp(16px, 1.4vw, 19px); color: var(--on-cover); }
.leaf-cover__act { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 14px 22px; align-items: center; }

/* prose and fact tables */
.prose { display: grid; gap: 20px; max-width: 68ch; color: var(--ink-2); }
.prose h3 { font: 600 clamp(20px, 2vw, 26px)/1.3 var(--serif); color: var(--ink); margin-top: 16px; }
.prose ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.prose li { display: grid; grid-template-columns: 18px 1fr; }
.prose li::before { content: "–"; color: var(--gold-ink); font-weight: 600; }
.two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.facts { border-top: 3px solid var(--rule); border-bottom: 1px solid var(--rule); }
.facts > div { display: grid; grid-template-columns: 168px 1fr; gap: 20px; padding: 16px 0; border-top: 1px solid var(--rule-2); }
.facts > div:first-child { border-top: 0; }
.facts dt { font: 600 12px/1.7 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }
html:lang(ja) .facts dt { letter-spacing: .02em; }
.facts dd { font-weight: 500; }
.facts dd .pend { color: var(--ink-2); font-weight: 400; }
.note { font-size: 14px; color: var(--ink-2); }

/* sub-contents: a TOC printed on paper */
.subtoc { list-style: none; padding: 0; border-top: 3px solid var(--rule); }
.subtoc a { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: baseline; padding: 18px 0; border-bottom: 1px solid var(--rule-2); text-decoration: none; transition: color .25s; }
.subtoc a span:first-child { font: 600 clamp(19px, 1.8vw, 23px)/1.3 var(--serif); }
.subtoc a small { display: block; margin-top: 4px; font: 400 15px/1.5 var(--sans); color: var(--ink-2); }
.subtoc i { height: 1px; align-self: center; background: radial-gradient(circle, var(--ink-2) 1px, transparent 1.4px) 0 0 / 7px 2px repeat-x; opacity: .6; }
.subtoc b { font: 600 15px/1 var(--sans); color: var(--gold-ink); white-space: nowrap; }
.subtoc a:hover span:first-child { color: var(--blue, #24407F); text-decoration: underline; text-decoration-color: var(--foil); text-underline-offset: 6px; }

/* honest empty state: a printed notice slip */
.notice { display: grid; grid-template-columns: auto 1fr; gap: 14px 24px; align-items: start; padding: 26px 0; border-top: 3px solid var(--rule); border-bottom: 1px solid var(--rule); max-width: 860px; }
.notice p { color: var(--ink-2); }
.notice strong { display: block; font: 600 clamp(20px, 2vw, 24px)/1.35 var(--serif); color: var(--ink); margin-bottom: 6px; }

/* groups / tiers / steps as ruled lists */
.ruled { list-style: none; padding: 0; border-top: 1px solid var(--rule); counter-reset: r; }
.ruled > li { display: grid; grid-template-columns: 64px minmax(0, 1fr) minmax(0, 1.2fr); gap: 8px 32px; padding: 22px 0; border-bottom: 1px solid var(--rule-2); }
.ruled > li > b { font: 600 18px/1.4 var(--serif); color: var(--gold-ink); font-variant-numeric: tabular-nums; }
.ruled h3 { font: 600 20px/1.35 var(--serif); }
.ruled p { color: var(--ink-2); }

/* FAQ */
.faq { border-top: 3px solid var(--rule); max-width: 900px; }
.faq details { border-bottom: 1px solid var(--rule-2); }
.faq summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 1fr auto; gap: 20px; padding: 20px 0; font: 600 clamp(18px, 1.7vw, 21px)/1.4 var(--serif); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; width: 12px; height: 12px; margin-top: 8px; border-right: 1.6px solid var(--gold-ink); border-bottom: 1.6px solid var(--gold-ink); transform: rotate(45deg); transition: transform .35s var(--ease); }
.faq details[open] summary::after { transform: rotate(-135deg) translate(-4px, -4px); }
.faq details > p { padding: 0 48px 22px 0; color: var(--ink-2); max-width: 66ch; }

/* archive */
.archive { list-style: none; padding: 0; border-top: 3px solid var(--rule); }
.archive li a { display: grid; grid-template-columns: 120px 1fr auto; gap: 24px; align-items: baseline; padding: 24px 0; border-bottom: 1px solid var(--rule-2); text-decoration: none; }
.archive .y { font: 600 34px/1 var(--serif); color: var(--ink); font-variant-numeric: tabular-nums; }
.archive .t { font: 600 20px/1.35 var(--serif); }
.archive .t small { display: block; margin-top: 4px; font: 400 15px/1.5 var(--sans); color: var(--ink-2); }
.archive li a:hover .t { text-decoration: underline; text-decoration-color: var(--foil); text-underline-offset: 6px; }

/* next-page footer link, like a booklet's "continued on" */
.turn { display: flex; justify-content: flex-end; margin-top: clamp(48px, 6vw, 80px); }
.turn a { display: grid; gap: 4px; text-align: right; text-decoration: none; padding-top: 14px; border-top: 3px solid var(--rule); min-width: min(100%, 360px); }
.turn small { font: 600 12px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-ink); }
html:lang(ja) .turn small { letter-spacing: .04em; }
.turn span { font: 600 22px/1.3 var(--serif); }
.turn a:hover span { text-decoration: underline; text-decoration-color: var(--foil); text-underline-offset: 6px; }

@media (max-width: 900px) {
  .two { grid-template-columns: 1fr; }
  .ruled > li { grid-template-columns: 48px 1fr; }
  .ruled > li > p { grid-column: 2; }
}
@media (max-width: 640px) {
  .crumbs .folio { display: none; }
  .facts > div { grid-template-columns: 1fr; gap: 4px; }
  .notice { grid-template-columns: 1fr; }
  .subtoc a { grid-template-columns: 1fr auto; }
  .subtoc i { display: none; }
  .archive li a { grid-template-columns: 1fr; gap: 6px; }
  .faq details > p { padding-right: 0; }
}

/* a running head already draws the opening rule */
.runhead + .facts, .runhead + .subtoc, .runhead + .timetable, .runhead + .ruled,
.runhead + .faq, .runhead + .archive, .runhead + .chapters { border-top: 0; }
.runhead + .timetable thead th { padding-top: 0; }
.runhead--solo { grid-template-columns: 1fr; }

/* archive rows: edition link + direct album / proceedings links */
.archive li { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto auto; gap: 12px 28px; align-items: baseline; padding: 24px 0; border-bottom: 1px solid var(--rule-2); }
.archive li a.t { text-decoration: none; }
.archive li a.t:hover { text-decoration: underline; text-decoration-color: var(--foil); text-underline-offset: 6px; }
.archive__links { display: flex; gap: 20px; }
.archive__links a { font-weight: 600; font-size: 15px; text-decoration: underline; text-decoration-color: var(--foil); text-decoration-thickness: 2px; text-underline-offset: 5px; }
.archive__links a:hover { text-underline-offset: 8px; }

/* proceedings */
.ky-pend { color: var(--ink-2); max-width: 64ch; padding: 4px 0; }
.albums { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 28px; }
.albums a { display: grid; gap: 10px; text-decoration: none; }
.albums img, .albums__blank { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; background: var(--ice-2, #E6EAF3); }
.albums__t { font: 600 18px/1.35 var(--serif); }
.albums__n { font-size: 14px; color: var(--ink-2); }
.albums a:hover .albums__t { text-decoration: underline; text-decoration-color: var(--foil); text-underline-offset: 5px; }
.videos { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr)); gap: 32px; }
.videos figure { margin: 0; }
.videos__frame { aspect-ratio: 16 / 9; background: var(--cover-2); }
.videos iframe { width: 100%; height: 100%; border: 0; }
.videos figcaption { margin-top: 10px; font-weight: 600; }

@media (max-width: 900px) {
  .archive li { grid-template-columns: 72px 1fr; }
  .archive__links, .archive li .stamp { grid-column: 2; justify-self: start; }
}
.archive li a { display: inline; padding: 0; border: 0; } .archive li a.t { display: block; }
.attend__modes:has(> .runhead) { gap: 0; }
