/* Fictional public sample only. Private readings and shared terms remain independent. */
.ss-sample { --ss-ink:#17263e; --ss-muted:#687a90; --ss-line:#dce4ef; --ss-blue:#0067ff; color:var(--ss-ink); font-size:14px; line-height:1.85; max-width:1200px; margin:0 auto; word-break:keep-all; overflow-wrap:anywhere; }
.ss-sample, .ss-sample * { box-sizing:border-box; }
.ss-sample :is(h1,h2,h3,p,figure) { margin:0; }
.ss-sample :is(ul,ol) { padding:0; margin:0; list-style:none; }
.ss-sample :is(h1,h2,h3) { color:var(--ss-ink); letter-spacing:-.04em; }
.ss-sample h2 { font-size:26px; font-weight:750; line-height:1.5; }
.ss-sample h3 { font-size:17px; font-weight:700; line-height:1.6; }
.ss-sample p { color:var(--ss-muted); }
.ss-sample button { font:inherit; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.ss-sample a { color:inherit; text-decoration:none; }
.ss-sample img { display:block; max-width:100%; }
.ss-sample .icon { width:18px; height:18px; flex-shrink:0; }
.ss-sample [id] { scroll-margin-top:88px; }
.ss-sample :is(button,a,summary):focus-visible { outline:3px solid var(--ss-blue); outline-offset:4px; }
.ss-sample [tabindex="-1"]:focus { outline:none; }
.ss-sample .ss-kicker { display:block; font-size:13px; color:#8e7955; font-weight:700; letter-spacing:.02em; line-height:1.5; margin-bottom:12px; }
.ss-sample .ss-button { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:46px; padding:12px 20px; border:1px solid transparent; border-radius:8px; font-size:14px; font-weight:700; line-height:1.5; }
.ss-sample .ss-primary { color:#fff; background:var(--ss-blue); transition:background-color .18s; }
.ss-sample .ss-primary:hover { background:#0057db; }
.ss-sample .ss-text-button { display:inline-flex; align-items:center; gap:9px; padding:8px 0; color:var(--ss-blue); background:transparent; border:0; font-size:13px; font-weight:650; line-height:1.6; }
.ss-sample .ss-hero { display:grid; grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr); align-items:center; gap:25px; background:#faf7ef; border:1px solid #e9e2d6; border-radius:15px; overflow:hidden; }
.ss-sample .ss-hero-copy { min-width:0; padding:31px 0 33px 34px; }
.ss-sample .ss-hero h1 { font-size:clamp(32px,3.1vw,41px); font-weight:800; line-height:1.4; }
.ss-sample .ss-hero-intro { margin-top:17px; color:#65748a; font-size:14px; line-height:1.9; }
.ss-sample .ss-profile { margin-top:24px; padding-top:19px; border-top:1px solid #e6dfd1; }
.ss-sample .ss-profile > span { color:#8b7a62; font-size:13px; border:1px solid #dfd4c1; border-radius:4px; padding:3px 6px; margin-right:7px; vertical-align:middle; line-height:1.5; }
.ss-sample .ss-profile strong { font-size:15px; }
.ss-sample .ss-profile p { font-size:13px; margin-top:8px; line-height:1.8; }
.ss-sample .ss-profile small { display:block; color:#92958d; font-size:13px; margin-top:5px; line-height:1.7; }
.ss-sample .ss-hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin-top:22px; }
.ss-sample .ss-hero-actions > span { font-size:13px; color:#8f8f83; }
.ss-sample .ss-hero-picture { padding:24px 25px 24px 0; min-width:0; }
.ss-sample .ss-hero-picture img { width:100%; height:auto; aspect-ratio:3/2; object-fit:contain; border-radius:10px; }
.ss-sample .ss-reading-guide { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:20px 0; border-bottom:1px solid var(--ss-line); margin-bottom:30px; }
.ss-sample .ss-reading-guide strong { display:block; font-size:13px; font-weight:700; }
.ss-sample .ss-reading-guide p { font-size:13px; margin-top:3px; }
.ss-sample .ss-reading-guide nav { display:flex; flex-wrap:wrap; align-items:center; gap:15px; }
.ss-sample .ss-reading-guide nav button { display:inline-flex; align-items:center; gap:6px; color:#547193; border:0; background:transparent; font-size:13px; padding:6px 0; }
.ss-sample .ss-reading-guide .icon { width:15px; height:15px; }
.ss-sample .ss-layout { display:grid; grid-template-columns:235px minmax(0,1fr); align-items:start; gap:28px; }
.ss-sample .ss-toc-desktop { display:flex; flex-direction:column; position:sticky; top:87px; max-height:calc(100dvh - 108px); background:#fff; border:1px solid var(--ss-line); border-radius:10px; overflow:hidden; }
.ss-sample .ss-toc-desktop > header { padding:19px 18px 16px; border-bottom:1px solid #e9edf4; }
.ss-sample .ss-toc-desktop h2 { display:inline; font-size:14px; letter-spacing:-.02em; }
.ss-sample .ss-toc-desktop > header > span { font-size:12px; color:#97a3b2; margin-left:8px; }
.ss-sample .ss-toc-list { display:flex; flex-direction:column; padding:9px; overflow-y:auto; overscroll-behavior:contain; }
.ss-sample .ss-toc-list button { display:flex; align-items:flex-start; gap:9px; width:100%; text-align:left; border:0; background:transparent; color:#73839a; padding:10px 9px; border-radius:6px; line-height:1.75; font-size:13px; }
.ss-sample .ss-toc-number { flex-shrink:0; color:#a8b4c2; font-size:12px; padding-top:1px; min-width:15px; font-variant-numeric:tabular-nums; }
.ss-sample .ss-toc-list button:hover { color:#386295; background:#f4f7fb; }
.ss-sample .ss-toc-list button[aria-current="location"] { color:#0067ff; background:#edf4ff; font-weight:650; }
.ss-sample .ss-toc-list button[aria-current="location"] .ss-toc-number { color:#669af0; }
.ss-sample .ss-toc-list .ss-toc-extra { align-items:center; justify-content:space-between; border-top:1px solid #eef1f6; border-radius:0; margin-top:5px; padding-top:12px; }
.ss-sample .ss-toc-list .ss-toc-extra .icon { width:12px; height:12px; }
.ss-sample .ss-toc-desktop > footer { padding:12px 18px; border-top:1px solid #e9edf4; background:#fbfcfe; }
.ss-sample .ss-toc-desktop > footer > span { font-size:12px; color:#9aa5b4; }
.ss-sample .ss-toc-desktop > footer p { font-size:12px; margin-top:2px; }
.ss-sample .ss-toc-mobile { display:none; }
.ss-sample .ss-reading-stack { min-width:0; }
.ss-sample .ss-cover { background:#fff; border:1px solid var(--ss-line); border-radius:11px; padding:30px 34px; margin-bottom:23px; }
.ss-sample .ss-cover > header { margin-bottom:20px; padding-bottom:19px; border-bottom:1px solid #e6ecf3; }
.ss-sample .ss-cover h2 { font-size:25px; line-height:1.5; }
.ss-sample .ss-keywords { display:flex; flex-wrap:wrap; gap:6px; margin-top:17px; }
.ss-sample .ss-keywords li { font-size:13px; color:#7790a7; background:#f1f5f8; border-radius:4px; padding:4px 8px; line-height:1.6; }
.ss-sample .ss-prose p { font-size:15px; line-height:1.95; color:#44566d; margin:0 0 16px; }
.ss-sample .ss-prose p:last-child { margin-bottom:0; }
.ss-sample .ss-cover .ss-text-button { margin-top:20px; }
.ss-sample .ss-chapter { background:#fff; border:1px solid var(--ss-line); border-radius:11px; margin-bottom:23px; overflow:hidden; }
.ss-sample .ss-chapter-heading { padding:25px 34px 23px; border-bottom:1px solid #e6ecf3; background:linear-gradient(110deg,#fbfcff,#fff); }
.ss-sample .ss-chapter-meta { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:10px; }
.ss-sample .ss-chapter-meta > span { font-size:13px; color:#5182bd; font-weight:700; }
.ss-sample .ss-chapter-meta > small { font-size:12px; color:#a8b4c3; font-variant-numeric:tabular-nums; }
.ss-sample .ss-chapter-heading h2 { font-size:24px; line-height:1.5; }
.ss-sample .ss-chapter-inner { padding:24px 34px 27px; }
.ss-sample .ss-chapter-summary { padding:17px 20px; background:#f1f5fb; border:1px solid #e7edf6; border-radius:7px; }
.ss-sample .ss-chapter-summary h3 { font-size:13px; color:#8195af; letter-spacing:0; margin-bottom:8px; }
.ss-sample .ss-chapter-summary .ss-prose p { font-size:15px; color:#394f6b; line-height:1.85; }
.ss-sample .ss-chapter-details { margin-top:22px; padding:0; }
.ss-sample .ss-chapter-details > summary { display:flex; align-items:center; justify-content:space-between; gap:14px; color:#527dab; font-size:13px; font-weight:650; padding:12px 0; border-top:1px solid #e7edf4; border-bottom:1px solid #e7edf4; cursor:pointer; list-style:none; }
.ss-sample .ss-chapter-details > summary::-webkit-details-marker, .ss-sample .ss-toc-mobile > summary::-webkit-details-marker { display:none; }
.ss-sample .ss-details-sign { display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; font-size:19px; font-weight:400; line-height:1; color:#8a9db5; transition:transform .18s; flex-shrink:0; }
.ss-sample details[open] > summary .ss-details-sign { transform:rotate(45deg); }
.ss-sample .ss-detail-body { padding-top:22px; }
.ss-sample .ss-evidence { background:#f7f8fa; border-left:2px solid #c6d4e4; border-radius:0 6px 6px 0; padding:14px 17px; margin-top:21px; }
.ss-sample .ss-evidence > strong { display:block; font-size:13px; color:#7b8ca4; margin-bottom:7px; }
.ss-sample .ss-evidence .ss-prose p { font-size:13px; line-height:1.9; color:#62738a; }
.ss-sample .ss-advice { margin-top:22px; padding:18px 21px; background:#fbf8f1; border:1px solid #eee6d7; border-radius:7px; }
.ss-sample .ss-advice h3 { color:#9a7e4f; font-size:13px; margin-bottom:11px; letter-spacing:0; }
.ss-sample .ss-advice ol { list-style:decimal; padding-left:18px; }
.ss-sample .ss-advice li { padding-left:5px; color:#a99676; }
.ss-sample .ss-advice li + li { margin-top:10px; }
.ss-sample .ss-advice li::marker { font-size:13px; font-weight:700; }
.ss-sample .ss-advice p { font-size:14px; line-height:1.85; color:#675e50; margin:0; }
.ss-sample .ss-chapter-nav { display:flex; justify-content:space-between; gap:15px; padding:13px 34px; background:#fbfcfe; border-top:1px solid #e9edf4; }
.ss-sample .ss-chapter-nav button { display:inline-flex; align-items:center; gap:8px; font-size:13px; color:#8b9ab0; border:0; background:transparent; padding:4px 0; line-height:1.6; }
.ss-sample .ss-chapter-nav button:hover { color:var(--ss-blue); }
.ss-sample .ss-chapter-nav .icon { width:14px; height:14px; }
.ss-sample .ss-chapter-nav button:first-child .icon { transform:rotate(180deg); }
.ss-sample .ss-flow { padding:29px 34px; border:1px solid #dce5e8; border-radius:11px; background:#f6faf9; margin-bottom:23px; }
.ss-sample .ss-flow > header { margin-bottom:25px; }
.ss-sample .ss-flow h2 { font-size:25px; }
.ss-sample .ss-flow > header > p { font-size:13px; margin-top:13px; color:#8b9d9b; }
.ss-sample .ss-flow ol { display:flex; flex-direction:column; }
.ss-sample .ss-flow li { display:grid; grid-template-columns:28px minmax(0,1fr); gap:15px; padding:21px 0; border-top:1px solid #dfe9e7; }
.ss-sample .ss-flow li:last-child { padding-bottom:0; }
.ss-sample .ss-flow-index { color:#abc0b9; font-size:13px; font-weight:700; line-height:2; }
.ss-sample .ss-flow-period { display:block; color:#6b9186; font-size:13px; font-weight:700; margin-bottom:5px; }
.ss-sample .ss-flow h3 { font-size:18px; margin-bottom:11px; }
.ss-sample .ss-flow .ss-prose p { font-size:14px; color:#5c716f; }
.ss-sample .ss-chart { padding:29px 34px; border:1px solid var(--ss-line); border-radius:11px; background:#fff; margin-bottom:0; }
.ss-sample .ss-chart > header { margin-bottom:22px; }
.ss-sample .ss-chart h2 { font-size:25px; }
.ss-sample .ss-chart > header > p { font-size:13px; margin-top:13px; }
.ss-sample .ss-chart .reading-section { background:transparent; border:0; border-radius:0; padding:0; margin:0; }
.ss-sample .ss-chart-content > .reading-section > details > summary { color:#426a99; font-size:13px; cursor:pointer; padding:13px 0; border-top:1px solid #e4eaf2; border-bottom:1px solid #e4eaf2; }
.ss-sample .ss-chart .reading-section p { font-size:13px; line-height:1.9; margin:10px 0; }
.ss-sample .ss-chart .reading-section h3 { font-size:16px; }
.ss-sample .ss-chart .element-graph { background:#f2f5fa; border:1px solid #e1e8f3; border-radius:7px; padding:16px; margin:18px 0; }
.ss-sample .ss-chart .element-graph > summary { cursor:pointer; color:#6783a6; font-size:13px; font-weight:650; }
.ss-sample .ss-chart .element-graph p { font-size:13px; color:#8796a9; }
.ss-sample .ss-chart .text-button { margin-top:12px; font-size:13px; }
.ss-sample .ss-ending { display:flex; justify-content:space-between; align-items:center; gap:35px; margin-top:35px; padding:31px 35px; border:1px solid #e4dfd6; border-radius:12px; background:#faf6ef; }
.ss-sample .ss-ending h2 { font-size:26px; }
.ss-sample .ss-ending p { font-size:13px; margin-top:16px; }
.ss-sample .ss-ending-actions { display:flex; flex-direction:column; align-items:flex-start; gap:10px; flex-shrink:0; }
.ss-sample .ss-ending-guide { color:#a29685; font-size:13px; padding-top:3px; }
.ss-sample .reading-term { color:#397fc9; background:transparent; border:0; border-bottom:1px dotted #8fb5dd; padding:0 1px; display:inline; font-size:inherit; line-height:inherit; vertical-align:baseline; }
.ss-sample .reading-term:hover { background:#edf4fc; border-bottom-style:solid; }
.ss-sample .term-easy { color:#8fa0b3; font-size:.84em; }

@media (max-width:1023px) {
 .ss-sample .ss-hero-copy { padding:27px 0 29px 26px; }
 .ss-sample .ss-hero h1 { font-size:32px; }
 .ss-sample .ss-hero-picture { padding:22px 22px 22px 0; }
 .ss-sample .ss-layout { display:block; }
 .ss-sample .ss-toc-desktop { display:none; }
 .ss-sample .ss-toc-mobile { display:block; background:#fff; border:1px solid var(--ss-line); border-radius:9px; margin-bottom:20px; overflow:hidden; }
 .ss-sample .ss-toc-mobile > summary { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:15px 20px; cursor:pointer; list-style:none; }
 .ss-sample .ss-toc-mobile > summary > span:first-child { display:flex; align-items:baseline; gap:12px; }
 .ss-sample .ss-toc-mobile strong { font-size:13px; }
 .ss-sample .ss-toc-mobile small { color:#94a1b2; font-size:12px; }
 .ss-sample .ss-toc-mobile .ss-toc-list { padding-top:0; max-height:460px; }
 .ss-sample .ss-toc-mobile .ss-toc-list button { font-size:13px; }
 .ss-sample .ss-ending h2 { font-size:23px; }
 .ss-sample .ss-ending { padding:28px; gap:25px; }
}

@media (max-width:767px) {
 .ss-sample { font-size:13px; }
 .ss-sample .ss-hero { display:flex; flex-direction:column; gap:0; margin:-16px -16px 0; border:0; border-radius:0; }
 .ss-sample .ss-hero-copy { width:100%; padding:27px 20px 24px; }
 .ss-sample .ss-kicker { font-size:13px; margin-bottom:10px; }
 .ss-sample .ss-hero h1 { font-size:clamp(28px,7.5vw,33px); line-height:1.43; }
 .ss-sample .ss-hero-intro { margin-top:17px; font-size:13px; line-height:1.85; }
 .ss-sample .ss-profile { margin-top:20px; padding-top:16px; }
 .ss-sample .ss-profile p { font-size:13px; }
 .ss-sample .ss-profile small { font-size:12px; }
 .ss-sample .ss-hero-actions { gap:10px; margin-top:19px; }
 .ss-sample .ss-hero-actions .ss-button { width:100%; min-height:46px; }
 .ss-sample .ss-hero-actions > span { font-size:12px; }
 .ss-sample .ss-hero-picture { width:100%; padding:0 16px 24px; }
 .ss-sample .ss-hero-picture img { border-radius:8px; }
 .ss-sample .ss-reading-guide { display:block; padding:19px 0; margin-bottom:23px; }
 .ss-sample .ss-reading-guide strong { font-size:13px; }
 .ss-sample .ss-reading-guide p { font-size:13px; line-height:1.8; }
 .ss-sample .ss-reading-guide nav { margin-top:9px; gap:18px; }
 .ss-sample .ss-reading-guide nav button { font-size:13px; }
 .ss-sample .ss-toc-mobile { margin-bottom:17px; }
 .ss-sample .ss-toc-mobile > summary { padding:13px 16px; }
 .ss-sample .ss-toc-mobile .ss-toc-list { max-height:390px; }
 .ss-sample .ss-toc-mobile .ss-toc-list button { padding:10px 9px; font-size:13px; }
 .ss-sample .ss-cover { border-radius:9px; padding:23px 20px; margin-bottom:18px; }
 .ss-sample .ss-cover > header { margin-bottom:17px; padding-bottom:17px; }
 .ss-sample .ss-cover h2 { font-size:22px; line-height:1.5; }
 .ss-sample .ss-keywords { margin-top:14px; gap:5px; }
 .ss-sample .ss-keywords li { font-size:12px; padding:4px 7px; }
 .ss-sample .ss-prose p { font-size:14px; line-height:1.95; margin-bottom:16px; }
 .ss-sample .ss-cover .ss-text-button { font-size:13px; margin-top:17px; }
 .ss-sample .ss-chapter { border-radius:9px; margin-bottom:18px; }
 .ss-sample .ss-chapter-heading { padding:20px 20px 19px; }
 .ss-sample .ss-chapter-meta { margin-bottom:9px; }
 .ss-sample .ss-chapter-meta > span { font-size:12px; }
 .ss-sample .ss-chapter-heading h2 { font-size:21px; line-height:1.5; }
 .ss-sample .ss-chapter-inner { padding:19px 20px 21px; }
 .ss-sample .ss-chapter-summary { padding:14px 15px; }
 .ss-sample .ss-chapter-summary h3 { font-size:12px; margin-bottom:7px; }
 .ss-sample .ss-chapter-summary .ss-prose p { font-size:14px; line-height:1.85; }
 .ss-sample .ss-chapter-details { margin-top:19px; }
 .ss-sample .ss-chapter-details > summary { font-size:13px; padding:12px 0; }
 .ss-sample .ss-detail-body { padding-top:19px; }
 .ss-sample .ss-evidence { padding:12px 14px; margin-top:18px; }
 .ss-sample .ss-evidence > strong { font-size:12px; }
 .ss-sample .ss-evidence .ss-prose p { font-size:13px; }
 .ss-sample .ss-advice { padding:15px 16px; margin-top:19px; }
 .ss-sample .ss-advice h3 { font-size:13px; margin-bottom:9px; }
 .ss-sample .ss-advice ol { padding-left:17px; }
 .ss-sample .ss-advice li { padding-left:3px; }
 .ss-sample .ss-advice p { font-size:13px; line-height:1.85; }
 .ss-sample .ss-chapter-nav { padding:12px 20px; gap:10px; }
 .ss-sample .ss-chapter-nav button { font-size:12px; gap:6px; }
 .ss-sample .ss-flow { border-radius:9px; padding:23px 20px; margin-bottom:18px; }
 .ss-sample .ss-flow h2 { font-size:22px; }
 .ss-sample .ss-flow > header { margin-bottom:21px; }
 .ss-sample .ss-flow > header > p { font-size:13px; margin-top:11px; }
 .ss-sample .ss-flow li { grid-template-columns:20px minmax(0,1fr); gap:10px; padding:18px 0; }
 .ss-sample .ss-flow-index, .ss-sample .ss-flow-period { font-size:12px; }
 .ss-sample .ss-flow h3 { font-size:17px; margin-bottom:10px; }
 .ss-sample .ss-flow .ss-prose p { font-size:13px; }
 .ss-sample .ss-chart { padding:23px 20px; border-radius:9px; }
 .ss-sample .ss-chart h2 { font-size:22px; }
 .ss-sample .ss-chart > header > p { font-size:13px; margin-top:11px; }
 .ss-sample .ss-chart-content > .reading-section > details > summary { font-size:13px; }
 .ss-sample .ss-chart .reading-section p { font-size:13px; }
 .ss-sample .ss-chart .element-graph { padding:14px; }
 .ss-sample .ss-chart .element-graph p { font-size:13px; }
 .ss-sample .ss-chart .element-row { gap:8px; font-size:13px; }
 .ss-sample .ss-ending { display:block; padding:24px 22px; margin-top:28px; border-radius:10px; }
 .ss-sample .ss-ending h2 { font-size:22px; line-height:1.5; }
 .ss-sample .ss-ending p { font-size:13px; margin-top:15px; }
 .ss-sample .ss-ending-actions { align-items:stretch; gap:11px; margin-top:22px; }
 .ss-sample .ss-ending-actions .ss-text-button { font-size:13px; }
 .ss-sample .ss-ending-guide { font-size:12px; }
}

@media (max-width:767px){.ss-sample :is(.ss-evidence .ss-prose p,.ss-advice p,.ss-flow .ss-prose p,.ss-chart .reading-section p,.ss-chart .element-graph p,.ss-ending p){font-size:14px}}

@media (prefers-reduced-motion:reduce) {
 .ss-sample .ss-primary, .ss-sample .ss-details-sign { transition:none; }
}
