*{box-sizing:border-box}body{margin:0;background:#f7f2e8;color:#171713;font-family:Arial,Helvetica,sans-serif}.home-story-page>header{max-width:1360px;padding:20px 40px;margin:auto;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #dfd9cf}.home-story-page>header img{width:100px}.header-actions{display:flex;align-items:center;gap:22px}.header-actions>span{font-size:10px;color:#767167;letter-spacing:1px}.login-menu{position:relative}.login-menu summary{list-style:none;cursor:pointer;padding:15px 20px;border:1px solid #d8d3c9;border-radius:12px;background:white;color:#2457e6;font-size:13px;font-weight:800}.login-menu summary::-webkit-details-marker{display:none}.login-menu summary span{margin-left:20px}.login-menu nav{position:absolute;right:0;top:calc(100% + 10px);width:320px;max-width:calc(100vw - 40px);background:white;border:1px solid #ded9d0;border-radius:16px;padding:8px;box-shadow:0 12px 35px #17171320;z-index:20}.login-menu a{display:block;padding:17px 14px;color:#171713;text-decoration:none;border-radius:10px;background:#fbe7f0}.login-menu a+a{margin-top:6px}.login-menu a:nth-child(2){background:#e8eddb}.login-menu a:nth-child(3){background:#fff5d6}.login-menu strong{font-size:12px}.login-menu small{display:block;font-size:12px;line-height:1.4;color:#605e56;margin-top:5px}main{max-width:1160px;margin:auto;padding:32px 40px}.intro{text-align:center}.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.4px;color:#2457e6}.intro h1{font-size:clamp(30px,3.6vw,46px);letter-spacing:-1.6px;line-height:1.1;margin:12px 0}.intro>p:last-child{font-size:16px;color:#6c685e;margin:14px 0 26px}.animation{background:#eeebe2;border:1px solid #dfd9cf;border-radius:28px;padding:12px 22px 16px;overflow:hidden}.stage{height:450px;position:relative;isolation:isolate}.board-frame{position:absolute;inset:18px 18px 34px;background:#fff;border:1px solid #d8d3c9;border-radius:18px;box-shadow:0 8px 0 #e0dacf;transition:opacity .8s,transform 1.1s}.board-top{display:flex;justify-content:space-between;padding:18px 24px;font-size:9px;font-weight:800;letter-spacing:1px;color:#817b70}.board-question{position:absolute;left:49%;right:4%;bottom:26px;font-size:11px;color:#817b70;text-align:center;opacity:0}.word-card{color:#171713;transform:none;position:absolute;left:8%;top:36px;width:276px;height:366px;background:#fffdf7;padding:19px 20px;border:1.4px solid #171713;border-radius:19px;box-shadow:5px 6px #171713;transform-origin:center;z-index:4;transition:transform 1.3s cubic-bezier(.22,.7,.22,1),left 1.3s cubic-bezier(.22,.7,.22,1),top 1.3s,opacity .8s}.card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.card-head img{width:45px;height:35px;object-fit:contain}.week{width:36px;height:36px;background:#f28c28;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:7px;font-weight:800}.week b{font-size:17px}.kicker{font-size:8px;letter-spacing:.8px;font-weight:800;color:#666158}.word-card h2{margin:7px 0 16px;background:#b7d96b;border-radius:9px;padding:17px 4px;text-align:center;font-size:30px;letter-spacing:-1px}.word-card h3{font-size:8px;letter-spacing:.7px;color:#666158;margin:11px 0 5px}.word-card>p{font-size:11px;line-height:1.42;margin:0}.example{font-style:italic}.citation{font-size:7px;line-height:1.45;border-top:1px solid #ded9d0;padding-top:8px;margin-top:14px;color:#777168}.word-card footer{background:#e85a9b;border-radius:6px;padding:9px 4px;text-align:center;font-size:7px;font-weight:800;margin-top:11px;letter-spacing:.4px}.lesson-copy{position:absolute;left:49%;top:104px;transition:opacity .7s,transform 1s}.lesson-copy h2,.class-activity h2{font-size:35px;line-height:1.1;letter-spacing:-1px;margin:15px 0}.lesson-copy p{font-size:15px;line-height:1.6;color:#6c685e}.class-activity{position:absolute;left:45%;top:40px;right:3%;opacity:0;transform:translateY(18px);transition:opacity .7s .15s,transform 1s}.class-activity h2{font-size:25px;margin:10px 0 18px}.phone-row{display:flex;gap:18px}.phone{width:142px;height:245px;border:2px solid #171713;border-radius:20px;background:#2f80c9;color:white;padding:18px 11px 12px;box-shadow:4px 5px #171713;position:relative;flex-shrink:0}.phone-notch{position:absolute;top:6px;width:32px;height:4px;background:#171713;border-radius:8px;left:calc(50% - 16px)}.phone>small{display:block;font-size:7px;font-weight:800;letter-spacing:.6px}.phone>strong{display:block;background:#b7d96b;border-radius:7px;color:#111;font-size:19px;text-align:center;padding:13px 2px;margin:11px 0}.phone p{font-size:10px;line-height:1.4;font-weight:700}.answer{display:block;font-size:9px;font-weight:700;background:#f7fbff;color:#171713;border-radius:5px;padding:7px;margin:5px 0}.selected{background:#ffe36b;box-shadow:inset 0 0 0 1px #171713}.phone-two{transform:translateY(-5px) rotate(3deg);background:#2f80c9}.phone-one{transform:rotate(-3deg)}.phone label{font-size:6px;letter-spacing:.4px;font-weight:700;display:block;margin:9px 0 5px}.writing{display:block;background:#f7fbff;color:#605e56;border-radius:5px;padding:10px 5px;font-size:8px;line-height:1.4}.sent{display:block;font-size:7px;font-weight:800;background:#e85a9b;color:#111;padding:8px 4px;border-radius:5px;margin-top:10px}.conversation{position:absolute;inset:26px 5% 20px;opacity:0;transform:translateY(25px);transition:opacity .8s .1s,transform 1s}.place-title h2{font-size:32px;letter-spacing:-1px;margin:12px 0}.bubble{position:absolute;z-index:3;border:1px solid #d9d6c9;border-radius:19px;padding:21px 26px;max-width:430px;box-shadow:0 5px 0 #1717130b;transition:transform 1s .25s,opacity .8s .25s}.bubble small{font-size:8px;font-weight:800;letter-spacing:1px;color:#6c685e}.bubble p{font-size:23px;line-height:1.3;margin:12px 0}.bubble b{font-weight:800}.bubble>span{display:block;text-align:right;font-size:8px;color:#817b70}.bubble-one{left:4%;top:108px;background:#e8eddb;transform:translateX(-30px)}.bubble-two{right:0;top:239px;background:#fbe7f0;transform:translateX(30px)}.word-trail{position:absolute;right:5%;top:120px;font-size:clamp(30px,5vw,65px);font-weight:900;letter-spacing:-2px;color:#dedbce;transform:rotate(-8deg);z-index:-1}.bank-phone{position:absolute;right:12%;top:80px;width:174px;height:292px;background:#fffdf7;color:#171713;z-index:5;transform:translateY(40px) rotate(6deg);opacity:0;transition:opacity .8s .25s,transform 1.2s .2s}.bank-phone h3{font-size:17px;margin:20px 0}.saved-word{background:#b7d96b;border-radius:9px;padding:16px 9px}.saved-word span{display:block;font-size:8px}.saved-word b{display:block;font-size:20px;letter-spacing:-.7px;margin:12px 0}.saved-word small{font-size:7px}.saved-line{height:7px;border-radius:3px;background:#e8e4d9;margin-top:15px}.saved-line.short{width:70%;margin-top:7px}.saved-label{display:block;font-size:7px;font-weight:800;color:#2457e6;margin-top:23px}.closing{position:absolute;left:40%;top:85px;opacity:0;transform:translateY(18px);transition:opacity .9s .3s,transform 1s .3s;z-index:6;pointer-events:none}.closing .eyebrow{font-size:8px}.closing h2{font-size:36px;letter-spacing:-1.2px;line-height:1.1;margin-top:18px}.closing em{font-style:normal;color:#2457e6}.pin{position:absolute;left:23%;top:34px;width:11px;height:11px;background:#e85a9b;border:2px solid #171713;border-radius:50%;z-index:9;opacity:0;transition:opacity .8s .7s}.story-footer{display:flex;justify-content:space-between;align-items:center;padding:10px 12px 4px;gap:16px}.story-caption{display:flex;align-items:center;gap:18px}.story-caption>span{font-size:10px;font-weight:800;color:#817b70;font-variant-numeric:tabular-nums}.story-caption p{font-size:19px;font-weight:700;letter-spacing:-.4px;margin:0}.story-footer button{border:1px solid #d8d3c9;border-radius:9px;background:transparent;padding:10px 12px;font-size:11px;cursor:pointer;color:#605e56}.timeline{display:flex;gap:8px;padding:12px}.timeline button{height:14px;flex:1;border:0;border-radius:5px;padding:5px 0;background:transparent;cursor:pointer}.timeline button:before{content:'';display:block;height:3px;background:#d8d3c9;border-radius:4px}.timeline span{display:block;height:3px;background:#2457e6;transform:scaleX(0);transform-origin:left;margin-top:-3px;border-radius:4px}.below{display:flex;justify-content:space-between;gap:30px;align-items:center;padding:16px 0}.below p{font-size:12px;color:#777168}.below a{font-size:13px;color:#2457e6;text-underline-offset:4px;font-weight:700}.below a span{margin-left:8px}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #2457e6;outline-offset:4px}
[data-phase="1"] .word-card{transform:scale(.86) rotate(-3deg);left:7%;top:49px}[data-phase="1"] .lesson-copy{opacity:0;transform:translateY(-15px)}[data-phase="1"] .class-activity{opacity:1;transform:none}[data-phase="1"] .board-question{opacity:1}[data-phase="2"] .board-frame{opacity:0;transform:scale(.96)}[data-phase="2"] .word-card{transform:translateX(-80px) scale(.6) rotate(-8deg);opacity:0}[data-phase="2"] .lesson-copy,[data-phase="3"] .lesson-copy{opacity:0;transform:translateY(-20px)}[data-phase="2"] .conversation{opacity:1;transform:none}[data-phase="2"] .bubble{transform:none}[data-phase="3"] .board-frame{opacity:.5;transform:scale(.98);background:#e8eddb}[data-phase="3"] .word-card{left:8%;top:40px;transform:scale(.85) rotate(-4deg)}[data-phase="3"] .bank-phone{opacity:1;transform:rotate(5deg)}[data-phase="3"] .closing{opacity:1;transform:none}[data-phase="3"] .pin{opacity:1}
@media(max-width:1000px) and (min-width:721px){.class-activity{left:43%}.phone{width:120px;height:240px}.phone-row{gap:12px}.word-card{left:5%}.lesson-copy h2{font-size:29px}.bank-phone{right:5%}.closing{left:41%}.closing h2{font-size:29px}.closing .eyebrow{max-width:140px;display:block;line-height:1.5}.bubble{max-width:360px}.bubble p{font-size:20px}}
@media(max-width:720px){.home-story-page>header{padding:16px 20px}.home-story-page>header img{width:82px}.header-actions>span{display:none}.login-menu summary{font-size:11px;padding:13px 16px}main{padding:24px 16px}.intro h1{font-size:31px;max-width:330px;margin:12px auto}.intro>p:last-child{font-size:13px;line-height:1.5;max-width:280px;margin:14px auto 24px}.intro .eyebrow{font-size:9px}.animation{padding:8px 6px 12px;border-radius:22px}.stage{height:480px}.board-frame{inset:10px 5px 20px}.board-top{font-size:7px;padding:15px}.word-card{width:252px;height:350px;left:calc(50% - 126px);top:25px;padding:17px 18px;transform:scale(.75);transform-origin:top center}.word-card h2{font-size:29px;margin-bottom:13px}.word-card>p{font-size:10px}.citation{margin-top:11px}.word-card footer{padding:8px 4px;margin-top:9px}.lesson-copy{left:5%;right:5%;top:315px;text-align:center}.lesson-copy h2{font-size:26px;margin:10px 0}.lesson-copy h2 br{display:none}.lesson-copy p{font-size:12px;line-height:1.5;margin:8px 0}.lesson-copy .eyebrow{font-size:8px}.class-activity{left:8%;right:8%;top:170px;text-align:center}.class-activity h2{font-size:22px;margin:9px 0 17px}.class-activity h2 br{display:none}.class-activity .eyebrow{font-size:8px}.phone-row{gap:16px;justify-content:center}.phone{width:119px;height:225px;padding:17px 9px 10px}.phone>strong{font-size:16px;padding:10px 2px;margin:9px 0}.phone p{font-size:9px}.phone .answer{padding:6px;font-size:8px}.phone label{font-size:6px}.phone .writing{font-size:7px;padding:8px 4px}.sent{font-size:6px;padding:7px 2px}.board-question{display:none}.conversation{inset:25px 12px}.place-title{text-align:center}.place-title .eyebrow{font-size:7px}.place-title h2{font-size:26px}.bubble{padding:18px;max-width:90%;border-radius:16px}.bubble p{font-size:19px}.bubble-one{left:0;top:110px}.bubble-two{right:0;top:260px}.bubble small{font-size:7px}.word-trail{top:220px;font-size:44px;right:3%}.bank-phone{right:8%;top:166px;width:132px;height:240px}.bank-phone h3{font-size:14px;margin:15px 0}.saved-word{padding:12px 7px}.saved-word b{font-size:17px}.saved-word small{font-size:6px}.saved-label{font-size:6px;margin-top:18px}.closing{top:32px;left:5%;right:5%;text-align:center}.closing h2{font-size:29px;margin-top:10px}.closing h2 br{display:initial}.closing .eyebrow{font-size:6px}.pin{left:22%;top:172px;width:8px;height:8px}.story-footer{padding:8px 8px 4px;gap:8px}.story-caption{gap:9px}.story-caption>span{font-size:8px;white-space:nowrap}.story-caption p{font-size:14px;line-height:1.3;max-width:185px;min-height:36px;display:flex;align-items:center}.story-footer button{font-size:9px;padding:9px}.timeline{padding:10px 8px 0}.below{display:block;text-align:center;padding:12px 8px}.below p{font-size:11px;line-height:1.5}.below a{font-size:12px;line-height:1.5;display:block}[data-phase="1"] .word-card{left:calc(50% - 126px);top:28px;transform:scale(.32) rotate(-3deg)}[data-phase="1"] .class-activity{transform:none}[data-phase="3"] .word-card{left:-9%;top:178px;transform:scale(.53) rotate(-4deg);transform-origin:center top}[data-phase="3"] .bank-phone{transform:rotate(5deg)}[data-phase="3"] .board-frame{background:#e8eddb}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}

.home-story-page>.teacher-navigation:not(.teacher-popup-layer){max-width:1280px;border-bottom:0;padding:8px 40px 0}.home-story-page>.teacher-navigation summary{color:#527c29;font-weight:800;text-underline-offset:4px;text-decoration:underline}.home-story-page .word-card a{color:#2457e6;text-underline-offset:2px}.home-footer{max-width:1200px;margin:0 auto;padding:18px 20px;display:flex;justify-content:space-between;border-top:1px solid #ded9d0;font-size:10px;color:#777168}.home-footer nav{display:flex;gap:20px}.home-footer a{text-underline-offset:3px}.home-story-page .phone-row{pointer-events:none}.home-story-page .word-card{height:382px}.home-story-page .word-card>p{font-size:10px}.home-story-page .citation{margin-top:10px}.home-story-page .word-card footer{margin-top:8px}@media(max-width:720px){.home-story-page>.teacher-navigation:not(.teacher-popup-layer){padding:8px 20px 0;justify-content:flex-end}.home-story-page .word-card{height:366px}.home-footer{padding:16px;gap:12px;flex-wrap:wrap}}

/* Requested placement of the full introduction above the header divider. */
.home-story-page>header{display:grid;grid-template-columns:140px minmax(0,1fr) 140px;gap:24px}.home-story-page>header>a{grid-column:1;justify-self:start}.home-story-page>header>.intro{grid-column:2;min-width:0;padding:12px 0}.home-story-page>header>.header-actions{grid-column:3;justify-self:end}.home-story-page>header>.intro h1{font-size:clamp(26px,3vw,40px);margin:10px 0;letter-spacing:-1.3px;max-width:none}.home-story-page>header>.intro>p:last-child{font-size:14px;line-height:1.45;margin:12px 0 0;max-width:none}@media(max-width:720px){.home-story-page>header{grid-template-columns:minmax(0,1fr) auto;gap:22px 12px}.home-story-page>header>a{grid-column:1;grid-row:1}.home-story-page>header>.header-actions{grid-column:2;grid-row:1}.home-story-page>header>.intro{grid-column:1/-1;grid-row:2;padding:0 0 8px}.home-story-page>header>.intro h1{font-size:30px;max-width:330px;margin:10px auto}.home-story-page>header>.intro>p:last-child{font-size:13px;max-width:310px;margin:12px auto 0}}

.home-story-page>header>.home-brand{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px;line-height:1;text-decoration:none}.home-story-page>header>.home-brand picture{display:block}.home-story-page>header>.home-brand img{display:block;width:72px;height:72px;object-fit:contain;aspect-ratio:1;border-radius:10px}.home-brand-tagline{display:block;white-space:nowrap;font-size:10px;line-height:1.2;font-weight:700;color:#605e56;letter-spacing:normal}@media(max-width:760px),(hover:none) and (pointer:coarse){.home-story-page>header>.home-brand img{width:90px;height:65px;aspect-ratio:auto;border-radius:0}}@media(min-width:761px) and (hover:hover) and (pointer:fine) and (max-height:650px){.home-story-page>header>.home-brand img{width:56px;height:56px;border-radius:8px}}

/* Keep the sources in the viewport without clipping the story or footer. */
.home-story-page main{padding-top:14px;padding-bottom:10px}.home-story-page>header{padding-top:10px;padding-bottom:10px}.home-story-page>header>.intro{padding:4px 0}.home-story-page>header>.intro h1{margin:4px 0}.home-story-page>header>.intro>p:last-child{margin-top:8px}.home-story-page .animation{padding-top:8px;padding-bottom:8px}.stage-viewport{position:relative;width:100%;height:450px;overflow:hidden}.stage-viewport>.stage{position:absolute;left:0;top:0;transform-origin:top left}.home-story-page>.site-source-strip{margin-top:0;padding-top:8px;padding-bottom:8px}.home-story-page>.home-footer{padding-top:10px;padding-bottom:10px}@media(max-width:720px){.stage-viewport{height:480px}.home-story-page>header{row-gap:12px}.home-story-page>header>.intro{padding-bottom:4px}.home-story-page>header>.intro h1{font-size:28px}.home-story-page>header>.intro>p:last-child{margin-top:8px}.home-story-page main{padding-top:10px;padding-bottom:6px}.home-story-page .story-footer{padding-top:6px}.home-story-page .timeline{padding-top:6px}}@media(max-width:720px) and (max-height:700px){.home-story-page>header{padding-top:6px;padding-bottom:6px;row-gap:6px}.home-story-page>header>.intro h1{font-size:23px;line-height:1.05}.home-story-page>header>.intro>p:last-child{font-size:11px;line-height:1.3;margin-top:5px}.home-story-page>.teacher-navigation:not(.teacher-popup-layer){padding-top:0}.home-story-page>.site-source-strip{padding-top:5px;padding-bottom:5px;gap:4px}.home-story-page>.home-footer{padding-top:7px;padding-bottom:7px}.home-story-page .story-caption p{font-size:12px;min-height:26px}.home-story-page .timeline{padding-top:2px}}
@media(max-width:720px){.home-story-page .animation[data-phase="3"] .word-card{left:max(-9%,-50px)}}

/* Let the story grow into spare height, with sources anchored at the bottom. */
body.home-story-page{min-height:100svh;display:flex;flex-direction:column}.home-story-page>header{width:100%;margin:0 auto;flex:none}.home-story-page>.teacher-navigation:not(.teacher-popup-layer){width:100%;margin:0 auto;flex:none}.home-story-page main{width:100%;margin:0 auto;flex:1 0 auto}.home-story-page>.site-source-strip,.home-story-page>.home-footer{width:100%;flex:none}

.stage{container-name:home-scene;container-type:inline-size}@media(min-width:721px){@container home-scene (max-width:900px){.home-story-page .word-card{left:4%}.home-story-page .lesson-copy{left:51%}.home-story-page .class-activity{left:47%}.home-story-page [data-phase="1"] .word-card{left:4%}.home-story-page .closing{top:26px;left:6%;right:6%;text-align:center}.home-story-page .closing h2{font-size:30px;line-height:1.05;margin:12px 0 0}.home-story-page .closing .eyebrow{font-size:8px}.home-story-page [data-phase="3"] .word-card{left:10%;top:140px;transform:scale(.72) rotate(-4deg);transform-origin:top center}.home-story-page .bank-phone{right:10%;top:140px}.home-story-page .pin{top:140px;left:calc(10% + 120px)}.home-story-page .bubble{max-width:46%}.home-story-page .bubble p{font-size:21px}.home-story-page .bubble-two{top:255px}}}

/* Restore the approved common heading within the existing top section. */
.home-story-page>header>.intro h1{font-size:20px;line-height:1.1;letter-spacing:-.3px;max-width:620px;margin:4px auto}@media(max-width:720px){.home-story-page>header>.intro h1{font-size:17px;line-height:1.2;max-width:330px;margin:4px auto}}@media(max-width:720px) and (max-height:700px){.home-story-page>header>.intro h1{font-size:14px;line-height:1.15}}

/* Only the first scene: Monday email opens into the existing word card. */
.mail-arrival{position:absolute;left:8%;top:160px;width:276px;height:170px;z-index:6;pointer-events:none;visibility:hidden;opacity:0}.mail-date{position:absolute;left:0;right:0;top:-35px;text-align:center;color:#2457e6;font-size:11px;font-weight:800;letter-spacing:1px}.mail-envelope{position:relative;width:100%;height:160px;border:1.5px solid #171713;border-radius:12px;background:#fffdf7;box-shadow:5px 6px #171713;perspective:700px}.mail-message{position:absolute;inset:20px 18px;color:#171713;background:#fffdf7;text-align:center}.mail-message span{display:block;font-size:9px;font-weight:900;letter-spacing:1px;color:#2457e6;margin-bottom:11px}.mail-message strong{font-size:17px;line-height:1.3}.mail-pocket{position:absolute;inset:0;border-radius:10px;background:#e8eddb;clip-path:polygon(0 0,50% 62%,100% 0,100% 100%,0 100%);z-index:3}.mail-flap{position:absolute;left:0;right:0;top:0;height:98px;background:#b7d96b;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top center;z-index:4}.animation[data-phase="0"] .mail-arrival{visibility:visible;animation:home-mail-arrive 2800ms linear both paused;animation-delay:var(--intro-delay,0ms)}.animation[data-phase="0"] .mail-flap{animation:home-mail-open 2800ms linear both paused;animation-delay:var(--intro-delay,0ms)}.animation[data-phase="0"] .word-card{animation:home-card-from-mail 2800ms linear both paused;animation-delay:var(--intro-delay,0ms)}
@keyframes home-mail-arrive{0%{opacity:1;translate:-70px 35px}20%{opacity:1;translate:0 0}74%{opacity:1;translate:0 0}100%{opacity:0;translate:0 30px}}
@keyframes home-mail-open{0%,20%{transform:rotateX(0deg)}40%,100%{transform:rotateX(-180deg)}}
@keyframes home-card-from-mail{0%,37%{opacity:0;translate:0 140px}45%{opacity:1;translate:0 105px}80%,100%{opacity:1;translate:0 0}}
@media(min-width:721px){@container home-scene (max-width:900px){.mail-arrival{left:4%}}}
@media(max-width:720px){.mail-arrival{left:calc(50% - 126px);top:190px;width:252px;transform:scale(.75);transform-origin:top center}.mail-date{font-size:12px}}
@media(prefers-reduced-motion:reduce){.mail-arrival{display:none}.animation[data-phase="0"] .word-card{opacity:1;translate:none}}

.home-story-page>header>.intro h1{font-weight:400}.home-story-page>header>.intro h1 strong{font-weight:800}

/* The classroom watermark belongs exclusively to slide 2. */
.home-story-page .animation[data-phase="1"] .board-frame{background-image:linear-gradient(#ffffffb8,#ffffffb8),url("/assets/classroom-paper-cut-watermark.png");background-size:cover;background-position:center;background-repeat:no-repeat}
.home-story-page .animation[data-phase="1"] .board-question{display:none}

/* Slide 1: the approved office/corridor illustration changes only the background. */
.home-story-page .animation[data-phase="0"] .board-frame{background-image:linear-gradient(#ffffffc7,#ffffffc7),url("/assets/reminder-paper-cut-watermark.png");background-size:cover;background-position:center;background-repeat:no-repeat}

/* Keep the room label off slide 1 without shifting its other elements. */
.home-story-page .animation[data-phase="0"] .board-top>span:last-child,.home-story-page .animation[data-phase="1"] .board-top>span:last-child{visibility:hidden}

/* Slide 3: three everyday settings, isolated from the other slides. */
.home-story-page .conversation{inset:18px 18px 34px;overflow:hidden;border-radius:18px;background:#fff}
.home-story-page .conversation .place-title{position:absolute;inset:20px 20px auto;text-align:center;z-index:2}
.home-story-page .conversation .place-title h2{font-size:30px;margin:9px 0}
.home-story-page .everyday-scenes{position:absolute;inset:85px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.home-story-page .everyday-scene{position:relative;display:flex;align-items:flex-end;padding:12px;background-image:linear-gradient(#ffffffb8,#ffffffb8),url('/assets/everyday-paper-cut-watermark.png');background-size:300% 100%;background-position:left center}
.home-story-page .everyday-scene.football{background-position:center}.home-story-page .everyday-scene.bedroom{background-position:right center}
.home-story-page .everyday-quote{width:100%;padding:15px;border:1px solid #ddd7cc;border-radius:15px;background:#fffaf0f5}
.home-story-page .football .everyday-quote{background:#edf2ddf5}.home-story-page .bedroom .everyday-quote{background:#fbe7f0f5}
.home-story-page .everyday-quote small{font-size:8px;letter-spacing:.7px;font-weight:800;color:#605e56}
.home-story-page .everyday-quote p{font-size:19px;line-height:1.3;margin:10px 0 0}
@media(max-width:720px){.home-story-page .conversation{inset:10px 5px 20px}.home-story-page .conversation .place-title{inset:13px 8px auto}.home-story-page .conversation .place-title h2{font-size:24px}.home-story-page .conversation .place-title .eyebrow{font-size:7px}.home-story-page .everyday-scenes{inset:73px 0 0;grid-template-columns:1fr;grid-template-rows:repeat(3,minmax(0,1fr))}.home-story-page .everyday-scene{padding:8px;align-items:center;justify-content:flex-end;background-size:300% auto}.home-story-page .everyday-quote{width:66%;padding:10px;border-radius:11px}.home-story-page .everyday-quote small{font-size:7px}.home-story-page .everyday-quote p{font-size:14px;line-height:1.3;margin-top:6px}}

/* Slide 3: full-panel watermark and pupil speech at 2, 4 and 6 seconds. */
.home-story-page .conversation{background-image:linear-gradient(#ffffffb8,#ffffffb8),url('/assets/everyday-paper-cut-watermark.png');background-size:cover;background-position:center}
.home-story-page .everyday-scenes{inset:0}
.home-story-page .everyday-scene{background:none;padding:14px;align-items:flex-end}
.home-story-page .everyday-quote{position:relative;visibility:hidden;opacity:0;transform:translateY(8px);transition:opacity .3s,transform .3s,visibility .3s;border-color:#d5cbb9;box-shadow:0 3px 0 #1717130b}
.home-story-page .everyday-quote p{margin:0}
.home-story-page .everyday-quote:before{content:"";position:absolute;top:-14px;left:18%;width:24px;height:24px;background:inherit;border-left:1px solid #d5cbb9;border-top:1px solid #d5cbb9;transform:skewY(30deg) rotate(25deg);clip-path:polygon(0 0,100% 0,0 100%)}
.home-story-page .football .everyday-quote:before{left:55%}.home-story-page .bedroom .everyday-quote:before{left:35%}
.home-story-page .animation[data-spoken="1"] .canteen .everyday-quote,.home-story-page .animation[data-spoken="2"] .canteen .everyday-quote,.home-story-page .animation[data-spoken="3"] .canteen .everyday-quote,.home-story-page .animation[data-spoken="2"] .football .everyday-quote,.home-story-page .animation[data-spoken="3"] .football .everyday-quote,.home-story-page .animation[data-spoken="3"] .bedroom .everyday-quote{visibility:visible;opacity:1;transform:none}
@media(max-width:720px){.home-story-page .conversation{background:none}.home-story-page .everyday-scenes{inset:0}.home-story-page .everyday-scene{background-image:linear-gradient(#ffffffb8,#ffffffb8),url('/assets/everyday-paper-cut-watermark.png');background-size:300% auto;background-position:left center;align-items:flex-end;padding:10px}.home-story-page .everyday-scene.football{background-position:center}.home-story-page .everyday-scene.bedroom{background-position:right center}.home-story-page .conversation .place-title{pointer-events:none}.home-story-page .everyday-quote{width:66%;padding:12px}.home-story-page .everyday-quote p{font-size:14px}.home-story-page .everyday-quote:before{left:8%;top:-10px;width:18px;height:18px}}
@media(prefers-reduced-motion:reduce){.home-story-page .everyday-quote{transition:none}}

/* Slide 4: the printed poster is part of the classroom background. */
.home-story-page .animation[data-phase="3"] .board-frame{background-image:linear-gradient(#ffffffb8,#ffffffb8),url('/assets/classroom-maths-paper-cut-watermark.png');background-size:cover;background-position:center;opacity:1;transform:none}
.home-story-page .animation[data-phase="3"] .word-card,.home-story-page .animation[data-phase="3"] .pin{display:none}
.home-story-page .animation[data-phase="3"] .board-top>span:last-child{visibility:hidden}
@media(max-width:720px){.home-story-page .animation[data-phase="3"] .board-frame{background-position:left center}}

/* Slide 1: a clearer teacher vignette and a compact reminder postcard. */
.home-story-page .animation[data-phase="0"] .board-frame{background-image:linear-gradient(90deg,#ffffff26 0%,#ffffff59 36%,#ffffffc7 65%,#ffffffdb 100%),url('/assets/reminder-paper-cut-watermark.png')}
.home-story-page .animation[data-phase="0"] .word-card{display:none}
.reminder-postcard{position:absolute;z-index:5;left:6%;top:265px;width:220px;min-height:104px;padding:17px 31px 17px 15px;display:flex;align-items:center;gap:12px;background:#fffdf7;border:1px solid #171713;border-radius:10px;box-shadow:4px 5px #171713;visibility:hidden;opacity:0;transform:translateY(14px) scale(.92);transition:opacity .35s,transform .35s,visibility .35s}
.reminder-postcard img{width:43px;height:43px;object-fit:contain}.reminder-postcard strong{display:block;font-size:14px;line-height:1.2}.reminder-postcard div>span{display:block;font-size:10px;line-height:1.4;margin-top:7px;color:#605e56}.postcard-stamp{position:absolute;top:9px;right:9px;color:#2457e6;border:1px dashed #b7d96b;padding:2px;font-size:13px}
.animation[data-postcard="true"] .reminder-postcard{visibility:visible;opacity:1;transform:none}
/* Slide 2: center the heading across the whole panel. */
.home-story-page .class-activity{left:4%;right:4%;top:26px;text-align:center}
.home-story-page .class-activity .phone-row{position:absolute;right:4%;top:112px;text-align:left}
@media(max-width:720px){.home-story-page .animation[data-phase="0"] .board-frame{background-position:left center}.reminder-postcard{left:6%;top:210px;width:170px;min-height:86px;padding:12px 24px 12px 12px;gap:9px}.reminder-postcard img{width:32px;height:32px}.reminder-postcard strong{font-size:12px}.reminder-postcard div>span{font-size:8px;margin-top:5px}.postcard-stamp{font-size:10px;right:6px;top:6px}.home-story-page .class-activity{top:27px;left:4%;right:4%}.home-story-page .class-activity .phone-row{top:197px;left:0;right:0;justify-content:center}.home-story-page .animation[data-phase="1"] .word-card{top:104px}}
@media(prefers-reduced-motion:reduce){.reminder-postcard{transition:none}}

/* Slide 4: four saved words in the illustrated phone. */
.bank-phone .saved-word-list{display:grid;gap:7px}.bank-phone .saved-word-row{background:#b7d96b;border-radius:7px;padding:8px 9px;color:#171713}.bank-phone .saved-word-row span{display:block;font-size:6px;font-weight:700;margin-bottom:4px}.bank-phone .saved-word-row b{display:block;font-size:14px;line-height:1.1;letter-spacing:-.3px}.bank-phone .saved-label{margin-top:12px}
@media(max-width:720px){.bank-phone .saved-word-list{gap:5px}.bank-phone .saved-word-row{padding:6px 7px}.bank-phone .saved-word-row span{font-size:5px;margin-bottom:3px}.bank-phone .saved-word-row b{font-size:11px}.bank-phone .saved-label{margin-top:9px}}
.bank-phone h3{font-size:16px;margin:10px 0}.bank-phone .saved-word-row{padding:6px 9px}.bank-phone .saved-label{margin-top:8px}
@media(max-width:720px){.bank-phone h3{font-size:12px;margin:7px 0}.bank-phone .saved-word-row{padding:5px 7px}.bank-phone .saved-label{margin-top:7px}}

/* One stationary card fades in at seven seconds and carries across to slide 2. */
.home-story-page .animation[data-phase="0"] .word-card,.home-story-page .animation[data-phase="1"] .word-card{display:block;animation:none;translate:none;left:7%;top:49px;transform:scale(.86) rotate(-3deg);transition:none}
.home-story-page .animation[data-phase="0"] .word-card{opacity:var(--opening-card-opacity,0)}
.home-story-page .animation[data-phase="1"] .word-card{opacity:1}
@media(min-width:721px){@container home-scene (max-width:900px){.home-story-page .animation[data-phase="0"] .word-card,.home-story-page .animation[data-phase="1"] .word-card{left:4%}}}
@media(max-width:720px){.home-story-page .animation[data-phase="0"] .word-card,.home-story-page .animation[data-phase="1"] .word-card{left:calc(50% - 126px);top:104px;transform:scale(.32) rotate(-3deg)}}

/* Slide 3 covers the board; retain its corner label above the illustration. */
.home-story-page .conversation:before{content:"UKENS ORD";position:absolute;left:24px;top:18px;z-index:5;color:#817b70;font:800 9px/normal Arial,Helvetica,sans-serif;letter-spacing:1px;pointer-events:none}
@media(max-width:720px){.home-story-page .conversation:before{left:15px;top:15px;font-size:7px}}