/* Narrative pages: one reading column, with the existing working objects. */
.story-page{--story-space:clamp(48px,8vw,112px)}
.story-beat{padding:var(--story-space) 0}
.story-hero{padding-top:clamp(52px,8vw,104px)}
.story-copy{max-width:760px}
.story-copy h1{max-width:22ch;font-size:clamp(40px,4.5vw,64px);line-height:1.08;letter-spacing:-.045em;font-weight:500}
.story-copy h1 em{font-family:Georgia,serif;font-weight:400}
.story-copy h2{max-width:26ch}
.story-copy .lead{margin-top:24px;max-width:62ch}
.story-body{max-width:68ch;color:var(--muted);font-size:18px;line-height:1.7;overflow-wrap:break-word}
.story-body p,.story-body ul,.story-body ol{margin:20px 0 0}
.story-body ul,.story-body ol{padding-left:24px;list-style:revert}
.story-body li+li{margin-top:12px}
.story-body strong{font-weight:500;color:var(--ink)}
.story-body code{font-size:.86em;overflow-wrap:anywhere}
.story-clay{display:block;object-fit:contain;width:clamp(160px,24vw,280px);height:auto;margin:36px 0 0}
.story-beat .mechanics-grid,.story-beat .tm-console,.story-beat .core-files{margin-top:40px}
.story-faq,.story-cases{max-width:calc(800px + var(--gut)*2)}
.story-faq h2,.story-cases h2{margin-bottom:28px}
.story-faq details,.story-case{margin-top:16px;padding:20px 24px;background:var(--frame);border-radius:var(--radius)}
.story-page summary{cursor:pointer;min-height:44px;display:list-item;align-content:center;font-size:20px;line-height:1.45;padding-right:12px}
.story-page details[open] summary{font-weight:500}
.story-page table{width:100%;border-collapse:separate;border-spacing:0 14px;font-size:16px;line-height:1.6}
.story-page td,.story-page th{padding:16px;text-align:left;vertical-align:top;background:var(--frame);overflow-wrap:anywhere}
.story-page th{font-weight:500}
.story-table{margin-top:32px;overflow:auto}
.story-page .story-actions{display:flex;gap:20px;flex-wrap:wrap;margin-top:28px;align-items:center}
.story-page .mechanics-grid{grid-template-columns:minmax(0,1fr);gap:56px}
.story-page .mechanic-card{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:40px;align-items:center;background:transparent;padding:0}
.story-page .mechanic-copy{max-width:34ch}
.story-page .mini-ui{min-width:0}
.story-page .stage{margin-top:40px}
@media(min-width:1024px){.story-hero:has(.stage)>.wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:40px;align-items:center}.story-hero .stage{margin-top:0}.story-hero:has(.stage) h1{font-size:clamp(40px,3.6vw,52px)}.story-hero:has(.stage) .lead{font-size:18px}}
.story-page .hf-heading,.story-page .sec-head{max-width:760px}
.story-page .threat-art{display:none}
.story-page .threat-panel{grid-template-columns:minmax(0,1fr)}
.story-page .proof-refs{overflow-wrap:anywhere;word-break:normal}
.story-page .proof-chip{max-width:100%}
.story-page .security-object{display:none}
footer .footer-bottom{flex-wrap:wrap;gap:12px 24px}
footer .footer-bottom a{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:759px){
.story-body{font-size:17px}.story-page .lead{font-size:18px}.story-page .mechanic-card{grid-template-columns:minmax(0,1fr);gap:24px}.story-clay{width:180px}.story-faq details,.story-case{padding:16px 20px}.story-page summary{font-size:18px}.story-page td,.story-page th{padding:12px;min-width:130px}
}
@media(prefers-reduced-motion:reduce){.story-page *{scroll-behavior:auto}}
