/* A single, close-up welcome scene; lesson rooms keep their existing styling. */
body:has(.brand-welcome){background:#173f34;color:#fff5dc}
body:has(.brand-welcome) .room-shade{display:none}
body:has(.brand-welcome) header{max-width:1280px;padding:16px 28px;height:88px}
body:has(.brand-welcome) header .brand{transform:none;font-size:24px}
body:has(.brand-welcome) #app{width:100%;max-width:1280px;margin:0 auto;padding:0 28px 28px}
body:has(.brand-welcome) .activity-nav{display:none}
.brand-welcome{display:grid!important;grid-template-columns:46% 54%;grid-template-rows:auto auto;align-content:center;position:relative;isolation:isolate;overflow:hidden;background:#173f34!important;color:#fff5dc;border:0!important;border-radius:28px;padding:0!important;margin:0!important;height:min(720px,calc(100svh - 116px));min-height:620px!important;box-shadow:none!important}
.brand-welcome-art{position:absolute;right:0;top:0;width:61%;height:100%;object-fit:cover;object-position:50% 45%;border-radius:0!important;z-index:-2;mask-image:linear-gradient(to right,transparent,#000 22%)}
.brand-welcome-copy{grid-column:1;grid-row:1;text-align:left;padding:40px 0 0 22px;align-self:end}
.brand-welcome-copy .kicker{font-size:11px;letter-spacing:2.5px;color:#e8cd91;font-weight:900}
.brand-welcome-copy h1{font:700 clamp(48px,5.8vw,76px)/1.04 Georgia,serif;margin:18px 0;color:#fff0c4;letter-spacing:-1.5px}
.brand-welcome-copy h1 em{font-size:.72em;font-style:normal}
.brand-welcome-copy p{font-size:21px;line-height:1.5;color:#e4eadb;margin:18px 0}
.brand-welcome .cover-actions{grid-column:1;grid-row:2;position:static!important;background:none!important;display:flex;flex-direction:column;align-items:flex-start;gap:16px;margin:0!important;padding:16px 30px 40px 22px!important}
.brand-welcome .cover-actions .caption{color:#e4eadb;font-size:14px;line-height:1.5;margin:4px 0;max-width:360px;min-height:63px}
.brand-welcome small,.brand-welcome small a{color:#e1cfa6;font-size:12px}
.brand-welcome #begin{display:none!important}
.brand-welcome .cover-actions #resumeLesson.picture-button{width:min(100%,320px)}
.person-picture{background:#fff8e9 url('people.webp') center/contain no-repeat!important}
.brand small{font-size:9px}
@media(max-width:700px){
 body:has(.brand-welcome) header{height:72px;padding:10px 14px;gap:8px}
 body:has(.brand-welcome) header .brand{font-size:18px;padding:10px 12px}
 body:has(.brand-welcome) header .tools{gap:7px}
 body:has(.brand-welcome) header .tools button{min-height:46px;padding:9px 12px;font-size:13px}
 body:has(.brand-welcome) #app{padding:0 0 18px}
 .brand-welcome{grid-template-columns:1fr;grid-template-rows:auto auto auto;border-radius:0;min-height:0!important;height:auto}
 .brand-welcome-copy{grid-column:1;grid-row:1;text-align:center;padding:10px 16px 4px}
 .brand-welcome-copy .kicker{font-size:9px;letter-spacing:2px}
 .brand-welcome-copy h1{font-size:40px;margin:9px 0;letter-spacing:-.7px}
 .brand-welcome-copy h1 br{display:none}
 .brand-welcome-copy h1 em{display:block;font-size:.65em;margin-top:3px}
 .brand-welcome-copy p{font-size:14px;margin:7px 0}
 .brand-welcome-copy p br{display:none}
 .brand-welcome-art{position:relative;grid-column:1;grid-row:2;z-index:0;width:100%;height:clamp(235px,34svh,340px);object-fit:cover;object-position:50% 30%;mask-image:linear-gradient(to bottom,transparent,#000 9%,#000 83%,transparent)}
 .brand-welcome .cover-actions{grid-column:1;grid-row:3;align-items:center;gap:12px;padding:0 22px 12px!important;margin-top:-8px!important;z-index:1}
 .brand-welcome .cover-actions #resumeLesson.picture-button{min-height:72px;font-size:24px;width:min(100%,340px)}
 .brand-welcome #resumeLesson .toddler-icon{width:45px;height:45px}
 .brand-welcome .cover-actions #pause.picture-button{min-height:56px;font-size:17px}
 .brand-welcome .cover-actions .caption{font-size:12px;line-height:1.4;text-align:center;min-height:0;max-width:350px;margin:0}
 .brand-welcome small,.brand-welcome small a{font-size:10px}
}