/* LONDI World is the setting: supplied scenes stay intact at every size. */
:root{--scene-image:url('./assets/school-welcome.webp')}
html{background:#edf9fd}
body{background:transparent;isolation:isolate}
.world-atmosphere{position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(180deg,#ffffffec,#f2fbffe8 55%,#ffffffed),var(--scene-image);background-position:center;background-size:cover}
.wrap{width:min(1360px,calc(100% - 64px))}
.site-header{min-height:102px;border-bottom:1px solid #b5dae5}
.prototype-label{font-size:.8rem;background:#e2f8fd;border:1px solid #8ac7d4;color:var(--ink)}
.screen{padding-top:30px;padding-bottom:36px}
.home-grid{grid-template-columns:.72fr 1.28fr;gap:42px}
.home-copy h1{font-size:clamp(3rem,4.65vw,4.7rem)}
.home-copy .eyebrow{font-size:.875rem}
.art-panel{border:3px solid var(--turquoise);border-radius:28px;box-shadow:0 16px 35px #153b661c;margin:0;padding:0;min-height:0;display:block}
.art-panel figcaption{background:linear-gradient(105deg,#d8f7ff,#fff4c3);padding:18px 25px}
.art-panel figcaption strong{display:inline;font-size:1.55rem;margin-left:4px}
.world-heart{font-size:2rem}
.welcome-banner{display:block;position:relative;margin-top:36px;overflow:hidden;border-radius:26px;border:3px solid white;background:white;box-shadow:0 10px 28px #153b6620;text-decoration:none}
.welcome-banner>img{display:block;width:100%;height:auto}
.welcome-banner-copy{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 28px;background:#fff}
.welcome-banner-copy strong{font-size:1.6rem;letter-spacing:-.025em}
.welcome-banner-copy>span{font-size:1.1rem;font-weight:bold;color:var(--blue)}
.grownup-route{margin-top:28px;background:#fffffff5}
.collection-world{display:grid;grid-template-columns:1.45fr 1fr;align-items:stretch;overflow:hidden;background:#fff;border:3px solid white;border-radius:28px;box-shadow:0 12px 30px #153b661c}
.collection-world>img{width:100%;height:100%;object-fit:contain;background:#e4f6fa;display:block}
.collection-heading{padding:32px;align-self:center}
.collection-heading h1{font-size:clamp(2.3rem,3.2vw,3.5rem);line-height:1.06}
.collection-intro{font-size:1.1rem;line-height:1.55}
.adventure-group{margin-top:40px}
.adventure-group h2{font-size:1.7rem;display:flex;align-items:center;gap:14px}
.adventure-group h2:before{content:'';display:block;width:10px;height:30px;border-radius:6px;background:var(--turquoise)}
.adventure-group:nth-child(2) h2:before{background:var(--yellow)}
.adventure-group:nth-child(3) h2:before{background:var(--red)}
.adventure-group:nth-child(4) h2:before{background:var(--orange)}
.adventure-grid{gap:24px}
.adventure-card{display:flex;flex-direction:column;align-items:stretch;padding:0;gap:0;background:#fff;border:2px solid #fff;border-radius:23px;overflow:hidden;box-shadow:0 8px 24px #153b661b;height:100%}
.adventure-card:hover{border-color:var(--turquoise);background:white;box-shadow:0 12px 30px #153b6630}
.adventure-picture{position:relative;aspect-ratio:16/10;isolation:isolate;background:#e6f5fa}
.adventure-picture:before,.scene-art:before{content:'';position:absolute;inset:0;z-index:-1;background-image:var(--art-image);background-position:center;background-size:cover;filter:blur(14px);opacity:.33}
.adventure-picture img{display:block;width:100%;height:100%;object-fit:contain}
.adventure-card-copy{display:grid;grid-template-columns:42px 1fr;gap:7px 14px;padding:20px}
.adventure-number{grid-row:1/3;align-self:start;min-width:42px;min-height:42px;border-radius:13px}
.adventure-card strong{font-size:1.17rem;line-height:1.3}
.adventure-status{font-size:1rem;line-height:1.4;align-self:end}
.story-top{margin-bottom:19px}
.adventure-heading{display:flex;align-items:center;gap:28px;margin-bottom:25px}
.chapter-mark{margin:0;display:flex;align-items:center;gap:13px;flex:none}
.chapter-mark b{font-size:2.65rem;line-height:1;background:var(--red);color:white;border-radius:18px;padding:13px 15px;letter-spacing:-.05em}
.chapter-mark span{font-size:.9rem;max-width:95px;line-height:1.4;letter-spacing:0;font-weight:bold}
#story-title{font-size:clamp(2rem,3.5vw,3.2rem);color:var(--ink);line-height:1.07;max-width:850px}
.story-layout.cinematic-play{grid-template-columns:1.28fr 1fr;gap:26px;align-items:start}
.story-world{margin:0;background:white;border:3px solid white;border-radius:27px;overflow:hidden;box-shadow:0 12px 32px #153b6625;min-width:0}
.scene-art{position:relative;isolation:isolate;overflow:hidden;background:#dfeef2}
.scene-art img{position:relative;display:block;width:100%;height:auto;max-height:510px;object-fit:contain}
.scene-narrative{padding:23px 28px 25px;border-top:5px solid var(--turquoise);background:white}
.scene-narrative .eyebrow{font-size:.875rem;color:var(--blue);margin-bottom:9px}
.scene-narrative>p:not(.eyebrow):not(.gentle-note){font-size:1.25rem;line-height:1.55}
.scene-narrative .gentle-note{font-size:.925rem;margin-top:13px}
.choice-panel{border:2px solid #6cbfce;background:#fffffff7;padding:29px;border-radius:27px;box-shadow:0 10px 25px #153b6612}
.choice-panel h2{font-size:1.75rem}.choice-hint{font-size:1rem}
.choices{margin-top:23px;gap:16px}.choice{font-size:1.15rem;min-height:92px;line-height:1.4;padding:19px 17px}
.choice-footer{font-size:.925rem;line-height:1.5;margin-top:25px}
.feedback-card,.completion-card{display:grid;grid-template-columns:1.13fr 1fr;align-items:stretch;gap:0;max-width:none;margin:0;padding:0;border:3px solid white;border-radius:28px;background:white;overflow:hidden;box-shadow:0 12px 32px #153b6623}
.response-world{margin:0;min-width:0;display:flex;flex-direction:column;background:#e7f6f9}
.response-world .scene-art{margin-block:auto}.response-world .scene-art img{max-height:560px}
.response-world figcaption{padding:18px 23px;background:#dff7fc;border-top:4px solid var(--turquoise);font-size:1.05rem;font-weight:bold;text-align:left}
.feedback-message,.completion-message{padding:35px;align-self:center;min-width:0}
.feedback-card h1,.completion-card h1{font-size:clamp(2rem,3vw,3rem);line-height:1.07}
.feedback-copy{margin:20px 0 25px;font-size:1.18rem}
.feedback-card .button-row,.completion-card .button-row{flex-direction:column;align-items:stretch;gap:15px}
.next-story-title{font-size:1rem;margin-top:23px}
.mission{display:flex;align-items:center;gap:18px;background:#effbff;border:1px solid #acdbe7;margin:0 0 25px;padding:18px;border-radius:20px;max-width:none}
.mission>img{width:115px;height:auto;flex:none;border-radius:8px;display:block}
.mission-copy-wrap{min-width:0}.mission-label{font-size:.8rem;line-height:1.4;display:block}
.mission h2{font-size:1.35rem;margin:8px 0}.mission p{font-size:1rem}
.completion-copy{font-size:1.1rem;margin-block:19px 25px}
.family-feature{display:grid;grid-template-columns:300px 1fr;align-items:center;gap:32px;margin-top:30px;max-width:970px;padding:22px;border:2px solid #cee9f0;border-radius:25px;background:white}
.family-feature>img{display:block;width:100%;height:auto;border-radius:18px}
.family-feature h2{font-size:2rem;margin:12px 0 17px}.family-feature p{font-size:1.05rem}
.book-world{border:3px solid white;box-shadow:0 10px 28px #153b661c}
.book-world figcaption{background:#dff7fc;font-size:1rem}
@media(min-width:1600px){.scene-art img{max-height:565px}}
@media(max-width:1100px){
 .wrap{width:calc(100% - 44px)}.home-grid{grid-template-columns:.8fr 1.2fr;gap:27px}.home-copy h1{font-size:3.3rem}
 .story-layout.cinematic-play{grid-template-columns:1.1fr 1fr;gap:22px}.choice-panel{padding:23px}.choice{font-size:1.06rem;padding:17px 14px}
 .feedback-message,.completion-message{padding:27px}.mission{display:block}.mission>img{width:100px;float:right;margin:0 0 10px 12px}.mission:after{content:'';display:block;clear:both}
 .collection-world{grid-template-columns:1.3fr 1fr}.collection-heading{padding:24px}.collection-heading h1{font-size:2.5rem}
}
@media(max-width:850px){
 .home-grid{grid-template-columns:1fr}.home-copy h1{font-size:3.5rem}.art-panel{order:0}.home-copy h1 br{display:none}.home-copy h1 span{display:inline}
 .home-copy h1 span+span:before{content:' '}.home-copy .londi-title{display:block;font-size:.78em;margin-bottom:3px}
 .tagline,.welcome{max-width:none}.choose-adventure{display:inline-flex;margin-left:20px}.read-together{margin-top:16px}
 .adventure-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.story-layout.cinematic-play{grid-template-columns:1fr}.scene-art img{max-height:470px}
 .adventure-heading{gap:20px}.chapter-mark span{display:none}
 .feedback-card,.completion-card{grid-template-columns:1fr}.response-world .scene-art img{max-height:440px}.feedback-message,.completion-message{padding:30px}
 .feedback-card .button-row,.completion-card .button-row{flex-direction:row}.feedback-card .button-row .button,.completion-card .button-row .button{flex:1}
 .mission{display:flex}.mission>img{float:none;width:125px;margin:0}.collection-world{grid-template-columns:1fr}.collection-world>img{height:auto}.collection-heading{padding:25px}
 .family-feature{grid-template-columns:240px 1fr;gap:24px}.family-feature h2{font-size:1.6rem}
}
@media(max-width:600px){
 .wrap{width:calc(100% - 28px)}.site-header{min-height:86px}.prototype-label{font-size:.65rem;padding:7px 8px}.header-right{gap:7px}
 .screen{padding-top:21px}.home-copy h1{font-size:2.85rem}.home-copy .eyebrow{font-size:.8rem}.home-copy .londi-title{font-size:.8em}
 .art-panel{display:block;min-height:0;padding:0;border-radius:21px;border-width:2px}.art-panel figcaption{padding:14px 17px;font-size:1rem}.art-panel figcaption strong{font-size:1.2rem}
 .choose-adventure{display:flex;margin:15px auto 0}.welcome-banner{margin-top:27px;border-radius:21px;border-width:2px}.welcome-banner-copy{display:block;padding:20px}.welcome-banner-copy strong{font-size:1.4rem;display:block}.welcome-banner-copy>span{display:block;margin-top:10px;font-size:1rem}
 .adventure-grid{gap:15px}.adventure-card-copy{padding:16px;grid-template-columns:34px 1fr;gap:6px 10px}.adventure-number{min-width:34px;min-height:36px;font-size:.9rem}.adventure-card strong{font-size:1rem}.adventure-status{font-size:.875rem}
 .adventure-group h2{font-size:1.5rem}.collection-heading h1{font-size:2.25rem}.collection-intro{font-size:1.03rem}
 .adventure-heading{align-items:flex-start;gap:14px;margin-bottom:21px}.chapter-mark b{font-size:1.8rem;padding:11px 12px;border-radius:13px}#story-title{font-size:clamp(1.9rem,7vw,2.5rem)}
 .story-world{border-width:2px;border-radius:21px}.scene-art img{max-height:420px}.scene-narrative{padding:20px}.scene-narrative>p:not(.eyebrow):not(.gentle-note){font-size:1.17rem}
 .choice-panel{padding:24px 19px;border-radius:23px}.choice-panel h2{font-size:1.6rem}.choice{font-size:1.06rem;min-height:86px}.choice-footer{font-size:.9rem}
 .feedback-card,.completion-card{border-width:2px;border-radius:23px}.response-world figcaption{padding:15px 19px;font-size:.95rem}.feedback-message,.completion-message{padding:25px 21px}
 .feedback-card .button-row,.completion-card .button-row{flex-direction:column}.feedback-card .button-row .button,.completion-card .button-row .button{width:100%;flex:auto}
 .feedback-card h1,.completion-card h1{font-size:2rem}.feedback-copy{font-size:1.12rem}.mission{align-items:flex-start;gap:13px;padding:14px}.mission>img{width:90px}.mission h2{font-size:1.25rem}.mission p{font-size:.95rem}
 .family-feature{grid-template-columns:1fr;padding:18px;gap:22px}.family-feature>img{max-width:350px;margin:auto}.family-feature h2{font-size:1.7rem}
}
@media(max-width:420px){.adventure-grid{grid-template-columns:1fr}.adventure-card strong{font-size:1.2rem}.adventure-status{font-size:1rem}.adventure-card-copy{padding:20px;grid-template-columns:42px 1fr}.adventure-number{min-width:42px;min-height:42px}.mission{display:block}.mission>img{float:right;width:90px;margin:0 0 10px 12px}.prototype-label{font-size:.6rem}}
@media(forced-colors:active){.world-atmosphere{display:none}.scene-art:before,.adventure-picture:before{display:none}.adventure-card,.story-world,.feedback-card,.completion-card{border:2px solid CanvasText}}
/* Picture-supported choices keep the complete scenes beside the words. */
.choice{display:grid;grid-template-columns:112px 1fr 20px;gap:14px;position:relative;padding:10px 15px 10px 10px;overflow:hidden;min-height:100px}
.choice-picture{position:relative;display:block;width:112px;aspect-ratio:16/10;overflow:hidden;border-radius:11px;background:#dfedf1;isolation:isolate}
.choice-picture:before{content:'';position:absolute;inset:0;z-index:-1;background:var(--art-image) center/cover;filter:blur(7px);opacity:.25}
.choice-picture img{display:block;width:100%;height:100%;object-fit:contain}
.choice .choice-number{position:absolute;left:13px;top:13px;width:25px;height:25px;font-size:.8rem;border:1px solid white;box-shadow:0 1px 5px #153b6650}
.choice-arrow{margin:0;justify-self:end}.choice-panel{padding:25px}
@media(max-width:1100px) and (min-width:851px){.choice{grid-template-columns:86px 1fr 14px;gap:10px}.choice-picture{width:86px}.choice-panel{padding:20px}}
@media(max-width:850px){.home-copy h1 .kindness-title,.home-copy h1 .adventures-title{display:block}.home-copy h1 .adventures-title:before{content:none}}
@media(max-width:600px){.choice{grid-template-columns:91px 1fr 13px;gap:11px;min-height:99px;padding:9px 12px 9px 9px}.choice-picture{width:91px}.choice-panel{padding:22px 16px}.choice .choice-number{left:11px;top:11px;width:23px;height:23px}.response-world .scene-art img{max-height:260px}}
@media(max-width:360px){.choice{grid-template-columns:78px 1fr 10px;gap:9px}.choice-picture{width:78px}.choice{font-size:1rem}}
.guide-scene{margin:-25px -25px 22px;overflow:hidden;border-radius:24px 24px 0 0;background:#e5f7fa}
.guide-scene .scene-art img{max-height:238px;object-fit:contain}
.guide-scene figcaption{font-size:1rem;font-weight:bold;padding:11px 20px;background:#e1f7fc;border-bottom:1px solid #acdbe6}
.book-route-art{width:150px;height:auto;display:block;border-radius:13px;flex:none}.grownup-route>span:first-of-type{flex:1}
@media(max-width:1100px) and (min-width:851px){.guide-scene{margin:-20px -20px 21px}}
@media(max-width:850px){.guide-scene{margin:-25px -25px 22px}.guide-scene .scene-art img{max-height:235px}}
@media(max-width:600px){.guide-scene{margin:-22px -16px 21px;border-radius:20px 20px 0 0}.guide-scene .scene-art img{max-height:190px}.guide-scene figcaption{font-size:.925rem;padding:10px 17px}.book-route-art{width:95px}.grownup-route{flex-wrap:wrap}.grownup-route .round-arrow{display:none}}
