:root{
 --bg:#f4f7fb;--panel:#fff;--ink:#102846;--muted:#687b91;--line:#d5e1ed;
 --navy:#103f6c;--blue:#2478c9;--green:#17845d;--amber:#c97a0d;--red:#bd3028;
 --shadow:0 13px 34px rgba(17,43,75,.09)
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink)}
button,input,textarea,select{font:inherit}button{cursor:pointer}
.shell{max-width:1450px;margin:auto;padding:14px}
.topbar{position:sticky;top:6px;z-index:50;background:var(--navy);color:#fff;border-radius:18px;padding:13px 18px;display:flex;justify-content:space-between;gap:14px;align-items:center;box-shadow:var(--shadow)}
.brand h1{margin:0;font-size:20px}.brand .sub{font-size:11px;opacity:.82;margin-top:3px}
.row{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.grow{flex:1}
.pill{display:inline-flex;padding:7px 10px;border-radius:999px;background:#e7f6ef;color:#14613f;font-size:11px;font-weight:900}.pill.dark{background:#14395d;color:#fff}.pill.test{background:#ffe2a7;color:#724400}.pill.xp{background:#efe7ff;color:#65459a}
.grid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:17px;margin-top:17px}
.sidebar,.card{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow)}
.sidebar{padding:15px;height:max-content;position:sticky;top:84px}.main{min-width:0}.card{padding:22px}
.ring{width:112px;height:112px;border-radius:50%;display:grid;place-items:center;margin:0 auto 13px;background:conic-gradient(var(--blue) var(--p),#e7eef5 0);position:relative}.ring:before{content:"";position:absolute;inset:10px;border-radius:50%;background:#fff}.ring b{position:relative;font-size:23px}
.nav{display:grid;gap:7px}.navbtn{border:0;background:#f5f7fa;border-radius:13px;padding:9px 10px;display:grid;grid-template-columns:30px 1fr auto;gap:9px;align-items:center;text-align:left;color:#1c3c5d}.navbtn.active{background:#eaf4ff;outline:1px solid #9fc8ee}.navbtn.done{background:#eff9f4}.num{width:28px;height:28px;border-radius:9px;background:#e1ebf5;display:grid;place-items:center;font-size:12px;font-weight:900}.navbtn.done .num{background:#17845d;color:#fff}.navtitle{font-size:12px;font-weight:900}.navsub{font-size:10px;color:#71849a}.navstate{font-size:10px;color:#17845d;font-weight:900}
.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:center}.hero h2{font-size:42px;line-height:1.03;letter-spacing:-.04em;margin:8px 0 11px}.hero p{font-size:16px;line-height:1.65;color:#455d75}.kicker{display:inline-flex;border-radius:999px;background:#e6f3ff;color:#1762a5;padding:6px 9px;font-size:11px;font-weight:900;letter-spacing:.05em}
.hero-panel{border:1px solid #c9ddec;border-radius:20px;padding:18px;background:linear-gradient(135deg,#edf6ff,#f1fbf6)}.hero-panel h3{margin:0 0 9px}.hero-panel ol{margin:0;padding-left:20px;color:#4b6279;line-height:1.7}
.identity{border:1px solid var(--line);border-radius:17px;padding:15px;background:#fbfdff;margin-top:17px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.field{display:grid;gap:5px}.field.full{grid-column:1/-1}.field label{font-size:11px;font-weight:900;color:#435a71}input,select,textarea{width:100%;padding:10px 11px;border:1px solid #c6d6e5;border-radius:11px;background:#fff;color:var(--ink)}textarea{min-height:112px;resize:vertical}
.testbox{border:2px dashed #e2a43b;background:#fff8e7;border-radius:14px;padding:11px;margin-bottom:12px}.testbox label{display:flex;gap:9px;align-items:flex-start;cursor:pointer}.testbox input{width:20px;height:20px;accent-color:#d07a0b;flex:0 0 auto}.testbox small{display:block;color:#6e5a35;line-height:1.4;margin-top:3px}
.btn{border:0;border-radius:12px;padding:10px 14px;background:#e8eef5;color:#1a4167;font-weight:900}.btn.primary{background:var(--blue);color:#fff}.btn.secondary{background:#174f80;color:#fff}.btn.good{background:var(--green);color:#fff}.btn.ghost{background:#fff;border:1px solid #c7d6e5}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-row{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-top:11px}
.head{display:flex;justify-content:space-between;gap:13px;align-items:flex-start;margin-bottom:14px}.head h1{margin:5px 0 5px;font-size:32px;letter-spacing:-.025em}.head p{margin:0;color:#587086;line-height:1.5}.points{background:#eef5ff;border:1px solid #bad5ef;border-radius:15px;padding:10px 13px;font-weight:900;white-space:nowrap}
.audio{border:1px solid #cbddec;background:#f3f8fd;border-radius:14px;padding:12px;margin-bottom:15px}.audio .atop{display:flex;justify-content:space-between;gap:9px;align-items:center;margin-bottom:8px}.audio strong{font-size:12px}.audio small{display:block;color:#72849a;margin-top:2px}.audio audio{width:100%}
.allq{display:grid;gap:13px}.qcard{border:1px solid #d5e1ed;border-radius:16px;padding:14px;background:#fff}.qtitle{font-weight:900;font-size:15px;line-height:1.45;margin-bottom:9px}.opts{display:grid;gap:7px}.optline{display:flex;align-items:flex-start;gap:8px;border:1px solid #d2dfeb;border-radius:11px;padding:9px 10px;background:#fff}.optline:hover{background:#f5f9fd}.optline input{width:18px;height:18px;flex:0 0 auto;margin-top:1px}.letter{width:22px;height:22px;border-radius:7px;background:#e9f1f8;display:grid;place-items:center;font-size:10px;font-weight:950;flex:0 0 auto}.choice-text{font-size:13px;line-height:1.4}
.feedback{margin-top:8px;border-radius:10px;padding:9px 10px;font-size:11px}.feedback.ok{background:#eaf8f1;color:#175c44;border:1px solid #abd9c4}.feedback.err{background:#fff0ee;color:#8d2921;border:1px solid #efb3ae}.feedback.warn{background:#fff8e8;color:#6d4b0b;border:1px solid #e9ca8a}
.section-result{border:1px solid #c8dded;background:#f4f9fd;border-radius:14px;padding:11px 13px;margin-top:13px;font-size:12px}
.schedule-wrap{max-width:100%;border:1px solid #d5e1ed;border-radius:16px;overflow:hidden;background:#fff}.schedule-wrap img{display:block;width:100%;height:auto}
.speaking-questions{display:grid;gap:11px;margin-top:14px}.speakq{border:1px solid #d3e0eb;border-radius:15px;padding:13px}.speakq h3{font-size:15px;margin:0 0 6px}.speakq p{font-size:13px;color:#4e657c;margin:0 0 8px}.recstate{font-size:11px;color:#176747;font-weight:850;margin-top:7px}.prep{display:flex;align-items:center;gap:12px;border:1px solid #edd09a;background:#fff8ea;border-radius:14px;padding:12px;margin-bottom:13px}.prep b{font-size:28px;font-variant-numeric:tabular-nums}
.email{border:1px solid #d7e1ea;border-radius:16px;padding:17px;background:#fffefa;margin-bottom:15px}.email p{font-size:13px;line-height:1.62;color:#3f5368;margin:0 0 10px}.email .sig{font-weight:800;color:#1c456d}
.write-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.writecard{border:1px solid #d4e1ed;border-radius:17px;padding:14px}.writecard img{width:100%;display:block;border-radius:13px;border:1px solid #e2e5e8}.writecard h3{font-size:15px;margin:11px 0 5px}.required{display:flex;gap:7px;flex-wrap:wrap;margin:8px 0}.req{background:#eaf4ff;color:#175f9e;border-radius:999px;padding:6px 9px;font-size:11px;font-weight:900}.write-note{font-size:11px;color:#64788e;line-height:1.45}.write-status{font-size:11px;margin-top:7px;font-weight:850}.write-status.ok{color:#176747}.write-status.warn{color:#9a5a06}
.finish{display:grid;grid-template-columns:250px 1fr;gap:18px}.score-ring{width:205px;height:205px;border-radius:50%;display:grid;place-items:center;margin:auto;background:conic-gradient(var(--blue) var(--s),#e7eef5 0);position:relative}.score-ring:before{content:"";position:absolute;inset:16px;border-radius:50%;background:#fff}.score-ring div{position:relative;text-align:center}.score-ring b{font-size:50px}.breakdown{display:grid;gap:7px}.br{border:1px solid #d6e2ed;border-radius:12px;padding:9px 11px;display:flex;justify-content:space-between;gap:10px;font-size:12px}.submit{margin-top:13px;border:1px solid #c8ddec;background:#f3f8fd;border-radius:15px;padding:14px}
.toast{position:fixed;right:18px;bottom:18px;background:#102c48;color:#fff;padding:11px 13px;border-radius:11px;z-index:999;max-width:420px;box-shadow:var(--shadow)}.footer{display:flex;justify-content:space-between;gap:10px;font-size:10px;color:#78899b;padding:16px 4px 6px}
@media(max-width:1000px){.grid{grid-template-columns:1fr}.sidebar{position:static}.hero,.finish{grid-template-columns:1fr}.nav{grid-template-columns:1fr 1fr}.write-grid{grid-template-columns:1fr}}
@media(max-width:650px){.shell{padding:8px}.topbar{position:static}.nav{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.hero h2{font-size:34px}.head h1{font-size:26px}}