:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--social-bg:#f4f3ec80;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}@media (prefers-color-scheme:dark){:root{--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--code-bg:#1f2028;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80;--social-bg:#2f303a80;--shadow:#0006 0 10px 15px -3px, #00000040 0 4px 6px -2px}}body{margin:0}#root{box-sizing:border-box;flex-direction:column;min-height:100svh;display:flex}.website-page{flex-direction:column;flex:1;min-height:0;display:flex}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code{font-family:var(--mono);background:var(--code-bg);color:var(--text-h);border-radius:4px;padding:4px 8px;font-size:15px;line-height:135%;display:inline-flex}.progress-layout{text-align:left;flex:1;min-height:0;display:flex}.unit-sidebar-item{cursor:pointer;text-align:left;padding:10px 16px}.unit-center{text-align:left;flex:1;padding:32px;overflow-y:auto}.unit-center h2{text-align:left}.unit-center-actions{margin-bottom:24px}.header-container{border-bottom:1px solid var(--border);box-sizing:border-box;justify-content:center;gap:8px;width:100%;padding:12px;display:flex}.word-tier-badge{opacity:.6;margin-left:auto;font-size:.85em}.session-view{text-align:left;max-width:800px;padding:32px}.counter{color:var(--accent);background:var(--accent-bg);border:2px solid #0000;border-radius:5px;margin-bottom:24px;padding:5px 10px;font-size:16px;transition:border-color .3s}.counter:hover{border-color:var(--accent-border)}.counter:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hero{position:relative}.hero .base,.hero .framework,.hero .vite{margin:0 auto;inset-inline:0}.hero .base{z-index:0;width:170px;position:relative}.hero .framework,.hero .vite{position:absolute}.hero .framework{z-index:1;height:28px;top:34px;transform:perspective(2000px)rotate(300deg)rotateX(44deg)rotateY(39deg)scale(1.4)}.hero .vite{z-index:0;width:auto;height:26px;top:107px;transform:perspective(2000px)rotate(300deg)rotateX(40deg)rotateY(39deg)scale(.8)}#center{flex-direction:column;flex-grow:1;place-content:center;place-items:center;gap:25px;display:flex}@media (width<=1024px){#center{gap:18px;padding:32px 20px 24px}}#next-steps{border-top:1px solid var(--border);text-align:left;display:flex}#next-steps>div{flex:1 1 0;padding:32px}@media (width<=1024px){#next-steps>div{padding:24px 20px}}#next-steps .icon{width:22px;height:22px;margin-bottom:16px}@media (width<=1024px){#next-steps{text-align:center;flex-direction:column}}#docs{border-right:1px solid var(--border)}@media (width<=1024px){#docs{border-right:none;border-bottom:1px solid var(--border)}}#next-steps ul{gap:8px;margin:32px 0 0;padding:0;list-style:none;display:flex}#next-steps ul .logo{height:18px}#next-steps ul a{color:var(--text-h);background:var(--social-bg);border-radius:6px;align-items:center;gap:8px;padding:6px 12px;font-size:16px;text-decoration:none;transition:box-shadow .3s;display:flex}#next-steps ul a:hover{box-shadow:var(--shadow)}#next-steps ul a .button-icon{width:18px;height:18px}@media (width<=1024px){#next-steps ul{flex-wrap:wrap;justify-content:center;margin-top:20px}#next-steps ul li{flex:calc(50% - 8px)}#next-steps ul a{box-sizing:border-box;justify-content:center;width:100%}}#spacer{border-top:1px solid var(--border);height:88px}@media (width<=1024px){#spacer{height:48px}}.ticks{width:100%;position:relative}.ticks:before,.ticks:after{content:"";border:5px solid #0000;position:absolute;top:-4.5px}.ticks:before{border-left-color:var(--border);left:0}.ticks:after{border-right-color:var(--border);right:0}.progress-layout{height:calc(100vh - 60px);display:flex}.unit-sidebar{border-right:1px solid var(--border);flex-shrink:0;width:200px;padding:16px 0;overflow-y:auto}.unit-sidebar-item{cursor:pointer;padding:10px 16px;font-family:monospace}.unit-sidebar-item.selected{border-left:3px solid;padding-left:13px}.unit-center{flex:1;padding:32px;overflow-y:auto}.word-progress-list{flex-direction:column;gap:8px;margin-top:16px;display:flex}.word-progress-item{gap:12px;font-family:monospace;display:flex}.session-view{max-width:800px;margin:0 auto;padding:32px}.question-text{overflow-wrap:break-word;max-width:100%;line-height:1.4}.question-text--long{font-size:clamp(1.25rem,3vw,2rem)}.voice-practice-container{text-align:center;max-width:600px;margin:0 auto;padding:24px}.voice-practice-container h2{margin-bottom:24px}.btn-start,.btn-end{color:#fff;cursor:pointer;border:none;border-radius:8px;padding:10px 20px;font-size:16px;font-weight:700;transition:opacity .2s}.btn-start:hover,.btn-end:hover{opacity:.9}.btn-start{background-color:#22c55e}.btn-end{background-color:#ef4444}.chat-box{border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:12px;height:256px;margin-top:24px;padding:16px;display:flex;overflow-y:auto}.msg-row{width:100%}.msg-row.user{text-align:right}.msg-row.assistant{text-align:left}.msg-bubble{word-wrap:break-word;border-radius:8px;max-width:85%;margin:0;padding:8px 14px;line-height:1.4;display:inline-block}.msg-bubble.user{color:#1e3a8a;background-color:#bfdbfe}.msg-bubble.assistant{color:#1f2937;background-color:#e5e7eb}.session-layout-wrapper{justify-content:center;align-items:flex-start;gap:2rem;width:100%;max-width:1200px;margin:0 auto;padding:1rem;display:flex}.session-main-content{flex:1;width:100%;max-width:700px}.grammar-tip-sidebar{background-color:#f8f9fa;border:1px solid #e0e0e0;border-radius:12px;width:400px;padding:1.5rem;position:sticky;top:2rem;box-shadow:0 4px 12px #0000000d}.grammar-tip-header{border-bottom:1px solid #ddd;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.75rem;display:flex}.grammar-tip-header h3{color:#2c3e50;margin:0;font-size:1.2rem}.grammar-tip-header button{cursor:pointer;color:#999;background:0 0;border:none;font-size:1.2rem}.grammar-tip-header button:hover{color:#333}.grammar-tip-content{color:#333;font-size:.95rem;line-height:1.5}.grammar-tip-entry hr{border:0;border-top:1px solid #eee;margin:1.5rem 0}.grammar-tip-content table{border-collapse:collapse;width:100%;margin:1rem 0}.grammar-tip-content th,.grammar-tip-content td{text-align:left;border:1px solid #ddd;padding:8px}.grammar-tip-content th{background-color:#f2f2f2}.mc-container{grid-template-columns:repeat(2,1fr);gap:12px;max-width:500px;margin:16px 0;display:grid}.mc-option{cursor:pointer;text-align:center;color:#333;background-color:#fff;border:2px solid #ddd;border-radius:8px;padding:16px;font-size:1.25rem;transition:all .2s ease-in-out}.mc-option:hover:not(:disabled){background-color:#f5f5f5;border-color:#aaa}.mc-option.mc-selected{color:#004085;background-color:#e6f2ff;border-color:#007bff}.mc-option.mc-correct{color:#155724!important;background-color:#d4edda!important;border-color:#28a745!important}.mc-option.mc-wrong{color:#721c24!important;background-color:#f8d7da!important;border-color:#dc3545!important}.mc-option:disabled{cursor:default}.decomposition-section{background-color:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;margin:1.5rem 0;padding:1rem}.decomposition-section h3{color:#495057;margin-top:0;margin-bottom:1rem;font-size:1.1rem}.decomposition-equation{background-color:#fff;border:1px solid #dee2e6;border-radius:6px;align-items:center;gap:.6rem;padding:.75rem;font-size:1.3rem;display:flex}.decomposition-equation+.decomposition-equation{margin-top:.5rem}.decomposition-equation-char{color:#212529;text-align:center;min-width:2rem;font-size:1.8rem;font-weight:700}.decomposition-equation-operator{color:#6c757d;font-weight:700}.decomposition-equation-component{color:#495057;padding:0 .2rem;font-size:1.5rem}.decomposition-equation-placeholder{color:#868e96;cursor:help;background-color:#f1f3f5;border:1px dashed #adb5bd;border-radius:4px;justify-content:center;align-items:center;width:1.4rem;height:1.4rem;font-size:1rem;display:inline-flex}.decomposition-equation-label{color:#adb5bd;text-transform:uppercase;letter-spacing:.02em;margin-left:.5rem;font-size:.75rem}.clickable-text-container{display:inline;position:relative}.clickable-word{cursor:pointer;text-underline-offset:3px;opacity:.95;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.vocab-popup{background:var(--code-bg,#1e1e1e);border:1px solid var(--border,#333);z-index:100;white-space:normal;min-width:180px;max-width:280px;font-family:var(--mono,monospace);border-radius:6px;padding:8px 12px;font-size:.85rem;position:absolute;box-shadow:0 4px 12px #00000026}.vocab-popup-header{justify-content:space-between;align-items:center;margin-bottom:4px;display:flex}.vocab-popup-title{font-size:1rem;font-weight:700}.vocab-popup-close{cursor:pointer;opacity:.6;-webkit-user-select:none;user-select:none;padding-left:8px}.vocab-popup-close:hover{opacity:1}.vocab-primary-def{margin-bottom:2px}.vocab-pinyin{font-weight:600}.vocab-unit-tag{opacity:.6;margin-left:6px;font-size:.75rem}.vocab-others-details{border-top:1px solid var(--border,#333);margin-top:6px;padding-top:6px}.vocab-others-summary{opacity:.7;cursor:pointer;-webkit-user-select:none;user-select:none;margin-bottom:4px;font-size:.75rem;font-weight:700}.vocab-others-summary:hover{opacity:1}.vocab-others-list{margin:4px 0 0;padding-left:14px;list-style-type:disc}.vocab-others-item{margin-bottom:3px}