/* #624b35 on #f8f5ed exceeds 7:1. Colours supplement text labels. */
.ryokan-page { --ryokan-brown: #624b35; --ryokan-line: #c9c1b2; }
.ryokan-feature { max-width: 1000px; margin: 0 auto; }
.ryokan-feature p, .ryokan-feature dd { line-height: 1.85; }
.ryokan-feature a { text-underline-offset: .22em; text-decoration-thickness: 1px; }
.ryokan-tabs { display: flex; flex-wrap: wrap; gap: 0 24px; border-block: 1px solid #c9c1b2; margin: 24px 0; }
.ryokan-tabs a { padding-block: 14px; min-height: 44px; text-decoration: none; }
.ryokan-tabs a[aria-current] { box-shadow: inset 0 -3px #624b35; font-weight: 700; }
[data-ryokan-primer] .article-toc ol { columns: 2; }
[data-ryokan-primer] .article-toc li { break-inside: avoid; }
.ryokan-picture { margin: 30px 0 60px; }
.ryokan-picture img { display: block; width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; border-radius: 2px; }
.ryokan-picture figcaption, .ryokan-room-figure figcaption { margin-top: 10px; font-size: .8rem; line-height: 1.65; color: #52636a; }
.ryokan-section { max-width: 760px; margin: 60px auto; }
.ryokan-section h2 { font-size: clamp(1.55rem,3.6vw,2.5rem); line-height: 1.25; text-wrap: balance; margin-bottom: 20px; }
.ryokan-section h2:lang(ja) { font-size: clamp(1.4rem,3.2vw,2rem); line-height: 1.6; }
.ryokan-section h3 { font-size: 1.15rem; line-height: 1.5; }
.ryokan-chapter { border-top: 1px solid var(--ryokan-line); padding-top: 36px; }
.ryokan-moment, .ryokan-number { font-size: .78rem; letter-spacing: .09em; color: var(--ryokan-brown); font-weight: 700; }
.ryokan-citations { font-size: .78rem; line-height: 1.65; margin-top: 24px; }
.ryokan-back { display: inline-block; padding-block: 10px; font-size: .85rem; }
.ryokan-reading-list article { display: grid; grid-template-columns: 40px 1fr; gap: 16px; padding-block: 24px; border-top: 1px solid var(--ryokan-line); }
.ryokan-reading-list h3 { margin-top: 0; }
.ryokan-definitions, .ryokan-words, .ryokan-phrases { margin: 24px 0; }
.ryokan-definitions > div, .ryokan-words > div, .ryokan-phrases > div { display: grid; grid-template-columns: minmax(140px,1fr) 2.4fr; gap: 24px; border-top: 1px solid var(--ryokan-line); padding-block: 22px; }
.ryokan-feature dt { font-weight: 700; line-height: 1.7; }
.ryokan-feature dd { margin: 0; }
.ryokan-feature dd p { margin: 0 0 10px; }
.ryokan-words small { display: block; font-weight: 400; }
.ryokan-phrases dd p[lang="ja"] { font-size: 1.15rem; }
.ryokan-jumps { padding-left: 22px; }
.ryokan-jumps a { display: inline-block; padding-block: 8px; }
.ryokan-safety, .ryokan-note { padding: clamp(20px,4vw,32px); background: #eee8dd; border-left: 3px solid var(--ryokan-brown); }
.ryokan-safety h2 { font-family: inherit; font-size: 1.15rem; line-height: 1.65; }
.ryokan-note p { margin: 0; }
.ryokan-checks details, .ryokan-faq details { border-bottom: 1px solid var(--ryokan-line); }
.ryokan-feature summary { cursor: pointer; min-height: 48px; padding: 18px 4px; line-height: 1.6; font-weight: 600; }
.ryokan-checks summary span { color: var(--ryokan-brown); margin-right: 12px; }
.ryokan-checks details > div { padding: 0 8px 24px; }
.ryokan-checks blockquote { margin: 20px 0; padding: 4px 20px; border-left: 2px solid var(--ryokan-line); }
.ryokan-feature details:target { outline: 2px solid var(--ryokan-brown); outline-offset: 5px; }
.ryokan-table-scroll { overflow-x: auto; margin: 28px 0; }
.ryokan-feature table { border-collapse: collapse; width: 100%; min-width: 560px; font-size: .9rem; }
.ryokan-feature caption { text-align: left; margin-bottom: 16px; }
.ryokan-feature th, .ryokan-feature td { padding: 16px 12px; border-bottom: 1px solid var(--ryokan-line); vertical-align: top; text-align: left; }
.ryokan-feature thead { background: #eee8dd; }
.ryokan-feature tbody tr:last-child { font-weight: 700; }
.ryokan-room-figure { margin: 32px 0; }
.ryokan-room-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; font-size: .8rem; }
.ryokan-room-pair > div > span { display: block; margin-bottom: 10px; font-weight: 700; color: var(--ryokan-brown); }
.ryokan-floor { position: relative; height: 220px; background: repeating-linear-gradient(0deg, #e3decd, #e3decd 3px, #d6d0bf 4px); border: 6px solid #7b6b50; }
.ryokan-floor i { position: absolute; display: grid; place-items: center; font-style: normal; }
.ryokan-table { inset: 25% 20% 45%; border: 2px solid #7b6b50; background: #e5c5a1; color: #382b1e; }
.ryokan-cushion { inset: 62% 37% 14%; background: #627775; border: 2px solid #3b5352; }
.ryokan-futon { inset: 17% 53% 13% 9%; border: 1px solid #8d8c7e; background: #fffdfa; color: #382b1e; }
.ryokan-futon + .ryokan-futon { inset: 17% 10% 13% 52%; }
.ryokan-futon::before { content: ''; position: absolute; inset: 6% 16% 76%; border: 1px solid #aaa69a; }
.ryokan-recoveries article { padding-block: 14px; }
.ryokan-next { list-style: none; padding: 0; }
.ryokan-next li { border-top: 1px solid var(--ryokan-line); padding-block: 20px; }
.ryokan-next a { font-weight: 600; display: inline-block; padding-block: 6px; }
.ryokan-next p { font-size: .92rem; margin: 8px 0 0; }
.ryokan-review { border-top: 1px solid var(--ryokan-line); padding-top: 24px; font-size: .85rem; }
.ryokan-review h2 { font-family: inherit; font-size: 1.2rem; }
.ryokan-review li { margin-block: 12px; }
.ryokan-place-index { margin-block: 28px; }
.ryokan-place-index > div { display: grid; grid-template-columns: 130px 1fr; gap: 20px; border-block-start: 1px solid var(--ryokan-line); padding-block: 20px; }
.ryokan-place-index a { display: inline-block; padding-block: 6px; }
.ryokan-place-fit { color: var(--ryokan-brown); font-weight: 600; }
.ryokan-timeline { list-style: none; padding: 0; margin-block: 28px; border-inline-start: 2px solid var(--ryokan-line); }
.ryokan-timeline li { display: grid; grid-template-columns: 28px 1fr; gap: 16px; padding: 14px 0 14px 20px; }
.ryokan-timeline p { margin: 0; }
.ryokan-timeline .ryokan-number { padding-top: 5px; }
.ryokan-plan-b, .ryokan-enquiry { border-block: 1px solid var(--ryokan-line); margin-block: 24px; }
.ryokan-cooking { margin-block: 32px; padding-block-start: 12px; }
.ryokan-decision li { padding-block: 10px; line-height: 1.7; }
.ryokan-draft { padding: 4px 0 16px; }
.ryokan-draft pre { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; line-height: 1.85; padding: clamp(16px,3vw,28px); background: #eee8dd; border-inline-start: 2px solid var(--ryokan-brown); }
.ryokan-draft button { font: inherit; color: #fffdfa; background: #624b35; border: 1px solid #624b35; border-radius: 2px; min-height: 48px; max-width: 100%; padding: 12px 20px; cursor: pointer; white-space: normal; }
.ryokan-draft button[hidden] { display: none; }
.ryokan-draft button:disabled { cursor: progress; }
.ryokan-copy-status { font-size: .85rem; min-height: 1.7em; }
.ryokan-menu-slip { margin: 32px 0; padding: clamp(20px,4vw,36px); border: 1px solid var(--ryokan-line); background: #fffdf8; box-shadow: 4px 4px 0 #e9e2d5; }
.ryokan-menu-slip__title { font-family: 'Noto Serif JP',serif; letter-spacing: .35em; font-size: 1.4rem; margin: 0 0 24px; }
.ryokan-menu-slip ol { list-style: none; padding: 0; }
.ryokan-menu-slip li { display: grid; grid-template-columns: 84px 1fr; gap: 16px; padding-block: 12px; border-top: 1px solid #e9e2d5; line-height: 1.7; }
.ryokan-menu-slip li > :first-child { font-family: 'Noto Serif JP',serif; }
.ryokan-menu-slip figcaption { font-size: .8rem; line-height: 1.7; border-top: 1px solid var(--ryokan-line); padding-top: 16px; margin-top: 16px; }
.ryokan-menu-terms details { border-block-end: 1px solid var(--ryokan-line); }
.ryokan-menu-terms summary > span:first-child { font-size: 1.1rem; }
.ryokan-menu-terms summary small { font-size: .8rem; font-weight: 400; margin-inline-start: 12px; }
.ryokan-menu-meaning { display: block; font-size: .87rem; font-weight: 400; margin: 6px 0 0 20px; }
.ryokan-menu-terms details > div { padding: 0 8px 24px; }
.ryokan-menu-terms blockquote, .ryokan-table-question { border-inline-start: 2px solid var(--ryokan-brown); padding-inline-start: 20px; margin-inline: 0; }
.ryokan-question-label { font-size: .8rem; font-weight: 700; color: var(--ryokan-brown); margin-block-end: 8px; }
.ryokan-regional-dish { padding-block: 28px 12px; border-top: 1px solid var(--ryokan-line); margin-top: 28px; }
.ryokan-regional-dish h3 { font-size: 1.35rem; }
.ryokan-plan-reading { padding-left: 24px; }
.ryokan-plan-reading > li { padding: 12px 0 28px 8px; border-top: 1px solid var(--ryokan-line); }
.ryokan-plan-reading > li::marker { color: var(--ryokan-brown); font-weight: 600; }
.ryokan-plan-reading h3 { font-size: 1rem; }
.ryokan-plan-reading dt { font-size: .8rem; color: var(--ryokan-brown); margin-top: 14px; }
.ryokan-plan-reading a { display: inline-block; padding-block: 8px; font-size: .85rem; }
.ryokan-feature blockquote p { margin-block: 10px; }
@media(max-width: 700px) {
  [data-ryokan-primer] { display: block; }
  [data-ryokan-primer] > h2 { font-size: 1.4rem; line-height: 1.6; margin-block: 14px; }
  [data-ryokan-primer] .article-primer__scene { border: 0; padding-top: 0; }
}
@media(max-width: 600px) {
  .ryokan-section { margin-block: 40px; }
  .ryokan-picture { margin-block: 24px 40px; }
  [data-ryokan-primer] .article-toc ol { columns: 1; }
  .ryokan-definitions > div, .ryokan-words > div, .ryokan-phrases > div { grid-template-columns: 1fr; gap: 8px; }
  .ryokan-room-pair { gap: 12px; }
  .ryokan-floor { height: 170px; }
  .ryokan-tabs { gap: 0 16px; }
  .ryokan-place-index > div { grid-template-columns: 1fr; gap: 6px; }
}
@media print {
  .ryokan-tabs, .ryokan-back { display: none; }
  .ryokan-section { break-inside: auto; }
  .ryokan-table-scroll { overflow: visible; }
  .ryokan-picture { max-width: 600px; }
  .ryokan-draft button, .ryokan-copy-status { display: none; }
}
