/* This frame alone owns screen dimensions; cameras never size the document. */
.story-pending,.has-story{overflow-y:scroll}
.story-pending .story-frame{position:fixed;inset:var(--header) 0 0;overflow:hidden;background:var(--paper)}
.story-pending .story-frame>.chapter:not(:first-child),.story-pending .entry-experience,.story-pending footer{display:none}
.story-pending .entry,.story-pending .entry-journey,.story-pending .entry-viewport,.story-pending .entry-camera{position:absolute;inset:0}
.story-pending .entry .entry-hero{height:100%;min-height:100%}
.has-story{overflow-anchor:none}
.has-story .story-runway{position:relative;height:var(--story-distance)}
.has-story .story-frame{position:fixed;left:0;top:var(--story-header);width:var(--story-width);height:var(--story-height);overflow:hidden;isolation:isolate;background:var(--paper)}
.has-story .story-frame>.chapter{position:absolute;inset:0;width:100%;height:100%;margin:0;overflow:hidden;opacity:0;pointer-events:none}
.has-story .story-frame>.chapter.is-current{opacity:1;pointer-events:auto}
.has-story footer{display:none}
.reading-scene{background:var(--green);color:#fafbf6}
.reading-art{position:relative;isolation:isolate}
.reading-background{width:100%;height:auto}
.reading-board{padding:30px 7%}
.reading-panel{margin-bottom:30px}
.reading-panel .narrative{margin:0}
.reading-panel h2{margin:0 0 20px;color:var(--yellow)}
.reading-panel h2,.reading-panel .narrative{font-family:var(--chalk-family,cursive)}
.reading-panel .inline-source{color:var(--yellow);text-decoration-color:currentColor}
.reading-gami{position:absolute;left:63%;bottom:var(--reading-gami-bottom,3%);width:18%;height:55%;margin:0;pointer-events:none;transform-origin:center bottom}
.reading-gami:before{content:'';position:absolute;left:32%;bottom:2%;width:60%;height:2%;border-radius:50%;background:#182c2738;filter:blur(3px);z-index:-1}
.reading-gami picture,.reading-gami img{display:block;width:100%;height:100%;object-fit:contain}
.reading-gami-pose{position:absolute;inset:0;display:block;transform-origin:center bottom}
.reading-gami-pose+.reading-gami-pose{visibility:hidden;opacity:0}
.design-context-drawings{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;list-style:none;width:min(100%,660px);margin:28px 0 0;padding:0}
.design-context-drawings li{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:0}
.design-context-drawings img{width:100%;height:76px;object-fit:contain}
.design-context-drawings span{font:400 18px/1.2 var(--chalk-family);text-align:center;color:#fafbf6}
.classroom-wipe-destination{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;pointer-events:none;visibility:hidden;opacity:0}
.classroom-wipe{position:absolute;left:0;top:0;width:120%;height:100%;z-index:9;background:var(--green);pointer-events:none;transform:translateX(-110%);clip-path:polygon(0 0,98% 0,99% 18%,98% 38%,100% 58%,99% 78%,98% 100%,0 100%)}
.classroom-wipe:after{content:'';position:absolute;top:0;right:2%;bottom:0;width:7px;background:#f0c85a73;transform:rotate(.3deg)}
.reading-controls{display:none}
.has-story .reading-art{position:absolute;left:var(--reading-x);top:0;width:1672px;height:941px;transform:scale(var(--reading-scale));transform-origin:0 0}
.has-story .reading-background{position:absolute;inset:0;width:100%;height:100%;max-width:none}
.has-story .reading-board{position:absolute;left:405px;top:80px;width:890px;height:305px;padding:0}
.has-story .reading-scene--design .reading-board{left:445px;width:850px}
.has-story #diseno-plataforma .narrative{width:660px;max-width:calc(100% - 160px);margin:35px auto 0;text-align:center;font-size:calc(26px / var(--reading-scale));line-height:1.4}
.has-story .reading-panel{position:absolute;inset:0;margin:0;visibility:hidden;opacity:0}
.has-story .reading-panel h2{font-size:calc(34px / var(--reading-scale));line-height:1.15;margin-bottom:calc(18px / var(--reading-scale))}
.has-story .reading-panel .narrative{font-size:calc(25px / var(--reading-scale));line-height:1.4}
.has-story .reading-panel p+p{margin-top:calc(16px / var(--reading-scale))}
.has-story .reading-controls{position:absolute;right:24px;bottom:16px;z-index:8;display:flex;gap:8px}
.reading-controls a{width:44px;height:44px;display:grid;place-items:center;background:var(--paper);color:var(--ink);border:1px solid #73968a;border-radius:4px;text-decoration:none}
.reading-controls a:hover{background:#e3ece6}
.reading-controls a:focus-visible{outline-color:var(--yellow)}
.reading-panel .story-restart{color:white;margin-left:24px}
.reading-panel .story-restart img{filter:brightness(0) invert(1)}
.reading-panel .resource-button{font-family:var(--sans)}
.has-story .reading-panel .resource-button,.has-story .reading-panel .story-restart{font-size:calc(14px / var(--reading-scale));min-height:calc(48px / var(--reading-scale));margin-top:calc(24px / var(--reading-scale))}
.has-story .reading-panel--closing{left:-445px;top:-80px;right:auto;bottom:auto;width:1672px;height:941px}
.closing-message{position:absolute;left:430px;top:145px;width:610px}
.has-story .closing-speech.narrative{position:relative;padding:30px 34px;background:#fafbf6;border:2px solid #183c33;border-radius:8px;color:var(--ink);font-size:calc(26px / var(--reading-scale));line-height:1.45;box-shadow:0 5px 0 #183c331a}
.closing-speech:before,.closing-speech:after{content:'';position:absolute;top:80px;left:100%;width:0;height:0;border-style:solid;border-width:0 0 32px 48px;border-color:transparent transparent transparent #183c33}
.closing-speech:after{top:82px;border-width:0 0 27px 42px;border-left-color:#fafbf6}
.closing-invitation{display:block;max-width:510px;margin-bottom:20px;font-size:calc(42px / var(--reading-scale));line-height:1.15}
.has-story .closing-message .resource-button{display:flex;justify-content:space-between;gap:28px;width:350px;min-height:64px;margin-top:28px;padding:16px 22px;font-size:20px}
.closing-message .resource-button img{width:24px;height:24px}
.reading-panel .survey-chalk-summary{display:grid;grid-template-columns:230px minmax(0,1fr);align-items:center;gap:28px;width:100%;max-width:800px;margin:26px 0 0;padding:0;border:0;color:#fafbf6}
.reading-panel .survey-chalk-value{font:400 80px/1.1 var(--chalk-family);color:#fafbf6;margin:0;text-shadow:1px 0 #fafbf64d,-1px 1px #fafbf633}
.reading-panel .survey-chalk-copy>p{font:400 23px/1.25 var(--chalk-family);margin:0 0 16px;color:#fafbf6}
.reading-panel .survey-chalk-track{position:relative;width:100%;height:26px;padding:3px;border:2px solid #e9eee1bd;border-radius:2px;box-shadow:1px 1px 0 #e9eee126,inset 1px 0 0 #e9eee133}
.reading-panel .survey-chalk-fill{display:block;height:100%;background-color:var(--yellow);background-image:repeating-linear-gradient(176deg,#fafbf633 0 1px,transparent 1px 4px);mask-image:repeating-linear-gradient(17deg,#000 0 2px,#000b 3px,#000 5px);clip-path:polygon(0 3%,8% 0,20% 5%,42% 1%,65% 4%,82% 0,100% 3%,100% 93%,85% 100%,62% 95%,40% 100%,15% 96%,0 100%);transform-origin:left center}
@media(max-width:1100px){
 .has-story .reading-art{left:0;width:100%;height:100%;transform:none}
 .has-story .reading-background{object-fit:cover;object-position:center bottom}
 .has-story .reading-board,.has-story .reading-scene--design .reading-board{left:0;top:0;width:100%;height:var(--reading-board-height);background:var(--green);padding:0}
 .has-story .reading-panel{bottom:auto;padding:28px 7% 20px}
 .has-story .reading-panel h2{font-size:30px;margin-bottom:18px}
 .has-story .reading-panel .narrative{font-size:24px;line-height:1.4}
 .has-story .reading-panel p+p{margin-top:16px}
 .has-story .reading-background{top:var(--reading-board-height);height:calc(100% - var(--reading-board-height))}
 .has-story .reading-gami{top:auto;bottom:0;height:42%;width:30%;left:65%}
 .has-story .reading-panel .resource-button,.has-story .reading-panel .story-restart{font-size:14px;min-height:48px;margin-top:24px}
 .has-story .reading-controls{right:14px;bottom:12px}
 .has-story .reading-panel--closing{left:0;top:0;width:100%;height:auto}
 .has-story .closing-message{position:relative;left:auto;top:auto;width:100%}
 .has-story .closing-speech.narrative{padding:20px 22px}
 .closing-speech:before,.closing-speech:after{display:none}
 .closing-invitation{max-width:none;font-size:32px}
 .has-story .closing-message .resource-button{width:100%;max-width:350px;min-height:56px;margin-top:20px;gap:16px;font-size:16px}
}
@media(max-width:700px){
 .has-story .reading-panel{padding:24px 7% 16px}
 .has-story .reading-panel h2{font-size:28px}
 .has-story .reading-panel .narrative{font-size:23px;line-height:1.4}
 .reading-panel .survey-paper{grid-template-columns:1fr;gap:8px}
 .reading-panel .survey-paper>*{grid-column:1;grid-row:auto}
 .reading-panel .survey-value{font-size:54px}
 .reading-panel .survey-description{font-size:22px}
 .reading-panel .motivation-breakdown{margin-top:8px}
 .reading-panel .survey-paper .small-label{font-size:16px}
 .reading-panel .motivation-breakdown>div{padding:6px 0}
 .reading-panel .motivation-breakdown dt{font-size:13px}
 .reading-panel .motivation-breakdown dd{font-size:14px;margin-top:4px}
 .reading-panel .story-restart{margin-left:0;display:flex;max-width:200px}
}
@media(max-height:500px) and (min-width:701px){
 .has-story .reading-panel{padding:18px 4%}
 .has-story .reading-board,.has-story .reading-scene--design .reading-board{width:66%;height:100%}
 .has-story .reading-background{top:0;left:66%;width:34%;height:100%;object-position:right bottom}
 .has-story .reading-panel .narrative{font-size:21px;line-height:1.3}
 .has-story .reading-panel h2{font-size:27px;margin-bottom:12px}
 .has-story .reading-gami{left:70%;width:27%;height:70%}
 .reading-panel .survey-value{font-size:48px}
 .reading-panel .survey-description{font-size:20px}
}
@media print{
 .has-story .story-runway{height:auto}
 .has-story .story-frame,.has-story .story-frame>.chapter{position:static;width:auto;height:auto;visibility:visible;overflow:visible}
 .has-story .reading-art,.has-story .reading-board,.has-story .reading-panel{position:static;inset:auto;width:auto;height:auto;transform:none!important;opacity:1!important;visibility:visible!important;color:var(--ink);background:white;padding:20px}
 .reading-background,.reading-gami,.reading-controls,.story-restart{display:none!important}
}