:root { --ink:#142421; --muted:#5c6c68; --paper:#f7f5ef; --line:#dfe5de; --forest:#123f39; --teal:#1d7c6f; --violet:#6754a4; --coral:#bd5b48; --gold:#a87523; --slate:#385667; --white:#fff; --wrong:#b34842; --right:#197361; --shadow:0 10px 30px rgba(16,48,42,.08); }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif; line-height:1.6; }
button,input { font:inherit; }
button { cursor:pointer; }
.app-shell { max-width:880px; margin:0 auto; padding:0 18px 92px; }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:28px 4px 18px; }
h1,h2,h3,p { margin-top:0; } h1 { margin-bottom:0; font-size:clamp(1.6rem,5vw,2.2rem); line-height:1.2; } h2 { margin-bottom:6px; line-height:1.3; } h3 { font-size:1rem; }
.eyebrow { margin:0 0 4px; color:var(--muted); font-size:.73rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.muted,.input-help { color:var(--muted); }
.screen { display:none; animation:enter .25s ease-out; }.screen.active { display:block; } @keyframes enter { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:none; } }
.hero-card,.settings-card,.note-card,.question-card,.reading-card,.writing-card,.plan-card { border:1px solid var(--line); border-radius:20px; background:var(--white); box-shadow:var(--shadow); }
.hero-card { display:flex; justify-content:space-between; gap:20px; padding:25px; background:linear-gradient(135deg,#e6f1e8,#fdfbf6); }.hero-card h2 { font-size:1.4rem; }.hero-card p:last-child { margin-bottom:0; }
.primary-button,.ghost-button { border-radius:11px; padding:10px 15px; font-weight:700; white-space:nowrap; }.primary-button { color:#fff; background:var(--forest); border:1px solid var(--forest); }.ghost-button { color:var(--forest); background:transparent; border:1px solid #aebdb8; }.primary-button:hover { background:#0b302c; }
.stat-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:15px 0 30px; }.stat { padding:13px 12px; border-radius:14px; background:#edf1ec; }.stat strong { display:block; color:var(--forest); font-size:1.25rem; }.stat span { display:block; font-size:.78rem; color:var(--muted); }
.section-block { margin-top:27px; }.section-heading { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }.section-heading h2 { margin:0; font-size:1.16rem; }.pill { padding:4px 9px; border-radius:99px; background:#e6f0e9; color:var(--forest); font-size:.76rem; font-weight:700; }
.task-list { display:grid; gap:10px; }.task-card { display:grid; grid-template-columns:45px 1fr auto; gap:13px; align-items:center; width:100%; padding:16px; text-align:left; border:1px solid var(--line); border-radius:15px; background:var(--white); color:var(--ink); }.task-card:hover { border-color:#8eaaa2; }.task-card.done { background:#f0f7f2; }.task-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; color:#fff; font-weight:800; }.task-card b,.task-card small { display:block; }.task-card small { color:var(--muted); }.task-arrow { color:var(--muted); font-size:1.2rem; }
.note-card { display:flex; gap:12px; padding:16px; box-shadow:none; }.note-card p { margin:0; font-size:.9rem; }.note-icon { display:grid; place-items:center; flex:0 0 24px; height:24px; border-radius:50%; color:#fff; background:var(--teal); font-weight:800; }
.subject-head { margin:0 -18px 19px; padding:26px 22px 22px; color:#fff; }.subject-head .eyebrow { color:rgba(255,255,255,.75); }.subject-head h2 { margin-bottom:5px; }.subject-head p:last-child { margin:0; font-size:.9rem; color:rgba(255,255,255,.88); }.teal { background:var(--teal); }.violet { background:var(--violet); }.coral { background:var(--coral); }.gold { background:var(--gold); }.slate { background:var(--slate); }
.english-head-row { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }.english-search-shelf { position:sticky; z-index:4; top:8px; display:flex; align-items:center; gap:16px; margin:0 0 20px; padding:11px 13px; border:1px solid #c97565; border-radius:13px; color:#fff; background:#b95543; box-shadow:0 8px 20px rgba(64,31,23,.18); }.word-search { flex:0 0 min(320px,47%); }.word-search label { display:block; margin-bottom:5px; color:#fff; font-size:.74rem; font-weight:700; }.word-search>div { display:flex; }.word-search input { min-width:0; flex:1; padding:8px; border:0; border-radius:7px 0 0 7px; color:var(--ink); background:#fff; font-size:.85rem; }.word-search button { padding:7px 10px; border:0; border-radius:0 7px 7px 0; color:#fff; background:#723025; font-size:.82rem; font-weight:700; }.word-result { flex:1; min-height:23px; color:rgba(255,255,255,.92); font-size:.82rem; }.word-result strong { color:#fff3c2; }.word-result a { color:#fff3c2; font-weight:700; }.english-section { margin-top:28px; }
.question-stack { display:grid; gap:16px; }.question-card { overflow:hidden; box-shadow:none; }.question-top { display:flex; justify-content:space-between; gap:12px; padding:15px 17px 0; }.question-index { font-weight:800; color:var(--forest); }.question-meta { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px; }.tag { height:max-content; padding:2px 8px; border-radius:99px; background:#e9efea; color:#466258; font-size:.72rem; }.year-tag { color:#9d4437; background:#fbe8e4; font-weight:800; }.question-body { padding:7px 17px 17px; }.question-text { white-space:pre-line; }.options { display:grid; gap:8px; margin-top:14px; }.option { display:flex; gap:10px; align-items:flex-start; width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:10px; text-align:left; color:var(--ink); background:#fff; }.option:hover { border-color:#6b9389; background:#f8fcf9; }.option-letter { display:grid; place-items:center; flex:0 0 23px; height:23px; border-radius:50%; background:#edf1ed; font-weight:800; font-size:.78rem; }.option.selected-correct { color:#11584b; border-color:#299079; background:#eaf7f1; }.option.selected-wrong { color:#812d29; border-color:#ca736d; background:#fdf0ee; }.option.answer-reveal { border-color:#299079; }.option.selected-correct .option-letter,.option.answer-reveal .option-letter { color:#fff; background:#197361; }.option.selected-wrong .option-letter { color:#fff; background:#b34842; }.analysis { display:none; padding:15px 17px 17px; border-top:1px solid var(--line); background:#f3f7f4; }.analysis.show { display:block; }.analysis p { margin-bottom:7px; }.analysis b { color:var(--forest); }.source { color:var(--muted); font-size:.77rem; }
.exam-section { margin-top:30px; }.exam-section:first-of-type { margin-top:0; }
.reading-list { display:grid; gap:20px; }.reading-card { overflow:hidden; box-shadow:none; }.reading-header { padding:18px; color:#fff; background:#8e4033; }.reading-header h3,.reading-header p { margin:0; }.reading-header p { font-size:.8rem; opacity:.85; }.passage { padding:16px 18px 3px; }.sentence { padding:10px 0; border-bottom:1px dashed var(--line); }.sentence:last-child { border-bottom:0; }.sentence p { margin:0; }.translation { margin-top:4px !important; color:#635c53; font-size:.9rem; }.reading-questions { padding:5px 18px 18px; }.reading-questions h3 { margin:15px 0 8px; }
.cloze-card .reading-header { background:#a95241; }.cloze-card .passage { background:#fffdf8; }.translation-card { padding:18px; }.translation-card h3 { margin-bottom:5px; }.translation-card>p { color:var(--muted); font-size:.86rem; }.translation-card .passage { padding:5px 0 0; }.translation-card .primary-button { margin-top:15px; }
.writing-grid { display:grid; gap:16px; }.writing-card { padding:18px; box-shadow:none; }.writing-card h3 { color:var(--gold); }.prompt-box,.template-box { padding:13px; border-radius:11px; background:#fff8e9; }.template-box { margin-top:12px; background:#f5f7f1; white-space:pre-line; font-family:ui-monospace,"Cascadia Mono",monospace; font-size:.86rem; }.writing-card ul { padding-left:19px; }
.settings-card { display:grid; gap:8px; padding:19px; box-shadow:none; }.settings-card label { font-weight:800; }.settings-card input { width:100%; padding:11px; border:1px solid #afbbb5; border-radius:10px; background:#fff; }.settings-card p { font-size:.83rem; margin:0 0 6px; }.plan-card { margin-top:16px; padding:18px; box-shadow:none; }.timeline { display:grid; gap:10px; margin-top:12px; }.timeline-step { display:flex; gap:11px; align-items:flex-start; padding:10px; border-radius:10px; background:#f5f6f2; }.timeline-dot { display:grid; place-items:center; flex:0 0 25px; height:25px; color:#fff; border-radius:50%; background:#9aa9a3; font-size:.75rem; font-weight:800; }.timeline-step.current { background:#edf5f0; }.timeline-step.current .timeline-dot { background:var(--forest); }.timeline-step strong,.timeline-step span { display:block; }.timeline-step span { color:var(--muted); font-size:.85rem; }.source-block { padding-bottom:15px; }.source-block>p { font-size:.9rem; }.source-list { display:grid; gap:8px; padding-left:20px; font-size:.86rem; }
.bottom-nav { position:fixed; z-index:5; left:0; right:0; bottom:0; display:flex; justify-content:center; gap:2px; padding:8px max(8px,env(safe-area-inset-left)) calc(8px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:rgba(255,255,255,.96); backdrop-filter:blur(12px); }.nav-item { display:grid; gap:1px; place-items:center; width:min(115px,16vw); padding:6px 3px; border:0; color:#64736e; background:transparent; font-size:.7rem; }.nav-item span { font-size:1.1rem; line-height:1.1; }.nav-item.active { color:var(--forest); font-weight:800; }
#toast { position:fixed; z-index:10; left:50%; bottom:78px; max-width:80vw; padding:9px 14px; color:#fff; background:#172d28; border-radius:10px; transform:translate(-50%,20px); opacity:0; pointer-events:none; transition:.2s; font-size:.87rem; }#toast.show { transform:translate(-50%,0); opacity:1; }
@media (min-width:700px) { .app-shell { padding-left:26px; padding-right:26px; }.subject-head { margin-left:-26px; margin-right:-26px; padding-left:30px; }.writing-grid { grid-template-columns:1fr 1fr; }.bottom-nav { padding-bottom:10px; }.nav-item { width:110px; }.question-card { border-radius:17px; } }
@media (max-width:620px) { .english-head-row { display:block; }.english-search-shelf { display:block; top:4px; }.word-search { max-width:none; }.word-result { margin-top:7px; } }
@media (max-width:460px) { .hero-card { display:block; }.hero-card .primary-button { margin-top:12px; }.stat-grid { grid-template-columns:1fr 1fr 1fr; }.stat { padding:10px 8px; }.task-card { grid-template-columns:39px 1fr 14px; padding:13px; }.task-icon { width:37px; height:37px; }.topbar { padding-top:20px; } }

/* 逐项中文对照与管综分步解析 */
.question-translation { margin:-1px 0 0; padding:9px 10px; border-left:3px solid #c66a57; border-radius:0 8px 8px 0; color:#695b4d; background:#fff7ee; font-size:.9rem; line-height:1.55; }
.option-copy { display:grid; gap:3px; min-width:0; }.option-english { line-height:1.42; }.option-translation { color:#6c6256; font-size:.84rem; line-height:1.42; }
.solution-steps { margin:12px 0; padding:12px 13px 7px; border:1px solid #d8e5dc; border-radius:10px; background:#fff; }.solution-steps h4 { margin:0 0 7px; color:var(--forest); font-size:.9rem; }.solution-steps ol { margin:0; padding-left:20px; }.solution-steps li { margin:0 0 7px; line-height:1.55; }.pitfall { margin:12px 0 4px !important; padding:9px 10px; border-radius:8px; color:#755018; background:#fff5dd; font-size:.89rem; line-height:1.5; }
.bottom-nav .nav-item { width:min(110px,calc((100vw - 16px) / 7)); }
.sync-key-row { display:flex; gap:8px; }.sync-key-row input { min-width:0; flex:1; font-family:ui-monospace,"Cascadia Mono",monospace; letter-spacing:.05em; }.sync-key-row .ghost-button { padding-left:12px; padding-right:12px; }