:root{--ink:#504159;--secondary:#87748c;--lavender:#9568a3;--soft:#eee2f4;--pink:#f6e0e9;--paper:#fffcfc;--line:#eadfea;--mint:#e8f2ec;--green:#52745f;--background:#fbf3f7}
*{box-sizing:border-box}body{margin:0;color:var(--ink);background:#f0e7ef;font:15px/1.7 'Yuanti SC','Hiragino Maru Gothic ProN','PingFang SC',sans-serif}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--lavender);outline-offset:3px}[hidden]{display:none!important}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}.icon{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.app{max-width:480px;min-height:100dvh;margin:auto;background:var(--background);box-shadow:0 0 70px #68516a0d}.appbar{display:flex;justify-content:space-between;align-items:center;padding:calc(16px + env(safe-area-inset-top)) 22px 12px;background:var(--background)}.wordmark{display:flex;gap:10px;align-items:center;font-weight:600;font-size:16px}.wordmark small{display:block;font-weight:400;font-size:11px;color:var(--secondary);letter-spacing:.4px}.brand-flower{font-size:31px;color:#b28ebd;line-height:1}.mini-avatar{border-radius:50%;border:3px solid var(--paper);outline:1px solid #d9c2dc;object-fit:cover}.prototype-note{margin:0 22px;padding:5px 10px;background:#f4ecd9;color:#8b7450;font-size:11px;border-radius:7px;letter-spacing:.3px}.prototype-note span{opacity:.9}main{padding:0 22px calc(110px + env(safe-area-inset-bottom))}.view{padding-top:21px}.page-intro{margin-bottom:20px}.eyebrow{font-size:11px;letter-spacing:.9px;color:#9b7aa5}h1{font-size:27px;font-weight:600;line-height:1.5;letter-spacing:.2px;margin:7px 0 0}h1 span{color:#b894bb;font-weight:400}h2{font-size:17px;line-height:1.5;margin:0;font-weight:600}p{margin:0}.page-intro p{color:var(--secondary);font-size:13px;margin-top:7px}.teacher-card{display:flex;align-items:center;gap:12px;justify-content:space-between;background:#eee3f4;border:1px solid #e0cee8;border-radius:22px;padding:19px 18px;position:relative}.teacher-card:before{content:'✦';position:absolute;top:-12px;right:22px;color:#b392bd;font-size:23px;transform:rotate(14deg)}.teacher-name{font-size:13px;font-weight:600}.teacher-name i{font-size:9px;font-style:normal;font-weight:400;margin-left:6px;background:#faf5fc;padding:3px 7px;border-radius:20px;color:#8a6e99;white-space:nowrap}.teacher-copy p{margin:10px 0 7px;font-size:15px;line-height:1.8}.quiet{font-size:11px;color:#927b9e}.teacher-avatar{width:90px;height:90px;object-fit:cover;border-radius:50%;border:5px solid #fff9ff;box-shadow:3px 4px 0 #ddcce5;transform:rotate(5deg);flex-shrink:0}.photo-entry{display:flex;align-items:center;text-align:left;width:100%;padding:18px 17px;border:0;border-radius:20px;background:#688c7b;color:#fffaf7;gap:12px;margin-top:18px;box-shadow:0 4px 0 #547562}.camera-bubble{height:43px;width:43px;display:grid;place-items:center;background:#ffffff21;border-radius:14px;flex-shrink:0}.photo-entry strong{font-size:17px;display:block;font-weight:600}.photo-entry small{display:block;font-size:11px;color:#f1f6f0;margin-top:3px}.photo-entry .arrow{margin-left:auto;width:19px}.sample-entry{border:0;background:none;padding:17px 2px;display:flex;justify-content:space-between;width:100%;gap:10px;color:#9b7ca7;font-size:12px;text-align:left}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:15px 0 13px}.text-button{border:0;background:transparent;color:#a383af;padding:8px 0;font-size:11px;min-height:40px}.count-row{display:flex;gap:9px;margin-bottom:12px}.count-row>span{padding:4px 11px;border-radius:20px;background:#f1e9f4;font-size:11px;color:#8a7195}.count-row strong{margin-left:5px;font-weight:600}.empty-card{background:var(--paper);border:1px dashed #e1d0e6;border-radius:17px;padding:21px 17px;text-align:center;color:#9e89a5;font-size:12px}.empty-card strong{display:block;color:#806c89;font-size:14px;font-weight:500;margin-bottom:5px}.empty-symbol{display:inline-block;background:#f4edf7;color:#b49abd;width:36px;height:36px;border-radius:13px;font-size:22px;margin-bottom:10px}.empty-card .text-button{display:block;margin:4px auto 0;padding:4px 0;min-height:34px}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,480px);z-index:5;display:grid;grid-template-columns:repeat(4,1fr);background:#fffcfcee;border-top:1px solid #eadfea;padding:10px 10px calc(10px + env(safe-area-inset-bottom));backdrop-filter:blur(16px)}.bottom-nav button{border:0;background:none;color:#aa95b1;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;min-height:51px;border-radius:14px;font-size:10px}.bottom-nav button[aria-current=page]{background:#f0e4f6;color:#90639f}.bottom-nav .icon{width:22px;height:22px}.row{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.button{border:1px solid #decbe3;border-radius:13px;background:var(--paper);color:#876493;font-size:13px;padding:10px 17px;min-height:44px;line-height:1.5}.button.primary{background:var(--lavender);border-color:var(--lavender);color:#fffaff;box-shadow:0 3px 0 #795585}.button.soft{background:#f1e7f6}.button.full{width:100%;margin-top:15px}.button.compact{padding:8px 12px;font-size:12px;white-space:nowrap}.upload-zone{text-align:center;background:var(--paper);padding:28px 18px;border:1.5px dashed #ceb4d8;border-radius:22px}.upload-zone .row{justify-content:center;margin-top:18px}.upload-icon{display:grid;place-items:center;width:58px;height:58px;border-radius:20px;background:#f2e8f7;margin:0 auto 13px;color:#b297bd}.upload-icon .icon{width:31px;height:31px}.upload-zone p{font-size:12px;color:#9b87a4;margin-top:8px}.info-note{display:flex;align-items:flex-start;gap:9px;background:#f8efd9;padding:12px 14px;margin:17px 0;border-radius:12px;font-size:11px;color:#8f7a58}.info-note>span{font-size:17px;line-height:1.4}.flow-preview{display:flex;align-items:center;justify-content:center;gap:14px;font-size:11px;color:#a18aac;margin:24px 0 9px}.flow-preview b{font-weight:400;color:#c4adc9}.photo-frame{border:1px solid var(--line);background:var(--paper);border-radius:19px;padding:8px;display:grid;place-items:center;min-height:150px}.photo-frame img{max-width:100%;max-height:360px;display:block;border-radius:12px;object-fit:contain}.photo-tools{justify-content:space-between;padding:4px 3px;font-size:11px;color:var(--secondary)}#photo-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:65%}.field-label{display:block;font-size:12px;font-weight:500;margin:16px 0 7px}.field-label span{margin-left:7px;color:#ae98b5;font-size:10px;font-weight:400}input:not([type=file]),textarea,select{display:block;width:100%;background:var(--paper);border:1px solid #ddcce3;color:var(--ink);padding:11px 12px;border-radius:11px;font-size:16px;max-width:100%}textarea{resize:vertical;min-height:70px}::placeholder{color:#b3a0ba;font-size:12px}.error-message{padding:12px 14px;color:#a15463;background:#fae6e9;font-size:12px;border-radius:12px;margin-top:13px}.filter-row{display:flex;gap:8px;margin:21px 0 17px}.filter-row button{padding:8px 10px;flex:1;border:1px solid #eadfea;background:var(--paper);color:#947b9e;white-space:nowrap;border-radius:11px;font-size:11px;min-height:42px}.filter-row button[aria-pressed=true]{background:#e9ddef;color:#866291;border-color:#cfb6d8}.filter-row span{padding-left:3px}.record-card,.task-card{padding:17px;background:var(--paper);border:1px solid #e6d8ea;border-radius:17px;margin-bottom:12px}.record-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:9px}.pill{background:#f1e9f5;color:#9c81a6;font-size:9px;padding:2px 8px;border-radius:20px}.pill.mastered{background:#e9f3ec;color:#66846e}.record-card h3,.task-card h3{margin:0;font-size:15px;font-weight:500;line-height:1.5}.record-card p{font-size:11px;color:#a18cab;margin:5px 0 11px}.record-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:10px;border-top:1px solid #f0e6f2}.record-actions .button{font-size:11px;padding:7px 11px;min-height:37px}.mastery-button{border:0;background:transparent;font-size:11px;color:#8d7399;min-height:38px;padding:5px}.storage-note{text-align:center;font-size:10px;color:#b29cba;margin-top:21px}.task-heading{display:flex;justify-content:space-between;align-items:center;gap:9px;margin-bottom:18px}.task-heading>span{font-size:11px;color:#9a82a4}.task-card{display:flex;gap:12px;align-items:flex-start}.task-card .task-check{height:24px;width:24px;min-width:24px;border:1.5px solid #d6bedf;background:#fbf7fc;border-radius:8px;color:#8d689c;margin-top:1px;padding:0;font-size:14px}.task-card.completed .task-check{background:#e8f1e9;border-color:#9fc0a7;color:#66886e}.task-card.completed h3{text-decoration:line-through;color:#ad99b5}.task-card p{font-size:11px;color:#9d85a7;margin-top:6px;white-space:pre-wrap;overflow-wrap:anywhere}.task-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}.task-meta span{font-size:9px;padding:2px 7px;background:#f3edf5;border-radius:7px;color:#a18baa}.task-link{border:0;background:none;color:#9a7ba5;font-size:11px;min-height:34px;padding:7px 0}.back-button{display:flex;align-items:center;gap:4px;background:none;border:0;color:#9b7aa6;font-size:12px;padding:4px 0 12px}.back-button .icon{width:18px;height:18px}.lesson-teacher{display:flex;gap:10px;align-items:center;margin:9px 0 13px}.lesson-teacher img{border-radius:50%;border:3px solid var(--paper);outline:1px solid #dcc6e1}.lesson-teacher strong{font-size:13px;font-weight:500;display:block}.lesson-teacher div>span{font-size:10px;color:#a086a9}.sample-tag{margin-left:auto;font-size:10px;background:#ece0f3;border-radius:8px;padding:4px 8px;color:#9776a2}.lesson-note{margin:10px 0 20px}.save-panel{padding:19px 17px;background:#efe4f5;border:1px solid #e1cfe9;border-radius:17px;margin-top:20px}.save-panel strong{font-size:14px;font-weight:500}.save-panel p{font-size:11px;color:#a086ad;margin:4px 0 13px}.save-panel .button{font-size:12px;padding:10px 13px}#lesson-frame{border:0;width:100%;height:850px;display:block}dialog{border:0;max-width:480px;width:100%;inset:auto 0 0;margin:0 auto;border-radius:24px 24px 0 0;padding:24px 24px calc(24px + env(safe-area-inset-bottom));background:var(--background);color:var(--ink);max-height:90dvh;overflow:auto;box-shadow:0 -8px 60px #67466915}dialog::backdrop{background:#4d354559;backdrop-filter:blur(4px)}.dialog-heading{display:flex;align-items:flex-start;justify-content:space-between}.dialog-heading h2{margin-top:6px}.close-button{border:0;background:#eee1f4;color:#aa89b5;border-radius:50%;height:31px;min-width:31px;font-size:23px;line-height:1}.toast{position:fixed;left:50%;bottom:calc(94px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:20;max-width:calc(100% - 44px);white-space:normal;text-align:center;background:#69536fea;color:#fff9ff;font-size:12px;border-radius:13px;padding:12px 20px;box-shadow:0 4px 25px #73527f20}.muted{color:#a087ab}.home-task{padding:14px 16px;background:var(--paper);border:1px solid var(--line);border-radius:14px;margin-bottom:8px;font-size:12px;display:flex;gap:10px;align-items:center}.home-task .dot{height:7px;width:7px;border-radius:50%;background:#c2a5ca;flex-shrink:0}.home-task span:last-child{margin-left:auto;color:#b39bbb;font-size:10px}.record-card .home-title{font-size:13px}.home-review-card{cursor:pointer}.teacher-name i,.quiet{max-width:100%}
@media(max-width:360px){main{padding-left:16px;padding-right:16px}.appbar{padding-left:16px;padding-right:16px}.prototype-note{margin-left:16px;margin-right:16px}h1{font-size:24px}.teacher-card{padding:15px 13px;gap:8px}.teacher-avatar{width:70px;height:70px}.teacher-name i{display:none}.teacher-copy p{font-size:14px}.quiet{font-size:10px}.photo-entry{padding:16px 13px;gap:9px}.photo-entry small{font-size:10px}.filter-row{gap:5px}.filter-row button{padding:8px 6px}.wordmark{font-size:15px}.task-heading{flex-wrap:wrap}.sample-entry{font-size:11px}.flow-preview{gap:9px}.button{padding:10px 14px}}
@media(prefers-reduced-motion:no-preference){.button,.photo-entry,.bottom-nav button{transition:background .15s,transform .15s}.button:active,.photo-entry:active{transform:translateY(2px)}}
.account-button{background:#eee2f4;color:#956ea3;border:1px solid #e0cce8;border-radius:20px;padding:5px 13px;min-height:36px;font-size:11px}
.task-advice{background:#eee3f4;border:1px solid #dfcbe7;border-radius:19px;padding:17px;margin:0 0 23px}.advice-heading{display:flex;align-items:center;gap:8px;font-size:11px;color:#9b7aa5;margin-bottom:13px}.advice-heading img{border:2px solid var(--paper);border-radius:50%}.task-advice h2{font-size:15px}.task-advice p{font-size:12px;color:#8f739d;margin-top:8px}.task-advice small{display:block;color:#a98ab4;font-size:9px;margin-top:10px}.account-copy{font-size:13px;color:#9b80a6;margin:19px 0}.sync-status{background:#f7eeda;border-radius:14px;padding:16px;color:#937a51}.sync-status strong{font-size:12px;font-weight:500}.sync-status p{font-size:11px;margin-top:6px}
.welcome{max-width:480px;min-height:100dvh;margin:auto;padding:36px 32px calc(32px + env(safe-area-inset-bottom));background:var(--background);background-image:radial-gradient(#ead6e5 .8px,transparent .8px);background-size:22px 22px;text-align:center;display:flex;flex-direction:column;align-items:center}.welcome-brand{font-size:14px;font-weight:500;letter-spacing:1px}.welcome-tag{font-size:10px;background:#e8f1e9;color:#7d9985;padding:3px 13px;border-radius:20px;margin-top:12px}.welcome-teacher{margin:29px 0 13px;position:relative}.welcome-teacher:after{content:'✦';position:absolute;right:-13px;top:24px;color:#ad8abb;font-size:28px;transform:rotate(13deg)}.welcome-teacher img{display:block;border-radius:50%;border:8px solid var(--paper);outline:2px solid #d6b9df;box-shadow:5px 6px 0 #e6d2ed;transform:rotate(3deg)}.welcome-teacher figcaption{display:inline-block;background:#ebdff2;font-size:11px;color:#9471a3;padding:3px 15px;border-radius:7px;margin-top:17px;transform:rotate(-4deg)}.welcome h1{font-size:29px;line-height:1.5;margin-top:5px}.welcome>p{font-size:12px;color:#9b81a6;margin-top:12px}.welcome form{text-align:left;width:100%;margin-top:21px}.welcome form input{text-align:center;background:#fffafd;letter-spacing:1px}.welcome .full{min-height:48px}.welcome-foot{font-size:10px;color:#b29abc;margin-top:auto;padding-top:30px;letter-spacing:.3px}
.recognized-question{padding:17px;background:var(--paper);border:1px dashed #d9c3e1;border-radius:14px;font-size:13px;overflow-wrap:anywhere}.recognized-question ol{padding-left:22px;margin:13px 0 0}.recognized-question li{padding:5px 0}.photo-tools #photo-name{flex:1;max-width:none;min-width:60px}
.candidate-choices{display:flex;flex-wrap:wrap;gap:8px}.candidate-hint{width:100%;font-size:12px;color:#9a76a6}.button[aria-pressed=true]{background:#e8d9f0;border-color:#b997c7;color:#795488}.ai-question{background:#eee3f4;border:1px dashed #ceb4d8;border-radius:15px;padding:15px;font-size:13px;overflow-wrap:anywhere}.ai-question h2{font-size:15px;margin:10px 0}.ai-question details{margin-top:13px;color:#9b7aa5;font-size:11px}.ai-question img{display:block;max-width:100%;border-radius:9px;margin-top:10px}.ai-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:18px 0}.ai-steps .button{font-size:11px;padding:9px 7px}.ai-equations{background:var(--paper);border:1px solid var(--line);border-radius:13px;padding:13px;margin:15px 0;font-size:13px;overflow-wrap:anywhere}.ai-equations>div{padding:6px 0}.ai-conclusion{padding:12px 14px;background:#f8efda;color:#8b714a;border-radius:12px;font-size:12px;margin:15px 0}#ai-step-content>h3{font-size:18px;margin:0 0 12px}#ai-step-content>p{font-size:14px;white-space:normal;overflow-wrap:anywhere}.ai-quiz{border:1px solid #e2cfe9;border-radius:15px;background:#f2e8f6;padding:15px;margin-top:20px}.ai-quiz strong{font-size:12px;font-weight:500}.ai-quiz p{font-size:13px;margin:10px 0}.quiz-options{display:grid;gap:8px}.quiz-options .button{text-align:left;background:var(--paper)}.quiz-options .button[aria-pressed=true]{background:#e8d9f0}.quiz-feedback{background:#fcf4e3;padding:10px 12px;border-radius:9px;color:#927951}.ai-answer{background:#e8f2eb;border-radius:14px;padding:16px;margin:18px 0;display:grid;gap:8px;color:#597b62}.ai-answer>span{font-size:11px}.ai-answer strong{font-size:20px;font-weight:500;overflow-wrap:anywhere}.ai-option-analysis{display:flex;flex-wrap:wrap;gap:8px}.ai-option-analysis .button{font-size:11px;padding:8px 11px}.ai-option-analysis p{width:100%;font-size:13px;background:#f4eaf8;padding:13px;border-radius:11px}.ai-verification{font-size:11px;color:#9b80a6;margin:20px 0;overflow-wrap:anywhere}.ai-pagination{display:flex;align-items:center;justify-content:space-between;margin-top:22px;gap:10px}.ai-pagination>span{font-size:11px;color:#a284ad}#ai-numberline{margin:20px 0;padding:16px 14px;background:var(--paper);border:1px solid var(--line);border-radius:15px}#ai-parameter{accent-color:var(--lavender);border:0;padding:0;margin:12px 0;height:26px}#ai-parameter-result{font-size:13px;color:#946ca2}#ai-numberline-svg{width:100%;height:100px;display:block}#ai-numberline-svg text{font-size:12px;fill:var(--secondary)}#ai-condition-list>div{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:12px}#ai-condition-list b{font-size:10px;font-weight:500;white-space:nowrap}.condition-pass{color:#66886f}.condition-fail{color:#ae7383}.katex{font-size:1.08em}.katex-display{margin:.6em 0;max-width:100%;overflow-x:auto;overflow-y:hidden;padding:4px 0}#generated-lesson .katex-display>.katex{text-align:left}.lesson-teacher div{min-width:0}.lesson-teacher div>span{display:block;overflow-wrap:anywhere}.lesson-teacher .sample-tag{white-space:nowrap}

/* Keep each calculation readable on a phone. */
.ai-equations{display:grid;gap:10px;padding:0;border:0;background:transparent;margin:18px 0;font-size:15px}
.equation-card{min-width:0;padding:15px 16px;background:var(--paper);border:1px solid var(--line);border-radius:14px}
.equation-label{display:block;font-size:11px;color:var(--secondary);margin-bottom:8px}
.equation-body{min-width:0;display:grid;gap:7px}
.equation-line{max-width:100%;min-width:0;overflow-x:auto;overflow-y:hidden;padding:3px 0;line-height:1.8;overflow-wrap:anywhere}
.equation-line>.katex{white-space:normal}
.equation-therefore{font-size:11px;color:var(--secondary);line-height:1.5}
.ai-conclusion{font-size:14px;line-height:1.8;padding:16px}
.ai-conclusion>strong{display:block;font-size:11px;font-weight:500;margin-bottom:5px}
#ai-step-content>p{font-size:15px;line-height:1.9;margin-bottom:18px}
#ai-step-content .ai-option-analysis p{font-size:14px;line-height:1.9}

.symbol-guide{margin:12px 0 18px;padding:11px 14px;border-radius:12px;background:#f0e5f5;font-size:12px;color:#8b6997}
.symbol-guide summary{cursor:pointer;min-height:24px;line-height:24px}
.symbol-guide p{display:flex;gap:13px;align-items:center;margin:9px 0}.symbol-guide b{font-size:19px;min-width:24px;text-align:center;font-weight:500}

.avatar-button{display:block;flex-shrink:0;padding:0;border:0;background:transparent;border-radius:50%;touch-action:manipulation;-webkit-tap-highlight-color:transparent;user-select:none}
.avatar-button .teacher-avatar{display:block;animation:huahua-float 4s ease-in-out infinite;transform-origin:50% 70%;-webkit-user-drag:none}
.avatar-button .avatar-shake{animation:huahua-shake .65s ease-in-out both}
@keyframes huahua-float{0%,100%{transform:translateY(0) rotate(5deg)}50%{transform:translateY(-3px) rotate(2deg)}}
@keyframes huahua-shake{0%,100%{transform:translateX(0) rotate(5deg)}18%{transform:translateX(-4px) rotate(-7deg)}36%{transform:translateX(4px) rotate(11deg)}54%{transform:translateX(-3px) rotate(-5deg)}72%{transform:translateX(2px) rotate(8deg)}88%{transform:translateX(-1px) rotate(3deg)}}
@keyframes huahua-greet{0%,100%{opacity:1}50%{opacity:.7}}
@media(prefers-reduced-motion:reduce){.avatar-button .teacher-avatar{animation:none}.avatar-button .avatar-shake{animation:huahua-greet .25s ease-out}}
