:root{color-scheme:light;--ink:#182338;--muted:#687287;--accent:#5745de;--accent-dark:#4634c5;--line:#e4e8f0;--surface:#f5f7fb;--green:#167457;--red:#b4354d;font-family:Inter,"Segoe UI","Microsoft YaHei","PingFang SC",sans-serif;font-size:16px}
select{font:inherit;color:var(--ink);border:1px solid #d9deea;border-radius:7px;background:white;padding:.65rem;max-width:100%}select:focus-visible{outline:3px solid #a597ff;outline-offset:3px}.builder{background:white;border:1px solid var(--line);border-radius:10px;padding:1.5rem;margin:1.2rem 0}.builder-heading,.records-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.builder-heading h2{margin:0;font-size:1.2rem}.builder-grid{display:grid;grid-template-columns:1fr 1.6fr;gap:1.2rem;margin:1.2rem 0}.builder-grid select,.builder-grid input[type=number]{width:100%;padding:.7rem;border:1px solid #d9deea;border-radius:7px}.field-label{display:block;font-size:.875rem;font-weight:600;margin-bottom:.4rem}.unit-picker{border:0;margin:0;padding:0;min-width:0}.unit-picker legend{font-size:.875rem;font-weight:600;margin-bottom:.4rem}.unit-picker label{display:flex;gap:.65rem;align-items:flex-start;margin:.5rem 0;font-size:.875rem}.unit-picker input{margin-top:.35rem;accent-color:var(--accent)}.builder-actions{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}.builder-actions span{font-size:.875rem;color:var(--muted)}.view-tabs{display:flex;gap:.5rem;flex-wrap:wrap}.view-tabs button{background:white;color:var(--muted);padding:.7rem 1rem;border:1px solid var(--line);border-radius:7px;font-size:.875rem}.view-tabs button[aria-pressed=true]{color:var(--accent);background:#eeebff;border-color:#bfb4fa}.print-controls{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap;padding:1rem 1.5rem;border-bottom:1px solid var(--line);font-size:.875rem}.print-controls button{padding:.6rem 1rem}.print-only{display:none}.empty-state{padding:2rem;text-align:center;color:var(--muted);background:white;border-radius:8px}.empty-state h3{color:var(--ink)}#save-status{font-size:.875rem;color:var(--green);margin:1rem 0 .2rem}.save-error{color:var(--red)!important}.save-retry{margin:0 1rem 1rem 0;font-size:.875rem}.record-card{border:1px solid var(--line);border-radius:10px;background:white;padding:1.3rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:1rem 0}.record-card h3{font-size:1rem;margin:0 0 .4rem}.record-card p,.records-heading p{font-size:.875rem;color:var(--muted);margin:.3rem 0}.record-card strong{font-size:.875rem}.record-card button{flex-shrink:0}.records-heading{margin-top:1rem}.records-heading h2{font-size:1.2rem;margin:0}.mistake-card{align-items:flex-start}.mistake-card>div{min-width:0}.mistake-card details{margin-top:.75rem}.mistake-card summary{cursor:pointer;color:var(--accent);font-size:.875rem}.mistake-tools{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin-top:1rem;font-size:.875rem}.mistake-tools input{width:90px;padding:.6rem;border:1px solid #d9deea;border-radius:7px}.auth-link{display:inline-block;padding:.7rem 1rem;border-radius:7px}.topbar #account{display:flex;gap:.75rem;align-items:center;letter-spacing:0;font-size:.875rem}.topbar #account a{color:var(--accent);text-decoration:underline}.topbar #account>span{max-width:240px;overflow:hidden;text-overflow:ellipsis}.review-column{align-content:start}.question-input{max-width:100%}@media(max-width:680px){.builder{padding:1rem}.builder-grid{grid-template-columns:1fr}.builder-actions .primary{width:100%}.builder-heading{align-items:flex-start}.record-card{flex-direction:column;align-items:stretch}.topbar{height:auto;min-height:52px;gap:1rem;padding:.75rem 1rem;flex-wrap:wrap}.topbar .top-tag{font-size:.875rem}.topbar #account>span{max-width:170px}.print-controls{padding:1rem}.print-controls select{width:100%}.records-heading{align-items:flex-start}.view-tabs button{padding:.6rem .7rem}}
@media print{@page{size:auto;margin:16mm}body{background:white!important;color:black!important;font-family:Arial,sans-serif;font-size:11pt;line-height:1.5}body>.layout,body>dialog,body>.skip{display:none!important}#print-document{display:block!important}#print-document h1{font-size:18pt}#print-document h3{font-size:12pt;line-height:1.5}#print-document header{border-bottom:1px solid #aaa;padding-bottom:12pt;margin-bottom:14pt}.print-question{break-inside:avoid;page-break-inside:avoid;margin-bottom:22pt}.print-question p{margin:6pt 0}.print-space{min-height:75pt;border-bottom:1px solid #aaa}.print-question .music-diagram{border:0;background:white;margin:8pt 0;padding:0;overflow:visible}.print-question svg{max-width:330pt}body:after{display:none}*{box-shadow:none!important}}
*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--surface);line-height:1.65}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:default}button,a,input,textarea{touch-action:manipulation}a{color:inherit;text-decoration:none}button{border:0}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #a597ff;outline-offset:3px}.skip{position:fixed;top:-100px;left:1rem;z-index:10;background:white;padding:.8rem}.skip:focus{top:1rem}.layout{display:grid;grid-template-columns:236px minmax(0,1fr);min-height:100vh}.sidebar{padding:2rem 1.15rem 1rem;background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:.8rem;padding:0 .5rem;margin-bottom:3rem;font-size:1.45rem;font-weight:750;letter-spacing:.07em;line-height:1.3}.brand small{display:block;margin-top:.35rem;font-size:.75rem;letter-spacing:.15em;color:var(--muted);font-weight:400}.brand-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:var(--accent);color:white;font-size:1.8rem;font-weight:600;letter-spacing:-.08em;padding-right:3px}.nav-label,.small-label{font-size:.75rem;color:var(--muted);letter-spacing:.08em}.nav-label{padding:0 .75rem;margin-bottom:.75rem}.subject-button{display:flex;width:100%;align-items:center;gap:.8rem;text-align:left;padding:.85rem .75rem;border-radius:8px;margin-bottom:.35rem;background:transparent;color:#58647a;font-size:.9rem}.subject-button:hover{background:#f6f7fa}.subject-button.active{background:#eeebff;color:var(--accent);font-weight:650}.subject-symbol{display:grid;place-items:center;width:30px;height:30px;border:1px solid currentColor;border-radius:7px;font-size:1.1rem}.subject-button .count{margin-left:auto;font-size:.8rem;font-weight:400}.subject-unit{margin:0 0 1rem 3.25rem;font-size:.75rem;color:#788398}.sidebar-note{margin-top:auto;padding:1rem .8rem;background:#f7f8fc;border-radius:10px;font-size:.8rem}.note-label{font-size:.8rem;font-weight:650;color:#3a465e}.sidebar-note p{margin:.65rem 0;color:var(--muted)}.text-button{color:var(--accent);padding:0;background:transparent;font-size:.875rem}.sidebar-bottom{padding:1.25rem .75rem 0;font-size:.75rem;color:#8b93a3}.topbar{height:73px;background:rgba(255,255,255,.8);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 2.6rem;font-size:.875rem;color:var(--muted)}.divider{padding:0 .8rem;color:#b9bfcb}.top-tag{font-size:.75rem;letter-spacing:.08em}main{max-width:1400px;margin:auto;padding:2.45rem 2.6rem 1.2rem}.heading-row{display:flex;align-items:center;justify-content:space-between;gap:1rem}.eyebrow{color:var(--accent);font-size:.75rem;letter-spacing:.14em;font-weight:650}h1{font-size:1.9rem;line-height:1.35;margin:.5rem 0 .55rem;letter-spacing:-.03em}.heading-row p{margin:0;color:var(--muted);font-size:.875rem}.sample-badge{border:1px solid #d7d1fa;color:#6c58ad;background:#f3f0ff;border-radius:6px;font-size:.75rem;padding:.3rem .6rem;white-space:nowrap}.notice{display:flex;align-items:flex-start;gap:.75rem;margin:1.65rem 0 1.5rem;padding:.85rem 1rem;border:1px solid #e1dff4;border-radius:8px;background:#f0effb;color:#626084;font-size:.875rem}.notice p{margin:0}.notice-icon{flex:0 0 17px;height:17px;border:1px solid #7c71aa;border-radius:50%;line-height:16px;text-align:center;margin-top:4px;font-family:serif;font-weight:bold;font-size:.75rem}.study-grid{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:1.5rem;align-items:start}.exercise-panel{background:white;border:1px solid var(--line);border-radius:12px;overflow:hidden}.exercise-header{display:flex;justify-content:space-between;align-items:center;padding:1.35rem 1.6rem;border-bottom:1px solid var(--line)}h2{font-size:1.05rem;line-height:1.5;margin:0 0 .4rem}.muted{color:var(--muted);font-size:.8rem}.exercise-number{font-size:2rem;line-height:1;color:#d4d7e4;font-weight:300;font-family:Georgia,serif}.question{padding:1.6rem;border-bottom:1px solid var(--line)}.question-top{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;margin-bottom:.85rem}.question-index{font-size:.75rem;font-weight:700;color:var(--accent);margin-right:.35rem}.type-chip{color:#56657b;background:#f1f3f7;border-radius:4px;font-size:.75rem;padding:.08rem .45rem}.subject-chip{font-size:.75rem;color:#8892a2}.question-title{font-size:1rem;font-weight:550;margin:0 0 1rem;white-space:pre-line;overflow-wrap:anywhere}.options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;border:0;padding:0;margin:0;min-width:0}.option{display:flex;gap:.65rem;align-items:flex-start;padding:.8rem .9rem;border:1px solid var(--line);border-radius:7px;cursor:pointer;background:#fff;font-size:.925rem}.option:hover{border-color:#b5abf2;background:#faf9ff}.option:has(input:checked){background:#f3f0ff;border-color:#7867e8}.option input{margin:.33rem 0 0;accent-color:var(--accent);flex-shrink:0}.letter{color:#8990a0;font-size:.85rem}.option:has(input:checked) .letter{color:var(--accent)}.option.answer-correct{background:#eff9f4;border-color:#93d1b3}.option.answer-wrong{background:#fff2f4;border-color:#e3a3af}.option:has(input:disabled){cursor:default}.answer-input{display:block;padding:.7rem .85rem;border:1px solid #dce1eb;border-radius:7px;width:min(100%,380px);color:var(--ink);background:#fbfcfe}.answer-input::placeholder{color:#8c95a6;font-size:.875rem}.answer-textarea{resize:vertical;min-height:120px;width:100%;line-height:1.7}.answer-input:disabled{background:#f5f6fa;color:#4d5a6f}.question-help{font-size:.8rem;color:var(--muted);margin:.55rem 0 0}.feedback{margin-top:1rem;padding:.95rem 1rem;border-radius:7px;background:#f5f7fb;border-left:3px solid #a8b2c7;font-size:.875rem}.feedback.correct{border-color:var(--green);background:#f0f9f5}.feedback.wrong{border-color:var(--red);background:#fff5f6}.feedback-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;font-weight:650;margin-bottom:.6rem}.feedback.correct .feedback-head{color:var(--green)}.feedback.wrong .feedback-head{color:var(--red)}.feedback p{margin:.45rem 0;white-space:pre-line;overflow-wrap:anywhere}.feedback .knowledge{margin-top:.8rem;padding-top:.65rem;border-top:1px solid #e2e6ee;color:var(--muted);font-size:.8rem}.self-check{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.8rem}.self-check button{padding:.3rem .75rem;background:white;border:1px solid #dce2ea;border-radius:6px;font-size:.8rem;color:#536178}.self-check button[aria-pressed=true]{color:var(--accent);border-color:var(--accent);background:#eeebff}.submit-bar{display:flex;justify-content:space-between;align-items:center;gap:.8rem;padding:1.2rem 1.6rem;background:#fcfcff}.submit-bar>span{font-size:.875rem;color:var(--muted)}.primary,.secondary{border-radius:7px;padding:.7rem 1.1rem;font-size:.875rem;line-height:1.5;display:inline-flex;justify-content:center;align-items:center}.primary{background:var(--accent);color:white;font-weight:600}.primary:hover{background:var(--accent-dark)}.primary:disabled{opacity:.7}.secondary{border:1px solid #d9deea;background:white;color:#526076}.review-column{display:grid;gap:1rem}.scope-card,.progress-card{padding:1.4rem;background:#fff;border:1px solid var(--line);border-radius:10px}.scope-card h2,.progress-card h2{margin:.35rem 0 1.1rem}.unit-scope+.unit-scope{border-top:1px solid var(--line);padding-top:.9rem;margin-top:.9rem}.unit-title{font-size:.875rem;font-weight:650}.unit-label{font-size:.75rem;color:var(--accent);margin-bottom:.2rem}.scope-card ul{padding:0 0 0 1.1rem;margin:.65rem 0 0}.scope-card li{font-size:.8rem;color:var(--muted);margin:.45rem 0}.progress-value{font-size:2rem;line-height:1.1;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:-.04em}.progress-value span{font-size:.875rem;color:#9aa2b1;font-weight:400;letter-spacing:0}.progress-caption{font-size:.75rem;color:var(--muted);margin-top:.55rem}.progress-track{height:6px;border-radius:10px;background:#eaeaf4;overflow:hidden;margin:1.1rem 0}.progress-track>div{height:100%;width:0;background:var(--accent);transition:width .2s}.progress-card>p{color:var(--muted);font-size:.8rem;margin:0}.progress-card .secondary{margin-top:1rem;width:100%}.review-tip{display:flex;gap:.7rem;padding:.4rem .55rem;color:#7f88a0}.review-tip>span{font-size:1.5rem;color:#8576cf;line-height:1.4}.review-tip p{font-size:.8rem;margin:0}.page-footer{margin:1.5rem 0 0;display:flex;justify-content:space-between;gap:1rem;color:#929aaa;font-size:.75rem}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}dialog{border:1px solid var(--line);border-radius:16px;max-width:540px;width:calc(100% - 2rem);padding:1.8rem;box-shadow:0 20px 70px #18233825;color:var(--ink)}dialog::backdrop{background:#18233870;backdrop-filter:blur(3px)}.dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:.65rem}.close-button{background:#f2f4f8;width:32px;height:32px;border-radius:50%;color:#687287;font-size:1.3rem;line-height:1}dialog h2{font-size:1.2rem}dialog p{font-size:.875rem;color:var(--muted)}dialog pre{font-size:.875rem;line-height:1.8;font-family:inherit;background:#f5f6fc;padding:1.2rem;border:1px solid var(--line);border-radius:8px;white-space:pre-wrap}.dialog-foot{margin-bottom:1.25rem}#copy-status{margin-left:.75rem;font-size:.8rem;color:var(--green)}
@media(min-width:1600px){main{padding-top:3rem}.layout{grid-template-columns:260px minmax(0,1fr)}}
@media(max-width:1150px){.layout{grid-template-columns:210px minmax(0,1fr)}main{padding:2rem 1.5rem}.topbar{padding:0 1.5rem}.study-grid{grid-template-columns:minmax(0,1fr) 225px;gap:1rem}.question,.exercise-header{padding:1.25rem}.scope-card,.progress-card{padding:1.1rem}.options{grid-template-columns:1fr}}
@media(max-width:940px){.study-grid{grid-template-columns:minmax(0,1fr)}.review-column{grid-template-columns:1fr 1fr}.scope-card{grid-row:span 2}.review-tip{align-self:start}.heading-row h1{font-size:1.6rem}}
@media(max-width:680px){.layout{display:block}.sidebar{height:auto;position:static;border-right:0;border-bottom:1px solid var(--line);padding:1rem}.brand{font-size:1.2rem;margin-bottom:1.1rem;gap:.6rem}.brand-mark{width:34px;height:34px;border-radius:9px;font-size:1.5rem}.brand small{font-size:.75rem;margin-top:.2rem}.nav-label,.subject-unit,.sidebar-note,.sidebar-bottom{display:none}#subjects{display:flex;gap:.5rem;flex-wrap:wrap}.subject-button{width:auto;margin:0;padding:.5rem .7rem;gap:.45rem;font-size:.875rem}.subject-symbol{width:23px;height:23px;font-size:.9rem;border-radius:5px}.subject-button .count{margin-left:.3rem}.topbar{height:52px;padding:0 1rem;font-size:.8rem}main{padding:1.5rem 1rem 1rem}.heading-row{align-items:flex-start}.heading-row h1{font-size:1.5rem}.heading-row p{font-size:.875rem;max-width:100%}.sample-badge{margin-top:1.55rem;font-size:.75rem}.notice{font-size:.8rem;margin:1.2rem 0}.question,.exercise-header{padding:1.2rem}.submit-bar{position:sticky;bottom:0;padding:1rem;border-top:1px solid var(--line);flex-wrap:wrap}.submit-bar .primary{flex:1;min-width:180px}.review-column{grid-template-columns:1fr}.scope-card{grid-row:auto}.scope-card ul{display:flex;flex-wrap:wrap;gap:0 1.5rem}.page-footer{flex-direction:column;gap:.25rem}.top-tag{display:flex;gap:.7rem}.mobile-material{color:var(--accent);background:transparent;padding:0;font-size:.8rem}.exercise-panel{border-radius:9px}dialog{padding:1.4rem}.option{min-height:48px}.question-title{font-size:1rem}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* English copy and readable supporting labels. */
.brand{font-size:1.25rem;letter-spacing:-.03em}.brand small{font-size:.75rem;letter-spacing:.035em}.subject-unit{font-size:.875rem}.sidebar-note,.scope-card li,.progress-card>p,.review-tip p{font-size:.875rem}.heading-row p{font-size:1rem}.sidebar-note p{font-size:.875rem}.top-tag{display:flex;gap:1rem;align-items:center}.mobile-material{color:var(--accent);background:transparent;font-size:.875rem;padding:0}.question-title{line-height:1.7}.brand{margin-bottom:2.7rem}.letter{min-width:.7rem}.progress-caption{line-height:1.7}.heading-row{align-items:flex-start}.sample-badge{margin-top:2rem}.submit-bar{flex-wrap:wrap}.topbar>span:first-child{min-width:0}@media(max-width:680px){.top-tag{font-size:0}.top-tag button{font-size:.875rem}.brand{margin-bottom:1rem}.heading-row{flex-wrap:wrap}.sample-badge{margin-top:0}.heading-row p{font-size:1rem}.subject-button .count{font-size:.875rem}}
.topic-controls{padding:1rem 1.6rem;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.topic-controls label{font-size:.875rem;color:var(--muted)}.topic-controls select{font:inherit;font-size:.875rem;max-width:100%;padding:.65rem 2rem .65rem .8rem;border:1px solid #dce1eb;border-radius:7px;background:#fff;color:var(--ink)}.music-diagram{margin:0 0 1.2rem;padding:.75rem;background:#fbfcff;border:1px solid var(--line);border-radius:8px;overflow:auto}.music-diagram svg{display:block;width:100%;max-width:450px;height:auto;min-width:220px;font-family:Segoe UI,Arial,sans-serif}.sources{font-size:.875rem;color:var(--muted);margin-top:1rem}.sources summary{cursor:pointer}#source-links{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem;padding:.8rem 0}#source-links a{color:var(--accent);text-decoration:underline}.subject-unit{font-size:.8rem;line-height:1.8}.sidebar{overflow:auto}.scope-card li{line-height:1.7}@media(max-width:680px){.topic-controls{padding:1rem}.topic-controls select{width:100%}.music-diagram{padding:.35rem}.music-diagram svg{min-width:0}}