.mobile-topic-gallery{display:none}
/* Mobile and small-tablet reading layouts share the desktop content and controls. */
@media(max-width:800px){
 html,body{max-width:100%;overflow-x:clip}button,a,summary{touch-action:manipulation}button{min-height:40px}
 #experience,body[data-stage] #experience,body.in-dark #experience{display:flex;flex-direction:column;height:auto;min-height:100svh;overflow:visible}
 #experience>header{order:0;padding:14px 16px;gap:10px;align-items:center;flex-wrap:wrap;flex-shrink:0;background:#06101ada}
 .brand{font-size:11px;letter-spacing:.09em;gap:9px;flex:1;min-width:180px}.brand-mark{font-size:26px}.brand small{font-size:10px;letter-spacing:.03em;max-width:240px;line-height:1.5}
 .tools{gap:4px}.tools button{font-size:12px;padding:7px 9px;min-height:36px}#full{display:none}
 #narrative,body[data-stage] #narrative,body.in-dark #narrative{order:1;position:relative;align-self:stretch;width:auto;max-width:none;margin:26px 20px 30px;padding:0;pointer-events:auto}
 #narrative h1,body.in-dark #narrative h1{font-size:clamp(34px,8.4vw,54px);line-height:1.12}#narrative h1 br{display:none}#narrative h1 em{display:block}
 #narrative h2,body[data-stage] #narrative h2{font-size:clamp(32px,7.7vw,48px);line-height:1.12}#narrative .intro,body[data-stage] #narrative .intro{font-size:17px;line-height:1.7;max-width:none}
 #narrative .closing-line{font-size:22px;line-height:1.5}#narrative .eyebrow{font-size:12px;line-height:1.5}.caption{font-size:14px;line-height:1.6}
 #world{position:fixed;height:100svh;bottom:auto;pointer-events:none}#sky-note{display:none}#labels{position:fixed;height:100svh;bottom:auto}.shade{position:fixed;pointer-events:none;background:linear-gradient(90deg,#04101eef,#04101ece)}
 body:not(.journey) #labels{display:none}#preparation{margin-top:22px}#preparation-detail{min-height:0}.preparation-tabs button{font-size:14px;min-height:52px}
 #experience>footer{order:3;position:relative;flex-shrink:0;margin-top:auto;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:#071420;z-index:6;display:grid;grid-template-columns:auto 1fr;gap:6px}
 #chapters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;width:100%;grid-column:1/-1}#chapters button{font-size:14px;min-width:0;min-height:38px;padding:6px 3px;white-space:normal}#next{min-height:40px;max-width:100%;line-height:1.3}footer .navigation{min-width:0}footer #counter{font-size:12px}
 /* Architecture connectors change axis; their labels remain upright. */
 body[data-stage] #architecture{order:2;position:relative;inset:auto;width:auto;margin:0 16px 28px;overflow:visible}
 .service-map{grid-template-columns:1fr;margin:16px 0;gap:0}.service-map [data-service]{min-height:0;padding:14px}.service-map small{font-size:12px}.service-map strong{font-size:22px}
 .service-edge{transform:none;height:auto;display:flex;align-items:center;justify-content:center;gap:10px;padding:10px;font-size:14px}.service-edge .edge-arrow{font-size:23px;line-height:1;transform:rotate(90deg)}
 .architecture-workbench{padding:18px}.architecture-steps{grid-template-columns:1fr;gap:6px}.architecture-steps button{font-size:15px;min-height:44px}.architecture-explanation{min-height:0}.architecture-explanation p:not(.eyebrow){font-size:16px}.arch-card{padding:16px}.arch-card p{font-size:16px;line-height:1.6}
 /* The folders become legible selectors; the reader takes the available height. */
 body.journey #experience{height:100svh;min-height:0;overflow:hidden}
 #perspective-experience{order:1;position:relative;inset:auto;flex:1;min-height:0;display:flex;flex-direction:column;overflow-y:auto;padding:0 14px;pointer-events:auto}
 .perspective-toolbar{position:relative;inset:auto;display:flex;align-items:center;flex-shrink:0;gap:8px;padding:6px 0 12px}.perspective-toolbar>div{display:none}#perspective-experience[data-view=desk] .perspective-toolbar{display:none}.perspective-toolbar .collection-label{font-size:11px}#perspective-location{display:block;border:0;padding:2px 0;font-size:14px}.perspective-toolbar button{font-size:12px;padding:6px 8px;min-height:36px}
 #desk-intro,.no-world #desk-intro{position:relative;inset:auto;text-align:left;margin:12px 0 20px;width:auto;order:1}#desk-intro{padding:20px;background:#08151e;border:1px solid #30434e;border-radius:12px}#desk-intro h2{font-size:30px;color:#eef3f1}#desk-intro .eyebrow{color:#b9ccd7}#desk-intro p:last-child{font-size:16px;line-height:1.65}
 #folder-surfaces,.no-world #folder-surfaces,#perspective-experience[data-view=focus] #folder-surfaces{position:relative;inset:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;height:auto;gap:6px;order:2;flex-shrink:0;margin:0 0 12px;pointer-events:auto}
 .briefing-folder,.no-world .briefing-folder{position:relative;inset:auto;transform:none!important;opacity:1!important;width:100%;height:auto;min-height:68px;padding:10px 8px;box-shadow:inset 3px 0 0 var(--folder-colour);justify-content:center;will-change:auto;background:#122a35}
 .briefing-folder strong,.no-world .briefing-folder strong{font:normal 15px/1.3 Georgia,serif;margin:0;overflow-wrap:break-word}.folder-number,.folder-action,.folder-question{display:none}
 .briefing-folder[aria-pressed=true]{outline:1px solid var(--folder-colour);outline-offset:-1px;background:#25434a}
 #perspective-experience[data-view=desk] #folder-surfaces{grid-template-columns:1fr;gap:12px;margin-bottom:20px}
 #perspective-experience[data-view=desk] .briefing-folder{min-height:106px;padding:18px 20px}#perspective-experience[data-view=desk] .briefing-folder strong{font-size:23px}#perspective-experience[data-view=desk] .folder-action{display:flex;font-size:14px;margin-top:10px}
 #perspective-experience[data-view=reading]{overflow:hidden}
 #reading-surface,.no-world #reading-surface{position:relative;inset:auto;width:100%;height:auto;min-height:0;flex:1;order:3;transform:none!important;opacity:1!important;margin:0 0 10px;will-change:auto}
 #reading-surface .reading-toolbar{padding:6px 8px}#reading-surface .reading-actions button{min-height:36px;font-size:14px}
 #perspective-experience[data-view=focus],.no-world #perspective-experience[data-view=focus]{padding:0 14px 16px;overflow-y:auto}
 #sky-explanation{order:4;position:relative;inset:auto;width:auto;margin:240px 0 0;padding:16px;overflow:visible;flex-shrink:0;background:#081b27f2}
 .no-world #sky-explanation{margin-top:0}#topic-without-renderer,.no-world #topic-without-renderer:not([hidden]){order:3;position:relative;inset:auto;width:100%;height:210px;min-height:210px;margin:0 0 12px;padding:12px}
 #sky-topic-detail>h3{font-size:24px}#sky-topic-detail>p:not(.eyebrow){font-size:16px}.focus-sources button{min-height:44px;font-size:15px}
 #perspective-experience.reading-expanded{position:fixed;inset:0;padding:0;height:100dvh;z-index:20;overflow:hidden}#perspective-experience.reading-expanded .perspective-toolbar,#perspective-experience.reading-expanded #folder-surfaces{display:none}
 #perspective-experience.reading-expanded #reading-surface{position:relative;inset:auto;width:100%;height:100%;margin:0;border:0;border-radius:0;flex:1}
 .reading-expanded #reading-surface .reading-toolbar{padding-top:calc(6px + env(safe-area-inset-top))}#reading-content{scroll-padding-top:60px}
 .investigation,.analysis-document{padding:16px}.investigation-controls{gap:6px;padding:8px 0}.investigation button{font-size:14px;padding:8px 10px;min-height:40px}.investigation-controls span{font-size:12px}.agent-message{margin-right:0;padding:15px}.agent-message>p,.log-person p{font-size:16px;line-height:1.7}.investigation .log-person{margin:14px 0;padding:15px}.step-annotation{margin-left:6px}.step-annotation>p{font-size:14px}.log-tool{padding:16px 0}
 .source-record,.source-dialog .source-record{padding:18px}.record-finding-body{padding-left:0}.record-findings summary strong{font-size:21px}.record-finding-body blockquote{font-size:20px}.record-metadata>div{grid-template-columns:100px 1fr;gap:10px}.record-json{padding:12px;font-size:12px}
 /* Evidence dialogs use the viewport rather than the desktop paper dimensions. */
 #reader,#reader.corpus-dialog,#reader.source-dialog{width:100%;max-width:100%;height:100dvh;max-height:100dvh;margin:0;border-radius:0;box-sizing:border-box}
 #reader:not(.corpus-dialog):not(.source-dialog){padding:20px}#reader .close{min-width:40px;min-height:40px}
 .corpus-reader{display:block}.corpus-main{padding:18px}.corpus-topics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:10px;gap:6px}.corpus-topics button{min-width:0;padding:8px}.corpus-topics span{font-size:12px;line-height:1.4}.corpus-topics small{font-size:11px}.corpus-heading h2{font-size:29px}.corpus-tabs{gap:12px}.corpus-tabs button{font-size:14px;min-height:42px}.corpus-bodies,.corpus-memberships{grid-template-columns:1fr}.corpus-quotes figure{padding:16px}.corpus-quotes blockquote{font-size:20px}.corpus-findings h3{font-size:20px}.corpus-description{font-size:16px}
}
@media(max-width:380px){.brand{min-width:155px}.brand small{max-width:190px}#experience>header{padding:10px 12px}.tools button{padding:6px}.briefing-folder strong,.no-world .briefing-folder strong{font-size:14px}.perspective-toolbar button{max-width:104px}.record-facets{gap:6px}.record-facets span+span{padding-left:6px}}

@media(max-width:800px){.mobile-topic-gallery{display:grid;grid-template-columns:1fr;gap:10px;margin-top:24px}.mobile-topic-gallery button{display:flex;align-items:center;gap:18px;text-align:left;padding:12px 16px;background:#0b2230c9;font-size:16px;line-height:1.4;border-color:#6b9d9b55}.mobile-topic-gallery img{width:85px;height:80px;object-fit:contain}.mobile-topic-gallery span{flex:1}.source-list button{min-height:48px}.source-list strong{font-size:17px}.source-list span{font-size:14px}}

@media(max-width:800px){body.journey #labels{display:none}#topic-without-renderer:not([hidden]){display:block}#sky-explanation{margin-top:0}}
@media(max-width:800px){
 body:has(#reader[open]){overflow:hidden}
 .corpus-topics{display:flex;overflow-x:auto;scroll-snap-type:x proximity;gap:8px}
 .corpus-topics button{flex:0 0 175px;scroll-snap-align:start;padding:10px}.corpus-topics span{font-size:14px}
 .corpus-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}.corpus-tabs button{text-align:left}
}