:root{--ink: #172027;--muted: #68737d;--line: #dce3e7;--paper: #ffffff;--soft: #f3f7f4;--green: #2f8f6b;--green-dark: #1f6c50;--coral: #d85b43;--amber: #d89128;--shadow: 0 18px 45px rgba(18, 32, 40, .1);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;color:var(--ink);background:var(--soft)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:var(--soft)}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}.page{min-height:100vh;padding:20px}.app-shell{min-height:calc(100vh - 40px);overflow:hidden;border:1px solid var(--line);background:var(--paper);box-shadow:var(--shadow)}.topbar{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;border-bottom:1px solid var(--line);background:#fff}.brand{display:flex;align-items:center;gap:10px;border:0;background:transparent;color:var(--ink);font-weight:900}.brand-mark,.avatar{width:34px;height:34px;display:grid;place-items:center;border-radius:8px;color:#fff;background:var(--green);font-weight:900}.top-note{color:var(--muted);font-size:13px;font-weight:800}.main-layout{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:calc(100vh - 104px)}.sidebar{padding:20px;border-right:1px solid var(--line);background:#fbfdfb}.student-card{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid #dce8e1;border-radius:8px;background:#fff}.student-card span{display:block;margin-top:2px;color:var(--muted);font-size:12px;font-weight:800}.side-nav{display:grid;gap:8px;margin-top:22px}.side-nav button{min-height:42px;display:flex;align-items:center;gap:10px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:var(--muted);font-size:14px;font-weight:850;text-align:left}.side-nav button.active{color:var(--green-dark);background:#e9f5ee}.content{min-width:0;padding:24px;background:#f7faf8}.title-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.title-row h1{margin:0;font-size:32px;line-height:1.08;font-weight:950}.title-row p,.hero-card p,.muted{margin:5px 0 0;color:var(--muted);font-size:14px;line-height:1.5;font-weight:700}.button{min-height:42px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 14px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font-weight:850}.button.dark{border-color:var(--ink);background:var(--ink);color:#fff}.button.green{border-color:var(--green-dark);background:var(--green);color:#fff}.chip,.recording-chip{min-height:30px;display:inline-flex;align-items:center;gap:6px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--muted);font-size:12px;font-weight:900}.chip.good{border-color:#2f8f6b40;color:var(--green-dark);background:#2f8f6b17}.chip.warn,.recording-chip{border-color:#d85b4340;color:#9d3d2b;background:#d85b4317}.hero-card,.panel,.practice-card,.reading-text,.exam-card,.pin-panel,.settings-list{border:1px solid var(--line);border-radius:8px;background:#fff}.hero-card{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;margin-bottom:14px;padding:18px}.hero-card h2,.panel h2,.practice-card h2{margin:0}.progress{height:8px;overflow:hidden;margin-top:14px;border-radius:999px;background:#e8edf0}.progress span{display:block;height:100%;border-radius:inherit;background:var(--green)}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px}.panel{padding:16px}.panel.wide{min-width:0}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.panel-head.clean{margin-bottom:16px}.task-list{display:grid}.task-row{width:100%;display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:12px;min-height:64px;padding:11px 0;border:0;border-bottom:1px solid var(--line);background:transparent;text-align:left}.task-row:last-child{border-bottom:0}.task-row span{display:block;margin-top:4px;color:var(--muted);font-size:12px;font-weight:750}.task-row em{min-height:28px;display:inline-flex;align-items:center;padding:0 9px;border-radius:8px;font-style:normal;font-size:12px;font-weight:900}.task-row em.done{color:var(--green-dark);background:#e9f5ee}.task-row em.pending{color:#9d3d2b;background:#fff1ef}.task-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:8px;color:var(--green-dark);background:#edf5f1}.ring{width:154px;height:154px;display:grid;place-items:center;margin:12px auto 18px;border-radius:50%}.ring strong,.ring span{display:block;text-align:center}.ring strong{font-size:34px;line-height:1}.ring span{color:var(--muted);font-size:12px;font-weight:850}.stat-grid,.report-grid,.exam-result{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.stat-grid div,.score-tile{padding:12px;border:1px solid var(--line);border-radius:8px;background:#fff}.stat-grid strong,.score-tile strong{display:block;font-size:28px;line-height:1}.stat-grid span,.score-tile span{display:block;margin-top:6px;color:var(--muted);font-size:12px;font-weight:850}.notice,.feedback{margin-top:14px;padding:14px 16px;border:1px solid #dce8e1;border-radius:8px;background:#fff;color:var(--muted);font-weight:750}.feedback.ok{color:var(--green-dark);background:#e9f5ee}.feedback.warn{color:#9d3d2b;background:#fff1ef}.practice-card{max-width:860px;padding:22px}.practice-card h2{margin:8px 0 14px;font-size:38px}.practice-card input,.exam-answer,.inline-form input,.pin-controls input{width:100%;min-height:52px;padding:0 14px;border:1px solid #cbdadb;border-radius:8px;background:#fff;color:var(--ink);font-size:17px;font-weight:800}.verb-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.verb-grid label span{display:block;margin-bottom:6px;color:var(--muted);font-size:12px;font-weight:850}.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.actions.vertical{display:grid}.actions.split{justify-content:space-between}.reading-layout,.data-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px}.reading-text{display:grid;gap:14px;padding:22px}.reading-text article{padding-bottom:16px;border-bottom:1px solid var(--line)}.reading-text article:last-child{border-bottom:0}.reading-text p{color:#34424c;font-size:18px;line-height:1.8;font-weight:650}.recorder-box{display:grid;gap:8px;place-items:center;min-height:180px;padding:18px;border-radius:8px;background:#f7faf8;text-align:center}.exam-timer{min-width:150px;padding:12px 14px;border-radius:8px;background:var(--ink);color:#fff;text-align:center}.exam-timer strong{display:block;font-size:30px;line-height:1}.exam-timer span{display:block;margin-top:5px;color:#ffffffb8;font-size:12px;font-weight:850}.exam-card{padding:22px}.exam-question{display:grid;gap:10px;min-height:150px;align-content:center;padding:18px;border:1px solid #dce5e4;border-radius:8px;background:#f7faf8}.exam-question span{color:var(--muted);font-size:13px;font-weight:850}.exam-question strong{font-size:38px;line-height:1}.question-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:7px}.question-dot{height:30px;display:grid;place-items:center;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--muted);font-size:12px;font-weight:900}.question-dot.done{border-color:#2f8f6b47;color:var(--green-dark);background:#e9f5ee}.question-dot.current{border-color:var(--ink);color:#fff;background:var(--ink)}.pin-panel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;margin-bottom:16px;padding:16px 18px;border-color:#d8912847;background:#fffaf1}.pin-panel h2{margin:0;font-size:17px}.pin-panel p{margin:5px 0 0;color:#7b6541;font-size:13px;font-weight:700}.pin-controls{display:flex;gap:10px}.pin-controls input{width:140px;letter-spacing:3px;text-align:center}.settings-list{overflow:hidden}.setting-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;min-height:82px;padding:14px 18px;border-bottom:1px solid var(--line)}.setting-row:last-child{border-bottom:0}.setting-row span{display:block;margin-top:5px;color:var(--muted);font-size:13px;font-weight:700}.stepper{display:inline-grid;grid-template-columns:38px 78px 38px auto;align-items:center;height:42px;overflow:hidden;border:1px solid var(--line);border-radius:8px;background:#fff}.stepper button{height:42px;border:0;border-right:1px solid var(--line);background:#f7faf8;color:var(--ink);font-size:18px;font-weight:900}.stepper strong{text-align:center}.stepper em{padding:0 10px;color:var(--muted);font-style:normal;font-size:12px;font-weight:850}.upload-card{min-height:180px;display:grid;align-content:center;gap:8px;padding:18px;border:1px dashed #b8c8c4;border-radius:8px;background:#fff;color:var(--ink)}.upload-card span{color:var(--muted);font-size:13px;font-weight:700}.upload-card input{margin-top:10px}.inline-form{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;margin-top:16px}.report-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:16px}.trend-table{width:100%;border-collapse:collapse}.trend-table th,.trend-table td{height:48px;padding:0 10px;border-bottom:1px solid var(--line);text-align:left;font-size:13px;font-weight:750}.trend-table th{color:var(--muted);font-size:12px;font-weight:900}@media(max-width:980px){.main-layout,.dashboard-grid,.reading-layout,.data-grid,.inline-form{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid var(--line)}.side-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-card,.pin-panel,.title-row{grid-template-columns:1fr;display:grid}}@media(max-width:640px){.page{padding:10px}.content,.sidebar{padding:14px}.title-row h1{font-size:26px}.verb-grid,.report-grid,.stat-grid,.setting-row{grid-template-columns:1fr}.question-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}