:root{--paper:#fbf8ee;--white:#fffdf6;--ink:#384f49;--muted:#8e9580;--green:#50765c;--sage:#e8efdf;--line:#dddcc7;--peach:#e5a58f;--gold:#c6a464;--red:#b97466}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Segoe UI","Microsoft YaHei",sans-serif;font-size:14px;background-image:radial-gradient(#c7b88926 .7px,transparent .7px);background-size:14px 14px}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,textarea:focus-visible{outline:3px solid #88a483;outline-offset:4px}button:disabled{cursor:not-allowed;opacity:.45}[hidden]{display:none!important}.learn-header{max-width:1320px;margin:auto;min-height:78px;display:flex;align-items:center;justify-content:space-between;padding:14px 30px;border-bottom:1px solid var(--line);gap:16px}.learn-brand{font-size:23px;font-weight:850;white-space:nowrap}.learn-brand>span{font-size:26px;color:var(--green)}.learn-brand small{font-size:11px;font-weight:400;color:var(--muted);margin-left:9px}.learn-header nav{display:flex;align-items:center;gap:23px;color:#7d8d78;font-size:12px}#learnerLabel{border-left:1px solid var(--line);padding-left:18px;font-size:11px}.quiet-button{border:0;background:none;color:inherit;padding:6px}.learn-map,.learn-stage{max-width:1240px;margin:auto;padding:36px 30px 64px}.eyebrow{font-size:10px;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold);font-weight:700}.map-hero{display:grid;grid-template-columns:1.2fr 1fr;gap:50px;align-items:center;margin-bottom:29px}.map-hero h1{font-family:Georgia,"Microsoft YaHei",serif;font-weight:700;font-size:38px;line-height:1.5;letter-spacing:-1px;margin:14px 0}.map-hero p{color:#89907b;line-height:1.9;max-width:520px}.map-hero canvas{width:100%;aspect-ratio:1.62;border-radius:42% 42% 22% 22%;border:1px solid var(--line);background:#e4eedc}.primary-button{border:1px solid var(--green);background:var(--green);border-radius:12px;color:white;min-height:46px;padding:12px 24px;font-weight:700;box-shadow:0 3px 0 #395a4230}.secondary-button{border:1px solid var(--line);background:var(--white);border-radius:12px;min-height:44px;padding:11px 21px;color:var(--ink)}.hero-actions{display:flex;align-items:center;gap:15px;margin-top:21px}.hero-actions small{font-size:11px;color:#949780}.map-summary{display:flex;align-items:center;gap:22px;border-block:1px solid var(--line);padding:17px 3px;margin:27px 0}.map-summary strong{font:26px Georgia,serif;color:var(--green);margin-right:5px}.map-summary span{font-size:11px;color:var(--muted)}.map-progress{height:5px;background:#e4e7d7;flex:1;border-radius:6px;margin-inline:15px}.map-progress i{display:block;height:100%;background:#a1b584;border-radius:6px}.chapter-picker{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.chapter-button{border:1px solid var(--line);border-radius:12px;min-height:78px;padding:13px;text-align:left;color:#7e8b74;background:#fffdf580}.chapter-button small{display:flex;justify-content:space-between;font-size:10px;margin-bottom:9px;opacity:.65}.chapter-button b{font-size:12px;font-weight:600}.chapter-button[aria-pressed=true]{color:white;background:var(--green);border-color:var(--green)}.chapter-heading{margin:38px 0 20px;display:flex;justify-content:space-between;align-items:end;gap:20px}.chapter-heading h2{font-family:Georgia,"Microsoft YaHei",serif;font-size:26px;margin:9px 0}.chapter-heading p{color:var(--muted);font-size:12px;margin:0;line-height:1.8}.chapter-heading>span{font-size:11px;color:#a3a68a;white-space:nowrap}.course-lessons{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.course-lesson{position:relative;border:1px solid var(--line);border-radius:18px;padding:20px;background:var(--white);text-align:left;color:var(--ink);min-height:128px;transition:transform .15s,border-color .15s}.course-lesson:hover{transform:translateY(-2px);border-color:#91aa88}.course-lesson.current{background:#eef3e5;border:2px solid #9caf84;padding:19px}.course-lesson.locked{background:#f8f7ef;color:#a3a995}.course-lesson.game-card{background:#f6efdf}.course-lesson.game-card.locked{background:#f6f2e8}.lesson-top{display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:1px;color:#9d9e87}.lesson-top .lesson-symbol{font-size:17px;letter-spacing:0;color:var(--green)}.course-lesson h3{font-size:15px;margin:17px 0 9px;font-weight:650}.course-lesson p{font-size:10px;color:#9da38c;margin:0}.lesson-stars{position:absolute;right:19px;bottom:19px;font-size:11px;color:var(--gold)}.map-footer{font-size:11px;color:#9b9c86;border-top:1px solid var(--line);padding-top:20px;margin-top:35px;display:flex;justify-content:space-between;gap:15px}.map-footer a{text-decoration:underline;text-underline-offset:3px}
.stage-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.stage-top-left{display:flex;align-items:center;gap:17px}.round-button{width:40px;height:40px;border:1px solid var(--line);border-radius:13px;background:var(--white);color:var(--ink);font-size:20px}.stage-top h1{font-size:19px;margin:6px 0 0;font-weight:650}.stage-top .eyebrow{font-size:9px}.stage-actions{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:11px}.stage-progress{height:4px;background:#e3e7d8;border-radius:4px;overflow:hidden;margin:0 0 22px}.stage-progress i{display:block;background:#a2b482;height:100%;transition:width .15s}.stage-stats{display:flex;justify-content:center;gap:60px;margin-bottom:16px}.stat{font-size:10px;color:#a0a18c;display:flex;gap:8px;align-items:baseline}.stat strong{font:22px Georgia,serif;color:var(--green)}.typing-panel{border:1px solid var(--line);border-radius:22px;background:var(--white);padding:28px 32px 21px;box-shadow:0 3px 0 #d1ccb315;position:relative}.typing-panel:focus-within{border-color:#a7b68b}.typing-panel-head{display:flex;justify-content:space-between;align-items:center;color:#9d9c82;font-size:11px;gap:16px;margin-bottom:21px}.typing-panel-head .book-title{font:18px Georgia,serif;color:#9a8056}.key-tiles{display:flex;gap:14px;justify-content:center;align-items:center;min-height:123px;padding:8px}.typing-tile{width:75px;height:88px;border-radius:16px;display:flex;align-items:center;justify-content:center;font:46px Georgia,serif;border:1px solid #e0e2d3;background:#f6f5eb;position:relative;color:#b5b9a3}.typing-tile.current{width:87px;height:104px;color:#405b46;background:#edf2dc;border:2px solid #a7b788;box-shadow:0 5px 0 #dce3c7;font-size:58px}.typing-tile.done{background:#eef2e5;color:#819665;border-color:#dce4cb}.typing-tile .tile-check{position:absolute;top:7px;right:9px;font:11px "Segoe UI",sans-serif}.had-error{ text-decoration:underline dotted #c18b79;text-underline-offset:6px}.typing-tile.had-error::after{content:"·";color:#c28b78;position:absolute;bottom:1px;left:10px;font:20px serif}.lesson-text{font-family:Georgia,"Times New Roman",serif;font-size:26px;line-height:1.95;letter-spacing:.2px;white-space:pre-wrap;overflow-wrap:break-word;max-height:270px;overflow-y:auto;scrollbar-width:thin;padding:3px 5px 13px;color:#7c7e68}.lesson-text .done{color:#8da36f}.lesson-text .current{color:#405e42;background:#e8edce;border-bottom:3px solid #a9b983;border-radius:2px}.typing-intro{display:flex;align-items:center;justify-content:center;gap:30px;padding:10px 15px 21px}.intro-key{width:105px;height:112px;border:2px solid #afbb8f;background:#f0f4df;border-radius:23px;box-shadow:0 6px 0 #e0e6cc;display:grid;place-items:center;font:76px Georgia,serif;color:#4c674d}.typing-intro>div:last-child{max-width:430px}.typing-intro h2{font-size:19px;line-height:1.8;margin:0 0 8px}.typing-intro p{color:#98a084;font-size:12px;line-height:1.8;margin:0}.input-row{display:flex;align-items:center;justify-content:space-between;border-top:1px dashed var(--line);margin-top:21px;padding-top:14px;gap:15px}.input-row label{font-size:11px;color:#9b9b83;white-space:nowrap}.course-capture{height:37px;min-height:37px;resize:none;border:1px solid #d9dfc4;background:#fffefa;border-radius:9px;color:var(--ink);padding:8px 13px;flex:1;width:100%;outline:0;line-height:20px;overflow:hidden}.course-capture:focus{box-shadow:0 0 0 3px #c6d1a930;border-color:#a6b98c}.course-feedback{font-size:12px;color:#829271;min-height:21px;text-align:center;margin:17px 0 0}.course-feedback.wrong{color:var(--red)}.wrong-badge{font-size:11px;color:var(--red);text-align:center;min-height:17px;margin:4px 0}.keyboard-panel{max-width:1020px;margin:0 auto;position:relative}.keyboard-caption{display:flex;align-items:center;justify-content:center;gap:10px;color:#849377;font-size:12px;margin-top:13px;min-height:26px;text-align:center}.keyboard-caption kbd{font-family:inherit;padding:4px 9px;background:#edf0e2;border:1px solid var(--line);border-radius:5px}.course-keyboard{width:100%;height:auto;display:block;overflow:visible}.keycap rect{fill:#fffcf2;stroke:#d7d9c7;stroke-width:1.2}.keycap.expected rect{fill:#dfe9c8;stroke:#a8b883;stroke-width:2}.keycap.anchor-key rect{fill:#f5e9c8;stroke:#cfb779;stroke-width:2}.keycap.pressed rect{fill:#c5d7ab}.keycap.wrong-key rect{fill:#f3d8d0;stroke:#d89d8e}.key-label{font:15px "Segoe UI",sans-serif;fill:#8c947c;text-anchor:middle;pointer-events:none}.selected-label{fill:#365c3e;font-weight:700}.home-bump{fill:none;stroke:#b3b898;stroke-width:2;stroke-linecap:round}.hand-outline{fill:#fffdf6b3;stroke:#a8ad99;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}.palm-crease{fill:none;stroke:#cdd1ba;stroke-width:1.4}.finger-contact path{fill:none;stroke:#a7bb8590;stroke-width:22;stroke-linecap:round}.finger-contact circle{fill:#a7bb8550;stroke:#6c905b;stroke-width:1.4}.finger-contact.anchored path{stroke:#d7ba7955}.finger-contact.anchored circle{stroke:#b89b58;fill:#e9cf8b66}.contact-radar{fill:none;stroke:#8fa773;stroke-width:1.4;opacity:.7;pointer-events:none}.stage-note{text-align:center;color:#aaa68e;font-size:10px;line-height:1.8;margin:2px 0 12px}.breathing-rest{text-align:center;padding:50px 10px}.rest-circle{width:105px;height:105px;border:1px solid #d7dfbf;border-radius:50%;display:grid;place-items:center;margin:10px auto 25px;background:#edf3df;font:40px Georgia,serif;color:#8ca36e;animation:breathe 5s ease-in-out infinite}.breathing-rest h2{font-family:Georgia,"Microsoft YaHei",serif;font-size:28px}.breathing-rest p{line-height:2.2;color:#8d987e;margin-bottom:26px}.rest-tips{display:flex;justify-content:center;gap:12px;margin-bottom:30px}.rest-tips span{font-size:12px;padding:11px 17px;border:1px solid var(--line);border-radius:12px}
.course-game-canvas{display:block;width:100%;height:385px;border-radius:22px;border:1px solid #c8ceb2;background:#e8efdf}.course-game-panel{position:relative}.game-rule-strip{display:flex;align-items:center;justify-content:space-between;gap:20px;background:var(--white);border:1px solid var(--line);border-radius:14px;padding:14px 21px;margin-bottom:16px;font-size:12px;color:#929879}.game-rule-strip strong{font:23px Georgia,serif;color:#8b9e74}.game-rule-strip .hearts{color:#d19b86;letter-spacing:4px}.game-start-card{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#fdf9ec66;border-radius:22px;backdrop-filter:blur(2px);padding:20px}.game-start-card>div{max-width:430px;text-align:center;border:1px solid var(--line);background:#fffcefef;border-radius:23px;padding:30px 35px;box-shadow:0 7px 0 #7a8f5310}.game-start-card h2{font-family:Georgia,"Microsoft YaHei",serif;font-size:26px;margin:12px 0}.game-start-card p{font-size:12px;color:#859277;line-height:1.9;margin-bottom:20px}.game-typing{margin-top:17px}.game-typing .typing-panel{padding:17px 25px}.game-typing .lesson-text{font-size:24px;max-height:185px;line-height:1.9}.game-typing .input-row{margin-top:10px;padding-top:10px}.fishing-targets{display:flex;justify-content:center;gap:12px;min-height:42px;align-items:center;font:23px Georgia,serif;color:#77915b}.fishing-targets span{background:#f1f4e7;border-radius:8px;padding:5px 11px}.fishing-targets span.active{border:1px solid #b2c58e}.fishing-targets .typed{color:#adb798}.travel-layout{display:grid;grid-template-columns:.88fr 1.25fr;gap:20px;align-items:start}.travel-layout .course-game-canvas{height:425px}.travel-layout .game-typing{margin:0}.travel-layout .typing-panel{min-height:425px;display:flex;flex-direction:column}.travel-layout .lesson-text{font-size:22px;max-height:310px;line-height:1.9;flex:1}.travel-layout .input-row{margin-top:auto}.game-keyboard{max-width:760px}.game-keyboard .course-keyboard{margin-top:-10px}.learn-dialog{border:1px solid #ced4bb;border-radius:25px;background:#fffcf3;color:var(--ink);width:min(510px,calc(100% - 32px));padding:35px;box-shadow:0 15px 70px #3e4c3720}.learn-dialog::backdrop{background:#3b4b3838;backdrop-filter:blur(4px)}.dialog-eyebrow{font-size:10px;color:var(--gold);letter-spacing:2px}.learn-dialog h2{font-family:Georgia,"Microsoft YaHei",serif;font-size:28px;line-height:1.5}.learn-dialog p{font-size:13px;line-height:1.9;color:#8a947a}.dialog-actions{display:flex;gap:10px;margin-top:25px;flex-wrap:wrap}.dialog-actions>*{flex:1}.detail-rules{font-size:12px;line-height:2;color:#7a8b6d;padding:16px;border-radius:12px;background:#eef2e3}.result-symbol{font:55px Georgia,serif;color:#9fb37c}.result-stars{color:var(--gold);font-size:27px;letter-spacing:8px;margin:9px 0}.result-stats{display:flex;gap:20px;margin:25px 0;border-block:1px dashed var(--line);padding:17px 0}.result-stats>div{flex:1;font-size:11px;color:#949c80}.result-stats b{display:block;font:29px Georgia,serif;color:var(--green);margin-bottom:6px}.save-warning{color:#b97964!important}.learn-toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);background:#4c6553ed;color:#fffdf2;padding:12px 22px;border-radius:12px;opacity:0;pointer-events:none;transition:.2s;z-index:20;font-size:12px;max-width:90vw;text-align:center}.learn-toast.visible{opacity:1;transform:translate(-50%,0)}@keyframes breathe{50%{transform:scale(1.1);background:#e2ebce}}
@media(max-width:800px){.learn-header{padding:14px 20px;flex-wrap:wrap;gap:11px}.learn-header nav{gap:14px;flex-wrap:wrap}.learn-map,.learn-stage{padding:25px 20px 45px}.map-hero{gap:25px}.map-hero h1{font-size:30px}.chapter-picker{grid-template-columns:repeat(4,1fr)}.course-lessons{grid-template-columns:repeat(2,1fr)}.course-game-canvas{height:325px}.travel-layout{grid-template-columns:1fr 1.2fr;gap:13px}.travel-layout .course-game-canvas{height:400px}.travel-layout .lesson-text{font-size:20px}.stage-stats{gap:30px}.key-tiles{gap:9px}.typing-tile{width:62px;height:76px;font-size:37px}.typing-tile.current{width:72px;height:88px;font-size:49px}}
@media(max-width:540px){.learn-header{padding:13px 16px}.learn-brand{font-size:20px}.learn-brand small{font-size:10px}.learn-header nav{font-size:10px;gap:13px}#learnerLabel{border-left:0;padding:0;font-size:10px}.learn-map,.learn-stage{padding:23px 15px 40px}.map-hero{grid-template-columns:1fr;gap:23px}.map-hero h1{font-size:30px;margin:11px 0}.map-hero canvas{max-height:205px;aspect-ratio:1.85;border-radius:25px}.hero-actions{gap:10px}.hero-actions small{font-size:10px}.map-summary{gap:13px;flex-wrap:wrap;margin-top:25px}.map-summary strong{font-size:23px}.map-progress{margin:0;width:100%;flex:auto;order:3}.chapter-picker{grid-template-columns:repeat(3,1fr);gap:6px}.chapter-button{padding:10px;min-height:72px;border-radius:10px}.chapter-button b{font-size:10px}.chapter-heading{margin-top:27px;align-items:start}.chapter-heading h2{font-size:23px}.chapter-heading>span{font-size:9px}.course-lessons{gap:9px}.course-lesson{min-height:123px;padding:15px;border-radius:14px}.course-lesson.current{padding:14px}.course-lesson h3{font-size:12px;line-height:1.6;margin:12px 0 8px}.lesson-stars{right:13px;bottom:15px;font-size:9px}.course-lesson p{font-size:9px}.map-footer{font-size:10px;line-height:1.7;flex-direction:column}.stage-top{gap:8px;align-items:start}.stage-top-left{gap:10px}.stage-top h1{font-size:14px;line-height:1.6}.stage-top .eyebrow{font-size:8px;letter-spacing:1px}.round-button{width:33px;height:34px;flex-shrink:0;font-size:18px}.stage-actions{gap:3px;font-size:9px;flex-wrap:wrap;justify-content:end;max-width:115px}.stage-actions .quiet-button{padding:4px}.stage-stats{gap:17px;margin-bottom:13px;justify-content:space-between}.stat{font-size:9px;gap:4px}.stat strong{font-size:20px}.typing-panel{padding:18px 13px 13px;border-radius:17px}.typing-panel-head{font-size:9px;margin-bottom:16px}.typing-intro{gap:17px;padding:8px 1px 17px}.intro-key{width:76px;height:87px;flex-shrink:0;font-size:57px;border-radius:17px}.typing-intro h2{font-size:14px}.typing-intro p{font-size:10px}.key-tiles{gap:5px;min-height:93px;padding:8px 0}.typing-tile{width:39px;height:57px;font-size:29px;border-radius:10px}.typing-tile.current{width:44px;height:69px;font-size:37px;border-radius:11px}.typing-tile .tile-check{top:3px;right:4px;font-size:8px}.lesson-text{font-size:23px;line-height:1.95;max-height:250px}.input-row{gap:8px;margin-top:14px}.input-row label{font-size:9px}.course-capture{font-size:12px;padding:7px 9px}.keyboard-caption{font-size:10px;line-height:1.8;gap:6px;margin-top:10px;min-height:40px}.keyboard-panel{width:calc(100% + 20px);margin-left:-10px}.course-feedback{font-size:11px;margin-top:13px;min-height:30px}.stage-note{font-size:9px;margin-top:5px}.key-label{font-size:19px}.keycap rect{stroke-width:2}.hand-outline{stroke-width:2.7}.course-game-canvas{height:265px;border-radius:17px}.game-rule-strip{padding:11px 12px;gap:10px;font-size:10px;border-radius:12px}.game-rule-strip strong{font-size:20px}.game-rule-strip .hearts{letter-spacing:1px}.game-start-card{padding:13px}.game-start-card>div{padding:19px 20px}.game-start-card h2{font-size:22px;margin:8px 0}.game-start-card p{font-size:11px;margin-bottom:15px}.game-typing .typing-panel{padding:15px 13px}.game-typing .lesson-text{font-size:21px;max-height:200px}.fishing-targets{font-size:21px;gap:7px;flex-wrap:wrap}.travel-layout{grid-template-columns:1fr;gap:14px}.travel-layout .course-game-canvas{height:245px}.travel-layout .typing-panel{min-height:340px}.travel-layout .lesson-text{font-size:21px;max-height:300px}.learn-dialog{padding:26px}.learn-dialog h2{font-size:24px}.dialog-actions{gap:9px}.dialog-actions button{padding:10px;font-size:12px}.result-stats{gap:10px}.result-stats b{font-size:25px}.breathing-rest{padding:25px 4px}.rest-tips{gap:7px}.rest-tips span{padding:9px;font-size:10px}.breathing-rest h2{font-size:23px}.game-keyboard{width:100%;margin:0}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.learn-stage{padding-top:26px}.keyboard-panel{max-width:900px}.wrong-badge:empty{display:none}.typing-panel:has(.typing-intro){padding-top:22px;padding-bottom:17px}.typing-panel:has(.typing-intro) .typing-panel-head{margin-bottom:12px}.typing-panel:has(.typing-intro) .input-row{margin-top:14px;padding-top:10px}.typing-intro{padding-bottom:14px}.course-feedback{margin-top:12px}
@media(max-width:540px){.learn-stage{padding-top:20px}.keyboard-panel{max-width:none}.typing-panel:has(.typing-intro){padding:18px 13px 13px}.typing-panel:has(.typing-intro) .input-row{margin-top:11px}.typing-intro{padding-bottom:12px}}
.paragraph-marker{display:inline-block;min-width:24px;font-family:"Segoe UI",sans-serif;color:#718950;font-size:19px;background:#e7edce;border-radius:5px;text-align:center;font-weight:500}.keyboard-caption{color:#64785c}.course-lesson.locked h3{color:#718267}.game-rule-strip{flex-wrap:wrap}
.keyboard-panel{max-width:800px}.keycap rect{fill:#ffffffed;stroke:#d2d5d7;stroke-width:1.2}.keycap.expected rect{fill:#1688df;stroke:#087bd0;stroke-width:1.7}.keycap.anchor-key rect{fill:#e6f1fa;stroke:#6da4d3;stroke-width:1.6}.keycap.pressed rect{fill:#2992df}.keycap.wrong-key rect{fill:#f9e3e2;stroke:#d96c68}.key-label{fill:#858b90;font-size:16px}.selected-label{fill:white;font-weight:600}.expected .home-bump{stroke:#ffffff99}.contact-radar{stroke:#4c9be8;opacity:.7;stroke-width:1.2}.reviewed-hand-image{pointer-events:none}.real-hand-outline{fill:none;stroke:#686d70;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}.hand-nail{fill:none;stroke:#747a7e;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}.hand-joint{fill:none;stroke:#858b8f;stroke-width:1.2;stroke-linecap:round}.hand-tendon{fill:none;stroke:#a8adb0;stroke-width:.85;opacity:.65}.active-finger-outline{fill:none;stroke:#1688df;stroke-width:2.9;stroke-linecap:round;stroke-linejoin:round}.held-finger-outline{stroke:#6ba4d3;stroke-dasharray:6 3}.finger-contact .finger-pad-reference{fill:none;stroke:none;opacity:0}.typing-instruction{font-size:19px;color:#757c79;margin:7px 3px 20px;line-height:1.9}.typing-instruction kbd{display:inline-block;vertical-align:middle;min-width:34px;height:38px;line-height:38px;text-align:center;border-radius:5px;background:#1688df;color:white;font-size:22px;font-family:inherit;font-weight:650;margin:0 4px}.typing-only .input-row{position:absolute;left:0;bottom:0;width:1px;height:1px;overflow:hidden;border:0;padding:0;margin:0}.typing-only .course-capture{position:absolute;left:0;top:0;width:1px;height:1px;min-height:1px;padding:0;border:0;opacity:0;font-size:16px}.typing-only .typing-panel{cursor:text}.typing-only .typing-panel::after{content:"点击练习区，开始输入";display:block;text-align:right;color:#a1a18c;font-size:10px;margin-top:10px}.typing-only .typing-panel:focus-within::after{content:"键盘输入已就绪"}.typing-only #keyboardCaption{display:none}
@media(max-width:540px){.keyboard-panel{max-width:none}.typing-instruction{font-size:13px;margin-bottom:15px}.typing-instruction kbd{height:30px;line-height:30px;min-width:28px;font-size:18px}.key-label{font-size:19px}.real-hand-outline{stroke-width:2.6}.hand-nail{stroke-width:1.9}.hand-joint{stroke-width:1.5}}
.active-finger-detail{stroke:#1688df}.held-finger-detail{stroke:#6ba4d3}
.learner-list{max-height:40dvh;overflow:auto;margin:15px 0}.learner-row{display:flex;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid var(--line)}.learner-row strong{margin-right:auto;overflow-wrap:anywhere}.learner-row button{white-space:nowrap}.learner-form{display:flex;align-items:end;gap:10px;margin:16px 0}.learner-form label{flex:1;display:grid;gap:7px;font-size:12px;color:var(--muted)}.learner-form input{width:100%;min-width:0;border:1px solid var(--line);border-radius:9px;padding:11px;background:var(--white);color:var(--ink)}.learner-form button{font-size:12px;white-space:nowrap;padding:12px}#courseLearners{max-height:calc(100dvh - 28px);overflow:auto}