*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top,#33245f,#17132d 55%);color:#fff;font-family:system-ui,-apple-system,Segoe UI,sans-serif}.app{max-width:980px;margin:auto;padding:24px 16px 60px}header{display:flex;gap:14px;align-items:center;margin:12px 0 24px}.logo{font-size:46px}h1{margin:0;font-size:30px}h2{margin-top:0}h3{margin-bottom:10px}.card,.story{background:#fff;color:#25213b;border-radius:24px;padding:22px;margin:16px 0;box-shadow:0 18px 45px #0003}.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.row{display:flex;gap:14px;margin-top:14px}.row label{flex:1}label{font-weight:650;font-size:14px}input,select{width:100%;padding:13px 42px 13px 13px;margin-top:6px;border:1px solid #cfc6e5;border-radius:12px;font:inherit;background:#faf9fd;color:#25213b}select{appearance:auto;cursor:pointer;min-height:48px}.language-card select{font-weight:700;font-size:16px;background-color:#fff;border:2px solid #8d72d1;box-shadow:0 4px 12px #3b25631a}.language-card select:focus{outline:3px solid #d8ccf2;outline-offset:1px}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.chip{border:1px solid #d8d1eb;background:#faf9ff;color:#40365e;padding:9px 12px;border-radius:999px;cursor:pointer}.chip.active{background:#2f2454;color:white}.primary{width:100%;border:0;border-radius:14px;padding:16px;background:#5c3bbf;color:#fff;font-size:17px;font-weight:750;cursor:pointer}.primary:disabled,.secondary:disabled{opacity:.45;cursor:default}.status{text-align:center;min-height:20px;color:#685d7c}.hidden{display:none}.actions{display:flex;gap:10px;margin-top:18px}.secondary{flex:1;padding:13px;border:1px solid #d8d1eb;background:#faf9ff;border-radius:12px;font-weight:700;cursor:pointer;color:#382b59}.library button{display:block;width:100%;text-align:left;background:none;border:0;padding:10px 0;border-bottom:1px solid #eee;color:#382b59;font-size:16px;cursor:pointer}.muted{color:#777}.error{color:#a22}

/* The story is presented as a real book: words on the left page, picture on the right. */
.story{padding:14px;background:#e8e0cf}.book-shell{max-width:920px;margin:auto;background:#d8cdb8;padding:18px;border-radius:18px;box-shadow:inset 0 0 0 1px #b9ab91}.book-cover-head{display:flex;justify-content:space-between;padding:2px 8px 12px;color:#685a43;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.book{display:grid;grid-template-columns:1fr 1fr;height:600px;border-radius:5px;overflow:hidden;box-shadow:0 15px 35px #0004}.paper{position:relative;background:#fffdf7;color:#302a24;padding:46px 46px 40px;min-width:0;height:600px;overflow:hidden}.left-page{border-right:1px solid #d9d0bf;background:linear-gradient(to right,#fffdf7 0%,#fbf8ee 96%,#e6dfd0 100%)}.right-page{background:linear-gradient(to left,#fffdf7 0%,#fbf8ee 96%,#e6dfd0 100%)}.page-number{position:absolute;top:19px;color:#9a8d79;font-size:12px}.left-page .page-number{left:24px}.right-page .page-number{right:24px}.page-content{height:100%;display:flex;flex-direction:column;justify-content:center;overflow:hidden}.chapter-label{font-family:Georgia,serif;font-size:12px;text-transform:uppercase;letter-spacing:.14em;color:#8d6e45;margin-bottom:16px;flex:0 0 auto}.story-text{font-family:Georgia,'Times New Roman',serif;font-size:18px;line-height:1.55;white-space:pre-line;max-height:472px;overflow:hidden}.story-text.compact-text{font-size:16.5px;line-height:1.47}.story-text.roomy-text{font-size:19px;line-height:1.62}.page-footer{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:#b0a38e;font:12px Georgia,serif}.illustration-frame{height:100%;min-height:0;display:flex;align-items:center;justify-content:center}.illustration-frame img{width:100%;height:100%;max-height:none;object-fit:cover;border-radius:4px}.illustration-placeholder{width:100%;height:500px;border:1px solid #e2d8c5;border-radius:4px;background:radial-gradient(circle at 50% 35%,#fffaf0,#f0e6d4);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;color:#78694f}.illustration-placeholder .moon{font-size:90px;line-height:1;margin-bottom:15px}.illustration-placeholder .stars{font-size:18px;letter-spacing:.18em;margin-bottom:20px}.illustration-placeholder p{font:700 16px Georgia,serif;margin:0 0 8px}.illustration-placeholder small{font:12px Georgia,serif;line-height:1.5;max-width:270px;color:#9a8d79}.book-controls{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:15px 4px 2px}.book-controls .secondary{max-width:160px}.book-controls .turn{width:auto;max-width:180px;margin-left:auto}.page-indicator{color:#685a43;font-size:13px;font-weight:700;text-align:center}.book-shell>.actions{padding:0 4px}.book-shell>.actions .secondary{background:#f6f0e5}
@media(max-width:700px){.app{padding:16px 10px 40px}.grid{grid-template-columns:1fr}.row{flex-direction:column}.book{grid-template-columns:1fr;height:auto;min-height:0}.paper{height:auto;min-height:430px;padding:46px 28px 42px;overflow:visible}.left-page{border-right:0;border-bottom:1px solid #d9d0bf}.right-page{min-height:430px}.illustration-frame,.illustration-placeholder{min-height:360px;height:360px}.illustration-placeholder .moon{font-size:70px}.story-text{font-size:18px;line-height:1.55;max-height:none;overflow:visible}.story-text.compact-text{font-size:17px;line-height:1.5}.story-text.roomy-text{font-size:18.5px;line-height:1.58}.book-controls{grid-template-columns:1fr auto 1fr}.book-controls .secondary,.book-controls .turn{max-width:none;width:100%;font-size:13px;padding:12px 8px}.book-cover-head{font-size:9px}}
.illustration-note{text-align:center;color:#75674f;font:12px Georgia,serif;margin:12px 0 0}.illustration-loading,.illustration-error{width:100%;height:500px;border:1px solid #e2d8c5;border-radius:4px;background:radial-gradient(circle at 50% 35%,#fffaf0,#f0e6d4);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;color:#78694f}.illustration-loading p,.illustration-error p{font:700 17px Georgia,serif;margin:12px 0 7px}.illustration-loading small,.illustration-error small{font:12px Georgia,serif;line-height:1.5;max-width:280px;color:#9a8d79}.spinner{width:34px;height:34px;border:3px solid #d9cdb8;border-top-color:#80643e;border-radius:50%;animation:spin 1s linear infinite}.illustration-error .moon{font-size:70px;line-height:1}.retry-illustration{margin-top:18px;max-width:150px}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:700px){.illustration-loading,.illustration-error{height:360px;min-height:360px}}
.language-card{border:2px solid #d8ccf2;background:linear-gradient(135deg,#fff,#f7f3ff)}
.language-card h2{margin-bottom:10px}
.language-card label{display:block}


/* V16 — illustrated front cover */
.story-cover{max-width:620px;margin:8px auto 4px}.cover-art-wrap{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:10px;background:radial-gradient(circle at 50% 30%,#6f5a98,#251b49 70%);box-shadow:0 18px 38px #0005;border:1px solid #9e8bbd}.cover-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.cover-shade{position:absolute;inset:0;background:linear-gradient(to bottom,#130d2d22 0%,#130d2d10 35%,#130d2daa 100%);pointer-events:none}.cover-copy{position:absolute;z-index:2;left:12%;right:12%;bottom:6%;text-align:center;color:white;text-shadow:0 2px 12px #000b}.cover-kicker{font-size:10px;font-weight:850;letter-spacing:.16em;text-transform:uppercase;margin-bottom:9px}.cover-copy h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(24px,4.2vw,40px);line-height:1.08;margin:0 auto 10px;color:white;max-width:92%;text-wrap:balance}.cover-copy p{font:italic 13px Georgia,serif;margin:0}.cover-loading,.cover-error-box{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;color:#fff;background:radial-gradient(circle at 50% 35%,#564477,#241a48)}.cover-loading p,.cover-error-box p{font:700 18px Georgia,serif;margin:14px 0 7px}.cover-loading small{font:13px Georgia,serif;opacity:.8}.cover-error-box .moon{font-size:70px}.cover-error-box .secondary{margin-top:14px;background:#fff}.cover-begin{max-width:330px;display:block;margin:18px auto 4px}.cover-loading[hidden],.cover-error-box[hidden],.cover-image[hidden]{display:none!important}
@media(max-width:700px){.story-cover{max-width:100%}.cover-copy{left:13%;right:13%;bottom:5%}.cover-copy h2{font-size:clamp(22px,7vw,30px);line-height:1.08;margin-bottom:8px;max-width:96%}.cover-kicker{font-size:8px;margin-bottom:7px}.cover-copy p{font-size:11px}}


/* V18 — parent accounts, cloud child profiles and story library */
.account-card{border:1px solid #d8ccf2}.account-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.account-head h2{margin-bottom:5px}.account-copy{margin:0}.account-badge{flex:0 0 auto;border-radius:999px;padding:7px 11px;background:#f1edf9;color:#5c4b7d;font-size:12px;font-weight:800}.account-badge.online{background:#e8f7ed;color:#23663a}.auth-row{margin-top:16px}.auth-actions{display:flex;gap:10px;margin-top:14px}.auth-actions .primary,.auth-actions .secondary{flex:1}.small-primary{width:auto;padding:13px}.signed-in-as{font-weight:700;margin:14px 0 10px}.sign-out{max-width:180px}.profile-tools{background:#f8f5fd;border:1px solid #e2dbef;border-radius:16px;padding:15px;margin-bottom:16px}.profile-tools label{display:block}.profile-buttons{display:flex;gap:10px;margin-top:10px}.profile-buttons .secondary{flex:1}.profile-status{margin:8px 0 0}.danger-lite{color:#8f2c3d;background:#fff8f9;border-color:#e9c6cd}.library-item{display:grid!important;grid-template-columns:1fr auto;gap:8px;align-items:center}.library-open{border:0!important;text-align:left!important;padding:10px 0!important}.library-delete{width:auto!important;border:1px solid #ead9dd!important;border-radius:9px!important;padding:7px 10px!important;color:#8f2c3d!important;background:#fff9fa!important;font-size:12px!important}.cloud-note{font-size:12px;color:#777;margin-top:6px}.save-feedback{margin-top:8px;text-align:center;color:#5b4e70;font-size:13px}
@media(max-width:700px){.account-head{display:block}.account-badge{display:inline-block;margin-top:10px}.auth-actions,.profile-buttons{flex-direction:column}.sign-out{max-width:none}}

/* V19 — immersive phone book reader. Portrait phones show one physical page at a time. */
.mobile-turn-zone{display:none}
@media(max-width:700px) and (orientation:portrait){
  .story{padding:8px;margin-left:-4px;margin-right:-4px;background:#ded3bf;border-radius:18px}
  .book-shell{padding:9px;border-radius:14px;max-width:100%;overflow:hidden}
  .book-cover-head{padding:0 5px 7px;font-size:8px}
  .book{position:relative;display:block;height:min(72svh,620px);min-height:430px;max-height:620px;overflow:hidden;border-radius:7px;background:#fffdf7;box-shadow:0 12px 30px #0004;touch-action:pan-y}
  .paper{position:absolute;inset:0;width:100%;height:100%;min-height:0;padding:42px 28px 56px;overflow:hidden;border:0!important}
  .left-page,.right-page{display:none}
  .book.show-mobile-text .left-page{display:block}
  .book.show-mobile-image .right-page{display:block}
  .left-page{background:linear-gradient(to right,#fffdf7 0%,#fbf8ee 97%,#eee5d5 100%)}
  .right-page{background:#f7f1e5;padding:17px}
  .page-content{height:calc(100% - 8px);justify-content:center;overflow:hidden}
  .chapter-label{font-size:10px;margin-bottom:11px}
  .story-text,.story-text.compact-text,.story-text.roomy-text{font-size:18px;line-height:1.52;max-height:none;overflow:visible}
  .illustration-frame{width:100%;height:100%;min-height:0}
  .illustration-frame img{width:100%;height:100%;object-fit:cover;border-radius:5px}
  .illustration-loading,.illustration-error,.illustration-placeholder{width:100%;height:100%;min-height:0;border-radius:5px}
  .page-number{top:16px}.left-page .page-number{left:19px}.right-page .page-number{right:19px}
  .page-footer{bottom:15px;font-size:10px;height:16px;line-height:16px;pointer-events:none}
  .mobile-turn-zone{display:block;position:absolute;z-index:6;top:0;bottom:0;width:18%;border:0;background:transparent;padding:0;opacity:0}
  .mobile-turn-left{left:0}.mobile-turn-right{right:0}
  .book-controls{grid-template-columns:1fr auto 1fr;gap:8px;padding-top:10px}
  .book-controls .secondary,.book-controls .turn{font-size:12px;padding:11px 6px;min-height:42px}
  .page-indicator{font-size:12px;white-space:nowrap}
  .illustration-note{display:none!important}
  .book-shell>.actions{padding:0;margin-top:10px}
  .book-shell>.actions .secondary{padding:11px 7px;font-size:12px}
  .story-cover{height:min(70svh,620px);max-width:500px}
  .cover-art-wrap{height:100%;aspect-ratio:auto}
  .cover-begin{margin:10px auto 2px;padding:13px}
}

/* V24 — password recovery */
.auth-link{display:inline-block;margin-top:12px;padding:0;border:0;background:transparent;color:#5d4a83;text-decoration:underline;text-underline-offset:3px;font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.password-recovery{margin-top:18px;padding:16px;border:1px solid #d8ccf2;border-radius:14px;background:#fbf9ff}
.password-recovery h3{margin:0 0 6px}
.password-recovery label{display:block;margin-top:12px}
.password-recovery .primary{margin-top:14px;width:100%}

.child-photo-card{margin:18px 0 6px;padding:18px;border:1px solid #ddd4ef;border-radius:18px;background:linear-gradient(135deg,#fbf9ff,#f5f0ff);display:grid;grid-template-columns:1.3fr .9fr;gap:18px;align-items:center}.child-photo-copy h3{margin:0 0 8px}.child-photo-copy p{margin:0 0 8px;color:#665f73;font-size:14px;line-height:1.5}.photo-privacy{font-size:12px!important;color:#81778e!important}.optional-pill{display:inline-block;margin-left:6px;padding:3px 7px;border-radius:999px;background:#ebe4fa;color:#65528e;font:700 10px system-ui,-apple-system,Segoe UI,sans-serif;text-transform:uppercase;letter-spacing:.06em;vertical-align:middle}.child-photo-controls{display:flex;flex-direction:column;gap:9px}.child-photo-preview{height:150px;border:1px dashed #b9aed3;border-radius:14px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;color:#8c80a5}.child-photo-preview span{font-size:42px;line-height:1}.child-photo-preview small{margin-top:5px}.child-photo-preview img{width:100%;height:100%;object-fit:cover}.photo-buttons{display:flex;gap:8px}.photo-buttons .secondary{padding:10px;font-size:13px}.photo-toggle{display:flex;align-items:center;gap:8px;font-weight:650;color:#493c67}.photo-toggle input{width:auto;margin:0;padding:0;accent-color:#5c3bbf}.photo-status{margin:0;min-height:18px;font-size:12px}.book-photo-badge{display:inline-flex;align-items:center;gap:6px;background:#ede7fa;color:#55447c;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:750;margin-top:8px}
@media(max-width:700px){.child-photo-card{grid-template-columns:1fr}.child-photo-preview{height:190px}}

/* V26 — phone setup is a true swipe deck: no vertical page scrolling. */
.setup-nav,.mobile-step-kicker,.mobile-page-hint{display:none}
.language-inline{margin-top:18px;padding-top:16px;border-top:1px solid #ece7f5}.language-inline h3{margin:0 0 8px}.language-inline label{display:block}
@media(max-width:700px) and (orientation:portrait){
  html,body{height:100%;overflow:hidden;overscroll-behavior:none}
  body{min-height:100dvh}
  .app{height:100dvh;max-width:none;padding:max(10px,env(safe-area-inset-top)) 0 max(6px,env(safe-area-inset-bottom));overflow:hidden;display:flex;flex-direction:column}
  header{flex:0 0 64px;margin:0;padding:4px 18px 8px;gap:10px;align-items:center}
  header .logo{font-size:34px} header h1{font-size:22px} header p{font-size:12px;margin:2px 0 0;opacity:.8}
  .setup-shell{min-height:0;flex:1;display:flex;flex-direction:column;overflow:hidden}
  .setup-track{min-height:0;flex:1;display:flex;gap:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;touch-action:pan-x;padding:0 10px 8px}
  .setup-track::-webkit-scrollbar{display:none}
  .setup-page{position:relative;flex:0 0 calc(100vw - 20px);width:calc(100vw - 20px);height:100%;max-height:100%;margin:0;padding:18px 18px 14px;border-radius:22px;box-shadow:0 10px 30px #0002;overflow:hidden;scroll-snap-align:start;scroll-snap-stop:always}
  .setup-page h2{font-size:25px;line-height:1.12;margin:20px 0 14px}.setup-page h3{font-size:16px;margin:12px 0 8px}
  .mobile-step-kicker{display:block;position:absolute;right:18px;top:15px;color:#8b80a2;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
  .mobile-page-hint{display:block;position:absolute;left:0;right:0;bottom:17px;text-align:center;color:#8b80a2;font-size:12px;font-weight:700}
  .setup-page .grid{grid-template-columns:1fr;gap:10px}.setup-page .row{flex-direction:column;gap:10px;margin-top:4px}
  .setup-page input,.setup-page select{min-height:46px;padding:10px 38px 10px 12px;margin-top:4px}
  .setup-page label{font-size:13px}
  .account-card .account-head{display:block}.account-copy{display:none}.account-card h2{margin-top:18px;margin-bottom:6px}.account-badge{margin:0 0 8px;font-size:11px}
  .auth-row{gap:8px!important}.auth-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}.auth-actions .primary,.auth-actions .secondary{padding:11px 8px;min-height:44px}.auth-link{margin-top:8px;font-size:12px}
  .language-inline{margin-top:10px;padding-top:10px}.language-inline h3{font-size:14px;margin:0 0 5px}.language-inline select{min-height:44px}
  .password-recovery{position:absolute;inset:48px 14px 14px;z-index:20;margin:0;padding:14px;overflow:hidden}.password-recovery .muted{font-size:12px;margin:4px 0}.password-recovery label{margin-top:8px}.password-recovery .primary{margin-top:10px}
  .profile-tools{padding:12px!important;margin-bottom:10px!important}.profile-tools label span{font-size:12px}.profile-buttons{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:8px}.profile-buttons .secondary{padding:10px 8px;font-size:12px}.profile-status{margin:4px 0 0;min-height:16px;font-size:11px}
  .basic-grid{gap:13px!important}.basic-grid input{font-size:18px;min-height:54px}
  .about-grid{gap:8px!important}.about-grid input{min-height:46px}
  .child-photo-card{display:grid;grid-template-columns:1fr 132px;gap:12px;margin:12px 0 0;padding:12px;border-radius:15px;align-items:start}.child-photo-copy h3{font-size:14px;margin:0 0 5px}.child-photo-copy p{font-size:12px;line-height:1.35;margin:0 0 5px}.photo-privacy{font-size:10px!important}.child-photo-controls{gap:6px}.child-photo-preview{height:116px}.child-photo-preview span{font-size:30px}.child-photo-preview small{font-size:9px}.photo-buttons{display:block}.photo-buttons .secondary{width:100%;padding:8px 6px;font-size:11px;margin-bottom:5px}.photo-toggle{font-size:10px;line-height:1.2;gap:5px}.photo-status{display:none}
  .chips{gap:6px;margin:8px 0 14px}.chip{padding:7px 9px;font-size:12px}.setup-page #generate{padding:14px;font-size:15px}.setup-page #status{margin:8px 0 0;font-size:12px;min-height:18px}
  .library{max-height:calc(100% - 70px);overflow:hidden}.library button{padding:12px 4px;font-size:14px}.library-item{min-height:46px}
  .setup-nav{flex:0 0 54px;display:grid;grid-template-columns:54px 1fr 54px;align-items:center;gap:8px;padding:4px 14px calc(4px + env(safe-area-inset-bottom));background:transparent}
  .setup-arrow{height:42px;border:1px solid #ffffff38;border-radius:14px;background:#ffffff18;color:#fff;font-size:28px;line-height:1;cursor:pointer}.setup-arrow:disabled{opacity:.25}
  .setup-dots{display:flex;justify-content:center;gap:7px}.setup-dot{width:7px;height:7px;border:0;border-radius:50%;background:#ffffff55;padding:0}.setup-dot.active{width:18px;border-radius:999px;background:#fff}
  body.story-mode header,body.story-mode .setup-shell{display:none}
  body.story-mode .app{padding:0;height:100dvh}
  body.story-mode #story{display:block!important;position:fixed;inset:0;z-index:50;margin:0;padding:8px;background:#ded3bf;border-radius:0;overflow:hidden}
  body.story-mode .book-shell{height:100%;display:flex;flex-direction:column;padding:8px;overflow:hidden}
  body.story-mode .book-cover-head{flex:0 0 auto}
  body.story-mode .story-cover{height:auto;max-height:none;flex:1;min-height:0;display:flex;flex-direction:column}
  body.story-mode .story-cover .cover-art-wrap{flex:1;min-height:0;height:auto}
  body.story-mode .cover-begin{flex:0 0 auto}
  body.story-mode .book{flex:1;min-height:0;height:auto!important;max-height:none}
  body.story-mode .book-controls{flex:0 0 auto}
  body.story-mode .book-shell>.actions{flex:0 0 auto}
}