:root{font-family:ui-rounded,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color:#173653;background:#f1f7fc;--blue:#126bc1;--line:#dce8f2;--soft:#eaf4ff;--green:#127b4f;--red:#bc3342}*{box-sizing:border-box}body{margin:0}button,a,input,select{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;background:white;border:1.5px solid #c7d9e9;border-radius:12px;padding:12px 18px;color:inherit;min-height:46px;touch-action:manipulation}button:hover{background:#edf5ff}button:focus-visible,a:focus-visible{outline:3px solid #e4a800;outline-offset:3px}button:disabled{cursor:default;opacity:.5}.primary{background:var(--blue);border-color:var(--blue);color:white;font-weight:700}.primary:hover{background:#095aa7}.quiet{border-color:transparent;background:transparent;padding:8px 12px}header{height:78px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1240px)/2));gap:16px}#brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#173653;font-size:20px}.logo{background:#1676cf;color:white;border-radius:13px 13px 4px 13px;padding:7px 10px;font-size:25px;font-weight:800;letter-spacing:-2px}.header-note{font-size:14px;color:#5c7890}main{max-width:1240px;margin:0 auto;padding:32px 24px}footer{padding:24px;text-align:center;color:#657d91;font-size:13px;line-height:1.8}.intro{padding:34px 0 38px}.intro h1{font-size:clamp(30px,4vw,46px);margin:0 0 12px;letter-spacing:-1px}.intro p{font-size:18px;color:#59768e;line-height:1.7;margin:0}.unit-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.unit-card{background:white;border:1px solid var(--line);border-radius:22px;overflow:hidden;position:relative}.unit-top{padding:28px 30px 22px;background:#deefff}.unit-card:nth-child(2) .unit-top{background:#fff1b6}.unit-number{font-size:15px;font-weight:700;margin-bottom:14px}.unit-top h2{font-size:28px;line-height:1.3;max-width:380px;margin:0 0 8px}.unit-top p{margin:0;color:#486780}.unit-bottom{padding:24px 30px}.unit-bottom p{font-size:14px;color:#607b90;margin:0 0 20px}.unit-bottom .primary{width:100%}.progress{height:8px;background:#e6eef6;border-radius:9px;overflow:hidden;margin:14px 0}.progress>span{display:block;height:100%;background:#1676cf;transition:width .25s}.howto{margin-top:32px;display:flex;gap:28px;flex-wrap:wrap;font-size:14px;color:#506f87}.howto b{color:#173653;margin-right:6px}.topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:12px}.topline h1{font-size:24px;margin:0}.topline small{display:block;font-size:14px;font-weight:400;color:#607b90;margin-top:5px}.workspace{display:grid;grid-template-columns:225px minmax(0,1fr);gap:24px;align-items:start}.sidebar{position:sticky;top:18px}.sidebar h2{font-size:16px;margin:0 0 6px}.sidebar p{font-size:14px;color:#607b90}.sections{display:flex;flex-direction:column;gap:4px}.section-nav{text-align:left;border:0;background:transparent;padding:12px;font-size:14px;border-radius:10px;display:flex;align-items:center;gap:10px}.section-nav.active{background:#dcecff;color:#075aa7;font-weight:700}.nav-count{margin-left:auto;color:#627e94;font-size:12px;white-space:nowrap}.section-nav .dot{width:8px;height:8px;border:1px solid #96afc4;border-radius:50%;flex:none}.section-nav.done .dot{background:#168b63;border-color:#168b63}.exercise{background:white;border:1px solid var(--line);border-radius:20px;overflow:hidden}.exercise-head{padding:24px 28px 18px;border-bottom:1px solid var(--line)}.eyebrow{color:#5b778f;font-size:13px;margin-bottom:8px}.exercise-head h2{margin:0;font-size:24px}.hint{margin:10px 0 0;color:#5b778f;font-size:14px;line-height:1.6}.audio-box{margin:20px 28px 8px;padding:14px 18px;background:#edf6ff;border-radius:12px;display:flex;align-items:center;gap:18px}.audio-box label{font-weight:700;white-space:nowrap;font-size:14px}audio{width:100%;height:42px}.audio-error{color:var(--red);font-size:13px}.picture-toolbar{display:flex;justify-content:flex-end;padding:8px 20px 0}.picture-toolbar button{font-size:13px;color:#386786;min-height:36px}.question-image{display:block;width:100%;height:auto;background:white}.answers{padding:20px 28px 28px;border-top:1px solid var(--line)}.answers h3{font-size:17px;margin:0 0 16px}.answer-row{display:flex;align-items:center;gap:14px;padding:13px 0;border-top:1px solid #edf2f6;flex-wrap:wrap}.answer-row:first-of-type{border:0}.question-label{min-width:84px;font-weight:600;font-size:15px}.options{display:flex;gap:8px;flex-wrap:wrap}.option{min-width:58px;padding:10px 18px;font-weight:650}.option.selected{background:#e0efff;border:2px solid #1676cf;padding:9.5px 17.5px;color:#075ba9}.feedback{width:100%;padding-left:98px;font-size:14px}.correct{color:var(--green)}.incorrect{color:var(--red)}.navigation{display:flex;gap:10px;justify-content:space-between;margin-top:20px}.navigation .right{display:flex;gap:10px}.result{background:#e4f3ed;border:1px solid #b6ddcc;border-radius:16px;padding:24px;margin-bottom:22px}.result h2{margin:0 0 8px;font-size:26px}.result p{margin:8px 0;line-height:1.6}.result .actions{margin-top:18px}.actions{display:flex;gap:10px;flex-wrap:wrap}.score{font-size:42px;color:#126b49;font-weight:800}.score small{font-size:18px;font-weight:400}.save-note{font-size:12px;color:#637e94;display:block;margin-top:14px}.mobile-picker{display:none}dialog{border:1px solid var(--line);border-radius:18px;max-width:540px;width:calc(100% - 32px);padding:28px;color:#173653;box-shadow:0 24px 80px #0c305942}dialog::backdrop{background:#14314e99}dialog p{line-height:1.7;color:#55738a}dialog h2{margin-top:0}#zoom{max-width:1280px;width:calc(100% - 24px);padding:12px}.zoom-top{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:14px}.zoom-scroll{overflow:auto;max-height:75vh}.zoom-scroll img{display:block;width:100%;min-width:900px}.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);background:#173653;color:white;border-radius:12px;padding:12px 22px;display:none;z-index:20;font-size:14px}.toast.show{display:block}.warning{background:#fff1cc;padding:14px;border-radius:12px;color:#705400;margin-bottom:18px;font-size:14px}.empty-note{font-size:13px;color:#6e8293}.unit-status{font-weight:600;color:#175e96!important}@media(max-width:850px){.workspace{grid-template-columns:1fr}.sidebar{position:static}.sidebar .sections{display:none}.sidebar .progress,.sidebar h2,.sidebar>p,.sidebar .save-note{display:none}.mobile-picker{display:block;width:100%;font:inherit;padding:13px;background:white;border:1px solid #bcd2e5;border-radius:10px;color:#173653}.unit-top h2{font-size:25px}.exercise-head{padding:20px}.answers{padding:16px 20px}.audio-box{margin:16px 20px 6px}.topline h1{font-size:21px}.sidebar .reset{display:none}}@media(max-width:560px){header{height:66px;padding:0 18px}.header-note{display:none}main{padding:22px 14px}.intro{padding:18px 4px 28px}.intro p{font-size:16px}.unit-grid{grid-template-columns:1fr;gap:18px}.unit-top{padding:24px}.unit-bottom{padding:20px 24px}.howto{gap:14px;flex-direction:column;padding:0 4px}.exercise{border-radius:14px}.exercise-head h2{font-size:21px}.audio-box{display:block;padding:12px}.audio-box label{display:block;margin-bottom:8px}.answer-row{gap:9px}.question-label{min-width:74px;font-size:14px}.option{min-width:48px;padding:10px 13px}.option.selected{padding:9.5px 12.5px}.feedback{padding-left:0}.navigation{flex-wrap:wrap}.navigation button{padding:11px 14px}.topline{align-items:flex-start}.topline small{font-size:12px}.answers{padding:16px}.question-image{min-height:0}.result{padding:20px}.result h2{font-size:23px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* Direct-on-sheet practice: one coordinate system for image and touch targets. */
.workspace{grid-template-columns:205px minmax(0,1fr)}main{max-width:1400px}.exercise-head{padding:18px 24px}.exercise-head .hint{display:none}.audio-box{margin:14px 20px 6px}.sheet-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 20px;background:#f7fbff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}.live-feedback{font-size:15px;line-height:1.5;font-weight:650}.sheet-tools button{flex:none;white-space:nowrap}.sheet-scroll{overflow-x:auto;padding:18px 16px 12px;background:white}.interactive-sheet{position:relative;overflow:hidden;width:100%;isolation:isolate;container-type:inline-size;background:white}.interactive-sheet>img{position:absolute;max-width:none;pointer-events:none;user-select:none}.answer-hit{position:absolute;background:rgba(215,237,255,.10);border:1.5px dashed rgba(36,116,192,.55);border-radius:8px;min-height:0;min-width:0;padding:0;z-index:2;color:#12517e;touch-action:manipulation}.answer-hit:hover{background:rgba(180,220,255,.23);border-color:#086dcb}.answer-hit:focus-visible{outline:3px solid #e8ac00;outline-offset:-3px}.answer-hit.hit-correct{border:3px solid #158354;background:rgba(92,213,155,.16)}.answer-hit.hit-wrong{border:3px solid #c7364a;background:rgba(246,112,135,.13)}.hit-badge{position:absolute;right:-1px;top:-1px;background:#14804e;color:white;border-radius:0 5px 0 7px;font:800 clamp(14px,2.4cqw,24px)/1.2 system-ui;padding:0 5px;pointer-events:none}.hit-wrong .hit-badge{background:#c7364a}.blank-hit{background:#f3f9ff;border:2px solid #89bde7;font-size:clamp(18px,3.1cqw,29px);font-weight:800;border-radius:8px}.blank-hit.hit-correct{background:#e3f6ea}.blank-hit.hit-wrong{background:#fff0f2}.blank-hit .hit-badge{font-size:clamp(11px,1.6cqw,17px);padding:0 3px}.source-hit.active-source{border:4px solid #e3a600;background:#ffce342c}.target-hit{border-style:dashed}.match-lines{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}.sheet-summary{padding:14px 20px;border-top:1px solid var(--line);font-size:14px;color:#4e6e87;background:#f8fbff}.score-rule{font-size:13px;color:#487861}#pickerOptions{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}.pick-option{font-size:25px;min-width:62px;min-height:60px;font-weight:700}#zoom{max-width:1350px}.zoom-scroll{padding-top:14px}.zoom-scroll img{min-width:0}#zoomSheet{min-width:740px;max-width:1200px;margin:auto}.toast{max-width:calc(100% - 32px);width:max-content;font-size:17px;bottom:24px}.source-hit .hit-badge{top:0;right:0}@media(max-width:1180px){.workspace{grid-template-columns:1fr;gap:12px}.sidebar{position:static}.sidebar .sections,.sidebar .progress,.sidebar h2,.sidebar>p,.sidebar .save-note,.sidebar .reset{display:none}.mobile-picker{display:block;width:100%;font:inherit;padding:13px;background:white;border:1px solid #bcd2e5;border-radius:10px;color:#173653}.topline{margin-bottom:16px}main{padding:22px 20px}.sheet-scroll{padding:16px 12px}.exercise-head{padding:16px 20px}.header-note{font-size:13px}}@media(max-width:600px){main{padding:18px 10px}.sheet-scroll{padding:12px 8px}#sheetHost{min-width:650px}.sheet-tools{padding:10px 12px;align-items:flex-start}.live-feedback{font-size:13px}.sheet-tools button{font-size:13px;padding:6px 8px;min-height:38px}.sheet-scroll::before{content:'题目可以左右滑动，也可以点“放大作答”';display:block;font-size:12px;color:#66839b;margin:0 0 8px}.audio-box{margin:12px}.exercise-head h2{font-size:21px}.score{font-size:52px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}