:root{--serif:Newsreader,serif;--utility:Newsreader,serif;font-family:var(--utility)}
body,button,input,select,textarea,label,figcaption,nav,p,small{font-family:var(--utility);font-weight:400}
h1,h2,h3,.wordmark,.waitlist-wordmark,.closing-wordmark{font-family:var(--serif);font-weight:400}
.chapter .chapter-lines h2{font-family:var(--serif);font-size:clamp(34px,3.7vw,55px);line-height:1.13;letter-spacing:-.025em}
.chapter .chapter-lines p{font-family:var(--utility);font-weight:400;letter-spacing:0;line-height:1.35}
.chapter .chapter-lines .closing-wordmark{font-family:var(--serif);font-weight:400;letter-spacing:-.025em}
.hero-subtitle,.about-intro p,.coming-soon,.access-dialog p,.access-dialog label,.access-dialog input,.access-submit,.access-placeholder p,.access-back,.access-placeholder .access-eyebrow,.demo-waitlist :is(input,label,button,p,small),.waitlist-float,.school-results,.school-option,.waitlist-status,.screen-tabs button,.site-footer,.story-link,.closing-link{font-family:var(--utility);font-weight:400}
.demo-waitlist .waitlist-wordmark{font-family:var(--serif);font-weight:400;font-size:32px;letter-spacing:-.025em}
.access-dialog h2{font-family:var(--serif);font-size:36px;letter-spacing:-.025em}
.access-dialog input,.demo-waitlist input{font-size:18px}
.access-dialog p{font-size:18px}.access-dialog label,.access-submit{font-size:16px}
@media(max-width:620px){.chapter .chapter-lines h2{font-size:clamp(31px,8vw,40px)}.chapter-closing .chapter-lines h2{font-size:38px}.chapter .chapter-lines .closing-wordmark{font-size:clamp(42px,12vw,60px)}}

.hero-stage figcaption,.demo-waitlist .waitlist-submit,.demo-waitlist .waitlist-community{font-family:var(--utility);font-weight:400}
.demo-waitlist h2,.demo-waitlist h3{font-family:var(--serif);font-weight:400}

/* Entry sheet over the unblurred site. */
.demo-waitlist{width:min(680px,calc(100% - 36px));max-height:calc(100dvh - 60px);padding:32px 52px 30px;border-radius:16px;background:#f5f4ef;box-shadow:0 18px 70px #151c1940;color:#3b2c29}
.demo-waitlist::backdrop{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.demo-waitlist .waitlist-close{display:none}
.demo-waitlist .waitlist-wordmark{font-size:28px;margin:0 0 24px}
.demo-waitlist .waitlist-heading h2{font-family:var(--serif);font-size:40px;max-width:none;line-height:1.1;letter-spacing:-.025em;margin-bottom:20px}
.demo-waitlist .waitlist-intro{font-family:var(--utility);font-size:19px;line-height:1.4;color:#3b2c29;margin:0 auto 24px;max-width:540px}
.demo-waitlist .waitlist-fine{font-size:14px;line-height:1.4;margin:15px 0 0;color:#3b2c29}
.demo-waitlist:has(form[hidden]) .waitlist-heading{display:none}
.demo-waitlist .waitlist-community{display:none}

@media(max-width:620px){.demo-waitlist{padding:26px 24px 24px;max-height:calc(100dvh - 72px)}.demo-waitlist .waitlist-heading h2{font-size:32px}.demo-waitlist .waitlist-intro{font-size:17px;margin-bottom:18px}.demo-waitlist .waitlist-wordmark{font-size:24px;margin-bottom:22px}}

.demo-waitlist .waitlist-heading h2:focus{outline:none}

/* Website branding stays editorial; app screenshot typography is separate. */
.site-footer{justify-content:space-between;gap:24px;align-items:center}
.site-footer>.wordmark,.demo-waitlist .waitlist-wordmark{font-family:var(--serif);font-weight:400;letter-spacing:0;text-transform:none}
.site-footer>.wordmark{font-size:clamp(22px,2.5vw,32px);line-height:1}
.site-footer>span{margin-left:auto;text-align:right;font-family:var(--utility);font-weight:400}
.demo-waitlist label,.demo-waitlist input,.demo-waitlist button,.demo-waitlist p{font-family:var(--utility);font-weight:400}
.photo-entry{height:100vh;height:100dvh;min-height:100dvh}
@media(max-width:620px){.site-footer{flex-direction:row;gap:18px}.site-footer>.wordmark{font-size:22px;letter-spacing:0}.site-footer>span{max-width:150px;font-size:13px;line-height:1.4}}
/* A larger entry sheet, with breathing room around the signup form. */
.demo-waitlist{width:min(880px,calc(100% - 48px));min-height:min(740px,88dvh);max-height:calc(100dvh - 32px);padding:clamp(32px,5dvh,64px) clamp(32px,7vw,100px);overflow-y:auto}
.demo-waitlist form,.demo-waitlist .waitlist-heading,.demo-waitlist .waitlist-pending,.demo-waitlist .waitlist-success,.demo-waitlist .waitlist-verify{max-width:580px;margin-inline:auto}
.demo-waitlist .waitlist-wordmark{margin-bottom:36px}
.demo-waitlist .waitlist-heading h2{font-size:clamp(36px,4vw,48px)}
.demo-waitlist .waitlist-intro{font-size:21px;margin-bottom:30px}
@media(max-width:620px){.demo-waitlist{width:calc(100% - 24px);min-height:88dvh;max-height:calc(100dvh - 24px);padding:32px 24px}.demo-waitlist .waitlist-wordmark{margin-bottom:30px}.demo-waitlist .waitlist-heading h2{font-size:34px}.demo-waitlist .waitlist-intro{font-size:18px;margin-bottom:26px}}
.photo-entry .entry-access svg{transform:translateY(-3px)}
.demo-waitlist{max-width:calc(100% - 48px);overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scroll-padding-block:20px}
@media(max-width:620px){.demo-waitlist{max-width:calc(100% - 24px)}}
@media(max-height:650px){.demo-waitlist{padding-block:24px}.demo-waitlist .waitlist-wordmark{margin-bottom:18px}.demo-waitlist .waitlist-heading h2{font-size:30px;margin-bottom:14px}.demo-waitlist .waitlist-intro{font-size:17px;margin-bottom:18px}}
.demo-waitlist.keyboard-open{top:calc(var(--keyboard-top) + 12px);bottom:auto;margin-block:0;min-height:0;max-height:calc(var(--keyboard-height) - 24px)}
/* Pause background scrolling without changing the visitor's place in the story. */
html:has(#waitlist-dialog[open]){overflow:hidden;overscroll-behavior:none}
