.chapter-experience { --story-ink:#233c42; --story-muted:#5e706e; --story-paper:#fffdf6; --story-line:#dfdfce; color:var(--story-ink); }
.chapter-experience *, .chapter-preview * { box-sizing:border-box; }
.chapter-experience,.chapter-storybook { scroll-margin-top:100px; }
.chapter-experience [hidden] { display:none!important; }
.chapter-storybook { display:grid; grid-template-columns:minmax(260px,.83fr) minmax(360px,1.17fr); align-items:stretch; overflow:hidden; border:1px solid var(--story-line); border-radius:22px; background:var(--story-paper); box-shadow:0 12px 38px #3b4c3610; }
.chapter-illustration { position:relative; min-height:620px; margin:0; overflow:hidden; background:#213c41; }
.chapter-illustration img { position:absolute; width:100%; height:100%; inset:0; object-fit:cover; object-position:center; }
.chapter-illustration::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,#101f2900 25%,#10212b18 50%,#10212bd9 100%); pointer-events:none; }
.chapter-art-label { position:absolute; z-index:1; left:30px; right:30px; bottom:100px; color:#fff9e9; }
.chapter-art-label span { display:block; font-size:.66rem; letter-spacing:.17em; font-weight:650; text-transform:uppercase; margin-bottom:17px; line-height:1.6; color:#f5e3bf; }
.chapter-art-label strong { display:block; max-width:12ch; font-family:Georgia,'Times New Roman',serif; font-size:clamp(2rem,3.5vw,3.4rem); line-height:1.08; font-weight:400; text-wrap:balance; }
.chapter-illustration figcaption { position:absolute; left:30px; right:30px; bottom:27px; z-index:1; color:#f1e9d9; font-size:.78rem; line-height:1.7; max-width:38ch; }
.chapter-story-page { padding:34px 36px 25px; min-width:0; }
.chapter-story-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:13px; }
.chapter-kicker { font-size:.65rem; letter-spacing:.14em; font-weight:750; color:#716648; line-height:1.6; }
.chapter-page-count { font-size:.68rem; color:#69766d; font-variant-numeric:tabular-nums; white-space:nowrap; }
.chapter-story-page h2, .chapter-preview h3 { font-family:Georgia,'Times New Roman',serif; font-weight:400; font-size:clamp(1.75rem,2.5vw,2.4rem); line-height:1.15; letter-spacing:-.025em; margin:0 0 22px; text-wrap:balance; }
.chapter-beats { font-size:.91rem; line-height:1.75; }
.chapter-narration { margin:0 0 16px; color:#4d605c; }
.chapter-dialogue { display:flex; align-items:flex-start; gap:10px; margin:15px 0; }
.chapter-speaker-mark { display:grid; place-items:center; flex-shrink:0; width:30px; height:30px; border-radius:50%; background:#e8eee1; color:#38625c; border:1px solid #cbd7c2; font-size:.78rem; font-family:Georgia,serif; margin-top:1px; }
.chapter-dialogue:nth-of-type(even) .chapter-speaker-mark { background:#f4e9cf; color:#8b6436; border-color:#e6d4b6; }
.chapter-dialogue strong { display:block; color:#344f4b; font-size:.7rem; font-weight:750; line-height:1.4; margin:1px 0 3px; letter-spacing:.03em; }
.chapter-dialogue p { margin:0; color:#2e4645; line-height:1.65; }
.chapter-coda { border-top:1px solid #e6e1d0; margin:23px 0 21px; padding-top:17px; font-family:Georgia,'Times New Roman',serif; font-size:.99rem; font-style:italic; color:#776247; line-height:1.65; }
.chapter-story-navigation { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:17px; }
.chapter-page-dots { display:flex; gap:6px; }
.chapter-page-dots button { border:1px solid #dedccd; color:#687465; background:#f8f6ec; border-radius:50%; height:32px; width:32px; cursor:pointer; font:inherit; font-size:.67rem; }
.chapter-page-dots button[aria-current] { border-color:#315953; background:#315953; color:#fffdf3; }
.chapter-story-actions { display:flex; flex-wrap:wrap; gap:9px; }
.chapter-primary,.chapter-secondary { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:11px 16px; border-radius:9px; border:1px solid #315953; background:#315953; color:#fffdf5; font:inherit; font-size:.82rem; font-weight:650; cursor:pointer; line-height:1.45; }
.chapter-secondary { background:#fffdf5; color:#315953; border-color:#bcc9bc; }
.chapter-primary:hover { background:#244a45; }
.chapter-secondary:hover { background:#edf1e7; }
.chapter-skip { display:block; margin:18px 0 0; padding:4px 0; border:0; background:none; color:#6c776e; font:inherit; font-size:.73rem; text-decoration:underline; text-underline-offset:3px; cursor:pointer; min-height:32px; }
.chapter-history { margin:18px 3px 6px; color:#65716b; font-size:.77rem; line-height:1.75; }
.chapter-history summary { cursor:pointer; color:#47635d; width:fit-content; }
.chapter-history p { max-width:90ch; }
.chapter-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px; background:#f7f6ed; border:1px solid #e1e1d2; border-radius:12px; padding:13px 17px; margin:0 0 22px; }
.chapter-toolbar .chapter-kicker { display:block; }
.chapter-journal-count { display:block; color:#6c786b; font-size:.72rem; margin-top:3px; }
.chapter-toolbar-actions { display:flex; align-items:center; flex-wrap:wrap; gap:17px; }
.chapter-text-button { color:#315953; border:0; background:none; font:inherit; font-size:.78rem; text-decoration:underline; text-underline-offset:3px; cursor:pointer; padding:8px 0; }
.chapter-journal-label { color:#596d61; font-size:.72rem; display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.chapter-journal-label select { max-width:280px; min-height:38px; background:#fffdf6; color:#315953; border:1px solid #cad2c1; border-radius:7px; font:inherit; padding:7px 9px; }
.chapter-discovery { padding:13px 16px; margin:0 0 22px; border-radius:10px; border:1px solid #cbdcc6; background:#edf4e8; font-size:.8rem; line-height:1.6; }
.chapter-discovery strong { display:block; color:#3c6747; font-size:.75rem; }
.chapter-discovery p { margin:5px 0 0; color:#405b46; }
.chapter-storybook--aftermath .chapter-illustration { min-height:530px; }
.chapter-story-note { font-size:.71rem; color:#788176; margin:15px 0 0; line-height:1.65; }
.chapter-experience button:focus-visible,.chapter-experience select:focus-visible { outline:3px solid #bd9043; outline-offset:4px; }
.chapter-experience h2:focus,.chapter-experience h3:focus { outline:none; }
.chapter-preview { color:#2c4545; }
.card-future { display:flex; flex-direction:column; gap:7px; align-items:flex-end; flex-shrink:0; }
.card-story-link { color:#315953; background:none; border:0; padding:3px 0; min-height:32px; font:inherit; font-size:.74rem; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.card-story-link:focus-visible { outline:3px solid #bd9043; outline-offset:3px; border-radius:3px; }
.chapter-preview figure { position:relative; margin:12px 0 24px; border-radius:12px; overflow:hidden; background:#213b42; }
.chapter-preview figure img { display:block; width:100%; height:240px; object-fit:cover; }
.chapter-preview figcaption { padding:12px 17px; color:#f3eddc; font-size:.74rem; line-height:1.55; }
.chapter-preview .chapter-kicker { margin:0 0 9px; }
.chapter-preview .chapter-dialogue,.chapter-preview .chapter-narration { font-size:.88rem; line-height:1.7; }
@media (min-width:1100px) { .chapter-storybook { grid-template-columns:minmax(290px,.85fr) minmax(420px,1.15fr); }.chapter-story-page { padding:38px 42px 28px; } }
@media (min-width:761px) { .chapter-experience[data-chapter="newton"] .chapter-illustration img { height:60%; object-position:58% center; mask-image:linear-gradient(#000 84%,transparent); }.chapter-experience[data-chapter="newton"] .chapter-art-label { bottom:95px; } }
@media (max-width:760px) { .chapter-storybook { grid-template-columns:1fr; }.chapter-illustration,.chapter-storybook--aftermath .chapter-illustration { min-height:0; height:290px; }.chapter-illustration img { object-position:center 43%; }.chapter-art-label { left:24px; right:24px; bottom:66px; }.chapter-art-label span { margin-bottom:10px; font-size:.6rem; }.chapter-art-label strong { max-width:20ch; font-size:2.05rem; }.chapter-illustration figcaption { bottom:18px; left:24px; right:24px; font-size:.7rem; max-width:none; }.chapter-story-page { padding:27px 24px 23px; }.chapter-story-page h2 { font-size:1.9rem; }.chapter-toolbar { align-items:flex-start; }.chapter-journal-label select { max-width:250px; } }
@media (max-width:420px) { .chapter-story-page { padding:23px 18px; }.chapter-story-heading { gap:5px; }.chapter-page-count { font-size:.58rem; }.chapter-beats { font-size:.88rem; }.chapter-illustration,.chapter-storybook--aftermath .chapter-illustration { height:255px; }.chapter-art-label { bottom:73px; left:20px; }.chapter-illustration figcaption { left:20px; }.chapter-art-label strong { font-size:1.8rem; }.chapter-story-navigation { align-items:flex-start; flex-direction:column; }.chapter-story-actions { width:100%; }.chapter-primary { flex:1; }.chapter-journal-label { flex-direction:column; align-items:flex-start; }.chapter-toolbar-actions { gap:10px; }.chapter-preview figure img { height:180px; } }
@media (max-width:560px) { .chapter-experience,.chapter-storybook { scroll-margin-top:130px; } }
/* Task scenes show the entire drawing, including the small props behind each joke. */
.chapter-storybook--aftermath .chapter-illustration--task { min-height:0; height:auto; align-self:center; margin:26px 0 26px 26px; border:1px solid #dedfcd; border-radius:14px; background:#f1ead8; }
.chapter-storybook--aftermath .chapter-illustration--task img,
.chapter-experience[data-chapter="newton"] .chapter-storybook--aftermath .chapter-illustration--task img { display:block; position:static; width:100%; height:auto; object-fit:contain; object-position:center; mask-image:none; }
.chapter-storybook--aftermath .chapter-illustration--task::after { display:none; }
.chapter-storybook--aftermath .chapter-illustration--task figcaption { position:static; max-width:none; padding:17px 20px; color:#536055; font-size:.78rem; line-height:1.65; background:#f3efdf; }
@media (max-width:760px) { .chapter-storybook--aftermath .chapter-illustration--task { margin:0; border:0; border-bottom:1px solid #dedfcd; border-radius:0; }.chapter-storybook--aftermath .chapter-illustration--task figcaption { padding:15px 24px; } }
@media print { .chapter-toolbar,.chapter-story-navigation,.chapter-story-actions,.chapter-skip { display:none!important; }.chapter-storybook { break-inside:avoid; box-shadow:none; } }
