:root{--ink:#242523;--muted:#787a73;--red:#b9382e;--red-dark:#922920;--cream:#f6f4ef;--paper:#fffefa;--line:#e8e5dd;--soft-red:#f8ece8;--green:#456b50;--sans:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;--hanzi:"Kaiti SC","STKaiti","KaiTi","Noto Serif CJK SC","Songti SC",serif}
*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);font-size:14px;line-height:1.55}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:default}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #dba59e;outline-offset:4px}button{transition:background .15s,color .15s,transform .15s}button:active:not(:disabled){transform:translateY(1px)}.site-header{max-width:1320px;margin:auto;padding:24px 44px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{text-decoration:none;display:flex;align-items:center;gap:13px}.brand-seal{display:grid;place-items:center;background:var(--red);color:white;font-family:var(--hanzi);font-size:34px;width:48px;height:48px;border-radius:11px}.brand strong{font-size:12px;letter-spacing:1.3px;display:block}.brand small{font-size:12px;color:var(--muted);display:block;margin-top:3px}.preview-pill{display:flex;align-items:center;gap:8px;color:#62675e;font-size:12px;background:#eeeee6;border:1px solid #e3e4d8;padding:7px 12px;border-radius:99px;white-space:nowrap}.preview-pill>span{height:6px;width:6px;border-radius:100%;background:#7c9167}main{max-width:1232px;margin:0 auto;padding:0 0 36px}.intro{display:flex;justify-content:space-between;align-items:center;padding:39px 0 35px}.eyebrow{font-size:11px;letter-spacing:2px;color:var(--red);font-weight:700;margin:0 0 9px}h1{font-size:40px;letter-spacing:-1.6px;font-weight:600;margin:0;line-height:1.2}h1 em{font-family:Georgia,"Times New Roman",serif;color:var(--red);font-weight:400;font-size:44px}.intro-copy{color:var(--muted);margin:13px 0 0;font-size:15px}.mobile-break{display:none}.intro-note{display:flex;align-items:center;gap:16px;margin-right:22px;color:#8c887d;line-height:1.8;font-size:13px}.note-mark{font-family:var(--hanzi);color:#d4cec0;font-size:62px;transform:rotate(-9deg)}.workspace{display:grid;grid-template-columns:304px minmax(0,1fr);gap:22px;align-items:start}.lookup,.lesson{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 5px 20px #332e1c03}.lookup{padding:23px 20px 18px;position:sticky;top:18px}.lookup-top{display:flex;align-items:center;gap:11px;margin-bottom:22px}.section-number{font-size:10px;font-weight:700;color:var(--red);border:1px solid #eac7bf;border-radius:50%;width:24px;height:24px;display:inline-grid;place-items:center;flex-shrink:0}.lookup h2{font-size:17px;letter-spacing:-.4px;margin:0}form label{font-size:12px;display:block;margin-bottom:8px;font-weight:600}.search-field{border:1.5px solid #cfb6ad;background:var(--paper);display:flex;align-items:center;padding:0 8px 0 12px;border-radius:9px;gap:8px;box-shadow:0 0 0 3px #b9382e06}.search-field>svg{width:17px;height:17px;fill:none;stroke:#8f8d84;stroke-width:1.8;flex-shrink:0}input[type=search]{min-width:0;width:100%;height:43px;border:0;background:none;outline:none;font-size:15px;color:var(--ink)}input[type=search]::placeholder{font-size:12px;color:#aaa69b}.search-field button{border:0;background:#eee9de;width:25px;height:25px;border-radius:5px;color:#777365;line-height:1}.input-hint{font-size:10px;color:#85857c;margin:8px 0 14px}.quick-search{display:flex;flex-wrap:wrap;gap:6px}.quick-search button{border:1px solid var(--line);background:#fff;border-radius:6px;padding:4px 9px;font-size:11px;color:#77766f}.quick-search button:hover,.quick-search button.active{background:var(--soft-red);border-color:#ecc3ba;color:var(--red)}.result-heading{display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:1px;color:#85857c;margin:27px 0 12px}.result-heading>span:last-child{letter-spacing:0}.results{display:grid;gap:7px;max-height:376px;overflow-y:auto;scrollbar-width:thin}.result{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:9px;padding:12px;text-align:left;width:100%;position:relative}.result:hover{background:#faf8f3}.result.selected{background:#fbf0ec;border-color:#eac0b4;box-shadow:inset 3px 0 0 var(--red)}.result-hanzi{font-family:var(--hanzi);font-size:28px;min-width:40px;line-height:1.3;color:#32302a}.result.selected .result-hanzi{color:var(--red)}.result-copy{flex:1;min-width:0}.result-pinyin{font-size:12px;color:#65645b;display:block;margin-bottom:3px}.result-meaning{display:block;font-size:12px;line-height:1.35}.result-arrow{color:#c6b9ac}.empty-results{padding:20px 12px;border-radius:9px;background:#faf8f3;color:#747167;font-size:13px}.empty-results strong{display:block;color:#3b3931;margin-bottom:7px}.lookup-tip{display:flex;gap:10px;color:#858078;font-size:11px;line-height:1.7;margin:22px 0 20px}.lookup-tip>span:first-child{font-size:18px;color:#b2a080}.lookup-tip strong{font-weight:500;color:#6c6559}.dictionary-scope{border-top:1px solid var(--line);padding-top:15px;font-size:10px;color:#8b877d;display:flex;align-items:center;gap:7px}.scope-dot{width:5px;height:5px;background:#8fa17d;border-radius:50%;flex-shrink:0}.lesson{padding:23px 28px 24px;min-width:0}.lesson-heading{display:flex;justify-content:space-between;align-items:center}.lesson-label{display:flex;align-items:center;gap:10px;font-size:10px;color:#8b877c;letter-spacing:1.2px}.simplified-badge{font-size:10px;color:#807e74;padding:4px 8px;background:#f6f4ee;border-radius:4px}.word-header{display:flex;align-items:center;justify-content:space-between;margin-top:23px;padding-bottom:23px;border-bottom:1px solid var(--line)}.word-title{display:flex;align-items:baseline;gap:17px}.word-title h2{font-family:var(--hanzi);font-size:45px;line-height:1.1;margin:0;font-weight:500;letter-spacing:3px}.word-title>span{font-size:18px;color:var(--red);font-weight:400}.word-header p{margin:9px 0 0;font-size:16px;color:#5b5a53}.word-count{border-left:1px solid var(--line);padding-left:23px;text-align:center;margin-right:4px}.word-count>span{font-size:25px;font-family:Georgia,serif;display:block;line-height:1.2}.word-count small{font-size:10px;color:var(--muted)}.lesson-body{display:grid;grid-template-columns:minmax(255px,1fr) 205px;gap:28px;padding-top:22px}.writing-panel{max-width:360px;width:100%;margin:0 auto}.character-tabs{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:17px;min-height:40px}.character-tab{border:1px solid #e7e3da;background:white;padding:5px 12px;border-radius:7px;display:flex;gap:8px;align-items:center;color:#8a867b}.character-tab .char{font-size:20px;font-family:var(--hanzi)}.character-tab .pinyin{font-size:11px}.character-tab.active{border-color:#c38374;background:#fff8f4;color:var(--red)}.paper-wrap{display:flex;flex-direction:column;align-items:center}.paper{width:100%;max-width:300px;aspect-ratio:1;background:var(--paper);border:1px solid #d7c5b5;position:relative;border-radius:2px;box-shadow:0 3px 12px #4d39200a;overflow:hidden}.paper:before,.paper:after{content:"";position:absolute;z-index:2;width:13px;height:13px;pointer-events:none}.paper:before{border-top:2px solid var(--red);border-left:2px solid var(--red);top:-1px;left:-1px}.paper:after{border-right:2px solid var(--red);border-bottom:2px solid var(--red);bottom:-1px;right:-1px}.paper-grid{position:absolute;width:100%;height:100%;pointer-events:none;inset:0}.paper-grid path{fill:none;stroke:#dfd2c2;stroke-width:1;stroke-dasharray:5 5}#writer{position:absolute;inset:0;touch-action:none}#writer svg{display:block;width:100%;height:100%}.paper-caption{font-size:10px;color:#aaa08f;margin-top:9px;min-height:16px}.progress-row{display:flex;justify-content:space-between;align-items:center;margin-top:16px;font-size:11px;color:#888174}.progress-track{height:3px;background:#eee9e0;border-radius:4px;overflow:hidden;margin:9px 0 17px}.progress-track>div{height:100%;width:0;background:var(--red);transition:width .2s}.primary-controls{display:flex;gap:9px}.button-primary{flex:1;border:0;border-radius:8px;display:flex;justify-content:center;align-items:center;gap:8px;background:var(--red);color:white;height:43px;font-size:13px;font-weight:600}.button-primary:hover:not(:disabled){background:var(--red-dark)}.button-primary svg{width:15px;height:15px;fill:currentColor;stroke:none}.button-icon{width:45px;border:1px solid #dfd8cb;background:white;border-radius:8px;color:#766a57;font-size:21px}.secondary-controls{display:flex;gap:9px;margin-top:9px}.secondary-controls button{width:50%;border:1px solid #e5dfd5;border-radius:7px;background:white;height:36px;font-size:11px;display:flex;justify-content:center;align-items:center;gap:7px;color:#6a6254}.secondary-controls button:hover:not(:disabled){background:#f7f3ec}.secondary-controls svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}.learning-notes{padding-top:6px;min-width:0}.note-card{background:#f7f5ef;padding:16px;border-radius:10px}.note-label{font-size:9px;font-weight:700;letter-spacing:1.2px;color:#8d806b;margin:0 0 11px}.note-card ol{padding:0;margin:0;list-style:none;display:grid;gap:13px}.note-card li{font-size:11px;line-height:1.6;color:#777267;display:flex;gap:9px}.note-card li>span{font-size:9px;background:#ebe7dd;color:#847b6b;flex-shrink:0;border-radius:50%;width:17px;height:17px;display:grid;place-items:center;margin-top:2px}.settings{padding:19px 0 16px;border-bottom:1px solid var(--line);display:grid;gap:15px}.settings label{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;color:#6f6a60}.settings select{border:1px solid #e0dbd0;border-radius:5px;background:white;font-size:11px;padding:4px 6px;color:#6c665a}.outline-label{position:relative;cursor:pointer}.outline-label input{position:absolute;right:0;opacity:0;width:34px;height:20px;cursor:pointer}.switch{width:32px;height:18px;background:#d8d5cd;border-radius:99px;position:relative;pointer-events:none}.switch:after{content:"";width:12px;height:12px;position:absolute;top:3px;left:3px;border-radius:50%;background:white;transition:left .2s}.outline-label input:checked+.switch{background:#789071}.outline-label input:checked+.switch:after{left:17px}.outline-label input:focus-visible+.switch{outline:2px solid var(--red);outline-offset:3px}.practice-feedback{color:#8a8274;font-size:11px;line-height:1.7;padding:14px 0;min-height:68px}.practice-feedback.success{color:var(--green)}.example-card{border-top:1px solid var(--line);padding-top:17px}.example-hanzi{font-family:var(--hanzi);font-size:22px;line-height:1.5;margin:3px 0 7px}.example-pinyin{font-size:11px;color:var(--red);margin:0 0 7px}.example-card>p:last-child{font-size:12px;color:#777267;margin:0}.stroke-sequence{border-top:1px solid var(--line);margin-top:25px;padding-top:17px}.stroke-sequence>div:first-child{display:flex;justify-content:space-between;align-items:center}.stroke-sequence .note-label{margin:0}.sequence-hint{font-size:9px;color:#a29a8c}.stroke-strip{display:flex;gap:7px;overflow-x:auto;padding:13px 1px 3px;scrollbar-width:thin}.stroke-tile{width:48px;min-width:48px;padding:3px 1px 2px;border:1px solid #ede7dc;border-radius:5px;background:#fcfaf5;display:flex;align-items:center;flex-direction:column;gap:1px;color:#a09888}.stroke-tile svg{width:40px;height:40px}.stroke-tile small{font-size:9px}.stroke-tile.current{border-color:#c97865;background:#f9eee7}.about-demo{display:grid;grid-template-columns:1.5fr 1fr;gap:50px;margin-top:29px;padding:0 5px;color:#8c887f;font-size:11px;line-height:1.8}.about-demo h2{font-size:13px;color:#716c61;font-weight:600;margin:0 0 5px}.about-demo p{margin:0 0 8px}.about-demo details{padding-top:2px}.about-demo summary{cursor:pointer;color:#827868;font-size:11px}.about-demo details p{margin-top:9px}.about-demo a{color:var(--red)}footer{max-width:1232px;margin:auto;padding:19px 0 23px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:#999385;font-size:9px;letter-spacing:1.1px}.load-error{border:1px solid #edc9c2;background:#fff1ef;color:#96382d;padding:15px;border-radius:8px;margin-top:16px}
@media(min-width:1450px){main{padding-top:10px}.intro{padding-top:45px;padding-bottom:40px}}
@media(max-width:1320px){main,footer{margin-left:34px;margin-right:34px}.site-header{padding-left:34px;padding-right:34px}.workspace{grid-template-columns:285px minmax(0,1fr)}.lesson{padding:22px}.lesson-body{gap:22px;grid-template-columns:minmax(225px,1fr) 185px}.paper{max-width:280px}.intro-note{margin-right:3px}}
@media(max-width:1050px){.workspace{grid-template-columns:260px minmax(0,1fr);gap:16px}.lookup{padding:20px 16px}.lesson-body{grid-template-columns:minmax(200px,1fr);gap:22px}.writing-panel{max-width:340px}.paper{max-width:300px}.learning-notes{display:grid;grid-template-columns:1fr 1fr;gap:12px 22px;padding:0}.note-card{grid-row:span 2}.settings{padding:0 0 12px}.practice-feedback{grid-column:1/-1;grid-row:3;padding:0;min-height:0}.example-card{grid-column:2;grid-row:2;border:0;padding:0}.intro-note{display:none}.word-title{flex-wrap:wrap;gap:8px 15px}.stroke-sequence{margin-top:20px}}
@media(max-width:720px){.site-header{padding:17px 20px}.brand-seal{width:39px;height:39px;border-radius:8px;font-size:29px}.brand{gap:10px}.brand strong{font-size:9px;letter-spacing:.7px}.brand small{font-size:10px}.preview-pill{font-size:9px;padding:5px 8px;gap:5px}.preview-pill>span{width:4px;height:4px}main,footer{margin-left:18px;margin-right:18px}.intro{padding:27px 3px 26px}h1{font-size:32px;letter-spacing:-1px;line-height:1.25}h1 em{font-size:35px}.intro-copy{font-size:12px;margin-top:10px}.eyebrow{font-size:9px;margin-bottom:8px}.workspace{grid-template-columns:1fr;gap:15px}.lookup{position:static;padding:19px 18px 15px;border-radius:13px}.lookup-top{margin-bottom:14px}.lookup h2{font-size:15px}.input-hint{margin-bottom:11px}.result-heading{margin:17px 0 9px}.results{display:flex;gap:8px;max-height:200px;flex-wrap:wrap;overflow-y:auto}.result{flex:1 1 130px;padding:10px;max-width:100%}.result-hanzi{font-size:25px;min-width:26px}.result-copy{min-width:65px}.result-pinyin,.result-meaning{font-size:11px}.lookup-tip{margin:13px 0 10px;font-size:10px;gap:7px}.lookup-tip>span:first-child{font-size:14px}.dictionary-scope{padding-top:10px;font-size:9px}.lesson{border-radius:13px;padding:19px 18px}.lesson-label{font-size:9px;letter-spacing:.6px}.word-header{margin-top:20px;padding-bottom:18px}.word-title h2{font-size:39px}.word-title>span{font-size:16px}.word-header p{font-size:14px}.word-count{padding-left:14px}.lesson-body{padding-top:18px;gap:25px}.paper{max-width:290px}.character-tabs{margin-bottom:14px}.primary-controls .button-primary{height:46px}.secondary-controls button{height:40px}.learning-notes{gap:15px 18px}.note-card{padding:13px}.note-card ol{gap:11px}.note-card li{font-size:10px}.example-hanzi{font-size:21px}.example-pinyin{font-size:10px}.sequence-hint{font-size:8px}.about-demo{grid-template-columns:1fr;gap:10px;margin-top:22px;font-size:10px}.about-demo h2{font-size:12px}footer{padding-top:15px;font-size:8px;letter-spacing:.5px;gap:15px}footer>span:last-child{text-align:right}.search-field input{height:44px;font-size:16px}.mobile-break{display:block}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}}

/* Same-origin embedded mode uses the website header and page introduction. */
.script-filter{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:15px;color:#70675b;font-size:11px}.script-filter select{max-width:150px;border:1px solid #ded7cb;border-radius:6px;background:#fff;padding:6px 8px;color:#625c51;font-size:12px}.more-results,.retry-load{display:block;width:100%;border:1px solid #ded7cb;border-radius:7px;padding:10px;background:#faf7f1;color:#8d3b31;font-size:11px;margin-top:10px}.retry-load{max-width:290px}.more-results[hidden],.retry-load[hidden],.reading-options[hidden],.definition-note[hidden],.example-card[hidden]{display:none}.result-copy{min-width:0}.result-meaning{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere}.result-tag{display:block;font-size:9px;color:#938a7c;margin-top:4px}.result-hanzi{max-width:90px;overflow-wrap:anywhere}.word-header{align-items:flex-start;gap:14px}.word-header>div:first-child{min-width:0;flex:1}.word-title{flex-wrap:wrap}.word-title h2{overflow-wrap:anywhere;line-height:1.3}.word-header #word-meaning{white-space:pre-line;overflow-wrap:anywhere;line-height:1.65}.word-header .word-source{font-size:10px;line-height:1.5;color:#8c7258;margin-top:9px}.word-header .definition-note{font-size:11px;line-height:1.65;color:#8b7968;margin-top:5px}.word-count{flex-shrink:0;margin-top:3px}.reading-options{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:14px;font-size:11px;color:#8a7a63}.reading-options button{border:1px solid #e5ded1;border-radius:6px;background:#fff;padding:5px 9px;color:#6d6558;font-size:12px}.reading-options button.active{border-color:#b9382e;color:#a23027;background:#fff5ed}.dictionary-scope{line-height:1.65}.results{overscroll-behavior:contain}@media(max-width:720px){.script-filter select{min-height:36px}.word-title h2{font-size:35px}.word-header .definition-note{font-size:10px}.more-results{min-height:40px}.reading-options button{min-height:34px}.result-hanzi{max-width:65px}.result-tag{font-size:8px}}
.embedded .site-header,.embedded .intro,.embedded .about-demo,.embedded footer{display:none}.embedded body{margin:0;background:transparent;min-height:0}.embedded main{margin:0;padding:0;max-width:none;width:100%}.embedded .lookup{position:static}.embedded .workspace{align-items:start}.embedded .load-error{margin:12px 0 0}.embedded .result{min-height:54px}@media(max-width:720px){.embedded .lesson{scroll-margin-top:18px}}

/* Pronunciation sits with the selected reading, independently of stroke playback. */
.pronunciation{margin-top:17px;padding:15px 16px 10px;background:#faf6ef;border:1px solid #ece3d7;border-radius:10px;min-width:0}.pronunciation-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.pronunciation-controls button,.character-audio button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:9px 13px;border:1px solid #ddc4b9;border-radius:8px;background:#fff;color:#94402f;font-size:12px;font-weight:600;line-height:1.45;max-width:100%;white-space:normal}.pronunciation-controls svg,.character-audio svg{width:18px;height:18px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.pronunciation-controls .listen-main{background:var(--red);border-color:var(--red);color:#fff}.pronunciation-controls button:hover:not(:disabled),.character-audio button:hover:not(:disabled){background:#f6e9e2}.pronunciation-controls .listen-main:hover:not(:disabled){background:var(--red-dark)}.pronunciation-controls .listen-stop{border-color:#d9d3c8;color:#6b6358}.pronunciation-controls .listen-stop svg{fill:currentColor;stroke:none}.pronunciation-controls button.is-playing,.character-audio button.is-playing{box-shadow:0 0 0 3px #b9382e23}.pronunciation-description,.pronunciation-status{font-size:11px;color:#7b7061;line-height:1.65;overflow-wrap:anywhere}.pronunciation-description{margin:10px 0 0}.pronunciation-status{margin:5px 0 0;min-height:0;color:var(--green)}.pronunciation-status:empty{display:none}.pronunciation-status.audio-error{color:#9b3a2c}.character-audio{display:flex;justify-content:center;margin:-7px 0 14px}.character-audio button{min-height:44px;padding:7px 13px;background:#fffefa;border-color:#e4dacc;font-size:11px;font-weight:500}.pronunciation-controls [hidden],.character-audio[hidden]{display:none}@media(max-width:720px){.pronunciation{padding:12px;margin-top:14px}.pronunciation-controls{gap:7px}.pronunciation-controls button{font-size:11px;padding:9px 10px;flex:1 1 120px}.pronunciation-controls .listen-stop{flex:0 1 auto}.pronunciation-description,.pronunciation-status{font-size:10px}.character-audio{margin-top:-5px}}

.character-audio{flex-wrap:wrap}.character-audio>p{width:100%;margin:0;text-align:center;font-size:11px;line-height:1.6;color:var(--muted)}.character-audio>p[hidden]{display:none}.audio-credit{font-size:10px;line-height:1.7;color:var(--muted);margin:20px 0 0}.audio-credit a{color:var(--red)}.embedded .audio-credit{display:none}