:root{--color-primary: #245748;--color-background: #f5f3ec;--color-surface: #ffffff;--color-ink: #202e29;--color-muted: #5c6b63;--color-border: #d4ddd4;--color-success: #245748;--color-warning: #805818;--color-danger: #a33333;--color-tint: #e8efe8;--font-sans: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;--font-display: "Songti SC", "Noto Serif CJK SC", serif;--font-mono: "SFMono-Regular", Consolas, monospace;--radius: .75rem;--radius-sm: .375rem;--radius-lg: 1.25rem;--page-max: 72rem;--section-gap: 2rem;--control-height: 2.75rem;--scrollbar-thumb: #8a9e90;--scrollbar-track: var(--color-background);--scrollbar-hover: var(--color-primary);--scrollbar-active: var(--color-ink);--z-dialog: 600;color:var(--color-ink);background:var(--color-background);font-family:var(--font-sans);font-size:16px;line-height:1.65;font-synthesis:none;scrollbar-gutter:stable;scrollbar-width:auto;scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track)}*{box-sizing:border-box;scrollbar-width:auto;scrollbar-color:var(--scrollbar-thumb) var(--scrollbar-track)}*::-webkit-scrollbar{width:12px;height:12px}*::-webkit-scrollbar-track{background:var(--scrollbar-track)}*::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border:3px solid var(--scrollbar-track);border-radius:8px}*::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-hover)}*::-webkit-scrollbar-thumb:active{background:var(--scrollbar-active)}body{margin:0}h1,h2,h3,p{margin:0 0 1rem}h1,h2,h3{font-family:var(--font-display);font-weight:600;line-height:1.4}h1{font-size:2.5rem;letter-spacing:.02em}h2{font-size:1.5rem}h3{font-size:1.15rem}button,input{font:inherit}button{position:relative;min-height:var(--control-height);padding:.6rem 1.1rem;border:1px solid var(--color-primary);border-radius:var(--radius);background:var(--color-primary);color:var(--color-surface);font-weight:600;cursor:pointer;white-space:nowrap;transition:background .12s,transform .12s}button:hover:not(:disabled){background:var(--color-ink)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.55;cursor:not-allowed}button.secondary{color:var(--color-primary);background:transparent;border-color:var(--color-border)}button.secondary:hover:not(:disabled){background:var(--color-tint);border-color:var(--color-primary)}:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px}h1:focus{outline:none}.busy-label{opacity:0}.busy-mark{position:absolute;inset:0;display:grid;place-items:center;font-size:.85rem}.full{width:100%}.text-button{background:transparent;color:var(--color-primary);padding:.25rem .5rem;border-color:transparent;font-size:.875rem}.text-button:hover:not(:disabled){color:var(--color-surface)}.masthead,main,footer{max-width:var(--page-max);margin-inline:auto;padding-inline:2rem}.masthead{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:7.5rem;border-bottom:1px solid var(--color-border)}.brand{display:flex;align-items:center;gap:.8rem;font-family:var(--font-display);font-size:1.5rem;font-weight:600}.brand small{display:block;font-family:var(--font-sans);font-size:.75rem;font-weight:400;color:var(--color-muted)}.seal{display:grid;place-items:center;border:1px solid var(--color-primary);color:var(--color-primary);height:2.8rem;width:2.8rem;border-radius:var(--radius-sm);font-size:1.8rem}.account{display:flex;align-items:center;gap:1rem;font-size:.875rem;overflow-wrap:anywhere}main{padding-top:2.5rem}footer{margin-top:3rem;padding-block:2rem;color:var(--color-muted);font-size:.8rem;border-top:1px solid var(--color-border)}.eyebrow{font-size:.8rem;color:var(--color-primary);letter-spacing:.07em;margin-bottom:.6rem}.muted{color:var(--color-muted);font-size:.875rem}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1.5rem;min-width:0}.status{min-height:2.75rem;padding:.55rem 0;font-size:.875rem;color:var(--color-muted);overflow-wrap:anywhere}.status.error{color:var(--color-danger)}.status.success{color:var(--color-success)}.status.warning{color:var(--color-warning)}.login-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:5rem;align-items:center;padding:2.5rem 0 4rem}.intro h1{font-size:3.4rem;line-height:1.4;margin-block:1rem 1.5rem}.intro>p:not(.eyebrow){max-width:26rem;color:var(--color-muted)}.rule-note{margin-top:2.25rem;padding-top:1.25rem;border-top:1px solid var(--color-border);font-size:.85rem;color:var(--color-primary)}.login-card{padding:2rem}.field label{display:block;margin-bottom:.4rem;font-size:.875rem}.field input{display:block;min-width:0;width:100%;min-height:var(--control-height);border:1px solid var(--color-border);border-radius:var(--radius);padding:.6rem .75rem;color:var(--color-ink);background:var(--color-surface)}.field input[aria-invalid=true]{border-color:var(--color-danger)}.field-error{min-height:1.6rem;font-size:.8rem;color:var(--color-danger)}.reveal{margin-top:-.5rem;display:block;margin-left:auto}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem}.page-heading h1{font-size:2rem;margin-bottom:.5rem}.dashboard-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--section-gap);align-items:start}.device-card{grid-column:1;grid-row:1}.dashboard-grid>aside{grid-column:2;grid-row:1 / span 2}.task-card{grid-column:1;grid-row:2}.section-heading{display:flex;justify-content:space-between;gap:1rem;align-items:start}.section-heading h2{margin-bottom:1rem;overflow-wrap:anywhere}.badge{font-size:.75rem;line-height:1.5;white-space:nowrap;padding:.35rem .5rem;border-radius:var(--radius-sm);background:var(--color-tint);color:var(--color-primary)}.badge.warning{color:var(--color-warning);background:var(--color-background)}.facts{margin:0 0 1rem}.facts>div{display:grid;grid-template-columns:6rem 1fr;gap:.75rem;padding:.5rem 0;border-top:1px solid var(--color-border);font-size:.875rem}.facts dt{color:var(--color-muted)}.facts dd{margin:0;overflow-wrap:anywhere}.device-nav{display:flex;flex-wrap:wrap;gap:.5rem;margin-block:.5rem 1.5rem}.device-nav button{white-space:normal;overflow-wrap:anywhere;text-align:left}.progress-count{font-family:var(--font-mono);font-size:2rem;color:var(--color-primary);font-variant-numeric:tabular-nums;white-space:nowrap}.progress-count small{font-size:1rem;color:var(--color-muted)}progress{display:block;width:100%;height:.5rem;appearance:none;border:0;background:var(--color-tint);border-radius:var(--radius-sm);margin-bottom:1rem}progress::-webkit-progress-bar{background:var(--color-tint);border-radius:var(--radius-sm)}progress::-webkit-progress-value{background:var(--color-primary);border-radius:var(--radius-sm)}progress::-moz-progress-bar{background:var(--color-primary)}.questions{list-style:none;margin:0;padding:0}.questions li{display:grid;grid-template-columns:1.5rem minmax(0,1fr) auto;gap:.8rem;padding:1rem 0;border-top:1px solid var(--color-border);align-items:start}.question-number{font-family:var(--font-mono);font-size:.75rem;color:var(--color-muted);padding-top:.2rem}.question-expression{font-family:var(--font-mono);font-size:1.1rem}.questions small{color:var(--color-muted);font-size:.75rem}.answer-status{font-size:.75rem;color:var(--color-primary);padding-top:.2rem;white-space:nowrap}.explanation{font-size:.8rem;color:var(--color-muted);margin:.4rem 0 0}.unlock-card{border-top:4px solid var(--color-primary)}.unlock-card>p{font-size:.875rem}.unlock-card fieldset{border:0;padding:0;margin:1.3rem 0}.unlock-card legend{font-size:.875rem;margin-bottom:.6rem}.duration-options{display:flex;gap:.5rem;flex-wrap:wrap}.duration-options label{display:flex;align-items:center;gap:.35rem;cursor:pointer;font-size:.8rem;min-height:2.75rem;padding:.25rem .5rem;border:1px solid var(--color-border);border-radius:var(--radius-sm)}.duration-options label:hover{background:var(--color-tint)}input[type=radio]{accent-color:var(--color-primary);cursor:pointer;margin:0}.code-region{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:12rem;margin-block:1.25rem;border-block:1px dashed var(--color-border);font-size:.8rem}.live-code{font-family:var(--font-mono);font-size:clamp(1.6rem,3vw,2.25rem);letter-spacing:.06em;line-height:1.8;font-variant-numeric:tabular-nums;color:var(--color-primary)}.code-region small{font-size:.75rem;color:var(--color-muted);margin-top:.5rem}.code-region p{margin:0}.code-placeholder{font-size:2rem;color:var(--color-muted)}.aside-note{padding:1.5rem .5rem;font-size:.85rem;color:var(--color-muted)}.aside-note h3{color:var(--color-primary)}.empty{max-width:40rem;margin:1rem auto}.pair-code{display:flex;flex-direction:column;margin-top:1.5rem;padding:1rem;background:var(--color-tint);border-radius:var(--radius);gap:.3rem}.pair-code strong{font-family:var(--font-mono);font-size:2.5rem;letter-spacing:.08em;color:var(--color-primary)}.pair-code small{font-size:.8rem}dialog{max-width:min(30rem,calc(100% - 2rem));max-height:calc(100% - 2rem);overflow:auto;padding:1.5rem;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);color:var(--color-ink);box-shadow:0 1.5rem 4rem #202e2930;z-index:var(--z-dialog)}dialog::backdrop{background:#202e2977}dialog p{font-size:.9rem}.actions{display:flex;gap:.75rem;justify-content:flex-end;flex-wrap:wrap}@media(max-width:720px){.masthead,main,footer{padding-inline:1.25rem}.masthead{min-height:6rem;align-items:center;flex-wrap:wrap;padding-block:1rem}.brand{font-size:1.25rem}.account{gap:.5rem}.account button{padding-inline:.7rem}main{padding-top:1.5rem}.login-layout{grid-template-columns:1fr;gap:1.5rem;padding:0}.intro h1{font-size:2.25rem}.intro h1 br{display:none}.rule-note{margin-top:1rem}.login-card{padding:1.5rem}.dashboard-grid{grid-template-columns:1fr;gap:1.5rem}.device-card{grid-column:1;grid-row:1}.dashboard-grid>aside{grid-column:1;grid-row:2}.task-card{grid-column:1;grid-row:3}.page-heading{align-items:start}.page-heading h1{font-size:1.75rem}.page-heading>button{font-size:.75rem;padding-inline:.6rem}.card{padding:1.25rem}.section-heading{gap:.5rem}.section-heading h2{font-size:1.3rem}.badge{white-space:normal;max-width:7rem;flex-shrink:0}.facts>div{grid-template-columns:5.5rem 1fr}.questions li{gap:.5rem;grid-template-columns:1.3rem minmax(0,1fr) auto}.live-code{font-size:2rem}.brand small{font-size:.65rem}footer{margin-top:1.5rem}.pair-code strong{font-size:2rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}@media(forced-colors:active){*{scrollbar-color:auto}*::-webkit-scrollbar-thumb{background:ButtonText;border-color:Canvas}*::-webkit-scrollbar-track{background:Canvas}button,progress,.badge{forced-color-adjust:auto}}a{color:var(--color-primary);text-underline-offset:.2em;cursor:pointer}a:hover{color:var(--color-ink)}a:active{color:var(--color-muted)}.assessment-card{margin-top:var(--section-gap)}.assessment-list{padding-left:1.4rem}.assessment-list>li{border-top:1px solid var(--color-border);padding-block:1.2rem}.assessment-list h3{overflow-wrap:anywhere}.student-main{max-width:55rem}.pairing-card{max-width:36rem;margin-inline:auto}.practice-card{border-top:4px solid var(--color-primary)}.reading-prompt{font-size:clamp(1.6rem,4vw,2.5rem);overflow-wrap:anywhere}.recorder{padding-block:1rem;border-block:1px solid var(--color-border)}.recorder audio{display:block;width:100%;max-width:30rem;margin-bottom:1rem}.record-actions{display:flex;flex-wrap:wrap;gap:.75rem}.pronunciation-feedback{padding-block:1rem}.score-line strong{font-family:var(--font-mono);color:var(--color-primary);font-size:2rem}.score-line span{color:var(--color-muted)}.word-feedback{margin-block:.7rem;overflow-wrap:anywhere}.phonemes{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin-block:.5rem}.phonemes li{padding:.3rem .6rem;background:var(--color-tint);border-radius:var(--radius-sm)}.phonemes span{font-family:var(--font-mono)}.authorization-status{border-left:3px solid var(--color-border);padding-left:1rem;margin-block:1rem}.authorization-status>p{margin-bottom:.25rem}@media(max-width:720px){.student-main .page-heading{flex-wrap:wrap}.student-link{margin-left:auto}.record-actions button{flex:1 0 auto}}