:root{--bg:#f4f5f1;--paper:#fff;--ink:#23352f;--muted:#85908b;--line:#e6eae3;--green:#227451;--green-dark:#15533a;--green-soft:#edf5ea;--lime:#d6ed9b;--amber:#a76c26;--shadow:0 4px 18px #29382904;--radius:18px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Noto Sans SC,Microsoft YaHei,system-ui,sans-serif;font-size:13px;-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}a,button{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:disabled{cursor:not-allowed;opacity:.43}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #98be74;outline-offset:3px}a{color:inherit;text-decoration:none}button{border:0}h1,h2,h3,h4,p{margin:0}button svg{flex-shrink:0}button{transition:background .18s,box-shadow .18s,color .18s,transform .18s}button:not(:disabled):active{transform:translateY(1px)}.topbar{height:52px;padding:0 16px;gap:38px;border-bottom:1px solid var(--line);background:#ffffffd9}.brand,.topbar{display:flex;align-items:center}.brand{gap:9px;font-size:18px;font-weight:750;letter-spacing:-1px}.brand-icon{height:32px;width:32px;border-radius:12px;background:var(--green-dark);color:var(--lime);display:grid;place-items:center;transform:rotate(-5deg)}.brand-light{font-weight:450;margin-left:3px}.brand small{font-size:8px;letter-spacing:2px;display:block;margin-top:1px;font-weight:550;color:#718177}.breadcrumb{gap:12px;color:#89938c;font-size:12px;border-left:1px solid var(--line);padding-left:28px}.breadcrumb,.header-actions{display:flex;align-items:center}.header-actions{margin-left:auto;gap:18px}.powered{font-size:11px;color:#637762;display:flex;gap:6px;align-items:center}.icon-button{display:grid;place-items:center;background:transparent;color:#849087;border-radius:7px;width:28px;height:28px;flex-shrink:0}.icon-button:hover{background:#eaf0e6;color:var(--green)}.button{border-radius:9px;padding:11px 15px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:550;white-space:nowrap}.button.small{padding:8px 11px;font-size:11px}.button.primary{background:var(--green);color:white}.button.primary:hover{background:var(--green-dark);box-shadow:0 3px 7px #15533a18}.button.secondary{background:#f1f6ed;color:var(--green);border:1px solid #dce7d5}.button.secondary:hover{background:#e5efde}.button.subtle{border:1px solid var(--line);background:white;color:#64746b}.export-wrap{position:relative}.export-menu{position:absolute;right:0;top:40px;width:205px;padding:8px;border:1px solid var(--line);box-shadow:0 8px 22px #18342615;background:white;border-radius:12px;z-index:30}.export-menu button{display:block;width:100%;background:none;text-align:left;padding:10px;border-radius:7px;font-size:12px}.export-menu button:hover{background:var(--green-soft)}.export-menu p{font-size:10px;color:var(--muted);padding:8px 10px;border-top:1px solid var(--line)}.main-content{width:100%;margin:auto;padding:10px 12px 0}.page-heading{justify-content:space-between;gap:12px}.eyebrow,.page-heading{display:flex;align-items:center;margin-bottom:8px}.eyebrow{font-size:10px;letter-spacing:1.6px;color:#86927c;gap:7px}.eyebrow span{width:5px;height:5px;background:#95ad66;border-radius:50%}h1{font-size:21px;font-weight:650;letter-spacing:-.8px;line-height:1.55}.page-heading p{font-size:12px;color:#899187;margin-top:5px}.mode-switch{border:1px solid #e1e6dc;border-radius:10px;padding:4px;background:#ecefe7;display:flex;gap:4px}.mode-switch button{display:flex;align-items:center;gap:7px;padding:6px 12px;border-radius:7px;background:none;font-size:12px;color:#7a8679}.mode-switch button.selected{background:white;color:var(--green);font-weight:600;box-shadow:0 1px 5px #00000009}.stepper{display:flex;background:#fff;border:1px solid var(--line);border-radius:9px;padding:6px 16px;gap:24px;margin-bottom:10px}.step{flex:1 1;gap:12px;position:relative;min-width:0}.step,.step-number{display:flex;align-items:center}.step-number{border:1px solid #e3e8df;border-radius:50%;height:22px;width:22px;justify-content:center;font-size:11px;flex-shrink:0;color:#a2ada0;font-weight:550;background:#fafbf8}.step-label{font-size:12px;color:#93a08f;font-weight:550;white-space:nowrap}.step-label small{display:none;font-size:9px;font-weight:400;color:#afb8a9;margin-top:4px}.step.current .step-number{color:white;background:var(--green);border-color:var(--green);box-shadow:0 0 0 4px #edf4e9}.step.current .step-label{color:var(--green-dark)}.step.current .step-label small{color:#7d956c}.step.done .step-number{background:#eaf3dd;color:#577b30;border-color:#eaf3dd}.step.done .step-label{color:#577b30}.step-line{height:1px;flex:1 1;background:#e7ece2;margin-left:8px}.stepper.exploring .step.current .step-number{background:#9baa99;border-color:#9baa99;box-shadow:none}.workspace-grid{display:grid;grid-template-columns:minmax(0,1fr) 312px;gap:12px;height:calc(100dvh - 190px);min-height:500px;align-items:stretch}.lab-column{display:flex;flex-direction:column;gap:8px;min-width:0;min-height:0}.experiment-card{display:flex;flex:1 1;flex-direction:column;min-height:0;border:1px solid #dde4d7;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);background:white}.experiment-toolbar{height:36px;flex-shrink:0;padding:0 17px;justify-content:space-between}.experiment-toolbar,.experiment-toolbar>div{display:flex;align-items:center;gap:8px}.experiment-toolbar strong{font-size:12px;font-weight:600}.live-dot{height:6px;width:6px;border-radius:50%;background:#7b9c59}.muted-text{font-size:9px;color:#a0aba0;margin-left:5px}.small-status{color:#809277;font-size:10px}.simulation-wrap{position:relative;flex:1 1;min-height:320px;background:#9ac0fb;margin:0 6px;border:1px solid #dfe6dc;border-radius:9px;overflow:hidden}.simulation-wrap:fullscreen{flex:none;height:100vh;width:100vw;border-radius:0;margin:0}.simulation-wrap iframe{width:100%;height:100%;border:0;display:block}.annotation-overlay{position:absolute;inset:0;pointer-events:none;overflow:hidden}.component-highlight{position:absolute;border:3px solid #fcb944;border-radius:13px;box-shadow:0 0 0 5px #fff2bd66,0 0 25px #ffd57b80;animation:highlight-in .35s ease}.component-highlight span{position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%);border-radius:7px;background:#fff8df;padding:5px 9px;font-size:11px;color:#8c5610;white-space:nowrap;max-width:240px;overflow:hidden;text-overflow:ellipsis}.instrument-strip{height:44px;flex-shrink:0;display:flex;align-items:center;gap:25px;padding:0 18px}.instrument-strip>span:first-child{display:flex;gap:7px;color:#8c988c;align-items:center;font-size:10px;margin-right:3px}.instrument-strip>div{border-left:1px solid var(--line);padding-left:20px;display:flex;flex-direction:column;gap:2px;min-width:60px}.instrument-strip small{font-size:9px;color:#97a091}.instrument-strip strong{font-size:16px;font-weight:550;color:#415b45;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.instrument-strip em{font-size:10px;font-style:normal;font-weight:400;color:#97a18f}.circuit-pill{display:flex;align-items:center;gap:5px;background:#f2f4ed;color:#8b927a;border-radius:20px;padding:5px 8px;font-size:9px;margin-left:auto;white-space:nowrap}.circuit-pill.good{background:#edf5e5;color:#548347}.mini-dot{width:4px;height:4px;background:currentColor;border-radius:50%}.task-card{flex-shrink:0;padding:11px 12px;background:#eef2e6;border:1px solid #dfe6d5;border-radius:10px;margin:0 12px 8px}.task-icon{display:none!important;width:43px;height:43px;background:#e1eace;display:grid;place-items:center;border:1px solid #d6e1c4;border-radius:12px;color:#6d8849;flex-shrink:0}.task-copy{flex:1 1}.task-eyebrow{font-size:9px;color:#91a077;letter-spacing:1px;margin-bottom:4px}.task-copy h2{font-size:13px;font-weight:600;color:#455f37;margin-bottom:6px}.task-copy p{font-size:11px;color:#6e805c;line-height:1.7}.task-card>.button{width:100%;font-size:11px;margin-top:8px;padding:7px 10px}.lab-note{display:flex;gap:7px;color:#a0aa98;font-size:10px;align-items:center;margin:14px 5px}.lab-note svg{flex-shrink:0}.inline-warning{font-size:11px;line-height:1.8;color:var(--amber);padding:10px 14px;background:#fff4df;border-radius:9px}.tutor-panel{background:white;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;height:100%;min-height:0;box-shadow:var(--shadow)}.tutor-heading{display:flex;align-items:center;gap:11px;padding:12px 14px}.tutor-avatar{width:35px;height:35px;border-radius:15px;display:grid;place-items:center;background:#eef4e5;color:#6b8c4b;border:1px solid #e0eacb;position:relative}.tutor-avatar:after{content:"";position:absolute;width:7px;height:7px;background:#a9bf80;border:2px solid white;border-radius:50%;bottom:-2px;right:-1px}.tutor-heading h2{font-size:13px;font-weight:600;display:flex;gap:7px;align-items:center}.tutor-heading h2 span{font-size:8px;color:#839960;background:#f0f5e7;border:1px solid #e6eddc;border-radius:4px;padding:1px 4px;font-weight:500}.tutor-heading p{font-size:9px;color:#99a28f;display:flex;gap:5px;align-items:center;margin-top:5px}.connection-dot{height:4px;width:4px;background:#c3c9b7;border-radius:50%}.connection-dot.on{background:#6eab73}.tutor-heading>.icon-button{margin-left:auto}.panel-tabs{margin:0 17px;display:flex;border-bottom:1px solid var(--line);gap:17px}.panel-tabs button{background:none;display:flex;align-items:center;justify-content:center;gap:5px;font-size:11px;position:relative;color:#98a18f;padding:9px 0;flex:1 1;white-space:nowrap}.panel-tabs button.active{color:var(--green);font-weight:550}.panel-tabs button.active:after{content:"";position:absolute;bottom:-1px;height:2px;left:8px;right:8px;background:var(--green);border-radius:4px}.count{font-size:9px;border-radius:4px;background:#eaf3e0;padding:1px 4px}.panel-body{flex:1 1;overflow-y:auto;min-height:0;position:relative;scrollbar-width:thin;scrollbar-color:#dfe5d7 transparent}.chat-content,.record-content{padding:14px}.welcome-card{background:#f5f7f0;border:1px solid #e8eddf;border-radius:11px;padding:13px}.tiny-label{font-size:9px;color:#92a078;letter-spacing:1.3px}.welcome-card h3{font-size:14px;font-weight:550;letter-spacing:-.4px;color:#45633b;margin:10px 0}.welcome-card p{font-size:11px;color:#80916f;line-height:1.8}.welcome-separator{height:1px;background:#e7ecdF;margin:10px 0}.welcome-footnote{display:flex;gap:7px;align-items:center;font-size:9px;color:#a0ac91}.suggestions{margin-top:14px}.suggestions>p{font-size:10px;color:#a5ae9c;margin-bottom:10px}.suggestions button{display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left;font-size:11px;color:#829175;border:1px solid #ebeee4;border-radius:8px;padding:10px 11px;background:#fff;margin:7px 0;width:100%}.suggestions button:hover{background:#f2f6ec;color:var(--green);border-color:#dce8cf}.suggestions button svg{color:#acb59c}.caption{margin:17px 0;max-width:95%}.caption small{font-size:9px;color:#9fa998;display:flex;align-items:center;gap:6px;margin-bottom:5px}.caption p{background:#f4f6ef;border:1px solid #e9ede0;border-radius:0 11px 11px;padding:11px 12px;font-size:12px;line-height:1.85;color:#5c7050;white-space:pre-wrap;word-break:break-word}.caption.student{margin-left:auto}.caption.student small{justify-content:flex-end}.caption.student p{background:#eaf3e1;color:#46683d;border-color:#dfeacd;border-radius:11px 0 11px 11px}.typing-dot{width:4px;height:4px;border-radius:50%;background:#8da66c;animation:pulse 1s infinite}.hint-card{border:1px solid #f0e2b5;border-radius:11px;padding:13px;background:#fffae8;margin:14px 0}.hint-card>span{display:flex;gap:6px;align-items:center;font-size:10px;color:#ad8b3f}.hint-card p{font-size:11px;line-height:1.9;color:#9a803f;margin-top:7px}.tutor-controls{flex-shrink:0;padding:10px 12px;border-top:1px solid #eef0e8;background:#fff}.voice-controls{display:flex;align-items:center;gap:8px;margin-bottom:9px}.connect-button{background:var(--green);color:white;width:100%;border-radius:10px;padding:10px 12px;display:flex;align-items:center;gap:9px;font-size:12px;font-weight:550}.connect-button:hover{background:var(--green-dark)}.connect-button span{flex:1 1;text-align:left}.connect-button>svg:last-child{opacity:.7}.mic-button{display:grid;place-items:center;height:39px;width:39px;background:var(--green);color:#fff;border-radius:50%;flex-shrink:0}.mic-button.muted{background:#ecefe6;color:#96a08e}.voice-state{flex:1 1}.voice-state>span{font-size:9px;color:#9aa68d}.waveform{display:flex;align-items:center;gap:3px;height:22px;overflow:hidden}.waveform i{display:block;width:3px;background:#98b785;border-radius:5px;transition:height .2s}.waveform.active i{animation:wave 1.2s ease-in-out infinite alternate}.end-button{background:#f8ede6;color:#b1836a;display:grid;place-items:center;border-radius:8px;width:29px;height:29px}.composer{border:1px solid #e4e9de;background:#fafbf7;border-radius:9px;display:flex;align-items:center;padding:4px 5px 4px 11px}.composer input{flex:1 1;min-width:0;border:none;background:transparent;color:#526b47;font-size:10px;outline:none;padding:7px 0}.composer input::placeholder{color:#a5b099}.composer button{height:29px;width:29px;display:grid;place-items:center;background:#eaf1df;color:#739255;border-radius:6px}.control-footer{display:flex;align-items:center;justify-content:space-between;margin-top:10px}.control-footer button{display:flex;align-items:center;gap:4px;background:none;color:#8e9f7a;font-size:9px;padding:0}.control-footer>span{font-size:8px;color:#b0b7a7}.connection-error{font-size:10px;color:#a9743c;background:#fff7e8;padding:10px 16px;line-height:1.7;border-top:1px solid #f7e5c7}.connection-error button{margin-left:6px;background:none;text-decoration:underline;color:var(--green);font-size:10px}.record-intro h3{font-size:14px;color:#49633e;margin:8px 0}.record-intro p{font-size:10px;color:#9aa58d;line-height:1.7}.prediction-editor{margin:19px 0}.prediction-editor label,.reflection-editor label{font-size:11px;color:#658151;font-weight:550;display:block;margin:0 0 9px}.prediction-editor textarea,.reflection-editor textarea{width:100%;height:87px;resize:vertical;border:1px solid #dde7d2;border-radius:9px;background:#fafcf7;padding:10px;color:#527444;font-size:11px;line-height:1.8;margin-bottom:8px}.prediction-editor textarea::placeholder,.reflection-editor textarea::placeholder{color:#a8b59b}.draft-notice{display:block;font-size:9px;color:#ac8944;margin-bottom:8px}.saved-prediction{background:#f4f7ee;border:1px solid #e7eddd;padding:11px;border-radius:9px;margin:12px 0}.saved-prediction small{font-size:9px;display:flex;gap:5px;align-items:center;color:#91a77a}.saved-prediction p{font-size:11px;line-height:1.8;color:#6c825c;margin-top:5px}.measurement-heading{display:flex;align-items:center;justify-content:space-between;margin:22px 0 10px}.measurement-heading h4{font-size:12px;font-weight:550;color:#607954}.measurement-heading span{font-size:9px;color:#a0ad91}.measurement-table{border:1px solid #e4eadd;border-radius:9px;overflow:hidden}table{border-collapse:collapse;width:100%;font-size:11px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}th{font-size:9px;font-weight:450;background:#f2f5ec;color:#8c9b7c;padding:10px 5px}td,th{text-align:center}td{border-top:1px solid #e9eee1;padding:11px 5px;color:#5b7748;font-weight:550}.empty-row{font-size:10px;color:#adb8a0;padding:24px 12px;font-weight:400}.record-button{width:100%;margin-top:10px}.measurement-note{font-size:9px;color:#a3ae98;line-height:1.8;margin-top:10px}.empty-guidance{margin:30px 0;color:#b4bea9;text-align:center}.empty-guidance p{font-size:10px;line-height:1.9;margin-top:10px}.reflection-editor{margin-top:20px}.reflection-editor textarea{height:100px}.details-panel{position:absolute;inset:0;background:#fafcf7;padding:16px;z-index:10;overflow:auto}.details-panel>div{display:flex;justify-content:space-between;align-items:center}.details-panel strong{font-size:12px}.details-panel p{font-size:10px;border-bottom:1px solid #e6ecdf;padding:10px 0;line-height:1.8;color:#7b8e6c}.details-panel time{font-feature-settings:"tnum";font-variant-numeric:tabular-nums;color:#a1af94}.details-panel small{display:block;font-size:9px;color:#a5b097;word-break:break-word}.page-footer{display:flex;gap:20px;align-items:center;justify-content:space-between;border-top:1px solid #e3e8db;margin-top:7px;padding:5px 2px 8px;color:#8b9980;font-size:9px}.page-footer>span:first-child{display:flex;gap:6px;align-items:center}.footer-dot{height:4px;width:4px;border-radius:50%;background:#8ea571}.page-footer a{margin-left:8px;color:#8ca276}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#233b2b;color:#eef4e5;border:1px solid #3d5744;border-radius:13px;box-shadow:0 8px 30px #12251622;display:flex;align-items:center;gap:12px;padding:14px 16px;font-size:12px;max-width:620px;z-index:100;line-height:1.8}.toast>svg{color:#d4e89f;flex-shrink:0}.toast button{background:none;color:#b6c7ac;display:grid;place-items:center}.modal-backdrop{position:fixed;inset:0;background:#20342966;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:110;display:grid;place-items:center;padding:20px}.modal{background:white;padding:30px;border-radius:22px;max-width:410px;box-shadow:0 20px 90px #1b302733}.modal-icon{background:#eff5e5;color:#709352;width:49px;height:49px;border-radius:16px;display:grid;place-items:center;margin-bottom:18px}.modal h2{font-size:20px;font-weight:600;margin-bottom:10px}.modal p{font-size:12px;color:#909e85;line-height:1.9;margin-bottom:25px}.modal>div{display:flex;gap:10px}.modal>div button{flex:1 1}.modal-cancel{background:none;font-size:11px;color:#a1ad97;padding:0;margin:20px auto 0;display:block}@keyframes wave{0%{transform:scaleY(.65)}to{transform:scaleY(1.15)}}@keyframes pulse{50%{opacity:.35}}@keyframes highlight-in{0%{opacity:0;transform:scale(1.1)}to{opacity:1;transform:scale(1)}}@media(min-width:1450px){.workspace-grid{grid-template-columns:minmax(0,1fr) 320px}.instrument-strip{gap:32px}}@media(max-width:1150px){.topbar{gap:20px}.breadcrumb{display:none}.workspace-grid{grid-template-columns:minmax(0,1fr) 296px;gap:10px}.muted-text{display:none}.stepper{gap:16px}.step-line{margin:0}.instrument-strip{gap:16px;padding:0 12px}.instrument-strip>span:first-child{font-size:0;margin:0;gap:0}.instrument-strip>div{padding-left:14px;min-width:48px}.panel-tabs{gap:7px;margin:0 12px}.panel-tabs button{font-size:10px}.page-footer>span:last-child{display:none}}@media(max-width:900px){.workspace-grid{grid-template-columns:1fr;height:auto;min-height:0}.experiment-card{flex:none;height:clamp(540px,calc(100dvh - 194px),940px)}.tutor-panel{height:650px}.task-card{margin:0 16px 10px}.task-card>.button{width:auto;min-width:150px}.tutor-heading{padding:14px 18px}.panel-tabs{max-width:400px;margin:0 auto;width:100%}.chat-content,.record-content{padding:16px 18px}.suggestions{display:flex;gap:8px;flex-wrap:wrap}.suggestions>p{width:100%;margin-bottom:0}.suggestions button{width:auto;flex:1 1;min-width:150px}.tutor-controls{padding:12px 18px}.voice-controls{max-width:430px;margin:0 auto 9px}.stepper{gap:16px}.step{gap:8px}.step-label{font-size:11px}.page-footer{flex-wrap:wrap;gap:8px}.powered{display:none}}@media(max-width:600px){.topbar{padding:0 12px}.brand{font-size:17px}.brand small{font-size:7px;letter-spacing:1.5px}.header-actions{gap:6px}.main-content{padding:8px 8px 0}.page-heading{flex-wrap:wrap;gap:8px}.page-heading h1{font-size:20px}.mode-switch{width:100%;padding:3px}.mode-switch button{flex:1 1;justify-content:center;padding:5px 8px;font-size:11px}.stepper{gap:5px;padding:6px 9px;margin-bottom:8px}.step{gap:6px}.step-label{font-size:10px}.step-line{display:none}.experiment-card{height:max(490px,calc(100dvh - 214px));border-radius:12px}.simulation-wrap{margin:0 3px;border-radius:5px}.experiment-toolbar{padding:0 10px}.instrument-strip{gap:10px;padding:0 10px}.instrument-strip>span:first-child{display:none}.instrument-strip>div:first-of-type{border:0;padding-left:0}.instrument-strip>div{padding-left:12px}.tutor-panel{height:650px}.suggestions{display:block}.suggestions button{width:100%}.page-footer{font-size:8px;line-height:1.8}.page-footer a{white-space:nowrap}.toast{width:calc(100% - 24px);font-size:11px;bottom:12px}}@media(prefers-reduced-motion:reduce){*,:after,:before{animation:none!important;scroll-behavior:auto!important;transition:none!important}}.text-connect{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:2px 0 11px;background:none;font-size:10px;color:var(--green)}.text-connect:hover{color:var(--green-dark);text-decoration:underline}