/* A quiet writing desk. Keep the controls distinct from the printed book. */
.language-switcher{display:inline-flex;align-items:center;gap:7px;border:1px solid #dfe1d5;border-radius:6px;background:#fffdf7;padding:3px 8px;flex-shrink:0}.language-switcher svg{width:17px;height:17px;fill:none;stroke:#78846d;stroke-width:1.35;flex-shrink:0}.language-switcher #ui-language{width:auto;max-width:170px;font-size:11px;padding:6px 2px;border:0;background:transparent}.language-switcher:focus-within{outline:2px solid var(--accent);outline-offset:2px}.language-switcher #ui-language:focus-visible{outline:none}
@media(max-width:740px){body .site-header{height:auto;min-height:72px;flex-wrap:wrap;padding:13px 15px;gap:12px}body .header-actions{margin-inline-start:auto}.language-switcher #ui-language{max-width:150px}}
:root{--bg:#f6f5ef;--ink:#38423a;--muted:#788174;--line:#e0e4d8;--accent:#97583e}
.site-header{height:78px;background:#fbfaf5;padding-inline:32px}.brand{letter-spacing:1px;font-size:24px}.brand small{letter-spacing:1px}.app-shell{grid-template-columns:190px minmax(0,1fr);max-width:1640px}.sidebar{padding:34px 17px}.workspace-label{font-size:10px}.steps{gap:10px}.step{padding:15px 10px;align-items:flex-start;gap:10px;font-size:13px}.step small{font-size:10px;line-height:1.7}.step.active{background:#e9eddf}.step-number{font-size:12px;width:25px;height:25px}.sidebar-note{margin-top:65px;font-size:11px}.local-label{font-size:9px;white-space:normal;line-height:1.9}
main{padding:34px 38px 0}.intro{padding-bottom:27px;align-items:flex-end}.intro h1{font-size:32px;line-height:1.45;letter-spacing:0;margin-bottom:11px}.intro p{font-size:13px;color:#7d8477}.eyebrow{font-size:10px;letter-spacing:2px;margin-bottom:13px}.edition small{font-size:8px}.workspace{grid-template-columns:minmax(360px,1fr) minmax(400px,1.12fr);gap:32px;padding-top:28px}.ai-composer{padding:25px;background:#fffdf8;border:1px solid #dfe3d5;box-shadow:0 5px 25px #47543904;border-radius:12px;margin:0 0 25px}.ai-heading{align-items:flex-start;flex-wrap:wrap;gap:10px}.ai-heading h2{font-size:25px;line-height:1.4;margin-top:8px}.ai-heading .section-index{font-size:9px}.ai-spark{display:none}.agent-chip{font-size:9px;line-height:1.6;white-space:normal;max-width:100%;margin:0;margin-inline-start:auto;padding:5px 9px}.ai-intro{font-size:12px;line-height:1.9;color:#7b8376;margin-top:16px}.source-modes{gap:8px;padding:4px;border:0;background:#f0f2e9;border-radius:7px;margin-top:21px}.source-modes button{flex:1;padding:9px 6px;border:0;border-radius:5px;font-size:12px}.source-modes button[aria-selected=true]{background:#fffefa;box-shadow:0 1px 5px #3a472312;color:#6a4635}.editor label:not(.upload-area):not(.audio-upload):not(.import-label){font-size:12px;color:#56624f}.editor input,.editor select{min-height:44px;border-radius:6px}.editor textarea{border-radius:7px}#ai-source{min-height:192px;font:17px/1.85 var(--serif);padding:16px;background:#fffefb;border-color:#d9dece}#ai-source::placeholder{font-size:15px;color:#a2a494}.source-tools{gap:17px}.source-tools button,.source-tools label{font-size:11px}.compose-options{border-top:1px solid var(--line);margin-top:23px;padding-top:15px;color:#858c7d;font-size:11px}.compose-options>summary{cursor:pointer;line-height:1.7}.illustration-preferences{margin-top:8px;padding-top:0;border:0}.ai-actions{flex-direction:column;align-items:stretch;gap:8px;margin-top:22px}.ai-actions .button{min-height:46px;font-size:13px;justify-content:space-between;padding-inline:18px}.ai-working:empty{display:none}.ai-working{font-size:12px;color:#6c795e}.direct-save{margin-top:9px;font-size:11px;white-space:normal;text-align:start;color:#7b826f}.ai-privacy{font-size:10px;color:#949888;line-height:1.8;margin-top:20px}.connection-note{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0 0;font-size:10px;line-height:1.8;color:#a06b4a}.connection-note.connected{color:#87907d}.connection-note.connected:before{content:'';width:5px;height:5px;border-radius:50%;background:#8f9b7b;flex-shrink:0}.connection-note .text-button{font-size:10px}.working-note{display:none;font-size:11px;line-height:1.8;color:#7c8872}.is-generating .working-note{display:block}.is-generating .ai-working:before{content:'';display:inline-block;width:8px;height:8px;border:1px solid #c1cbb4;border-top-color:#677b54;border-radius:50%;margin-inline-end:8px;animation:studio-spin 1s linear infinite}@keyframes studio-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.is-generating .ai-working:before{animation:none}}
.preview-column{top:24px}.preview-toolbar{padding:5px 0 15px}.preview-kind{font-size:11px;color:#78846a;display:flex;align-items:center;gap:8px}.preview-kind:before{content:'';width:5px;height:5px;border-radius:50%;background:#839775}.preview-kind.is-draft{color:#a16c42}.preview-kind.is-draft:before{background:#b7824e}.book-stage{min-height:430px;padding:52px 25px 45px;border-radius:10px;background-color:#eaede3;background-image:radial-gradient(#a5af9130 .7px,transparent .7px)}.stage-note{font-size:8px;color:#97a18a}.spread{transform:rotate(-.8deg)}.book-page{padding:10% 10% 11%}.book-page h3{line-height:1.55;font-size:clamp(17px,1.6vw,24px)}.book-right .story-preview-body{font-size:clamp(11px,.94vw,14px);line-height:2;top:19%;bottom:16%;margin:0}.story-preview-heading{font-size:7px;letter-spacing:1px}.book-doodle{width:76%;max-height:64%;margin:15px auto 0}.book-page.has-doodle:not(.has-photo) .sample-label{font-size:6px;margin-top:7px}.preview-truncation{font-size:6px;bottom:11%}.page-number{font-size:7px;bottom:5%}.preview-navigation{padding:17px 0;gap:19px}.preview-navigation>span{font-size:10px;max-width:75%;min-width:0}.preview-bottom{font-size:9px;line-height:1.8;padding-bottom:16px}.book-outline{padding-top:24px}.outline-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;color:#7d8872;margin-bottom:11px}.outline-heading .text-button{font-size:10px}#outline-pages{max-height:230px;overflow:auto;scrollbar-width:thin;display:flex;flex-direction:column;gap:3px}.outline-page{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:6px;border:1px solid transparent;text-align:start;font-size:12px;line-height:1.6}.outline-page.selected{background:#fcfbf5;border-color:#dce0d2}.outline-page>span[data-user-content]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.outline-number{font:11px Georgia,serif;color:#a5aa98;min-width:16px}.outline-page small{font-size:10px;color:#9da38f}.panel-heading{margin:3px 0 24px}.panel-heading h2{font-size:27px;line-height:1.5}.panel-heading p{line-height:1.9}.full-story-record{border-top:1px solid var(--line);padding:15px 0;margin-top:8px;font-size:11px;color:#7c8971}.full-story-record>summary{cursor:pointer}.full-story-record .source-record{margin-top:14px}.story-label textarea{font-size:16px!important;font-family:var(--serif)}.page-edit{margin-top:20px;border-top:0;padding-top:0}.page-edit>summary{display:none}.page-edit textarea{font-size:18px!important;line-height:1.95}.layout-picker{border:0;padding:0;margin:23px 0 0;min-width:0}.layout-picker legend{font-size:11px;color:#7b866e;margin-bottom:10px}.layout-picker>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.layout-picker button{border:1px solid #dce1d2;border-radius:6px;padding:10px 6px;display:flex;flex-direction:column;align-items:center;gap:8px;font-size:10px;line-height:1.5}.layout-picker button[aria-pressed=true]{background:#edf0e5;border-color:#a7b295;color:#587044}.layout-icon{display:block;width:25px;height:30px;border:1px solid #b8bfab;position:relative;background:#fffdf5}.layout-icon:before{content:'';position:absolute;inset:5px;background:repeating-linear-gradient(#acb59e 0 1px,transparent 1px 4px)}.layout-icon-classic:before{inset:15px 5px 4px}.layout-icon-classic:after,.layout-icon-photo:after{content:'';position:absolute;top:4px;left:5px;right:5px;height:8px;background:#d4dcc8}.layout-icon-photo:after{height:15px}.layout-icon-photo:before{inset:22px 5px 4px}.new-day-action{font-size:11px}.story-tabs{max-height:150px;overflow:auto}.prompt-box{display:none}.editor-footer{border-top:1px solid var(--line);margin-top:18px;padding-top:22px;font-size:9px}.editor-footer button{font-size:12px}.upload-area{min-height:90px}.upload-area strong{font-size:12px}.upload-area small{font-size:9px}.main-footer{font-size:9px;line-height:1.8}
/* Layout choices affect both the desk preview and the exported book. */
.book-preview[data-layout=letter] .book-left .book-doodle{width:47%;margin-top:25px}.book-preview[data-layout=letter] .book-left .photo-frame{transform:none;box-shadow:none;background:transparent}.book-preview[data-layout=letter] .book-left .photo-frame:before{display:none}.book-preview[data-layout=letter] .book-right .story-preview-body{background:repeating-linear-gradient(transparent 0 1.92em,#c1c1aa33 1.92em 2em);line-height:2}.book-preview[data-layout=photo] .photo-frame{margin-top:12px;padding:4px 4px 12px;transform:rotate(-1deg)}.book-preview[data-layout=photo] .photo-frame img{aspect-ratio:.85}.book-preview[data-layout=photo] .has-photo .book-doodle{width:21%;height:20%;bottom:4%}.memory-page.layout-letter .page-art{justify-content:flex-end;margin-bottom:0}.memory-page.layout-letter .page-art .page-doodle{width:65px;max-height:85px}.memory-page.layout-letter .page-art .full-photo{width:35%;max-height:40mm}.memory-page.layout-letter .page-story{padding:10px 0;background:repeating-linear-gradient(transparent 0 1.98em,#c1c1aa33 1.98em 2.05em)}.memory-page.layout-photo .page-art{display:block;position:relative}.memory-page.layout-photo .page-art .full-photo{width:100%;max-height:95mm}.memory-page.layout-photo .page-art:has(.full-photo) .page-doodle{position:absolute;width:65px;height:90px;bottom:-10px;inset-inline-end:-12px;transform:rotate(8deg)}
@media(min-width:1600px){.book-stage{min-height:520px}.workspace{gap:42px}.book-right .story-preview-body{font-size:14px}}
@media(max-width:1200px){.app-shell{grid-template-columns:160px minmax(0,1fr)}main{padding:28px 25px 0}.sidebar{padding-inline:10px}.step{font-size:12px;padding-inline:7px;gap:8px}.step small{font-size:9px}.workspace{grid-template-columns:minmax(320px,1fr) minmax(320px,1fr);gap:23px}.ai-composer{padding:21px}.intro h1{font-size:28px}.book-stage{padding-inline:19px;min-height:410px}.book-page h3{font-size:18px}}
@media(max-width:1000px){.app-shell{grid-template-columns:1fr}.sidebar{padding:8px 20px}.steps{gap:8px;justify-content:space-between}.step{align-items:center;padding:10px 12px}.workspace{grid-template-columns:minmax(310px,1fr) minmax(320px,1fr)}.book-stage{min-height:400px}}
@media(max-width:740px){.site-header{height:72px;padding:0 15px}.brand{font-size:19px}.brand small{font-size:8px}.header-actions .button{padding:8px;font-size:10px}#ui-language{width:80px}.sidebar{padding:7px 9px}.steps{gap:3px}.step{flex:1;justify-content:center;flex-direction:column;gap:5px;padding:7px 3px;font-size:10px;line-height:1.5}.step-number{width:auto;height:auto;border:0;font-size:10px}.step.active .step-number{border:0}.step>span:last-child{max-width:100%;overflow-wrap:anywhere}.step small{display:none}main{padding:25px 17px 0}.intro{padding-bottom:22px}.intro h1{font-size:27px;line-height:1.5}.intro p{font-size:12px;max-width:none}.eyebrow{font-size:8px}.workspace{display:flex;gap:25px;padding-top:23px}.ai-composer{padding:20px 17px}.ai-heading h2{font-size:24px}.agent-chip{font-size:8px}.ai-heading>div{flex:1 1 200px}.ai-intro{font-size:12px}#ai-source{min-height:190px;font-size:18px}.field-row{gap:10px}.ai-actions .button{font-size:13px}.preview-column{padding-top:20px}.book-stage{min-height:0;padding:48px 20px 38px}.book-page h3{font-size:clamp(14px,4.1vw,22px)}.book-right .story-preview-body{font-size:clamp(9px,2.5vw,12px)}.book-doodle{width:76%;margin-top:10px}.book-outline{padding-top:20px}.main-footer{flex-wrap:wrap;font-size:9px}.header-actions{gap:6px}.panel-heading h2{font-size:26px}.editor-footer{flex-wrap:wrap;gap:15px}.editor-footer button{margin-inline-start:auto}.preview-bottom{font-size:8px}.ai-privacy{font-size:10px}html[dir=rtl] .intro h1{font-size:30px}html[dir=rtl] .step{font-size:12px}html[dir=rtl] .ai-heading h2{font-size:27px}.book-page[data-story-lang=ar] .story-preview-body{font-size:clamp(11px,3vw,15px);line-height:1.8}}
