:root{--blue:#1d70b8;--blue-dark:#16548a;--ink:#0b0c0c;--ink-soft:#4b4f52;--line:#d9dde0;--bg:#f3f5f7;--card:#fff;--green:#00703c;--green-bg:#e7f3ec;--amber:#946300;--amber-bg:#fdf3e0;--red:#b00020;--red-bg:#fbe8eb;--radius:14px;--shadow:0 1px 2px #0b0c0c0f, 0 8px 24px #0b0c0c14;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Roboto, Helvetica, Arial, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;line-height:1.5}button{cursor:pointer;font-family:inherit}a{color:var(--blue)}.app{max-width:760px;margin:0 auto;padding:18px 16px 64px}.app__header{justify-content:space-between;align-items:center;gap:12px;display:flex}.app__brand{align-items:center;gap:12px;display:flex}.app__logo{box-shadow:var(--shadow);border-radius:9px}.app__title{letter-spacing:-.01em;margin:0;font-size:1.5rem}.app__subtitle{color:var(--ink-soft);margin:2px 0 0;font-size:.85rem}.iconbtn{border:1px solid var(--line);background:var(--card);width:42px;height:42px;box-shadow:var(--shadow);border-radius:10px;font-size:1.2rem;line-height:1;transition:transform .1s}.iconbtn:hover{transform:rotate(30deg)}.app__progress{background:#e4e8eb;border-radius:999px;height:26px;margin:16px 0;position:relative;overflow:hidden}.app__progress-bar{background:linear-gradient(90deg, var(--green), #2a9d63);transition:width .35s;position:absolute;inset:0 auto 0 0}.app__progress-text{z-index:1;color:#07331e;mix-blend-mode:luminosity;place-items:center;height:100%;font-size:.78rem;font-weight:600;display:grid;position:relative}.toolbar{flex-wrap:wrap;justify-content:space-between;gap:10px;margin-bottom:16px;display:flex}.seg{background:#e4e8eb;border-radius:11px;gap:3px;padding:3px;display:inline-flex}.seg__btn{color:var(--ink-soft);background:0 0;border:0;border-radius:9px;padding:7px 13px;font-size:.85rem;font-weight:600;transition:all .12s}.seg__btn--on{background:var(--card);color:var(--blue);box-shadow:var(--shadow)}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--line);padding:20px}.card__top{justify-content:space-between;align-items:center;display:flex}.card__tags{gap:8px;display:flex}.card__counter{color:var(--ink-soft);font-variant-numeric:tabular-nums;font-size:.85rem}.badge{letter-spacing:.05em;color:#fff;border-radius:999px;padding:4px 9px;font-size:.7rem;font-weight:800}.badge--tell{background:var(--blue)}.badge--show{background:#6f42c1}.badge--num{background:#5a6066}.card__question{margin:16px 0 18px}.card__prompt-en{margin:0;font-size:1.22rem;font-weight:600;line-height:1.35}.card__prompt-zh{color:var(--ink-soft);margin:8px 0 0;font-size:.98rem}.recorder__controls{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.mic{border:1px solid var(--blue);color:var(--blue);background:#eaf2fa;border-radius:11px;align-items:center;gap:8px;padding:10px 16px;font-size:.95rem;font-weight:700;display:inline-flex}.mic--on{background:var(--red-bg);border-color:var(--red);color:var(--red)}.mic__dot{opacity:.55;background:currentColor;border-radius:50%;width:9px;height:9px}.mic--on .mic__dot{opacity:1;animation:1s infinite pulse}@keyframes pulse{0%{box-shadow:0 0 #b0002080}70%{box-shadow:0 0 0 8px #b0002000}to{box-shadow:0 0 #b0002000}}.recorder__nosupport{color:var(--amber);background:var(--amber-bg);border-radius:8px;padding:6px 10px;font-size:.82rem}.recorder__text{border:1px solid var(--line);resize:vertical;border-radius:11px;width:100%;margin-top:12px;padding:12px 14px;font-family:inherit;font-size:1rem}.recorder__text:focus{border-color:var(--ink);outline:3px solid #fd0}.recorder__error{color:var(--red);margin:8px 0 0;font-size:.85rem}.recorder__hint{color:var(--blue-dark);background:#eaf2fa;border:1px solid #cfe2f3;border-radius:8px;margin:8px 0 0;padding:8px 10px;font-size:.82rem;line-height:1.5}.btn{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:10px;padding:9px 14px;font-size:.9rem;font-weight:600;transition:background .12s,border-color .12s}.btn:hover{background:#f0f3f5}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background:var(--blue);border-color:var(--blue);color:#fff}.btn--primary:hover{background:var(--blue-dark)}.btn--ghost{background:0 0;border-style:dashed}.btn--known.is-known{background:var(--green-bg);border-color:var(--green);color:var(--green)}.card__grading{color:var(--ink-soft);margin:12px 0 0;font-size:.9rem}.result{border:1px solid var(--line);border-radius:12px;margin-top:16px;padding:14px 16px}.result--pass{background:var(--green-bg);border-color:#a9d6bd}.result--partial{background:var(--amber-bg);border-color:#f0d49a}.result--fail{background:var(--red-bg);border-color:#eeb6bf}.result--empty{background:#f0f3f5}.result__head{flex-wrap:wrap;align-items:center;gap:8px 12px;display:flex}.result__badge{font-size:1rem;font-weight:800}.result--pass .result__badge{color:var(--green)}.result--partial .result__badge{color:var(--amber)}.result--fail .result__badge{color:var(--red)}.result__score{color:var(--ink-soft);font-variant-numeric:tabular-nums;font-size:.85rem}.result__bonus{opacity:.8;font-style:normal}.result__engine{color:var(--ink-soft);background:#e4e8eb;border-radius:999px;margin-left:auto;padding:3px 8px;font-size:.7rem;font-weight:700}.result__engine.is-bridge{color:#5a32a3;background:#e6dcfa}.result__feedback{margin:10px 0 0;font-size:.92rem}.result__points{gap:7px;margin:12px 0 0;padding:0;list-style:none;display:grid}.result__point{align-items:baseline;gap:9px;font-size:.92rem;display:flex}.result__tick{color:var(--red);font-weight:800}.result__point.is-covered .result__tick{color:var(--green)}.result__point:not(.is-covered) .result__point-text{color:var(--ink-soft)}.result__point-en{color:var(--ink-soft);font-size:.82rem}.result__opt-tag,.result__point .result__opt-tag{color:var(--ink-soft);background:#e4e8eb;border-radius:999px;margin-left:6px;padding:1px 6px;font-size:.66rem;font-weight:700}.card__reveal-row{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.card__answer{border:1px solid var(--line);background:#f7f9fb;border-radius:12px;margin-top:14px;padding:16px}.card__answer-title{letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 8px;font-size:.78rem}.card__answer-en{margin:0;font-weight:500}.card__answer-zh{color:var(--ink-soft);margin:8px 0 0;font-size:.92rem}.card__nav{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:10px;margin-top:18px;padding-top:16px;display:flex}.card__nav-mid{gap:8px;display:flex}.video-clip{margin-top:16px}.video-clip__head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px;display:flex}.video-clip__title{color:var(--ink-soft);font-size:.82rem;font-weight:700}.video-clip__tabs{gap:6px;display:flex}.chip{border:1px solid var(--line);background:var(--card);color:var(--ink-soft);border-radius:999px;padding:3px 10px;font-size:.75rem;font-weight:600}.chip--on{background:var(--blue);border-color:var(--blue);color:#fff}.video-clip__frame{aspect-ratio:16/9;background:#000;border-radius:12px;width:100%;position:relative;overflow:hidden}.video-clip__frame iframe{border:0;width:100%;height:100%;position:absolute;inset:0}.video-clip__hint{color:var(--ink-soft);margin:6px 0 0;font-size:.76rem}.browse__group{margin:22px 0 10px;font-size:1.02rem}.browse__list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.browse__row{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:12px;overflow:hidden}.browse__row.is-known{border-color:#a9d6bd}.browse__summary{text-align:left;background:0 0;border:0;align-items:center;gap:10px;width:100%;padding:12px 14px;display:flex}.browse__row.is-known .browse__summary{background:var(--green-bg)}.browse__q{flex:1;font-size:.92rem;font-weight:500}.browse__chevron{color:var(--ink-soft);font-size:.7rem}.browse__detail{border-top:1px solid var(--line);padding:4px 16px 18px}.browse__h{letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);margin:16px 0 6px;font-size:.74rem}.browse__points{gap:4px;margin:0;padding-left:18px;font-size:.9rem;display:grid}.browse__actions{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.modal{z-index:50;background:#0b0c0c73;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal__panel{background:var(--card);border-radius:var(--radius);width:min(560px,100%);max-height:90vh;box-shadow:var(--shadow);overflow:auto}.modal__head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:16px 18px;display:flex}.modal__head h2{margin:0;font-size:1.1rem}.modal__close{color:var(--ink-soft);background:0 0;border:0;font-size:1.1rem}.modal__body{padding:18px}.modal__h{margin:0 0 8px;font-size:.95rem}.modal__p{color:var(--ink-soft);margin:0 0 14px;font-size:.88rem}.modal__label{margin-top:14px;margin-bottom:6px;font-size:.82rem;font-weight:600;display:block}.toggle{cursor:pointer;align-items:center;gap:9px;margin:4px 0 6px;font-size:.9rem;font-weight:600;display:flex}.toggle input{width:18px;height:18px;accent-color:var(--blue)}.modal__test{flex-wrap:wrap;align-items:center;gap:12px;margin-top:14px;display:flex}.conn{font-size:.82rem;font-weight:600}.conn--ok{color:var(--green)}.conn--bad{color:var(--red)}.modal__input{border:1px solid var(--line);border-radius:10px;width:100%;padding:10px 12px;font-family:inherit;font-size:.95rem}.modal__input:focus{border-color:var(--ink);outline:3px solid #fd0}.modal__details{margin-top:14px;font-size:.85rem}.modal__pre{color:#e8eaed;background:#0b0c0c;border-radius:10px;padding:12px;font-size:.78rem;line-height:1.5;overflow:auto}.modal__actions{gap:10px;margin-top:18px;display:flex}.app__footer{color:var(--ink-soft);text-align:center;margin-top:28px;font-size:.76rem;line-height:1.6}.empty{text-align:center;color:var(--ink-soft);padding:40px 0}@media (width<=560px){.app{padding:16px 12px 56px}.app__title{font-size:1.25rem}.card__prompt-en{font-size:1.08rem}.toolbar{flex-wrap:nowrap;align-items:center;gap:8px}.seg{gap:2px;min-width:0;padding:2px}.seg__btn{white-space:nowrap;padding:8px 9px;font-size:.8rem}.card__nav{flex-wrap:wrap}.card__nav-mid{order:3;justify-content:center;width:100%}}@media (width<=360px){.seg__btn{padding:7px;font-size:.74rem}}
