*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{color:#1a1a2e;background:#fafafa;max-width:860px;margin:2rem auto;padding:0 1rem;font-family:system-ui,-apple-system,sans-serif}.hero{margin-bottom:1.5rem}.hero-row{justify-content:space-between;align-items:center;gap:1rem;display:flex}h1{margin-bottom:.25rem;font-size:1.5rem}.lang-switcher{color:#444;cursor:pointer;background:#fff;border:1px solid #ddd;border-radius:4px;padding:.25rem .4rem;font-size:.8rem}.subtitle{color:#555;font-size:1rem;font-weight:400}.editor{background:#fff;border:2px solid #e0e0e0;border-radius:12px;margin-bottom:1.5rem;padding:0;transition:border-color .15s;position:relative;overflow:hidden}.editor:focus-within{border-color:#4361ee;box-shadow:0 0 0 3px #4361ee1a}.section-label{text-transform:uppercase;letter-spacing:.06em;color:#999;padding:.6rem 1rem 0;font-size:.7rem;font-weight:600;display:block}.editor-upper{transition:opacity .15s}.editor-upper.mode-active{box-shadow:inset 0 0 0 2px #4361ee26}.editor-upper.mode-active .section-label,.editor-lower:not(.mode-inactive) .section-label{color:#4361ee}.editor-upper.mode-inactive .math-display{opacity:.55}.math-display{cursor:text;outline:none;align-items:center;min-height:4.5rem;padding:.5rem 1rem .75rem;font-size:1.6rem;transition:opacity .15s;display:flex;position:relative;overflow:hidden}.math-display .placeholder{color:#bbb;pointer-events:none;-webkit-user-select:none;user-select:none;font-size:1rem;font-style:italic}.math-display math{font-family:Latin Modern Math,STIX Two Math,Cambria Math,math;font-size:1.6rem}.math-toolbar{background:#f8f9ff;border-top:1px solid #eee;gap:.25rem;padding:.4rem .75rem .5rem;display:flex}.math-toolbar button{cursor:pointer;color:#444;text-align:center;background:#fff;border:1px solid #ddd;border-radius:4px;min-width:2.2rem;padding:.3rem .6rem;font-size:.95rem;line-height:1.3;transition:background .12s,border-color .12s}.math-toolbar button:hover{color:#4361ee;background:#eef0ff;border-color:#4361ee}.mode-hints{text-transform:none;letter-spacing:0;color:#999;margin-left:.5rem;font-size:.68rem;font-weight:400}.mode-hints kbd{background:#f0f0f0;border:1px solid #d0d0d0;border-radius:3px;margin:0 .05em;padding:.05em .25em;font-family:inherit;font-size:.9em}.mode-hints .cheat-nav,.mode-hints .cheat-edit{display:none}.editor-lower{border-top:1px solid #e8e8e8;padding-bottom:.75rem;transition:opacity .15s}.editor-lower.mode-inactive{opacity:.55}.source-row{align-items:center;padding:0 .75rem;display:flex}.source-input{color:#2d2d3a;background:0 0;border:none;outline:none;flex:1;padding:.6rem .5rem;font-family:SF Mono,Fira Code,Cascadia Code,Consolas,monospace;font-size:1rem}.source-input::placeholder{color:#bbb}.source-input.mode-inactive{caret-color:#0000}.source-hint{color:#aaa;margin-top:-.1rem;padding:0 1rem;font-size:.75rem}.source-hint kbd{background:#f0f0f0;border:1px solid #d0d0d0;border-radius:3px;padding:.1em .35em;font-family:inherit;font-size:.9em}.source-input.has-errors{border-color:#e74c3c;box-shadow:0 0 0 2px #e74c3c1f}.source-input.has-errors:focus{border-color:#e74c3c;box-shadow:0 0 0 3px #e74c3c2e}.error-strip{flex-wrap:wrap;gap:.4rem;margin-top:.1rem;padding:.35rem 1rem;display:flex}.error-strip[hidden]{display:none}.error-item{color:#c0392b;cursor:pointer;border-radius:4px;align-items:center;gap:.3rem;padding:.15rem .5rem .15rem .35rem;font-size:.78rem;transition:background .1s;display:inline-flex}.error-item:hover{background:#e74c3c14}.error-dot{background:#e74c3c;border-radius:50%;flex-shrink:0;width:6px;height:6px}.error-pos{color:#999;margin-left:.15rem;font-size:.7rem}.suggestions-row{flex-wrap:wrap;gap:.3rem;min-height:0;margin-top:.35rem;padding:0 .75rem;display:flex}.suggestions-row:empty{display:none}.suggestion-chip{cursor:pointer;color:#4361ee;background:#f0f2ff;border:1px solid #d0d4e8;border-radius:4px;padding:.2rem .5rem;font-family:SF Mono,monospace;font-size:.78rem;transition:background .1s}.suggestion-chip:hover{background:#dde0ff;border-color:#4361ee}.cursor{pointer-events:none;z-index:2;background:#4361ee;border-radius:1px;width:2px;animation:1.06s step-end infinite blink;display:none;position:absolute}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.math-display.mode-navigate{background:#4361ee08}.math-display.mode-edit{background:#2ea04308}.math-display .node-selected{outline-offset:2px;outline:2px solid #4361eeb3}.math-display.mode-edit .cursor{background:#2ea043}.sel-overlay{pointer-events:none;z-index:1;background:#4361ee38;border-radius:2px;position:absolute}.examples{margin-bottom:1.5rem}.examples h2{text-transform:uppercase;letter-spacing:.04em;color:#888;margin-bottom:.6rem;font-size:.85rem;font-weight:600}.example-grid{flex-wrap:wrap;gap:.4rem;display:flex}.example-grid[hidden]{display:none}.example-grid+.example-grid{margin-top:.4rem}.example-grid button{cursor:pointer;color:#444;background:#fff;border:1px solid #ddd;border-radius:6px;padding:.45rem .85rem;font-size:.82rem;transition:background .12s,border-color .12s,transform .1s}.example-grid button:hover{color:#4361ee;background:#eef0ff;border-color:#4361ee;transform:translateY(-1px)}.show-more-btn{cursor:pointer;color:#4361ee;text-underline-offset:2px;background:0 0;border:none;margin-top:.5rem;padding:.3rem .7rem;font-size:.8rem;text-decoration:underline;display:inline-block}.show-more-btn:hover{color:#2a47c9}.how-to{background:#f5f6ff;border:1px solid #e4e6f5;border-radius:10px;margin-bottom:1.5rem;padding:1rem 1.25rem}.how-to h2{text-transform:uppercase;letter-spacing:.04em;color:#888;margin-bottom:.6rem;font-size:.85rem;font-weight:600}.steps{counter-reset:steps;gap:.4rem;list-style:none;display:grid}.steps li{counter-increment:steps;color:#444;padding-left:1.8rem;font-size:.88rem;line-height:1.5;position:relative}.steps li:before{content:counter(steps);color:#fff;background:#4361ee;border-radius:50%;justify-content:center;align-items:center;width:1.3rem;height:1.3rem;font-size:.72rem;font-weight:700;display:flex;position:absolute;top:.05em;left:0}.steps kbd{background:#fff;border:1px solid #ccc;border-radius:3px;padding:.1em .4em;font-family:inherit;font-size:.85em}.about-section{color:#555;margin-bottom:1rem;font-size:.85rem}.about-section summary{cursor:pointer;color:#777;-webkit-user-select:none;user-select:none;font-weight:500}.about-section p{max-width:640px;margin-top:.5rem;line-height:1.6}.about-section a{color:#36c}.exercises{margin-bottom:1.5rem}.exercises h2{text-transform:uppercase;letter-spacing:.04em;color:#888;margin-bottom:.6rem;font-size:.85rem;font-weight:600}.exercise-grid{flex-wrap:wrap;gap:.4rem;display:flex}.exercise-grid button{cursor:pointer;color:#444;background:#fff;border:1px solid #ddd;border-radius:6px;padding:.45rem .85rem;font-size:.82rem;transition:background .12s,border-color .12s,transform .1s}.exercise-grid button:hover{color:#b37300;background:#fff5e6;border-color:#e6960a;transform:translateY(-1px)}.exercise-bar{background:#fffbf0;border-top:1px solid #e8e8e8;flex-wrap:wrap;align-items:center;gap:.5rem;padding:.6rem 1rem;display:flex}.exercise-bar[hidden]{display:none}.exercise-prompt{color:#7a5c00;flex:1;min-width:150px;font-size:.9rem;font-weight:600}.exercise-actions{align-items:center;gap:.35rem;display:flex}.check-btn{color:#fff;cursor:pointer;background:#f5a623;border:1px solid #e6960a;border-radius:6px;padding:.35rem .9rem;font-size:.82rem;font-weight:600;transition:background .12s}.check-btn:hover{background:#e6960a}.exit-exercise-btn{cursor:pointer;color:#999;background:0 0;border:none;padding:.2rem .5rem;font-size:1.1rem;line-height:1}.exit-exercise-btn:hover{color:#666}.exercise-result{width:100%;padding-top:.15rem;font-size:.82rem;font-weight:600}.exercise-result:empty{display:none}.result-correct{color:#27ae60}.result-incorrect{color:#c0392b}.result-hint{color:#999;font-weight:400}.mark-incorrect-overlay{pointer-events:none;z-index:1;background:#e74c3c1a;border:2px solid #e74c3c8c;border-radius:4px;position:absolute}details.debug{margin:1rem 0 2rem;font-size:.82rem}details.debug summary{cursor:pointer;color:#888;-webkit-user-select:none;user-select:none}details.debug pre{white-space:pre-wrap;word-break:break-word;background:#f0f0f3;border-radius:6px;max-height:24rem;margin-top:.5rem;padding:.75rem;font-size:.78rem;line-height:1.5;overflow-x:auto}.accessible-math-editor{color:#1a1a2e;background:#fff;border:2px solid #e0e0e0;border-radius:12px;max-width:100%;margin-bottom:1.5rem;padding:0;font-family:system-ui,-apple-system,sans-serif;transition:border-color .15s;position:relative;overflow:hidden}.accessible-math-editor:focus-within{border-color:#4361ee;box-shadow:0 0 0 3px #4361ee1a}.accessible-math-editor *{box-sizing:border-box}.accessible-math-editor .section-label{text-transform:uppercase;letter-spacing:.06em;color:#999;padding:.6rem 1rem 0;font-size:.7rem;font-weight:600;display:block}.accessible-math-editor .editor-upper{transition:opacity .15s}.accessible-math-editor .editor-upper.mode-active{box-shadow:inset 0 0 0 2px #4361ee26}.accessible-math-editor .editor-upper.mode-active .section-label,.accessible-math-editor .editor-lower:not(.mode-inactive) .section-label{color:#4361ee}.accessible-math-editor .editor-upper.mode-inactive .math-display{opacity:.55}.accessible-math-editor .math-display{cursor:text;outline:none;align-items:center;min-height:4.5rem;padding:.5rem 1rem .75rem;font-size:1.6rem;transition:opacity .15s;display:flex;position:relative;overflow:hidden}.accessible-math-editor .placeholder{color:#bbb;pointer-events:none;-webkit-user-select:none;user-select:none;font-size:1rem;font-style:italic}.accessible-math-editor math{font-size:1.6rem}.accessible-math-editor .math-toolbar{background:#f8f9ff;border-top:1px solid #eee;gap:.25rem;padding:.4rem .75rem .5rem;display:flex}.accessible-math-editor .math-toolbar button{cursor:pointer;color:#444;text-align:center;background:#fff;border:1px solid #ddd;border-radius:4px;min-width:2.2rem;padding:.3rem .6rem;font-size:.95rem;line-height:1.3;transition:background .12s,border-color .12s}.accessible-math-editor .math-toolbar button:hover{color:#4361ee;background:#eef0ff;border-color:#4361ee}.accessible-math-editor .mode-hints{text-transform:none;letter-spacing:0;color:#999;margin-left:.5rem;font-size:.68rem;font-weight:400}.accessible-math-editor .mode-hints kbd{background:#f0f0f0;border:1px solid #d0d0d0;border-radius:3px;margin:0 .05em;padding:.05em .25em;font-family:inherit;font-size:.9em}.accessible-math-editor .mode-hints .cheat-nav,.accessible-math-editor .mode-hints .cheat-edit{display:none}.accessible-math-editor .editor-lower{border-top:1px solid #e8e8e8;padding-bottom:.75rem;transition:opacity .15s}.accessible-math-editor .editor-lower.mode-inactive{opacity:.55}.accessible-math-editor .source-row{align-items:center;padding:0 .75rem;display:flex}.accessible-math-editor .source-input{color:#2d2d3a;background:0 0;border:none;outline:none;flex:1;width:100%;padding:.6rem .5rem;font-family:SF Mono,Fira Code,Cascadia Code,Consolas,monospace;font-size:1rem}.accessible-math-editor .source-input::placeholder{color:#bbb}.accessible-math-editor .source-input.mode-inactive{caret-color:#0000}.accessible-math-editor .source-hint{color:#aaa;margin-top:-.1rem;padding:0 1rem;font-size:.75rem}.accessible-math-editor .source-hint kbd{background:#f0f0f0;border:1px solid #d0d0d0;border-radius:3px;padding:.1em .35em;font-family:inherit;font-size:.9em}.accessible-math-editor .source-input.has-errors{border-color:#e74c3c;border-radius:4px;box-shadow:0 0 0 2px #e74c3c1f}.accessible-math-editor .source-input.has-errors:focus{border-color:#e74c3c;box-shadow:0 0 0 3px #e74c3c2e}.accessible-math-editor .error-strip{flex-wrap:wrap;gap:.4rem;margin-top:.1rem;padding:.35rem 1rem;display:flex}.accessible-math-editor .error-strip[hidden]{display:none}.accessible-math-editor .error-item{color:#c0392b;cursor:pointer;border-radius:4px;align-items:center;gap:.3rem;padding:.15rem .5rem .15rem .35rem;font-size:.78rem;transition:background .1s;display:inline-flex}.accessible-math-editor .error-item:hover{background:#e74c3c14}.accessible-math-editor .error-dot{background:#e74c3c;border-radius:50%;flex-shrink:0;width:6px;height:6px}.accessible-math-editor .error-pos{color:#999;margin-left:.15rem;font-size:.7rem}.accessible-math-editor .suggestions-row{flex-wrap:wrap;gap:.3rem;min-height:0;margin-top:.35rem;padding:0 .75rem;display:flex}.accessible-math-editor .suggestions-row:empty{display:none}.accessible-math-editor .suggestion-chip{cursor:pointer;color:#4361ee;background:#f0f2ff;border:1px solid #d0d4e8;border-radius:4px;padding:.2rem .5rem;font-family:SF Mono,monospace;font-size:.78rem;transition:background .1s}.accessible-math-editor .suggestion-chip:hover{background:#dde0ff;border-color:#4361ee}.accessible-math-editor .cursor{pointer-events:none;z-index:2;background:#4361ee;border-radius:1px;width:2px;animation:1.06s step-end infinite math-editor-blink;display:none;position:absolute}@keyframes math-editor-blink{0%,to{opacity:1}50%{opacity:0}}.accessible-math-editor .sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.accessible-math-editor .math-display [data-s]{border-radius:2px;transition:background .1s}.accessible-math-editor .math-display [data-s]:hover{background:#4361ee12}.accessible-math-editor .math-display.mode-navigate{background:#4361ee08}.accessible-math-editor .math-display.mode-edit{background:#2ea04308}.accessible-math-editor .node-selected{outline-offset:2px;background:#4361ee14;border-radius:3px;outline:2px solid #4361eeb3}.accessible-math-editor .math-display.mode-edit .cursor{background:#2ea043}.accessible-math-editor .sel-overlay{pointer-events:none;z-index:1;background:#4361ee38;border-radius:2px;position:absolute}.accessible-math-editor .mark-incorrect-overlay{pointer-events:none;z-index:1;background:#e74c3c1a;border:2px solid #e74c3c8c;border-radius:4px;position:absolute}