/* Current paper-world design. Reading surfaces stay open; controls have soft edges.
   Loaded after legacy styles so saved and conditional screens share this treatment. */
html { scroll-padding-top: calc(var(--site-header-h) + 16px); }
.individual-longform-body .longform-section { scroll-margin-top: 16px; }
.button { border: 0; border-radius: 999px; box-shadow: none; padding: 12px 22px; line-height: 1.5; }
.button:hover { transform: translateY(-1px); box-shadow: 0 4px 16px color-mix(in srgb, var(--modo-violet) 12%, transparent); }
.button-ghost { border: 1px solid var(--modo-line); background: var(--modo-panel); }
.button:disabled { transform: none; box-shadow: none; }
:is(select, input:not([type="radio"]):not([type="checkbox"]), textarea) { border-radius: 14px; font-size: 16px; }
.home-rpg-sections { padding: 26px 4px 36px; }
.home-institute-window.rpg-window { background: transparent; color: var(--modo-ink); padding: 16px 0; }
.home-institute-window :is(.rpg-kicker, a) { color: var(--modo-violet); }
.home-institute-window > p:not(.rpg-kicker) { font-weight: 450; line-height: 1.9; }
.home-institute-window a { display: inline-flex; align-items: center; min-height: 44px; }
.home-world-copy { padding-top: 30px; padding-bottom: 12px; }
.home-world-copy h1 { font-size: clamp(1.65rem, 7.4vw, 2.1rem); line-height: 1.3; }
.home-world-copy > p { font-size: 15px; line-height: 1.85; font-weight: 500; }
.home-door { flex-direction: column; justify-content: center; gap: 2px; padding-block: 12px; min-height: 70px; box-shadow: 0 5px 0 var(--modo-world-door-deep); }
.home-door small { font-size: 12px; }
.analytics-consent { border: 0; border-radius: 20px; width: calc(100% - 36px); grid-template-columns: minmax(0, 1fr); margin: 12px auto 28px; box-shadow: none; padding: 8px 12px; gap: 4px; }
.analytics-consent [hidden] { display: none; }
.analytics-consent #analytics-consent-status { display: block; grid-column: 1 / -1; margin-block: 8px; font-size: 14px; line-height: 1.7; }
.analytics-consent #analytics-consent-status[hidden] { display: none; }
.analytics-consent #analytics-dismiss { justify-self: start; margin-top: 8px; }
.analytics-consent .analytics-consent-copy { font-size: 13px; line-height: 1.5; }
.analytics-consent a { margin: 0; }
.analytics-consent .button { font-size: 13px; }

/* Diagnosis: one question = one card（2026-09-12 吉田さま「1問と2問の境が分かりにくい・カードに」）。
   ベンチマークは 16Personalities の回答画面: 1 枚 1 文・同じ級数・丸を選ぶと次の 1 枚へ送る。 */
.assessment-shell { width: calc(100% - 36px); }
.question-list { gap: 14px; }
.question-item {
  padding: 14px 18px 18px; border: 1px solid var(--modo-line); border-radius: 18px;
  background: var(--modo-panel); box-shadow: 0 2px 10px rgba(17, 15, 22, .05);
}
.question-item.is-current { border-color: var(--modo-violet); }
.question-dialog { border: 0; border-radius: 0; box-shadow: none; background: transparent; padding: 0; }
body.is-assessing .question-item.is-current .question-dialog { border: 0; }
/* 「場面 N」と「？」を 1 行に。文は場面文＋設問文を同じ大きさ・同じ色の 1 段落で（サイズや色の変化は付けない） */
.question-head { align-items: center; justify-content: space-between; margin: 0 0 6px; }
.question-scene-number { margin: 0; }
.question-scene-toggle { margin-block: 0; }
.question-prompt { margin: 0; color: var(--modo-ink); font-size: 17px; line-height: 1.65; font-weight: 700; }
.question-scene-body { margin: 0 0 10px; }
.scale-row { margin-top: 14px; }
/* 選択後に出る「わりとあてはまる」等の文言は出さない（両端の「あてはまらない／半々くらい／あてはまる」だけで足りる）。
   読み上げ用のラベルは各丸の sr-only に残る */
.scale-caption { display: none; }
.scale-footer { justify-content: flex-end; }
/* 「次へ」は自動送りの補助（「もどる」で戻った後・最後の 1 問）。未回答の間は控えめに */
body.is-assessing #question-next:not(.is-ready) { opacity: .45; }
body.is-assessing #question-next.is-ready { outline: 0; }
/* 1 問ずつ画面固定（2026-09-12 吉田さま「次へを押さなくても進め・ポチポチだけに」）。
   次の 1 問は同じ位置へ、短い浮き上がりで入れ替わる。着地は進捗の帯の直下（scroll-margin-top 0） */
body.is-assessing .question-item { scroll-margin-top: 0; animation: question-in .18s ease-out; }
/* 診断中はビューを画面の高さ（100vh−64px）まで伸ばさない。iOS Safari の 100vh はアドレスバーを含む高さで、
   中身より長い分だけページが動き、下に余白が露出していた（2026-09-12 吉田さま実機指摘） */
body.is-assessing .assessment-view.is-active { display: flex; flex-direction: column; min-height: 100vh; min-height: 100dvh; }
body.is-assessing .assessment-shell { display: flex; flex-direction: column; flex: 1 1 auto; padding-bottom: 0; }
/* 「もどる／次へ」の段は画面の下端に据える（上に進み具合・中央に設問・下に操作、というスマホの標準形。
   これで設問カードの下に用途のない空白が残らない） */
body.is-assessing .assessment-actions { margin-top: auto; }
@keyframes question-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { body.is-assessing .question-item { animation: none; } }
/* 「？」の場面シート: 目次のシート（#reading-contents-dialog）と同じ下から出る形。絵は 3:2・紙地に細線 */
#scene-dialog { position: fixed; inset: auto 0 0; width: min(100%, 480px); max-width: 480px; max-height: 88dvh; margin: 0 auto; padding: 16px 20px max(24px, env(safe-area-inset-bottom)); border: 0; border-radius: 28px 28px 0 0; background: var(--modo-paper); color: var(--modo-ink); box-sizing: border-box; overflow-y: auto; }
#scene-dialog::backdrop { background: #21192b65; }
.scene-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.scene-dialog-head p { margin: 0; color: var(--modo-muted); font-size: 12px; font-weight: 900; letter-spacing: .1em; }
.scene-dialog-head button { flex-shrink: 0; min-height: 44px; padding: 0 12px; border: 0; background: transparent; color: var(--modo-violet); font: inherit; font-weight: 700; cursor: pointer; }
#scene-dialog-figure { margin: 0 0 14px; }
#scene-dialog-figure img { display: block; width: 100%; aspect-ratio: 3 / 2; height: auto; object-fit: cover; border-radius: 16px; border: 1px solid var(--modo-line); background: var(--modo-panel); }
#scene-dialog-figure[hidden] { display: none; }
#scene-dialog-title { margin: 0 0 8px; font-size: 18px; line-height: 1.5; font-weight: 800; }
#scene-dialog-body { margin: 0; color: var(--modo-ink-soft); font-size: 15px; line-height: 1.85; font-weight: 500; }
/* 選択は濃い紫の塗り＋白の✓（styles.css）。淡紫の塗りは未選択と見分けがつかなかったため使わない */
.not-applicable.is-selected { background: var(--modo-violet-pale); border: 1px solid var(--modo-violet); color: var(--modo-violet); }
.progress-track { border: 0; border-radius: 999px; background: var(--modo-line); }
.assessment-actions { margin-inline: -18px; padding-inline: 18px; border-color: var(--modo-line); }

/* Reading: one 18px page margin, including past and provisional results. */
.rpg-result-body { width: calc(100% - 36px); gap: 32px; margin: 0 auto; }
.result-reading-page { min-width: 0; }
.result-without-scene .rpg-result-body { padding-top: 32px; }
.result-without-scene .result-introduction h1 { margin: 8px 0 18px; font-size: clamp(1.625rem, 7vw, 2rem); line-height: 1.5; }
.result-without-scene .result-introduction > p:last-child { font-weight: 450; font-size: 16px; line-height: 1.9; }
.result-reading-section { min-width: 0; padding-block: 24px; }
.result-prose { min-width: 0; font-size: 17px; line-height: 1.95; }
.individual-encounter { padding: 30px 0 8px; }
.individual-encounter h1 { font-size: clamp(2rem, 9vw, 2.6rem); line-height: 1.25; }
.individual-truth { color: var(--modo-ink-soft); font-size: 18px; font-weight: 600; }
.individual-tagline { background: var(--modo-world-hill-mid); border-radius: 999px; transform: none; padding: 10px 16px; }
.character-provisional { color: var(--modo-muted); border-color: var(--modo-line); }
.individual-introduction { font-size: 17px; font-weight: 450; line-height: 1.95; }
.individual-result .result-world-scene { height: 260px; }
.result-world-scene img { max-width: 80%; height: 84%; bottom: 8px; }
.result-reading { min-width: 0; padding: 24px 0; }
.result-reading > summary { gap: 16px; }
.result-reading[open] > summary { border-bottom: 1px solid var(--modo-line); }
.result-reading > summary strong { font-size: 23px; }
.individual-longform-body { max-width: 100%; }
/* 8 章の目次は 2 列（2026-09-12・D-13「共有は 4 画面以内」のため。1 列 8 行では目次だけで 1 画面弱あった） */
.longform-section { margin-top: 72px; }
.longform-head { text-align: left; margin: 0 0 22px; }
.longform-head h2 { font-size: 28px; line-height: 1.5; }
.chapter-scene { margin: 22px -18px 32px; }
.chapter-scene img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.longform-block, .longform-list { max-width: none; }
.longform-block h3 { font-size: 20px; line-height: 1.65; margin-bottom: 20px; }
.longform-block p, .longform-list p { font-size: 17px; line-height: 2; font-weight: 450; }
.longform-list { gap: 32px; }
.longform-list li { padding: 0; border: 0; background: transparent; }
.longform-list strong { font-size: 20px; line-height: 1.65; }
.reading-note { min-width: 0; padding: 20px 0; border-top: 1px solid var(--modo-line); color: var(--modo-muted); font-size: 14px; line-height: 1.9; }
/* 折りたたみの見出しは指で押せる高さ（40px 以上）にする。2026-09-12 の 390px 監査で 27px と実測 */
.reading-note > summary { display: flex; align-items: center; min-height: 40px; cursor: pointer; }
.personal-reading { border: 0; border-radius: 0; background: transparent; padding: 8px 0; }
.personal-reading h2 { font-size: 24px; }
.personal-reading-item h3 { font-size: 19px; }
.personal-reading-item > p { font-size: 17px; }
.individual-neighbour { border: 0; border-radius: 24px; box-shadow: none; background: transparent; padding: 0; }
.individual-neighbour.changes-family { border: 0; }
.individual-neighbour img { border-radius: 24px; mix-blend-mode: multiply; }
.individual-neighbour figcaption { font-size: 14px; line-height: 1.6; }
.individual-neighbour figcaption > span { white-space: normal; }
.rpg-story-windows { grid-template-columns: 1fr; gap: 28px; }
.rpg-story-windows .rpg-window, .rpg-story-windows .rpg-question-window { padding: 0; border: 0; background: transparent; box-shadow: none; }
.rpg-result .domain-pole-list, .rpg-outcome .domain-pole-list, .rpg-outcome .outcome-domain-list { border: 0; background: transparent; }
.rpg-result .domain-pole-row, .rpg-outcome .domain-pole-row { padding: 18px 0; border-color: var(--modo-line); border-width: 1px; }
.rpg-result .domain-pole-heading h3, .rpg-outcome .domain-pole-heading h3 { font-size: 15px; }
.rpg-result .domain-pole-track, .rpg-outcome .domain-pole-track { border: 0; border-radius: 999px; background: var(--modo-violet-pale); }
.rpg-result .domain-pole-track::before, .rpg-outcome .domain-pole-track::before { background: var(--modo-world-hill-mid); }
.rpg-result .domain-pole-track::after, .rpg-outcome .domain-pole-track::after { background: none; }
.result-reading-dock { border: 1px solid var(--modo-line); border-radius: 999px; box-shadow: 0 4px 24px color-mix(in srgb, var(--modo-ink) 12%, transparent); }
.result-reading-dock :is(a, button) { border-radius: 999px; font-size: 13px; }
.outcome-only, .rpg-outcome { width: calc(100% - 36px); margin: 0 auto; padding: 32px 0 60px; border: 0; box-shadow: none; background: transparent; }
.outcome-only h1, .rpg-outcome .rpg-dialog-window h1, .individual-unordered .rpg-dialog-window h1 { font-size: 30px; line-height: 1.5; }

/* Dialogs use the phone surface; long records never acquire another reading gutter. */
dialog:not(.site-menu-dialog) { width: min(480px, 100%); max-width: 100%; max-height: 100dvh; margin: auto; border: 0; border-radius: 28px; background: var(--modo-panel); box-shadow: 0 16px 50px color-mix(in srgb, var(--modo-ink) 16%, transparent); }
.dialog-card { padding: 28px 18px; --dialog-pad: 18px; }
.dialog-card h2 { font-size: 25px; line-height: 1.5; }
dialog.album-dialog, dialog.reading-dialog, #result-history-dialog { height: 100dvh; border-radius: 0; }
.album-dialog-head { padding: 10px 18px; }
.album-dialog-body { padding: 24px 18px; }
.album-dialog-head, #result-history-dialog form { background: var(--modo-panel); border-color: var(--modo-line); }
.history-dialog-card { padding: 0 18px 32px; }
#product-dialog > .dialog-card { padding-top: 0; }
#product-dialog .dialog-close { position: sticky; top: 0; right: auto; display: block; margin: 0 0 16px auto; padding: 14px 12px; background: var(--modo-panel); border-radius: 999px; }
.history-entry { padding: 20px 0; border: 0; border-top: 1px solid var(--modo-line); background: transparent; }
.history-entry > summary strong { font-size: 20px; }
.history-chapters { gap: 8px; }
.history-chapters button { border: 1px solid var(--modo-line); border-radius: 999px; font-size: 14px; }
.history-source-notice { border: 0; border-radius: 20px; padding: 18px; }
.reply-counts > div { border: 0; border-radius: 20px; background: var(--modo-violet-pale); }
.share-management-card, .safety-dialog-card { max-height: none; overflow: visible; }
.owned-referral-list > article { border: 0; border-radius: 22px; padding: 18px; }
.owned-referral-list > article.is-disabled { border: 0; border-inline-start: 4px solid var(--modo-coral); }
.owned-referral-heading b { border: 0; border-radius: 999px; background: var(--modo-world-hill-mid); }
.owned-referral-empty { border: 0; padding: 20px 0; }
.copy-feedback-panel { border: 0; border-radius: 24px; box-shadow: 0 8px 32px color-mix(in srgb, var(--modo-ink) 16%, transparent); }
.copy-feedback-panel-card { padding: 24px 18px; }
.copy-feedback-panel .button { box-shadow: none; }
.copy-feedback-panel-card blockquote { border: 0; border-radius: 18px; font-size: 16px; font-weight: 450; line-height: 1.9; }
.copy-feedback-reactions button, .copy-feedback-directions button { min-height: 44px; border: 1px solid var(--modo-line); border-radius: 999px; padding: 10px 14px; }
.copy-feedback-reactions button.is-active, .copy-feedback-directions button.is-active { background: var(--modo-violet-pale); color: var(--modo-ink); border-color: var(--modo-violet); box-shadow: none; }
.copy-feedback-directions { min-width: 0; padding: 16px 0 0; border: 0; }
.album-discard, .album-selection-toolbar { border: 0; border-radius: 20px; }
.album-discard button { border-radius: 999px; }
.album-sentences label { border-radius: 18px; padding: 16px; }
.reading-album { border: 0; border-radius: 0; margin: 24px 0; padding: 0; background: transparent; }
.album-list, .album-controls { grid-template-columns: minmax(0, 1fr); }
.album-item { border: 0; border-radius: 0; padding: 24px 0; background: transparent; border-top: 1px solid var(--modo-line); }
.album-item[data-selected] { border-radius: 20px; padding: 20px; }

/* The collection begins with residents. Record management is an intentional expansion. */
.dex-view { padding: 32px 18px 64px; }
.dex-heading > p:last-child { font-size: 15px; font-weight: 450; line-height: 1.85; }
.dex-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px 6px; }
.dex-cell { padding: 10px 4px; border-radius: 24px; }
.dex-cell img { mix-blend-mode: multiply; border: 0; background: transparent; border-radius: 24px; }
.dex-cell[data-state="today"] { outline: 0; background: var(--modo-violet-pale); }
.dex-cell figcaption { gap: 6px; }
.dex-number { font-size: 10px; white-space: normal; word-break: normal; overflow-wrap: anywhere; }
.dex-name, .dex-cell[data-name-size] .dex-name { font-size: 12px; letter-spacing: -.02em; white-space: normal; word-break: normal; overflow-wrap: anywhere; line-height: 1.6; }
.dex-display-options, #dex-records { border-block-start: 1px solid var(--modo-line); }
.dex-display-options > summary, #dex-records > summary { display: flex; align-items: center; min-height: 60px; gap: 8px; font-size: 16px; font-weight: 700; cursor: pointer; list-style: none; }
.dex-display-options > summary::-webkit-details-marker, #dex-records > summary::-webkit-details-marker { display: none; }
.dex-display-options > summary::after, #dex-records > summary::after { content: '+'; margin-left: auto; color: var(--modo-violet); }
.dex-display-options[open] > summary::after, #dex-records[open] > summary::after { content: '−'; }
.dex-controls { border: 0; padding: 8px 0 20px; }
.dex-controls select { border-color: var(--modo-line); border-radius: 14px; font-size: 16px; }
.dex-journal { border-color: var(--modo-line); }
.dex-journal-list button { border: 0; border-radius: 20px; }
.dex-display-options > summary:focus-visible, #dex-records > summary:focus-visible { outline: 3px solid var(--modo-violet); outline-offset: 3px; }

/* Secondary and conditional screens share the same open page treatment. */
.friend-view { padding: 32px 18px 64px; }
.friend-view > .outcome-only { width: 100%; margin: 0; padding: 0; }
.friend-view > .outcome-only h1 { text-wrap: pretty; }
.friend-view > .outcome-only > p:not(.section-kicker) { font-size: 17px; font-weight: 450; line-height: 1.9; }
.connection-hub { max-width: 100%; margin: 0; padding: 0; background: transparent; }
.connection-card { padding: 24px 0; background: transparent; box-shadow: none; }
.connection-hub h1 { font-size: 30px; line-height: 1.5; }
.connection-hub > p:not(.section-kicker), .connection-card p { font-size: 16px; font-weight: 450; line-height: 1.9; }
.friend-reaction-card, .friend-host-card, .friend-individual-card { border: 0; box-shadow: none; border-radius: 24px; }
.friend-reaction-card { padding: 24px 0; background: transparent; }
.landing-reaction-row button { border-radius: 999px; box-shadow: none; }
#method-view.method-view, #shop-view.shop-view { width: calc(100% - 36px); padding: 32px 0 64px; }
#method-view .method-hero { padding: 0; gap: 24px; }
#method-view .method-hero h1, #method-view .method-hero h1 span { color: var(--modo-ink); font-size: 32px; line-height: 1.45; }
#method-view .method-hero-copy > p:last-child { color: var(--modo-ink-soft); font-weight: 450; }
#method-view .method-origin-card { border: 0; border-radius: 28px; background: var(--modo-world-hill-mid); box-shadow: none; transform: none; }
#method-view .method-principles { padding: 24px 0; }
#method-view .method-flow { grid-template-columns: minmax(0, 1fr); gap: 28px; }
#method-view .method-flow article, #method-view .method-flow article:last-child { border: 0; box-shadow: none; background: transparent; padding: 0; }
#method-view .method-separation, #method-view .method-guardrails { border: 0; padding-top: 24px; }
#method-view .method-separation h2, #method-view .method-guardrails h2 { font-size: 26px; line-height: 1.5; }
#method-view .method-layer-grid article, #method-view .method-guardrails li { border: 0; box-shadow: none; padding: 16px 0; background: transparent; }
#method-view .method-hero { display: block; }
#method-view .method-flow p, #method-view .method-layer-grid p { font-size: 17px; font-weight: 450; line-height: 1.9; }
#method-view .method-guardrails { display: block; padding: 20px 0; border-top: 1px solid var(--modo-line); }
#method-view .method-guardrails summary { padding: 12px 0; font-size: 16px; font-weight: 700; cursor: pointer; }
#method-view .method-guardrails li { display: list-item; min-height: 0; padding: 10px 0; margin-left: 1.2em; list-style: disc; font-size: 15px; line-height: 1.8; }
#method-view .method-guardrails > a { display: inline-block; padding: 12px 0; color: var(--modo-ink); font-size: 15px; line-height: 1.8; }
.shop-message { padding: 24px 0; transform: none; }
.shop-message h1 { font-size: 32px; line-height: 1.5; }
.shop-message > p:not(.rpg-kicker), .theme-preview > p:not(.rpg-kicker), .commerce-restore p { font-size: 16px; font-weight: 450; line-height: 1.9; }
.shop-message .shop-guardrail { border-color: var(--modo-line); }
.shop-sign { border: 0; border-radius: 999px; box-shadow: none; background: var(--modo-world-hill-mid); }
.premium-preview, .theme-preview, .commerce-restore { border: 0; box-shadow: none; background: transparent; }
.premium-preview-grid, .full-report-theme-grid { grid-template-columns: minmax(0, 1fr); border: 0; }
.premium-preview-grid article, .full-report-theme:nth-child(n) { border: 0; box-shadow: none; padding: 24px 0; background: transparent; }
.full-report-action, .unlocked-full-report, .score-section { border: 0; box-shadow: none; padding: 24px 0; background: transparent; }
.product-preview-content { max-height: none; overflow: visible; padding: 0; border: 0; background: transparent; }
.legacy-report-themes p, .legacy-facet-readings p { font-size: 17px; line-height: 2; font-weight: 450; }
.deep-experiment, .deep-experiment.is-active,
.product-satisfaction, .product-satisfaction.is-recorded { border: 0; border-radius: 0; background: transparent; box-shadow: none; padding: 24px 0; }
.deep-experiment p, .product-satisfaction p { font-size: 17px; line-height: 1.9; font-weight: 450; }
.deep-experiment-task { border: 0; border-radius: 0; padding: 0; background: transparent; }
.satisfaction-scale { display: grid; grid-template-columns: repeat(4, minmax(44px, 1fr)); gap: 8px; }
.satisfaction-scale button { min-width: 44px; min-height: 44px; border: 1px solid var(--modo-line); border-radius: 999px; box-shadow: none; background: var(--modo-panel); }
.satisfaction-scale button:hover { background: var(--modo-world-hill-mid); }
.safety-receipt { border: 0; border-radius: 22px; background: var(--modo-world-hill-mid); }
.checkout-contract, .checkout-contract > div, .checkout-contract dd { border-color: var(--modo-line); }
.checkout-price { border: 0; border-radius: 22px; background: var(--modo-world-hill-mid); }
.session-save-notice { border: 0; border-radius: 20px; }

/* A result is a page: its date, a named way back, and a contents button while reading. */
.result-location { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 18px; min-height: 52px; font-size: 12px; color: var(--modo-muted); }
.result-location button { min-height: 44px; padding: 6px 0; flex-shrink: 0; border: 0; background: transparent; color: var(--modo-violet); font: inherit; font-weight: 700; cursor: pointer; }
.result-location span { text-align: right; }
.result-records-page { padding: 0 18px 60px; }
.result-records-page .result-location { padding-inline: 0; }
.result-records-page h1 { margin-top: 28px; font-size: 28px; }
.result-records-page > p { line-height: 1.9; }
#result-record-list { margin-block: 32px; }
.result-record-link { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 108px; padding: 12px 0; border: 0; border-bottom: 1px solid var(--modo-line); background: transparent; color: var(--modo-ink); font: inherit; text-align: left; cursor: pointer; }
.result-record-link img, .record-without-character { width: 80px; height: 80px; object-fit: contain; flex-shrink: 0; }
.result-record-link > span:nth-child(2) { display: grid; gap: 8px; flex: 1; }
.result-record-link time { font-size: 12px; color: var(--modo-muted); }
.result-record-link strong { font-size: 18px; }
.personal-reading-item { padding: 24px 0; border-bottom: 1px solid var(--modo-line); }
.personal-reading-item h3 { margin: 0 0 16px; }
.personal-reading-prompt { padding: 0; background: none; }
.reading-contents-fab { position: fixed; z-index: 35; right: max(18px, calc((100vw - 480px) / 2 + 18px)); bottom: max(20px, env(safe-area-inset-bottom)); width: 62px; height: 62px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; border: 0; border-radius: 50%; background: var(--modo-violet); color: white; box-shadow: 0 4px 16px #34216c30; font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.reading-contents-fab > span { font-size: 19px; line-height: 1; }
#reading-contents-dialog { position: fixed; inset: auto 0 0; width: min(100%, 480px); max-width: 480px; max-height: 82dvh; margin: 0 auto; padding: 20px 24px max(24px, env(safe-area-inset-bottom)); border: 0; border-radius: 28px 28px 0 0; background: var(--modo-paper); color: var(--modo-ink); box-sizing: border-box; overflow-y: auto; }
.reading-contents-dialog::backdrop { background: #21192b65; }
.reading-contents-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.reading-contents-head h2 { font-size: 20px; }
.reading-contents-head button { flex-shrink: 0; min-height: 44px; }
.reading-contents-dialog ol { list-style: decimal-leading-zero; padding-left: 28px; margin: 14px 0 0; }
.reading-contents-dialog li { padding-left: 8px; color: var(--modo-muted); border-top: 1px solid var(--modo-line); }
.reading-contents-dialog li button { min-height: 50px; width: 100%; padding: 10px 0; border: 0; background: transparent; font: inherit; font-size: 16px; font-weight: 650; text-align: left; color: var(--modo-ink); cursor: pointer; }
.individual-longform-body .longform-section, .personal-reading h2 { scroll-margin-top: 16px; }
.dex-open { width: 100%; min-height: 52px; }
.dex-story-link { position: relative; z-index: 1; display: block; min-height: 44px; width: 100%; padding: 4px; border: 0; border-radius: 16px; background: transparent; color: var(--modo-violet); font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.dex-story-link:hover { background: var(--modo-violet-pale); }
.dex-story-link:focus-visible { outline: 3px solid var(--modo-violet); outline-offset: 2px; }
.dex-record-count { font-size: 10px; line-height: 1.5; }
.home-reading-guide { padding-block: 12px 28px; }
.home-reading-guide h2 { font-size: 25px; line-height: 1.5; }
.home-reading-guide p { font-size: 16px; line-height: 1.9; font-weight: 450; }
.home-start-steps { list-style: decimal-leading-zero; padding: 0 0 0 30px; margin: 26px 0 30px; }
.home-start-steps li { padding: 12px 0 12px 8px; border-bottom: 1px solid var(--modo-line); line-height: 1.8; }
.home-start-steps li::marker { color: var(--modo-violet); font-weight: 700; }
@media (prefers-reduced-motion: reduce) { .button { transition: none; } .button:hover { transform: none; } }

/* ---- 結果ページの文書構造（2026-09-13 吉田さま「先頭に目次・折りたたむな・課金は下」） ---- */
.result-cover-actions { margin-top: 20px; }
.result-cover-actions .button { width: 100%; }
.individual-encounter .share-status { margin: 10px 0 0; text-align: center; }
.result-contents h2, .result-measurement h2, .individual-neighbours h2, .result-themes h2, .result-closing h2 { font-size: 22px; margin: 0 0 12px; }
.result-contents-list { list-style: none; margin: 0; padding: 0; }
.result-contents-list > li { border-bottom: 1px solid var(--modo-line); }
.result-contents-list > li:last-child { border-bottom: 0; }
.result-contents-list button[data-contents-target], .result-contents-list button[data-individual-longform-target] { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 44px; padding: 10px 0; border: 0; background: transparent; color: var(--modo-ink); font: inherit; text-align: left; cursor: pointer; }
.result-contents-list button:disabled { color: var(--modo-ink-soft); cursor: default; }
.result-contents-list button > span { flex: 0 0 2.2em; font-variant-numeric: tabular-nums; color: var(--modo-violet); font-weight: 700; }
.result-contents-list button > strong { font-size: 16px; line-height: 1.5; font-weight: 700; }
.facet-readings { margin-top: 24px; }
.facet-readings > h3 { font-size: 19px; margin: 0 0 4px; }
.facet-reading-domain { margin-top: 20px; }
.facet-reading-domain-title { font-size: 15px; font-weight: 700; color: var(--modo-ink-soft); margin: 0 0 4px; }
.facet-reading-domain .personal-reading-item h4 { font-size: 18px; margin: 0 0 12px; }
.result-themes-intro { margin: 0 0 4px; }
.result-themes-upcoming { margin: 22px 0 0; padding-top: 14px; border-top: 1px solid var(--modo-line); color: var(--modo-ink-soft); font-size: 14px; line-height: 1.8; }
.result-themes-upcoming > span { display: inline-block; margin-right: .6em; font-weight: 700; color: var(--modo-ink); }
.result-closing .result-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.result-closing .result-retake { margin: 0 0 12px; text-align: left; }
/* 旧 .result-retake button（下線だけの文字ボタン）より優先し、下の 2 つと同じ丸いボタンにそろえる */
.result-closing .result-retake .button { width: 100%; min-height: 52px; padding: 0 20px; border: 1px solid var(--modo-line); border-radius: 999px; background: var(--modo-panel); color: var(--modo-ink); font-weight: 700; }
.result-research-note { margin-top: 24px; font-size: 14px; color: var(--modo-ink-soft); }
.result-research-note h3 { font-size: 14px; margin: 0 0 6px; color: var(--modo-ink); }