:root{--bg-body: #1a1a2e;--bg-panel: #16213e;--bg-key: #1a1a3a;--bg-key-hover: #2a2a5a;--bg-key-used: #2b2b31;--bg-punct: #12122a;--bg-subtitle: #2a2a4a;--bg-badge: #2a2a4a;--bg-char-active: #1a2a5a;--bg-level-bar: #2a2a4a;--bg-feedback-correct: #1a3a1a;--bg-feedback-wrong: #3a1a1a;--bg-target: #3a3a1a;--bg-error-item: #1a1a3a;--bg-modal-row: #1a1a3a;--bg-btn-hover: #2a2a4a;--bg-btn-secondary-hover: #2a1a1a;--bg-accent-soft: rgba(102, 126, 234, .12);--bg-stat-card: rgba(255, 255, 255, .035);--text-primary: #e0e0e0;--text-secondary: #888;--text-tertiary: #aaa;--text-dim: #777;--text-stat: #fff;--text-stat-label: #777;--text-level-label: #aaa;--text-bar: #aaa;--text-btn: #ccc;--text-btn-secondary: #888;--text-punct-label: #555;--text-vk-bottom: #888;--text-error-context: #888;--text-error-pinyin: #aaa;--hand-fill: #24294d;--hand-border: #4b557f;--finger-pinky: #f28cab;--finger-ring: #eebc58;--finger-middle: #5bd0b2;--finger-index: #7f98ff;--finger-thumb: #b58cff;--border-key: #333;--border-punct: #2a2a4a;--border-btn: #444;--border-btn-secondary: #333;--border-modal-row: #2a2a4a;--border-wide: #2a2a4a;--border-panel: rgba(255, 255, 255, .07);--overlay: rgba(0, 0, 0, .6);--accent: #667eea;--accent-gradient: linear-gradient(135deg, #667eea, #764ba2);--correct: #44cc44;--error: #ff4444;--target: #ffcc00;--char-done: #44cc44;--char-error: #ff4444;--char-inactive: #555;--pinyin-active: #667eea;--pinyin-inactive: #555;--panel-shadow: 0 18px 45px rgba(4, 8, 24, .18)}[data-theme=light]{--bg-body: #f0f2f5;--bg-panel: #ffffff;--bg-key: #e8ecf1;--bg-key-hover: #d0d4e0;--bg-key-used: #dedede;--bg-punct: #e0e4ea;--bg-subtitle: #e0e0e0;--bg-badge: #e8ecf1;--bg-char-active: #e0e8ff;--bg-level-bar: #e0e0e0;--bg-feedback-correct: #e8f5e8;--bg-feedback-wrong: #f5e8e8;--bg-target: #fff8e0;--bg-error-item: #f5f5f5;--bg-modal-row: #f5f5f5;--bg-btn-hover: #e0e0e0;--bg-btn-secondary-hover: #f5e8e8;--bg-accent-soft: rgba(102, 126, 234, .1);--bg-stat-card: #f7f8fb;--text-primary: #333;--text-secondary: #666;--text-tertiary: #888;--text-dim: #999;--text-stat: #222;--text-stat-label: #888;--text-level-label: #888;--text-bar: #888;--text-btn: #666;--text-btn-secondary: #999;--text-punct-label: #888;--text-vk-bottom: #999;--text-error-context: #666;--text-error-pinyin: #888;--hand-fill: #dfe5f3;--hand-border: #9aa7c7;--finger-pinky: #c54f78;--finger-ring: #a66a00;--finger-middle: #167b68;--finger-index: #4d63c9;--finger-thumb: #7851b8;--border-key: #ccc;--border-punct: #ccc;--border-btn: #ccc;--border-btn-secondary: #ddd;--border-modal-row: #e0e0e0;--border-wide: #ccc;--border-panel: rgba(32, 42, 68, .09);--overlay: rgba(0, 0, 0, .3);--char-inactive: #ccc;--pinyin-inactive: #ccc;--panel-shadow: 0 18px 45px rgba(47, 57, 89, .08)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans SC,sans-serif;background:var(--bg-body);color:var(--text-primary);min-height:100vh;transition:background .3s,color .3s}.app{display:flex;flex-direction:column;min-height:100vh;max-width:1360px;margin:0 auto;padding:0 20px}.app-header{display:flex;align-items:center;gap:14px;padding:14px 0 6px}.app-title{font-size:23px;font-weight:700;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.app-subtitle{font-size:14px;color:var(--text-secondary);background:var(--bg-subtitle);padding:3px 12px;border-radius:10px}.header-right{margin-left:auto;display:flex;align-items:center;gap:10px}.theme-toggle{background:var(--bg-subtitle);border:1px solid var(--border-key);border-radius:8px;padding:6px 12px;color:var(--text-secondary);font-size:14px;cursor:pointer;transition:all .2s;font-family:inherit}.theme-toggle:hover{border-color:var(--accent);color:var(--accent)}.settings-menu{position:relative}.settings-trigger{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;color:var(--text-secondary);background:var(--bg-subtitle);border:1px solid var(--border-key);border-radius:8px;font:inherit;font-size:14px;cursor:pointer;transition:color .2s,border-color .2s,background .2s}.settings-trigger:hover,.settings-trigger.active{color:var(--accent);border-color:var(--accent);background:var(--bg-accent-soft)}.settings-popover{position:absolute;top:calc(100% + 10px);right:0;z-index:10001;width:min(330px,calc(100vw - 24px));padding:16px;color:var(--text-primary);background:var(--bg-panel);border:1px solid var(--border-panel);border-radius:14px;box-shadow:0 22px 60px #04081857}.settings-popover-header{display:flex;align-items:baseline;justify-content:space-between;padding:0 2px 12px;border-bottom:1px solid var(--border-panel)}.settings-popover-header strong{font-size:15px}.settings-popover-header span{color:var(--text-dim);font-size:11px}.settings-options{display:flex;flex-direction:column;padding-top:4px}.input-mode-setting{margin:14px 0 6px;padding:0 0 14px;border:0;border-bottom:1px solid var(--border-panel)}.input-mode-setting legend{margin-bottom:9px;padding:0 2px;color:var(--text-dim);font-size:11px}.input-mode-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.input-mode-option{position:relative;display:flex;min-width:0;padding:10px;flex-direction:column;gap:3px;border:1px solid var(--border-key);border-radius:10px;background:var(--bg-key);cursor:pointer;transition:border-color .2s,background .2s}.input-mode-option.active{border-color:var(--accent);background:var(--bg-accent-soft)}.input-mode-option input{position:absolute;width:1px;height:1px;opacity:0}.input-mode-option:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}.input-mode-option strong{color:var(--text-primary);font-size:13px}.input-mode-option small{color:var(--text-dim);font-size:10px;line-height:1.35}.setting-option{position:relative;display:flex;align-items:center;gap:14px;padding:11px 2px;cursor:pointer}.setting-option+.setting-option{border-top:1px solid var(--border-panel)}.setting-copy{display:flex;min-width:0;flex:1;flex-direction:column;gap:3px}.setting-copy strong{font-size:14px;font-weight:600}.setting-copy small{color:var(--text-dim);font-size:11px;line-height:1.4}.setting-option input{position:absolute;width:1px;height:1px;opacity:0}.setting-switch{position:relative;width:38px;height:22px;flex-shrink:0;background:var(--bg-level-bar);border:1px solid var(--border-key);border-radius:999px;transition:background .2s,border-color .2s}.setting-switch:after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;background:var(--text-tertiary);border-radius:50%;transition:transform .2s,background .2s}.setting-option input:checked+.setting-switch{background:var(--accent);border-color:var(--accent)}.setting-option input:checked+.setting-switch:after{background:#fff;transform:translate(16px)}.setting-option input:focus-visible+.setting-switch{outline:2px solid var(--accent);outline-offset:3px}.app-main{display:flex;flex:1;gap:24px;padding:10px 0 24px}.center-section{flex:1;display:flex;flex-direction:column;gap:14px;min-width:0}.top-area{display:flex;gap:18px;align-items:stretch}.center-section.keyboard-hidden .top-area{flex:1;min-height:0}.question-panel{flex:1;background:var(--bg-panel);border:1px solid var(--border-panel);border-radius:18px;padding:22px 28px 26px;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:320px;box-shadow:var(--panel-shadow);overflow:hidden;transition:background .3s,border-color .3s}.question-header{font-size:13px;color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px;width:100%;margin-bottom:18px;display:flex;align-items:center;gap:8px}.question-loading{gap:10px;color:var(--text-secondary);font-size:14px}.question-loading-dot{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px var(--bg-accent-soft);animation:question-loading-pulse 1.2s ease-in-out infinite}@keyframes question-loading-pulse{50%{opacity:.35;transform:scale(.8)}}.question-progress{margin-left:auto;color:var(--text-dim);font-size:12px;letter-spacing:0;text-transform:none;font-variant-numeric:tabular-nums}.question-source{flex:1;min-width:0;overflow:hidden;color:var(--text-secondary);font-size:12px;letter-spacing:0;text-align:center;text-overflow:ellipsis;text-transform:none;white-space:nowrap}.type-badge{font-size:12px;color:var(--text-tertiary);color:var(--accent);background:var(--bg-accent-soft);padding:4px 12px;border-radius:999px;text-transform:none;letter-spacing:0}.question-main{display:flex;flex-direction:column;align-items:center;flex:1;justify-content:center;width:100%;margin-bottom:18px}.pinyin-display{font-size:42px;color:var(--accent);font-weight:600;letter-spacing:6px}.char-display{font-size:80px;font-weight:700;color:var(--text-stat);margin-top:10px}.syllables-row{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 6px;width:100%}.poem-lines{display:flex;flex-direction:column;gap:12px;width:100%}.poem-line{align-items:flex-end}.poem-punctuation{padding-bottom:12px;color:var(--text-secondary);font-size:36px;font-weight:600;line-height:1}.syllable-unit{display:inline-flex;min-width:58px;padding:7px 7px 8px;flex-direction:column;align-items:center;color:var(--char-inactive);border:1px solid transparent;border-radius:12px;transition:all .2s}.syllable-unit .char-unit{font-size:52px;font-weight:700;line-height:1.08;transition:color .2s}.syllable-unit.done{color:var(--char-done);opacity:.7}.syllable-unit.active{animation:target-breathe 2s ease-in-out infinite;color:var(--text-stat);background:var(--bg-char-active);border-color:var(--accent);box-shadow:0 8px 26px #667eea33}.pinyin-unit{font-size:13px;color:var(--pinyin-inactive);margin-bottom:4px;text-align:center;line-height:1;transition:color .2s}.syllable-unit.active .pinyin-unit{color:var(--pinyin-active);font-weight:600}.syllable-unit.done .pinyin-unit{color:var(--char-done)}.key-sequence{width:100%;padding-top:18px;border-top:1px solid var(--border-panel)}.key-sequence-label{display:block;margin-bottom:10px;color:var(--text-dim);font-size:11px;text-align:center;letter-spacing:.12em}.keys-row{display:flex;gap:8px;margin-top:0;flex-wrap:wrap;justify-content:center}.key-chip{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;min-width:38px;height:38px;border:1px solid var(--border-key);border-radius:9px;font-weight:700;line-height:1;color:var(--text-tertiary);background:var(--bg-key);transition:all .15s;padding:0 6px}.key-chip-uppercase{font-size:15px}.key-chip-lowercase{margin-top:2px;color:var(--text-secondary);font-size:10px;font-weight:500}.key-chip.active .key-chip-lowercase{color:var(--accent)}.key-chip.active{animation:target-breathe 2s ease-in-out infinite;border-color:var(--accent);color:var(--accent);background:var(--bg-char-active);box-shadow:0 0 0 4px var(--bg-accent-soft)}.key-chip.done{border-color:var(--text-secondary);color:var(--text-secondary);background:var(--bg-key-used)}.key-chip.wrong{background:var(--bg-feedback-wrong);border-color:var(--error);color:var(--error)}.key-chip.wrong .key-chip-lowercase{color:var(--error)}.error-hint{margin-top:14px;font-size:18px;color:var(--error);font-weight:600}@keyframes target-breathe{0%,to{box-shadow:0 0 0 2px var(--bg-accent-soft),0 0 6px var(--bg-accent-soft)}50%{box-shadow:0 0 0 5px var(--bg-accent-soft),0 0 22px var(--accent)}}@keyframes pulse-slot{0%,to{box-shadow:0 0 8px #667eea33}50%{box-shadow:0 0 24px #667eea80}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-8px)}75%{transform:translate(8px)}}.stats-panel{width:320px;flex-shrink:0;background:var(--bg-panel);border:1px solid var(--border-panel);border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--panel-shadow);transition:background .3s,border-color .3s}.stats-header{font-size:13px;color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px;margin-bottom:0}.stats-primary{display:grid;grid-template-columns:minmax(0,.85fr) minmax(138px,1.15fr);gap:10px}.primary-stat{min-width:0;padding:10px;background:var(--bg-accent-soft);border:1px solid rgba(102,126,234,.16);border-radius:12px}.primary-stat-value{display:flex;align-items:baseline;gap:2px;min-height:35px;margin-top:4px;color:var(--accent);font-size:27px;font-weight:750;line-height:1.15;font-variant-numeric:tabular-nums;white-space:nowrap}.primary-stat-value small,.stat-value small{color:var(--text-secondary);font-size:11px;font-weight:500;white-space:nowrap}.speed-stat .primary-stat-value{justify-content:space-between}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-bottom:0;align-items:start}.stat-item{display:flex;flex-direction:column;padding:6px 8px;border-bottom:1px solid var(--border-panel)}.stat-label{font-size:12px;color:var(--text-stat-label)}.stat-value{font-size:18px;font-weight:700;color:var(--text-stat);line-height:1.4;min-height:26px;font-variant-numeric:tabular-nums}.keystroke-summary .correct{color:var(--correct)}.keystroke-summary .error{color:var(--error)}.stat-divider{color:var(--text-dim)}.stat-num{font-variant-numeric:tabular-nums;min-width:4.5ch;display:inline-block}.stat-unit{font-size:12px;color:var(--text-secondary);font-weight:400;margin-left:1px}.stat-value.correct{color:var(--correct)}.stat-value.error{color:var(--error)}.level-section{padding:10px;margin-bottom:0;background:var(--bg-stat-card);border:1px solid var(--border-panel);border-radius:12px}.level-header{display:flex;align-items:center;gap:10px;margin-bottom:7px}.level-badge{background:var(--accent-gradient);color:#fff;font-size:12px;font-weight:600;padding:3px 12px;border-radius:10px}.level-label{font-size:15px;color:var(--text-level-label)}.level-bar-container{position:relative;height:10px;background:var(--bg-level-bar);border-radius:4px;overflow:hidden}.level-bar{height:100%;background:var(--accent-gradient);border-radius:4px;transition:width .5s ease}.level-bar-text{margin-left:auto;flex-shrink:0;font-size:12px;font-weight:600;line-height:1.4;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--text-secondary)}.restart-btn{width:100%;padding:9px 7px;border:1px solid var(--border-btn);border-radius:8px;background:transparent;color:var(--text-btn);cursor:pointer;font-size:14px;transition:all .2s}.stats-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.restart-btn:hover{background:var(--bg-btn-hover);border-color:var(--accent);color:var(--accent)}.restart-btn.secondary{border-color:var(--border-btn-secondary);color:var(--text-btn-secondary);font-size:13px}.restart-btn.secondary:hover{border-color:#f64;color:#f64;background:var(--bg-btn-secondary-hover)}.virtual-keyboard{background:var(--bg-panel);border:1px solid var(--border-panel);border-radius:18px;padding:14px 16px 16px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--panel-shadow);transition:background .3s,border-color .3s}.keyboard-header{display:flex;align-items:center;justify-content:space-between;gap:16px}.keyboard-title{color:var(--text-primary);font-size:14px;font-weight:650}.keyboard-hint{margin-left:10px;color:var(--text-dim);font-size:11px}.keyboard-target-label{padding:5px 10px;color:var(--text-secondary);background:var(--bg-accent-soft);border-radius:999px;font-size:12px}.keyboard-target-label strong{display:inline-flex;align-items:baseline;gap:3px;margin-left:4px;color:var(--accent);font-size:15px}.keyboard-target-lowercase{font-size:11px;font-weight:500}.finger-guide{display:grid;grid-template-columns:minmax(100px,1fr) minmax(128px,auto) minmax(100px,1fr);align-items:end;gap:12px;min-height:66px;padding:7px 14px 6px;overflow:hidden;background:var(--bg-stat-card);border:1px solid var(--border-panel);border-radius:12px}.finger-guide__hand-slot{display:flex;justify-content:flex-end}.finger-guide__hand-slot:last-child{justify-content:flex-start}.finger-guide__hand{width:104px;opacity:.42;transition:opacity .2s}.finger-guide__hand.is-active{opacity:1}.finger-guide__fingers{display:flex;height:31px;align-items:flex-end;justify-content:center;gap:3px;padding:0 7px}.finger-guide__finger{position:relative;width:14px;height:25px;flex:0 0 auto;background:var(--hand-fill);border:1px solid var(--hand-border);border-radius:8px 8px 4px 4px;transform-origin:bottom center;transition:background .2s,border-color .2s,box-shadow .2s}.finger-guide__finger--pinky{--finger-color: var(--finger-pinky);height:19px}.finger-guide__finger--ring{--finger-color: var(--finger-ring);height:26px}.finger-guide__finger--middle{--finger-color: var(--finger-middle);height:30px}.finger-guide__finger--index{--finger-color: var(--finger-index);height:27px}.finger-guide__finger--thumb{--finger-color: var(--finger-thumb);width:18px;height:16px;border-radius:8px 8px 5px 5px}.finger-guide__finger.is-target{z-index:1;background:var(--finger-color);border-color:var(--finger-color);box-shadow:0 0 0 3px var(--bg-accent-soft),0 0 13px var(--finger-color);animation:finger-guide-reach 1.1s ease-in-out infinite}.finger-guide__palm{display:flex;width:92px;height:21px;margin:-1px auto 0;align-items:center;justify-content:center;color:var(--text-dim);background:var(--hand-fill);border:1px solid var(--hand-border);border-radius:4px 4px 12px 12px;font-size:9px;transition:border-color .2s,color .2s}.finger-guide__hand.is-active .finger-guide__palm{color:var(--text-primary);border-color:var(--active-finger-color)}.finger-guide__status{display:flex;min-width:0;align-self:center;flex-direction:column;align-items:center;gap:1px;color:var(--text-secondary);font-size:10px;line-height:1.2;text-align:center}.finger-guide__status strong{color:var(--text-primary);font-size:13px}.finger-guide__eyebrow{color:var(--text-dim);font-size:9px;letter-spacing:.12em}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes finger-guide-reach{0%,to{transform:translateY(0) scale(1)}45%{transform:translateY(4px) scale(.96)}}.keyboard-scroll{width:100%;overflow-x:auto;overflow-y:hidden;padding:4px 0 6px;scrollbar-width:thin}.keyboard-layout{min-width:770px;width:max-content;margin:0 auto;display:flex;flex-direction:column;gap:7px}.vk-row{display:flex;gap:6px;justify-content:center}.vk-key{display:flex;flex-direction:column;align-items:center;justify-content:center;width:60px;height:54px;border:1px solid var(--border-key);border-radius:10px;background:var(--bg-key);color:var(--text-primary);cursor:pointer;box-shadow:0 3px 0 var(--border-key);transition:transform .12s,border-color .12s,background .12s,box-shadow .12s;font-family:inherit;line-height:1}.vk-key:hover:not(.disabled){background:var(--bg-key-hover);border-color:var(--text-tertiary);transform:translateY(-1px)}.vk-key.disabled{opacity:.3;cursor:default;background:transparent;border-color:transparent}.vk-punct{width:48px!important;height:48px!important;border-color:var(--border-punct);background:var(--bg-punct)}.vk-punct .vk-key-top{font-size:18px}.vk-punct .vk-key-bottom{font-size:10px;color:var(--text-punct-label)}.vk-wide{width:100%!important;max-width:400px;height:40px;font-size:14px;color:var(--text-secondary);border-color:var(--border-wide)}.vk-row-space{justify-content:center}.vk-key.feedback-correct{border-color:var(--text-secondary);color:var(--text-secondary);background:var(--bg-key-used);box-shadow:0 0 16px #80808059}.vk-key.feedback-wrong{border-color:var(--error);background:var(--bg-feedback-wrong);box-shadow:0 3px 0 var(--error),0 0 18px #ff44444d;animation:shake .3s ease-in-out}.vk-key.target{animation:target-breathe 2s ease-in-out infinite;color:var(--accent);border-color:var(--accent);background:var(--bg-accent-soft);box-shadow:0 3px 0 var(--accent),0 0 0 4px var(--bg-accent-soft)}.vk-key.used:not(.feedback-correct):not(.feedback-wrong):not(.target){border-color:var(--text-secondary);color:var(--text-secondary);background:var(--bg-key-used);opacity:.6}.vk-key-top{display:inline-flex;align-items:baseline;gap:3px;font-size:20px;font-weight:700}.vk-key-lowercase{color:var(--text-vk-bottom);font-size:11px;font-weight:500}.vk-key-bottom{font-size:11px;color:var(--text-vk-bottom);margin-top:2px}@media(min-width:961px)and (max-height:760px){.app-header{padding-top:8px}.app-main{padding:4px 0 12px}.center-section{gap:10px}.question-panel{min-height:280px;padding-top:16px;padding-bottom:18px}.question-header,.question-main{margin-bottom:12px}.syllable-unit .char-unit{font-size:46px}.key-sequence{padding-top:12px}.virtual-keyboard{padding-top:10px;padding-bottom:11px;gap:7px}.finger-guide{min-height:54px;padding-top:3px;padding-bottom:3px}.finger-guide__fingers{height:26px;transform:scale(.86);transform-origin:bottom center}.finger-guide__palm{height:17px}.vk-key{height:48px}.vk-punct{height:44px!important}.vk-wide{height:34px}}@media(max-width:960px){.top-area{flex-direction:column}.stats-panel{width:100%;display:grid;grid-template-columns:1fr 1fr;align-items:center}.stats-header,.level-section{grid-column:1 / -1}.stats-primary{grid-column:1 / -1;grid-template-columns:1fr 1fr}.stats-secondary,.stats-actions{grid-column:1 / -1}.restart-btn{align-self:stretch}}@media(max-width:640px){.app{padding:0 12px}.app-header{gap:8px}.app-title{font-size:19px}.app-subtitle{display:none}.theme-toggle{padding:6px 9px;font-size:12px}.settings-trigger{padding:6px 9px}.settings-trigger span:last-child{display:none}.settings-popover{position:fixed;top:54px;right:12px}.question-panel{min-height:350px;padding:20px 14px 24px}.syllable-unit{min-width:48px;padding:6px 4px}.syllable-unit .char-unit{font-size:42px}.poem-lines{gap:8px}.poem-punctuation{padding-bottom:10px;font-size:30px}.stats-panel{display:flex;padding:18px}.keyboard-hint{display:none}.virtual-keyboard{padding:15px 12px 16px}.finger-guide{grid-template-columns:minmax(0,1fr) minmax(92px,auto) minmax(0,1fr);gap:5px;padding-right:7px;padding-left:7px}.finger-guide__hand{width:72px}.finger-guide__fingers{padding-right:0;padding-left:0;transform:scale(.78);transform-origin:bottom center}.finger-guide__palm{width:68px}.finger-guide__status strong{font-size:11px}.modal-content{padding:30px 20px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.finger-guide__finger.is-target{animation:none;transform:translateY(2px)}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--overlay);display:flex;align-items:center;justify-content:center;z-index:1000;padding:24px}.modal-content{background:var(--bg-panel);border-radius:18px;padding:44px 40px;max-width:580px;width:100%;max-height:80vh;overflow-y:auto;transition:background .3s}.modal-title{font-size:28px;font-weight:700;text-align:center;margin-bottom:28px;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.modal-stats{display:flex;flex-direction:column;gap:12px;margin-bottom:28px}.modal-stat-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border-modal-row)}.modal-stat-label{font-size:16px;color:var(--text-dim)}.modal-stat-value{font-size:20px;font-weight:700;color:var(--text-stat)}.modal-stat-value.correct{color:var(--correct)}.modal-stat-value.error{color:var(--error)}.modal-errors{margin-bottom:28px}.modal-errors-title{font-size:18px;font-weight:600;color:#f64;margin-bottom:14px}.modal-errors-list{display:flex;flex-direction:column;gap:8px;max-height:240px;overflow-y:auto}.modal-error-item{display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--bg-error-item);border-radius:10px;font-size:15px}.error-char{font-size:24px;font-weight:700;color:#f44;width:34px;text-align:center}.error-pinyin{color:var(--text-error-pinyin);width:70px}.error-context{color:var(--text-error-context);font-size:12px;flex:1}.error-keys{color:var(--correct);font-size:12px}.error-pressed{color:var(--error);font-size:12px}.modal-actions{display:flex;justify-content:center;gap:12px}.modal-btn{padding:14px 48px;border:none;border-radius:12px;background:var(--accent-gradient);color:#fff;font-size:18px;font-weight:600;cursor:pointer;transition:opacity .2s}.modal-btn:hover{opacity:.85}.modal-btn-secondary{background:transparent;border:2px solid var(--border-modal-row, #3a3a5a);color:var(--text-secondary, #888)}.modal-btn-secondary:hover{background:var(--bg-modal-row, #1a1a3a);opacity:1}@media(max-width:640px){.modal-content{padding:30px 20px}}.result-dialog{width:min(1080px,calc(100vw - 40px));max-height:calc(100dvh - 48px);margin:auto;padding:30px;border:1px solid var(--border-panel);border-radius:26px;background:var(--bg-body);color:var(--text-primary);box-shadow:0 24px 90px #00000040;overflow-y:auto}.result-dialog::backdrop{background:var(--overlay);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.result-header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px}.result-eyebrow{color:var(--text-secondary);font-size:10px;letter-spacing:.12em;margin-bottom:8px}.result-header h2{font-size:28px;letter-spacing:-.04em}.result-level{font-size:12px;color:var(--text-secondary);white-space:nowrap}.result-grid{display:grid;grid-template-columns:.95fr 1fr 1fr 1fr;gap:16px}.result-card{position:relative;min-width:0;padding:22px;border:1px solid var(--border-panel);border-radius:20px;background:var(--bg-panel);box-shadow:var(--panel-shadow);overflow:hidden}.result-card h3{font-size:14px;font-weight:500;color:var(--text-secondary)}.result-card h3 small{font-size:11px}.result-number{display:block;position:relative;z-index:1;font-size:clamp(36px,4.8vw,60px);font-weight:750;line-height:1.2;letter-spacing:-.05em;font-variant-numeric:tabular-nums;margin:18px 0 8px;overflow-wrap:anywhere}.result-number small{font-size:19px;letter-spacing:0;margin-left:5px}.result-number-large{font-size:clamp(44px,6vw,76px);margin:10px 0 28px}.result-overview{grid-row:span 2;display:flex;flex-direction:column}.result-overview-bottom{margin-top:auto;padding-top:30px}.result-error-number{color:var(--error);font-variant-numeric:tabular-nums}.result-overview-bottom strong{display:block;font-size:24px;margin-top:8px}.result-correct{display:flex;flex-direction:column;justify-content:space-between}.result-watermark{position:absolute;right:-10px;bottom:-30px;font-size:150px;line-height:1;color:var(--text-secondary);opacity:.1;pointer-events:none}.result-passage{grid-column:span 2}.result-quote{font-size:clamp(19px,2.3vw,26px);font-weight:650;line-height:1.6;margin:14px 0 8px;max-height:125px;overflow-y:auto;overflow-wrap:anywhere}.result-note{color:var(--text-secondary);font-size:11px;line-height:1.6}.result-completion{display:flex;gap:18px;border-top:1px solid var(--border-panel);padding-top:12px;margin-top:14px;font-size:12px;color:var(--text-secondary)}.result-completion strong{color:var(--text-primary)}.result-chart{grid-column:span 2;padding:20px 16px 12px}.result-card-heading{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:6px}.result-card-heading span{font-size:10px;color:var(--text-secondary)}.result-chart svg{width:100%;display:block;margin-top:12px;overflow:visible}.result-chart svg text{fill:var(--text-secondary);font-size:11px}.result-chart-grid{stroke:var(--border-key);stroke-dasharray:3 5;stroke-opacity:.5}.result-chart-empty{display:grid;min-height:155px;place-items:center;color:var(--text-secondary);font-size:13px}.result-time{display:flex;flex-direction:column;justify-content:flex-end}.result-time h3{margin-bottom:auto}.result-time .result-watermark{top:-12px;bottom:auto;font-size:110px}.result-time .result-number{font-size:clamp(32px,4vw,50px);margin-top:40px}.result-errors{margin-top:24px;border:1px solid var(--border-panel);border-radius:14px;background:var(--bg-panel);padding:16px 20px}.result-errors summary{cursor:pointer;font-size:14px;font-weight:600}.result-errors summary span{color:var(--text-secondary);font-size:12px;margin-left:8px}.result-errors>.result-note{margin-top:14px}.result-error-table-wrap{overflow:auto;max-height:230px;margin-top:14px}.result-error-table{width:100%;border-collapse:collapse;text-align:left;font-size:12px}.result-error-table th{color:var(--text-secondary);font-weight:500;white-space:nowrap}.result-error-table td,.result-error-table th{padding:10px 12px;border-bottom:1px solid var(--border-panel)}.result-error-table td:first-child{white-space:nowrap}.result-error-table td:nth-child(2){min-width:130px;overflow-wrap:anywhere}.result-error-table td span{color:var(--text-secondary)}.result-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:24px}.result-actions .modal-btn{padding:12px 28px;font-size:14px}.result-dialog button:focus-visible,.result-errors summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}@media(max-width:760px){.result-dialog{padding:20px;width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}.result-grid{grid-template-columns:1fr 1fr;gap:12px}.result-card{padding:18px}.result-overview{grid-row:span 2}.result-passage{grid-column:1 / -1;grid-row:3}.result-chart{grid-column:1 / -1;grid-row:4}.result-time{grid-column:2;grid-row:2}.result-number-large{font-size:54px}.result-header{align-items:flex-start}.result-header h2{font-size:24px}.result-level{font-size:10px}}