:root{--ink:#172431;--paper:#fff7df;--yellow:#ffe068;--blue:#94d9ec;--pink:#f6cbbd;--green:#c5e8d9;--line:1.5px solid var(--ink);--comic:'Comic Sans MS','Chalkboard SE','Marker Felt',ui-rounded,system-ui,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--comic);line-height:1.55}button,input,a{font:inherit}a{color:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #176a79;outline-offset:5px}.wrap{width:min(1200px,calc(100% - 72px));margin-inline:auto}.skip{position:absolute;left:16px;top:-80px;background:var(--yellow);padding:12px;z-index:9}.skip:focus{top:10px}.site-header{width:min(1320px,calc(100% - 72px));margin:auto;display:flex;justify-content:space-between;align-items:center;padding:25px 0;border-bottom:var(--line);gap:20px}.brand{font-weight:900;font-size:21px;line-height:1;letter-spacing:-.04em;text-decoration:none}.brand span{display:block;font-size:9px;letter-spacing:.13em;margin-top:9px}.site-header nav{display:flex;gap:28px;align-items:center;font-size:15px;font-weight:800}.site-header nav>a{text-decoration:none}.button{display:inline-flex;align-items:center;justify-content:center;gap:22px;background:var(--yellow);border:var(--line);border-radius:5px;padding:16px 23px;font-weight:900;text-decoration:none;box-shadow:3px 3px 0 var(--ink);transition:transform .15s,box-shadow .15s}.button:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}.button.small{padding:10px 17px;box-shadow:2px 2px 0 var(--ink)}.hero{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding:74px 0 82px}.eyebrow{font-size:11px;letter-spacing:.13em;font-weight:900;display:block;margin-bottom:18px}h1,h2,h3,p,figure{margin:0}h1{font-size:clamp(38px,4.8vw,66px);line-height:1.07;letter-spacing:-.05em}h1 em,.closing em{font-style:normal;color:#ca483f}h2{font-size:clamp(30px,3.7vw,49px);line-height:1.15;letter-spacing:-.045em}h3{font-size:23px;line-height:1.25}p{margin:18px 0;font-size:17px}.manifesto{font-size:25px;font-weight:900;line-height:1.35;margin:26px 0 18px}.hero .intro{max-width:450px}.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin:28px 0}.text-link{font-size:14px;font-weight:800;text-underline-offset:5px}.trust{font-size:12px;margin-top:30px}.hero-art{position:relative;border:var(--line);padding:10px;background:var(--blue);transform:rotate(1deg)}.hero-art>img{display:block;width:100%;height:490px;object-fit:cover;object-position:55% center;border:var(--line)}.hero-art figcaption{position:absolute;left:28px;top:30px;transform:rotate(-1deg)}.bubble{--balloon:#fffdf5;position:relative;display:block;background:var(--balloon);border:var(--line);border-radius:50% / 48%;text-align:center;padding:19px 28px;font-size:23px;line-height:1.2;font-weight:800}.tail{position:absolute;width:40px;height:46px;left:calc(35% - 20px);bottom:calc(2.2% - 39px);overflow:visible;pointer-events:none}.art-caption{display:block;text-align:center;padding:13px 8px 3px;font-size:11px;font-weight:900;letter-spacing:.1em}.story-ribbon{background:var(--yellow);border-block:var(--line);text-align:center;padding:17px 20px;font-size:21px;font-weight:900}.story-ribbon span span{color:#d54243}.story-intro{text-align:center;padding:80px 0 40px}.story-intro h2{font-size:clamp(36px,4.5vw,58px)}.story-intro p{font-size:18px}.chapter-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:13px;margin:30px auto 0}.chapter-nav a{display:flex;gap:9px;border:var(--line);padding:9px 14px;background:#fffdf5;font-size:13px;font-weight:700;text-decoration:none}.chapter-nav b{color:#bd433a}.story{display:grid;grid-template-columns:.78fr 1.22fr;gap:65px;align-items:center;padding:70px 0;border-bottom:var(--line);scroll-margin-top:24px}.story .issue{display:flex;gap:15px;align-items:center;font-size:38px;font-weight:900;line-height:1.1;margin-bottom:23px;color:#bd433a}.issue span{max-width:250px;font-size:10px;letter-spacing:.12em;color:var(--ink)}.story-copy p{max-width:470px}.takeaway{background:var(--blue);border:var(--line);display:flex;align-items:center;gap:17px;padding:18px 21px;margin-top:29px}.takeaway>span{font-size:35px;font-weight:900}.takeaway p{font-size:14px;margin:0;line-height:1.6}#cinema .takeaway{background:var(--pink)}#picnic .takeaway{background:var(--green)}#shopping .takeaway{background:var(--yellow)}.next-page{display:flex;justify-content:space-between;gap:18px;font-size:13px;font-weight:800;text-decoration:none;margin-top:28px;border-bottom:var(--line);padding-bottom:10px}.comic{min-width:0}.comic-open{display:block;padding:0;width:100%;background:none;border:0;cursor:zoom-in;position:relative}.comic img{display:block;width:100%;height:auto;border:var(--line)}.zoom-label{position:absolute;right:12px;bottom:12px;display:flex;gap:13px;background:var(--paper);border:var(--line);padding:7px 12px;font-size:11px;font-weight:900;opacity:0;transition:opacity .2s}.comic-open:hover .zoom-label,.comic-open:focus-visible .zoom-label{opacity:1}.comic figcaption{text-align:right;font-size:11px;margin-top:10px}.how-section{margin-top:65px;padding:72px 0;background:var(--blue);border-block:var(--line)}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:45px}.step-number{display:inline-flex;align-items:center;justify-content:center;width:45px;height:45px;background:var(--yellow);border:var(--line);border-radius:50%;font-size:23px;font-weight:900;margin-bottom:16px}.steps p{font-size:16px;margin-bottom:0}.demo-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center;padding:95px 0;border-bottom:var(--line)}.demo-section label{display:block;font-weight:900;margin-top:28px}output{color:#b94339}input[type=range]{accent-color:#bd433a;width:100%;margin:18px 0 0;min-height:32px;cursor:pointer}.range-end{display:flex;justify-content:space-between;font-size:11px}.demo-panel{border:var(--line);background:#fffdf5;padding:25px}.demo-panel>h3{font-size:16px;padding-bottom:23px;text-align:center}.money-panels{display:grid;grid-template-columns:repeat(3,1fr);border:var(--line)}.money-panels>div{padding:22px 10px;min-width:0;text-align:center;background:var(--blue)}.money-panels>div+div{border-left:var(--line);background:#ddd0ed}.money-panels>div:last-child{background:var(--green)}.money-panels span{display:block;font-weight:900;font-size:11px}.money-panels strong{display:block;font-size:clamp(18px,2vw,26px);margin:14px 0 12px;white-space:nowrap}.money-panels small{display:block;font-size:10px;line-height:1.4}.demo-panel>p{font-size:13px;text-align:center;padding:10px 0}.demo-panel>.button{width:100%;font-size:14px}.faq-section{display:grid;grid-template-columns:.65fr 1.35fr;gap:80px;padding:90px 0}.faq details{border-top:var(--line);padding:17px 0}.faq details:last-child{border-bottom:var(--line)}.faq summary{font-size:17px;font-weight:800;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:18px}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:'+';font-size:22px;line-height:1}.faq details[open] summary:after{content:'−'}.faq p{font-size:15px}.closing{text-align:center;padding:70px 0;background:var(--yellow);border-block:var(--line);background-image:radial-gradient(#17243120 .7px,transparent .7px);background-size:8px 8px}.closing h2{font-size:clamp(38px,5vw,64px)}.closing p{font-weight:900;font-size:21px;margin:25px 0}.closing .button{background:var(--paper)}footer{padding:33px 0;display:flex;justify-content:space-between;align-items:center;gap:25px;font-size:12px}footer p{font-size:11px;margin:0}footer a{font-size:11px}.footer-brand{font-size:13px;font-weight:900;text-decoration:none}dialog{padding:0;border:var(--line);width:min(1100px,calc(100% - 32px));max-height:92dvh;background:var(--paper);color:var(--ink)}dialog::backdrop{background:#172431c9}.reader-toolbar{position:sticky;top:0;padding:13px 20px;display:flex;justify-content:space-between;align-items:center;background:var(--yellow);border-bottom:var(--line);z-index:1;gap:15px}.reader-toolbar h2{font-size:19px}.reader-toolbar button{background:var(--paper);border:var(--line);padding:8px 14px;border-radius:4px;cursor:pointer;font-weight:800}.reader-scroll{overflow:auto;padding:15px;max-height:calc(92dvh - 70px)}.reader-scroll img{display:block;width:max(100%,720px);height:auto}.reader-description{font-size:14px}body.reader-open{overflow:hidden}
@media(max-width:900px){.wrap,.site-header{width:calc(100% - 44px)}.hero{gap:32px;padding-block:55px}.hero-art>img{height:430px}.hero-art figcaption{left:20px;top:23px}.bubble{font-size:20px;padding:17px 23px}.hero-actions{gap:18px}.story{gap:30px;grid-template-columns:.85fr 1.15fr;padding:50px 0}.story h2{font-size:34px}.story p{font-size:15px}.takeaway{padding:15px}.takeaway p{font-size:13px}.demo-section{gap:30px;grid-template-columns:1fr 1.2fr}.demo-panel{padding:18px}.faq-section{gap:35px}footer{flex-wrap:wrap}}
@media(max-width:650px){html{scroll-padding-top:16px}.wrap,.site-header{width:calc(100% - 32px)}.site-header{padding:19px 0;gap:10px}.brand{font-size:16px}.brand span{font-size:7px}.site-header nav{gap:12px;font-size:12px}.site-header nav>a:first-child{display:none}.site-header nav .button{padding:9px 10px;font-size:11px;gap:8px}.hero{grid-template-columns:1fr;gap:32px;padding:42px 0 42px}.eyebrow{font-size:9px;letter-spacing:.1em}h1{font-size:clamp(40px,11.5vw,58px)}.manifesto{font-size:23px;margin-top:23px}.hero .intro{font-size:16px}.hero-actions{margin-block:23px;gap:20px}.hero .button{font-size:14px;padding:14px 18px}.trust{font-size:11px;margin:23px 0 0}.hero-art{transform:none}.hero-art>img{height:300px;object-position:55% center}.hero-art figcaption{transform:none}.bubble{font-size:20px}.story-ribbon{font-size:16px;padding:14px 18px}.story-intro{padding:48px 0 20px}.story-intro h2{font-size:39px}.story-intro p{font-size:16px}.story-intro br{display:none}.chapter-nav{gap:8px;margin-top:24px}.chapter-nav a{font-size:11px;padding:7px 9px}.story{grid-template-columns:1fr;gap:24px;padding:38px 0 44px}.story .issue{font-size:33px;margin-bottom:17px}.story h2{font-size:35px}.story p{font-size:16px}.takeaway{padding:15px 19px;margin-top:22px}.takeaway p{font-size:14px}.next-page{margin-top:20px;font-size:12px}.comic figcaption{font-size:10px}.zoom-label{opacity:1;font-size:10px;padding:5px 9px;right:9px;bottom:9px}.how-section{margin-top:38px;padding:45px 0}.how-section h2{font-size:34px}.steps{grid-template-columns:1fr;gap:27px;margin-top:32px}.steps article{position:relative;padding-left:64px}.step-number{position:absolute;left:0;top:0;width:42px;height:42px;font-size:21px}.steps h3{font-size:23px}.steps p{margin-top:10px;font-size:15px}.demo-section{grid-template-columns:1fr;gap:29px;padding:48px 0}.demo-section h2{font-size:35px}.demo-section p{font-size:15px}.demo-panel{padding:17px 12px}.demo-panel>h3{font-size:13px}.money-panels>div{padding:19px 5px}.money-panels span{font-size:9px}.money-panels strong{font-size:clamp(16px,5.1vw,24px)}.money-panels small{font-size:9px}.demo-panel>p{font-size:12px}.demo-panel>.button{font-size:13px;gap:10px;padding:13px 10px}.faq-section{grid-template-columns:1fr;gap:28px;padding:48px 0}.faq-section h2{font-size:35px}.faq-section h2 br{display:none}.faq summary{font-size:16px}.closing{padding:47px 0}.closing h2{font-size:44px}.closing p{font-size:17px}.closing .button{font-size:14px}footer{padding:28px 0;gap:15px}footer p{order:3;flex-basis:100%}.reader-toolbar{padding:10px 12px}.reader-toolbar h2{font-size:15px}.reader-toolbar button{font-size:13px}.reader-scroll{padding:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* Website v2: the app's approved comic-cover identity. */
.app-masthead{container-type:inline-size;position:relative;isolation:isolate;overflow:hidden;text-align:center;
 background:radial-gradient(circle at 82% 72%,#ffeab3 0,#ffeab3 12%,transparent 44%),linear-gradient(120deg,#ffda55,#ffecab);
 border:2px solid #172431;box-shadow:2px 2px 0 #172431;padding:27px 16px 38px;}
.app-masthead::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#ab542a 1.1px,transparent 1.5px);background-size:9px 9px;opacity:.18;pointer-events:none;}
.app-masthead::after{content:"";position:absolute;right:0;bottom:0;width:33%;height:53%;opacity:.88;
 background:url('./assets/app-cover-character.jpg') center 17%/cover no-repeat;
 -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 48%);mask-image:linear-gradient(90deg,transparent 0%,#000 48%);z-index:0;pointer-events:none;}
.app-masthead>*{position:relative;z-index:1;font-family:var(--comic);font-weight:900;}
.app-masthead-kicker,.app-masthead-sub{font-size:clamp(1.1rem,5cqw,1.55rem);letter-spacing:.015em;color:#173e57;}
.app-masthead-title{margin:6px auto;font-size:clamp(2.4rem,11cqw,5.7rem);line-height:.94;letter-spacing:-.06em;color:#e73d36;
 -webkit-text-stroke:1.3px #172431;text-shadow:3px 4px 0 #fff7df,6px 7px 0 #172431;padding:4px 0 8px;}
.app-masthead-tag{max-width:70%;margin:14px auto 0 10px;text-align:left;font-size:clamp(.72rem,2.7cqw,.9rem);line-height:1.35;color:#18364b;}
.app-wordmark{color:#e73d36;-webkit-text-stroke:.55px #172431;text-shadow:1px 1px 0 #fff7df,2px 2px 0 #172431;font-family:var(--comic);}
.brand.app-wordmark span{color:#173e57;-webkit-text-stroke:0;text-shadow:none;}
@media(max-width:650px){.app-masthead{padding:24px 15px 38px;}.app-masthead-title{font-size:clamp(2rem,11cqw,4.5rem);}.footer-brand.app-wordmark{font-size:14px;}}

/* Website v3: Dad delivers the welcome using the approved family artwork. */
.dad-welcome{position:relative;padding-bottom:190px;margin-top:6px;}
h1.dad-welcome-bubble{position:relative;background:#fffdf5;border:var(--line);border-radius:50% / 48%;
 padding:35px 42px;font-size:clamp(23px,2.4vw,32px);line-height:1.3;letter-spacing:0;text-align:center;}
.dad-welcome-bubble>span{display:block;margin-top:16px;font-size:.82em;}
.dad-welcome-bubble strong{color:#bd433a;}
.dad-welcome-tail{position:absolute;left:calc(65% - 20px);bottom:calc(2.2% - 39px);width:40px;height:46px;overflow:visible;transform:scaleX(-1);}
.dad-portrait{position:absolute;right:10px;bottom:0;width:165px;}
.dad-portrait-window{position:relative;width:165px;height:156px;overflow:hidden;border:var(--line);background:#f6cbbd;}
.dad-portrait img{position:absolute;height:100%;width:auto;max-width:none;right:0;top:0;}
.dad-portrait figcaption{text-align:center;font-size:11px;font-weight:900;margin-top:6px;}
@media(max-width:650px){.dad-welcome{padding-bottom:175px;}.dad-welcome-bubble{padding:29px 31px!important;font-size:25px!important;}.dad-portrait{width:150px;right:0;}.dad-portrait-window{width:150px;height:146px;}}
/* Website v4: four family members welcome visitors in comic reading order. */
.hero.family-hero{display:block;padding-top:45px;}
.family-hero>.app-masthead{width:min(640px,100%);margin:0 auto 43px;}
.family-welcome-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:stretch;}
.family-welcome-card{border:var(--line);padding:15px 12px 12px;background:#f9e3aa;display:grid;grid-template-rows:230px auto;gap:40px;min-width:0;}
.family-mum{background:#bfe7ee;}.family-son{background:#c5e8d9;}.family-kate{background:#f6cbbd;}
.family-welcome-card .family-speech{position:relative;display:flex;flex-direction:column;justify-content:center;
 background:#fffdf5;border:var(--line);border-radius:50% / 48%;margin:0;padding:24px 20px;
 color:#172431;font-family:var(--comic);font-size:18px;font-weight:800;line-height:1.4;letter-spacing:0;text-align:center;}
.family-speech-tail{position:absolute;left:calc(50% - 20px);bottom:-39px;width:40px;height:46px;overflow:visible;pointer-events:none;}
.family-portrait{width:100%;aspect-ratio:1/1;position:relative;overflow:hidden;border:var(--line);}
.family-portrait img{position:absolute;top:0;width:400%;height:auto;max-width:none;}
.family-dad .family-portrait img{left:-300%;}.family-mum .family-portrait img{left:0;}
.family-son .family-portrait img{left:-100%;}.family-kate .family-portrait img{left:-200%;}
.family-welcome-card figcaption{font-size:12px;font-weight:800;text-align:center;margin-top:9px;}
.family-intro{text-align:center;margin-top:35px;}.family-intro .intro{max-width:none;}
.family-intro .hero-actions{justify-content:center;}.family-intro .trust{margin-top:22px;}
@media(max-width:1000px){.family-welcome-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;}.family-welcome-card{grid-template-rows:200px auto;}.family-portrait{aspect-ratio:1.3/1;}}
@media(max-width:520px){.family-welcome-strip{grid-template-columns:1fr;gap:24px;}.family-welcome-card{grid-template-rows:auto auto;gap:40px;padding:20px 18px 13px;}.family-welcome-card .family-speech{min-height:140px;font-size:20px;padding:25px 29px;}.family-dad .family-speech{min-height:210px;}.family-son .family-speech{min-height:170px;}.family-kate .family-speech{min-height:165px;}.family-portrait{aspect-ratio:1.55/1;}.family-hero>.app-masthead{margin-bottom:30px;}.hero.family-hero{padding-top:32px;}}

/* Website v5: room for Dad's full welcome and a direct-to-viewer portrait. */
.family-welcome-card{grid-template-rows:minmax(360px,auto) auto;}
.family-welcome-card .family-speech{font-size:17px;}
.family-dad .family-portrait img.dad-front-portrait{position:static;width:100%;height:100%;object-fit:cover;object-position:center 25%;}
@media(max-width:1000px){.family-welcome-card{grid-template-rows:minmax(290px,auto) auto;}}
@media(max-width:520px){.family-welcome-card{grid-template-rows:auto auto;}.family-welcome-card .family-speech{font-size:20px;}.family-dad .family-speech{min-height:330px;}}

/* Website v6: smaller Dad portrait, without a caption. */
.family-dad .family-portrait{width:78%;max-width:190px;aspect-ratio:1/1;margin-inline:auto;}
@media(max-width:520px){.family-dad .family-portrait{width:64%;max-width:190px;}}
/* Website v7: one shared, direct-facing family scene with an integrated live balloon. */
.family-comic-welcome{width:min(900px,100%);margin:auto;border:var(--line);background:#f6cbbd;padding:20px 20px 0;}
.shared-family-bubble{position:relative;margin:0 0 22px;z-index:2;}
#family-bubble-art{position:absolute;inset:0 0 auto;width:100%;height:calc(100% + 38px);overflow:visible;pointer-events:none;}
h1.shared-family-message{position:relative;z-index:1;font-family:var(--comic);font-size:clamp(17px,2.1vw,24px);font-weight:800;line-height:1.45;letter-spacing:0;text-align:center;color:#172431;padding:26px 38px;margin:0;min-height:150px;display:flex;align-items:center;justify-content:center;}
.shared-family-scene{position:relative;border:var(--line);margin:0 -20px;overflow:hidden;}
.shared-family-scene>img{display:block;width:100%;height:auto;}
.family-face-targets{position:absolute;inset:3% 0 13%;display:grid;grid-template-columns:repeat(4,1fr);}
.family-face-targets button{background:none;border:0;border-radius:0;padding:0;cursor:pointer;min-width:44px;min-height:44px;box-shadow:none;}
.family-face-targets button:hover{background:#fff7df18;}
.family-face-targets button:focus-visible{outline:2px dashed #fffdf5;outline-offset:-8px;background:#fff7df20;}
.family-message-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;}
.family-message-controls button{border:var(--line);background:var(--yellow);color:#172431;border-radius:4px;width:44px;height:44px;cursor:pointer;font-size:21px;flex-shrink:0;}
.family-message-controls p{text-align:center;margin:0;font-size:13px;line-height:1.4;}
#family-message-count{display:block;font-weight:800;font-size:11px;margin-top:4px;}
@media(max-width:650px){.family-comic-welcome{padding:14px 12px 0;}.shared-family-scene{margin-inline:-12px;}.shared-family-bubble{margin-bottom:18px;}h1.shared-family-message{font-size:17px;padding:25px 28px;min-height:145px;}.family-message-controls{gap:7px;padding:12px 0;}.family-message-controls p{font-size:11px;}}

/* Website v8: the four-dot family scene and matching quadrant tap areas. */
.family-comic-welcome{max-width:690px;}
.family-face-targets{inset:0;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);}
.family-face-targets button{position:relative;}
.family-face-targets button[aria-pressed="true"]::after{content:"";position:absolute;right:12px;bottom:12px;width:9px;height:9px;border:1px solid #172431;border-radius:50%;background:#ffe06c;box-shadow:0 0 0 3px #fffdf5a0;}

/* Website v9: messages fit a compact, content-sized balloon. */
h1.shared-family-message{font-size:18px;line-height:1.38;padding:19px 28px;min-height:0;overflow-wrap:break-word;}
.shared-family-bubble{margin-bottom:16px;}
@media(max-width:650px){h1.shared-family-message{font-size:15px;line-height:1.4;padding:18px 23px;min-height:0;}.family-comic-welcome{padding-top:10px;}.shared-family-bubble{margin-bottom:14px;}}
/* Website v11: each speaker's tail originates from their own row. */
.family-comic-welcome{display:flex;flex-direction:column;}
.shared-family-bubble{order:0;}.shared-family-scene{order:1;}.family-message-controls{order:3;}
.family-lower-speaker .shared-family-bubble{order:2;margin-top:17px;margin-bottom:0;}
.family-lower-speaker .shared-family-scene{order:1;}
.family-lower-speaker .shared-family-bubble #family-bubble-art{bottom:auto;}

/* Keep Kate’s balloon near her, with a curved tail towards her chin. */
.family-kate-speaker .shared-family-bubble{margin-top:var(--kate-bubble-overlap, -60px);}

/* Readable instructions beneath the four family faces. */
.family-message-controls p{font-size:16px;line-height:1.45;font-weight:800;}
#family-message-count{font-size:13px;margin-top:6px;}

/* Keep the cover focused on the comic title. */
.app-masthead::after{display:none;}
.app-masthead-tag{max-width:100%;margin:14px auto 0;text-align:center;}

/* Review: one prominent cover, compact welcome and readable Kate introduction. */
.site-header{justify-content:flex-end;padding-block:18px;}
.site-header nav>a:first-child{display:none;}
.family-hero>.app-masthead{width:min(900px,100%);padding:25px 18px 30px;}
.app-masthead-title{font-size:clamp(3rem,16cqw,8rem);line-height:.96;letter-spacing:-.055em;margin:12px auto 18px;}
.app-masthead-kicker,.app-masthead-sub{font-size:clamp(1.15rem,4.7cqw,2rem);}
.app-masthead-tag{font-size:clamp(.85rem,3cqw,1.15rem);margin-top:18px;}
h1.shared-family-message{font-size:20px;line-height:1.4;padding:21px 28px;}
.family-kate-speaker .shared-family-bubble{margin-top:34px;margin-bottom:0;}
.family-lower-speaker .shared-family-bubble{margin-top:34px;}
@media(max-width:650px){
 .site-header{padding-block:13px;}
 .site-header nav{gap:18px;font-size:13px;}
 .site-header nav .button{font-size:12px;padding:10px 13px;}
 .hero.family-hero{padding-top:25px;}
 .family-hero>.app-masthead{padding:23px 12px 27px;margin-bottom:28px;}
 .app-masthead-title{font-size:16cqw;-webkit-text-stroke:1px #172431;text-shadow:2px 3px 0 #fff7df,4px 5px 0 #172431;}
 h1.shared-family-message{font-size:15px;padding:17px 22px;}
 .family-kate-speaker h1.shared-family-message{font-size:17px;line-height:1.45;padding:22px 25px;}
}

/* The son introduces the stories separately from the four welcome messages. */
.son-story-introduction{display:grid;grid-template-columns:200px minmax(0,1fr);align-items:center;gap:38px;max-width:800px;margin:35px auto 0;text-align:center;}
.son-story-portrait{position:relative;overflow:hidden;aspect-ratio:1/1.25;border:var(--line);background:var(--blue);border-radius:12px;}
.son-story-portrait img{position:absolute;width:210%;max-width:none;height:auto;left:0;bottom:0;}
.son-story-bubble{position:relative;border:var(--line);border-radius:46px;background:#fffdf5;padding:24px 29px;}
.son-story-bubble p{font-size:21px;font-weight:800;line-height:1.5;margin:0;}
.son-story-tail{position:absolute;width:46px;height:54px;left:-45px;top:42%;overflow:visible;}
@media(max-width:650px){
 .son-story-introduction{grid-template-columns:1fr;gap:27px;margin-top:28px;}
 .son-story-portrait{width:170px;justify-self:center;}
 .son-story-bubble{border-radius:36px;padding:24px;}
 .son-story-bubble p{font-size:18px;}
 .son-story-tail{left:calc(50% - 15px);top:-35px;transform:rotate(90deg);width:46px;height:54px;}
 .family-kate-speaker h1.shared-family-message{font-size:15px;padding:17px 22px;}
}

/* One comic panel for the presenter, followed by compact story openings. */
.son-story-introduction{max-width:900px;padding:28px;background:var(--blue);background-image:radial-gradient(#17243118 1px,transparent 1px);background-size:9px 9px;border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink);gap:40px;}
.son-story-portrait{border:3px solid var(--ink);border-radius:0;outline:6px solid #fffdf5;box-shadow:8px 8px 0 #172431;transform:rotate(-2deg);}
.son-story-bubble{border:0;background:transparent;border-radius:0;padding:24px 30px;}
.son-story-bubble p{position:relative;z-index:1;}
#son-bubble-art{position:absolute;overflow:visible;pointer-events:none;}
.story-choice-prompt{margin:30px 0 12px;font-weight:900;font-size:19px;}
.chapter-nav{margin-top:0;gap:14px;}
.chapter-nav a{background:var(--yellow);border:2px solid var(--ink);border-radius:6px;box-shadow:3px 3px 0 var(--ink);font-size:16px;min-height:48px;align-items:center;justify-content:center;padding:11px 18px;}
.chapter-nav a:nth-child(2){background:var(--green);}.chapter-nav a:nth-child(3){background:var(--pink);}.chapter-nav a:nth-child(4){background:var(--blue);}
.chapter-nav a:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink);}
.story{grid-template-columns:1fr;gap:20px;max-width:980px;padding-block:42px;}
.story-copy{text-align:center;}.story-copy h2{font-size:clamp(27px,3.5vw,40px);}.story-copy p{max-width:none;margin:12px 0 0;}
.comic img{box-shadow:3px 3px 0 var(--ink);}.zoom-label{opacity:1;font-size:12px;}
@media(max-width:650px){
 .son-story-introduction{padding:24px 15px 18px;gap:36px;}
 .son-story-portrait{width:165px;}
 .son-story-bubble{padding:22px;}
 .son-story-bubble p{font-size:17px;}
 .story-choice-prompt{font-size:17px;margin-top:29px;}
 .chapter-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
 .chapter-nav a{font-size:15px;padding:10px 9px;}
 .story{padding-block:32px;gap:17px;}.story h2{font-size:29px;}.story p{font-size:16px;}
}

/* Kate introduces the three steps in the same comic-panel style. */
.kate-steps-introduction{background-color:var(--pink);margin:35px 0 0;}
.kate-steps-portrait img{left:auto;right:0;}
.kate-steps-bubble>svg{position:absolute;overflow:visible;pointer-events:none;}

.kate-app-action{margin-top:28px;text-align:center;}

/* A brief static glimpse; the app handles the user's own budget. */
.demo-section.brief-app-preview{display:block;text-align:center;padding-block:40px;}
.brief-app-preview>h2{font-size:clamp(28px,3.5vw,40px);}
.brief-app-preview>p{font-size:16px;margin:12px 0 20px;}
.brief-app-preview .demo-panel{max-width:580px;margin:auto;padding:18px;}
.brief-app-preview .money-panels>div{padding:16px 8px;}
.brief-app-preview .money-panels strong{margin:10px 0 0;}
.brief-app-preview .preview-caption{margin:8px 0 14px;padding:0;font-size:11px;}

.app-elements-heading{font-size:clamp(20px,2.4vw,27px);font-weight:900;text-align:center;margin:34px 0 0;}

.tap-count{display:inline-block;margin-top:12px;padding:6px 10px;background:#fffdf5;border:var(--line);border-radius:6px;font-size:14px;font-weight:800;line-height:1.4;}.tap-count-note{font-size:12px;max-width:680px;margin:24px auto 0;text-align:center;}

.steps{grid-template-columns:repeat(2,minmax(0,1fr));}@media(max-width:650px){.steps{grid-template-columns:1fr;}}

/* Website v33: exact approved app v94 cover lettering and composition. */
.family-hero>.app-masthead{
 width:min(780px,100%);position:relative;isolation:isolate;overflow:hidden;
 text-align:center;padding:24px 15px 38px;border:2px solid #172431;
 box-shadow:2px 2px 0 #172431;line-height:normal;
 background:radial-gradient(circle at 82% 72%,#ffeab3 0,#ffeab3 12%,transparent 44%),linear-gradient(120deg,#ffda55,#ffecab);
}
.app-masthead::before{
 content:"";position:absolute;inset:0;background-image:radial-gradient(#ab542a 1.1px,transparent 1.5px);
 background-size:9px 9px;opacity:.18;pointer-events:none;
}
.app-masthead::after{content:none;display:none;}
.app-masthead>*{position:relative;z-index:1;font-family:'Comic Sans MS','Chalkboard SE','Marker Felt',ui-rounded,system-ui,sans-serif;font-weight:900;}
.app-masthead-kicker,.app-masthead-sub{
 font-size:clamp(1.1rem,5vw,1.55rem);letter-spacing:.015em;color:#173e57;
}
.app-masthead .app-masthead-title{
 position:relative;z-index:2;margin:3px auto;font-size:clamp(2.4rem,11vw,5.7rem);
 line-height:.94;font-weight:900;letter-spacing:.015em;color:#e73d36;
 -webkit-text-stroke:1.3px #172431;text-shadow:3px 4px 0 #fff7df,6px 7px 0 #172431;
 padding:4px 0 8px;display:block;min-height:0;width:auto;max-width:100%;
 transform:none;background:none;clip-path:none;filter:none;font-style:normal;
}
.app-masthead .app-masthead-tag{
 position:relative;z-index:3;display:block;max-width:70%;margin:10px auto 0 10px;
 text-align:left;font-size:clamp(.72rem,2.7vw,.9rem);line-height:1.35;
 padding:0 4px;color:#18364b;letter-spacing:.005em;font-weight:900;
}

/* Agreed annual launch offer; preview remains free until checkout exists. */
.launch-price{max-width:850px;margin:30px auto;padding:22px;background:#fff7df;border:1.5px solid #172431;text-align:center;}
.launch-price h3{font-size:clamp(22px,5vw,32px);line-height:1.25;margin:12px 0;}
.launch-price p{margin:10px 0;font-size:17px;}
.launch-price .launch-price-note{font-size:14px;line-height:1.5;}

/* Native language choice and optional readable comic dialogue. */
.site-header{justify-content:space-between;flex-wrap:wrap;}
.website-language-control{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;}
.website-language-control select{font:inherit;max-width:170px;border:var(--line);border-radius:5px;padding:8px 10px;background:#fffdf5;color:var(--ink);min-height:44px;}
.website-language-control select:focus-visible{outline:3px solid #176a79;outline-offset:4px;}
.comic-language-reading{border:var(--line);background:#fffdf5;padding:14px 18px;margin-top:8px;}
.comic-language-reading summary{font-weight:800;font-size:15px;cursor:pointer;}
.comic-dialogue,.reader-description{white-space:pre-line;line-height:1.6;}
.comic-language-reading .comic-art-note{font-size:12px;margin:14px 0;color:#465565;}
.comic-language-reading .comic-dialogue{font-size:16px;margin:16px 0 0;}
.son-story-bubble p,h1.shared-family-message{overflow-wrap:break-word;}
@media(max-width:650px){.site-header{gap:10px;}.website-language-control{font-size:11px;gap:6px;}.website-language-control select{max-width:116px;padding:8px 5px;}.site-header nav{gap:9px;font-size:11px;flex-wrap:wrap;}.site-header nav .button{font-size:11px;padding:9px;gap:4px;}.chapter-nav a{overflow-wrap:break-word;}.app-masthead-sub{font-size:clamp(1rem,4.6cqw,2rem);}.comic-language-reading{padding:12px;}}

/* Keep the enlarge control clear of the comic's translated bottom caption. */
.comic-open .zoom-label{position:static;width:fit-content;max-width:100%;margin:12px 0 0 auto;opacity:1;}