@font-face{font-family:DM Sans;src:url('/assets/dm-sans.woff2') format('woff2');font-display:swap;font-weight:100 1000}
:root{font-family:'DM Sans',sans-serif;color:#2c4638;background:#faf9f5;font-synthesis:none;--green:#285a45;--muted:#75816d;--line:#dce2d5;--cream:#fffffa;--soft:#eef3e6;--coral:#d78b6b}
*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}button,a,summary{touch-action:manipulation}button{cursor:pointer;color:inherit}button:disabled{cursor:wait;opacity:.6}a{color:inherit;text-decoration:none}h1,h2,p{margin-top:0}h1,h2{font-family:Georgia,serif;font-weight:400;letter-spacing:-1.5px}h1{font-size:clamp(34px,5vw,52px);line-height:1.15;margin-bottom:18px}h1 em{color:#739065}h2{font-size:29px;line-height:1.2}p{line-height:1.7}input,textarea,select{color:#2c4638}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #92b17e;outline-offset:4px}.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.topbar{height:88px;max-width:1100px;padding:0 40px;margin:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-family:Georgia,serif;font-size:27px;letter-spacing:-.8px;display:flex;align-items:center;gap:9px}.brand img{width:32px;height:32px}.brand span{color:var(--coral);margin-left:-8px}nav{display:flex;gap:8px}.nav-button{background:none;border:0;border-radius:9px;padding:12px 14px;display:flex;gap:8px;align-items:center;font-size:13px;color:#64725e}.nav-button.active,.nav-button:hover{background:var(--soft);color:var(--green)}.saved-count{margin-left:5px;font-size:11px}.saved-count:empty{display:none}main{max-width:1040px;margin:auto;padding:65px 30px 90px;min-height:calc(100dvh - 175px)}footer{max-width:1020px;margin:auto;border-top:1px solid var(--line);padding:23px 20px;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted)}.step-label{font-size:10px;font-weight:650;letter-spacing:2px;display:block;color:#859277;margin-bottom:22px}.lede{color:var(--muted);font-size:15px;line-height:1.8;margin-bottom:32px}
.button{border-radius:9px;min-height:47px;padding:13px 20px;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-weight:500;font-size:13px;line-height:1.4}.primary{background:var(--green);color:#fff}.primary:hover{background:#194632}.secondary{background:var(--cream);border-color:var(--line)}.secondary:hover{background:var(--soft)}.text-button{border:0;background:none;padding:10px 0;min-height:42px;display:inline-flex;align-items:center;gap:7px;color:#6c8060;font-size:12px;text-decoration:underline;text-underline-offset:4px}.icon-button{display:inline-flex;align-items:center;justify-content:center;background:none;border:0;min-height:44px;min-width:44px}.button-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.surface{background:var(--cream);border:1px solid var(--line);padding:32px;border-radius:18px;box-shadow:0 12px 35px #243f3004}
.onboarding{max-width:570px;margin:0 auto;text-align:center;padding:15px 0}.onboarding .step-label{margin-bottom:32px}.onboarding .button-row{justify-content:center}.setup-mark{margin:0 auto 26px;display:grid;place-items:center;width:72px;height:72px;border-radius:22px;background:var(--soft)}.setup-mark img{width:38px;height:38px}.model-label{font-size:12px;color:#66815a;background:var(--soft);border:1px solid var(--line);border-radius:20px;padding:8px 14px;display:inline-block}.setup-progress{margin:30px 0 15px;min-height:80px}.setup-progress progress{display:block;width:100%;height:7px;border:0;appearance:none;border-radius:6px;background:#e6ebde;margin-bottom:14px;overflow:hidden}.setup-progress progress::-webkit-progress-bar{background:#e6ebde}.setup-progress progress::-webkit-progress-value{background:#6e945f;border-radius:6px}.setup-progress progress::-moz-progress-bar{background:#6e945f}.setup-progress strong{font-size:14px}.setup-progress p{font-size:12px;color:var(--muted);margin:8px auto;max-width:440px;overflow-wrap:anywhere}.fine-print{font-size:12px;color:var(--muted);max-width:420px;margin:0 auto 24px}.quiet{font-size:11px;color:#88947c;margin-top:25px}.language-options{display:grid;gap:14px;text-align:left}.language-card{display:flex;gap:18px;align-items:center;padding:24px;border:1px solid var(--line);border-radius:14px;background:var(--cream);text-align:left}.language-card:hover{background:var(--soft);border-color:#8ba57c}.language-symbol{width:54px;height:54px;display:grid;place-items:center;border-radius:12px;background:var(--soft);font-family:Georgia,serif;font-size:26px;color:#6c8a59}.language-card strong{display:block;font-size:19px;margin-bottom:7px}.language-card small{display:block;font-size:12px;color:var(--muted)}.language-card>.icon{margin-left:auto}
.builder{max-width:700px;margin:auto}.builder-intro{text-align:center;margin-bottom:33px}.builder-intro .lede{margin-bottom:0}.form-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:27px}.compact-select{display:flex;align-items:center;gap:8px;color:#6e805f}.compact-select select{width:auto;border:0;background:none;padding:5px 24px 5px 0;font-size:13px;min-height:34px}.private-label{font-size:10px;color:#8b977e}.field-label{display:block;font-size:13px;font-weight:500;margin:16px 0 12px}input:not([type=checkbox]):not([type=range]),textarea,select{display:block;width:100%;background:#fcfcf7;border:1px solid #d6dfcb;border-radius:8px;padding:13px;outline:none;font-size:14px;line-height:1.5}input:focus,textarea:focus,select:focus{border-color:#89a878;box-shadow:0 0 0 3px #8da77c1c}textarea{resize:vertical}textarea::placeholder,input::placeholder{color:#9aa58d}#lesson-topic{font-size:17px;line-height:1.7;background:#f8faf2;padding:19px;min-height:150px}.customize{margin:23px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.customize summary{cursor:pointer;list-style:none;padding:18px 0;display:flex;align-items:center;gap:9px;font-size:12px}.customize summary:after{content:'+';font-size:18px;margin-left:auto}.customize[open] summary:after{content:'−'}.customize summary::-webkit-details-marker{display:none}#spec-summary{font-size:11px;color:#8b957f;margin-left:auto}.custom-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:8px 0 23px}.custom-grid label,fieldset label{font-size:12px;color:#65765c;line-height:1.6}.custom-grid input,.custom-grid select,.custom-grid textarea,fieldset textarea{margin-top:8px}.custom-grid .wide{grid-column:1/-1}.optional{font-size:10px;color:#9aa48e;margin-left:5px}.generate{width:100%;font-size:15px;min-height:53px}.ai-notice{display:flex;align-items:center;gap:8px;font-size:11px;color:#839275;margin-bottom:17px;min-height:18px;overflow-wrap:anywhere}.ready-dot{display:inline-block;width:7px;height:7px;background:#91a879;border-radius:50%}.form-note{font-size:11px;color:#8b957f;line-height:1.7;margin:18px 0 0}.spinner{width:22px;height:22px;border:2px solid #d8e2ca;border-top-color:#608753;border-radius:50%;display:inline-block;animation:spin 1s linear infinite;flex-shrink:0}.spinner.small{width:12px;height:12px}.generation-progress{display:flex;align-items:center;gap:12px;padding:20px 0 0}.generation-progress strong{font-size:12px;display:block}.generation-progress span:not(.spinner){font-size:11px;color:var(--muted)}.generation-progress .text-button{margin-left:auto}.error{padding:15px 18px;border:1px solid #e5c9b8;border-radius:9px;color:#9d654d;background:#f9ece5;font-size:13px;line-height:1.6;margin-top:16px;overflow-wrap:anywhere}.ready{display:flex;align-items:center;justify-content:center;gap:8px}
.page-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:30px}.page-heading .lede{margin-bottom:0}.saved-page{max-width:800px;margin:auto}.saved-toolbar{display:flex;gap:20px;margin-bottom:24px;align-items:center}.saved-toolbar>input{max-width:450px}.saved-toolbar>.menu{margin-left:auto}.saved-lesson{display:flex;gap:18px;align-items:center;border-top:1px solid var(--line);padding:23px 4px}.saved-lesson:last-child{border-bottom:1px solid var(--line)}.lesson-initial{display:grid;place-items:center;background:var(--soft);color:#7d986a;border-radius:12px;width:50px;height:58px;font-family:Georgia,serif;font-size:23px;flex-shrink:0}.saved-info{min-width:0}.saved-info strong{display:block;font-size:17px;font-weight:500;overflow-wrap:anywhere}.saved-info small{display:block;color:var(--muted);font-size:11px;margin-top:9px}.saved-lesson>.icon{margin-left:auto;color:#98a18e}.empty{padding:60px 10px;text-align:center}.empty-icon{display:inline-flex;border-radius:100%;background:var(--soft);padding:20px;margin-bottom:25px}.empty h2{font-size:28px;letter-spacing:-.8px}.empty p{color:var(--muted);font-size:14px}.menu{position:relative}.menu>summary{cursor:pointer;list-style:none;min-height:44px;border:1px solid var(--line);border-radius:9px;background:var(--cream);padding:12px 18px;font-size:12px;display:flex;align-items:center;justify-content:center;gap:8px}.menu>summary:after{content:'⌄'}.menu>div{position:absolute;top:calc(100% + 8px);right:0;min-width:225px;padding:7px;border:1px solid var(--line);border-radius:11px;background:var(--cream);box-shadow:0 12px 35px #18372416;z-index:4}.menu button{border:0;background:none;display:block;text-align:left;width:100%;padding:13px 12px;border-radius:6px;font-size:12px}.menu button:hover{background:var(--soft)}.danger{color:#a6614e}.lesson-reader{max-width:760px;margin:auto}.reader-back{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.save-status{font-size:10px;color:#88977d;display:flex;align-items:center;gap:5px}.save-status .icon{width:14px;height:14px}.warning{color:#a66c4f}.lesson-heading h1{font-size:clamp(32px,5vw,45px);max-width:680px;overflow-wrap:anywhere}.subtitle{color:#7b8d6e;font-size:18px}.reader-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:30px 0 10px}.reader-actions .menu{margin-left:auto}.speech-status{color:#7b8e6a;font-size:12px;min-height:0;line-height:1.6}.speech-status:not(:empty){margin:14px 0}.reader-options{display:flex;gap:20px;align-items:center;flex-wrap:wrap;font-size:11px;color:#7e8b73;border-bottom:1px solid var(--line);padding:10px 0 18px}.reader-options label{display:flex;align-items:center;gap:6px;min-height:36px}.reader-options input{accent-color:var(--green);width:16px;height:16px}.reader-options>.text-button{margin-left:auto}.lesson-line{display:flex;gap:24px;padding:26px 0;border-bottom:1px solid var(--line);break-inside:avoid}.line-number{font-size:11px;color:#9daa8e;padding-top:9px}.line-body{flex:1;min-width:0}.language-line{display:flex;align-items:flex-start;gap:15px}.language-line p{flex:1;font-size:20px;line-height:1.8;margin:0;overflow-wrap:anywhere}.listen-button{border:0;background:transparent;color:#7f966e;border-radius:50%;min-width:42px;min-height:42px;display:grid;place-items:center;padding:10px;flex-shrink:0}.listen-button>span{display:none}.listen-button:hover,.playing{background:#e6efda!important;color:#315a37!important}.listen-button .icon{width:18px;height:18px}.translation{margin-top:12px}.translation summary{cursor:pointer;display:inline-block;color:#93a082;font-size:10px;padding:8px 0;min-height:32px;list-style:none}.translation summary:after{content:' +';margin-left:3px}.translation[open] summary:after{content:' −'}.translation .language-line p{font-size:16px;color:#77876a}.pinyin{font-size:12px;line-height:1.8;color:#9aa58b;margin:6px 0 0}.lesson-end{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:40px}.lesson-end p{font-family:Georgia,serif;font-size:19px;margin:0}.lesson-end span{font:11px 'DM Sans',sans-serif;color:var(--muted)}.editor{max-width:760px;margin:auto}fieldset{padding:20px 0 28px;border:0;border-top:1px solid var(--line);margin:10px 0}fieldset legend{padding-right:15px;font-size:12px;color:#7b8e6b}fieldset label{display:block;margin-bottom:12px}
dialog{border:1px solid var(--line);border-radius:18px;background:var(--cream);width:min(500px,calc(100% - 28px));max-height:calc(100dvh - 40px);padding:25px;color:#48603d;box-shadow:0 20px 80px #192a2a25}dialog::backdrop{background:#324b425e;backdrop-filter:blur(4px)}.modal-header{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;position:sticky;top:-1px;background:var(--cream);padding-bottom:10px}.modal-header h2{font-size:27px;letter-spacing:-.8px;margin:8px 0 10px}dialog p{font-size:13px;color:#7c8d6c}dialog .button-row{margin-top:20px}input[type=range]{display:block;width:100%;margin:18px 0;accent-color:var(--green)}output{float:right}.settings-list{display:grid;gap:10px;margin:15px 0 25px}dialog a{text-decoration:underline}.skip-link{position:fixed;left:15px;top:-70px;background:var(--green);color:white;z-index:20;padding:12px;border-radius:5px}.skip-link:focus{top:10px}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);max-width:calc(100% - 32px);width:max-content;background:#284d3b;color:#fff;padding:15px 24px;font-size:12px;border-radius:10px;opacity:0;pointer-events:none;transition:.2s;z-index:20;box-shadow:0 8px 35px #243b3625;line-height:1.6}#toast.show{opacity:1;transform:translate(-50%,0)}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:600px){.topbar{height:73px;padding:0 20px}.brand{font-size:23px}.brand img{width:28px;height:28px}.nav-button{font-size:11px;padding:10px 9px;gap:5px}.nav-button .icon{width:16px;height:16px}nav{gap:0}main{padding:42px 20px 65px}.step-label{font-size:9px;letter-spacing:1.6px}.lede{font-size:13px;line-height:1.8}.onboarding{padding:5px 0}.setup-card h1{font-size:42px}.language-card{padding:20px 16px;gap:13px}.language-card small{font-size:10px}.language-card strong{font-size:17px}.surface{padding:22px 18px;border-radius:14px}.builder-intro{margin-bottom:27px}h1{font-size:36px}.form-top{margin-bottom:24px}.field-label{font-size:12px}#lesson-topic{font-size:16px;padding:14px;min-height:140px}.customize summary{font-size:11px}.customize summary .icon{width:16px;height:16px}#spec-summary{font-size:9px}.custom-grid{gap:16px}input:not([type=checkbox]):not([type=range]),textarea,select{font-size:16px}.compact-select select{font-size:12px}.private-label{font-size:9px}.page-heading{display:block}.page-heading>.button{margin-top:5px}.saved-toolbar{gap:10px}.saved-toolbar>input{min-width:0;font-size:14px!important}.menu>summary{padding:12px 14px}.saved-info strong{font-size:15px}.saved-lesson{gap:14px}.lesson-initial{width:43px;height:50px;font-size:20px}.lesson-reader{margin:0 -1px}.reader-back{margin-bottom:25px}.save-status{font-size:9px}.lesson-heading h1{font-size:34px}.subtitle{font-size:16px}.reader-actions{gap:7px}.reader-actions>.button{font-size:11px;padding:12px 11px;min-height:44px;gap:6px}.reader-actions>.button .icon{width:16px;height:16px}.reader-actions>.menu{margin-left:0}.reader-options{gap:10px;font-size:10px}.reader-options>.text-button{font-size:10px}.lesson-line{gap:14px;padding:23px 0}.language-line p{font-size:18px;line-height:1.85}.translation .language-line p{font-size:15px}.language-line{gap:5px}.line-number{font-size:9px}.pinyin{font-size:11px}.lesson-end{display:block}.lesson-end .button{margin-top:22px;width:100%}footer{font-size:10px;padding:20px}.form-note{font-size:10px}.fine-print{font-size:11px}.empty{padding:42px 5px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:2s!important;transition:none!important}}
@media print{.topbar,footer,.reader-back,.reader-actions,.reader-options,.speech-status,.listen-button,.lesson-end,.menu,#toast,.skip-link{display:none!important}main{padding:0;max-width:none}.lesson-reader{max-width:none}body{background:white}.translation{display:block}.lesson-line{break-inside:avoid}.lesson-heading h1{font-size:30px}.language-line p{font-size:15px}.translation .language-line p{font-size:13px}}