*{margin:0;padding:0;box-sizing:border-box;}
:root{--bg:#f5f6f8;--card:#fff;--border:#e0e3e8;--text:#1a1a2e;--muted:#6b7280;--primary:#3b82f6;--primary-light:#dbeafe;--green:#10b981;--green-light:#d1fae5;--red:#ef4444;--red-light:#fee2e2;--purple:#8b5cf6;--purple-light:#ede9fe;--orange:#f59e0b;--orange-light:#fef3c7;--radius:10px;--shadow:0 1px 3px rgba(0,0,0,.08);}
body{font-family:'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;background:var(--bg);color:var(--text);line-height:1.6;}

/* ===== Layout ===== */
.app{display:flex;min-height:100vh;}
.sidebar{width:240px;background:var(--card);border-right:1px solid var(--border);padding:0;position:fixed;top:0;left:0;bottom:0;overflow-y:auto;z-index:100;transition:transform .3s;}
.sidebar-header{padding:20px 18px 14px;border-bottom:1px solid var(--border);}
.sidebar-header h1{font-size:17px;font-weight:700;display:flex;align-items:center;gap:8px;}
.sidebar-header p{font-size:11px;color:var(--muted);margin-top:4px;}
.nav-section{padding:8px 0;}
.nav-section-title{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;padding:8px 18px 4px;font-weight:600;}
.nav-item{display:flex;align-items:center;gap:10px;padding:9px 18px;font-size:13.5px;cursor:pointer;color:var(--text);border-left:3px solid transparent;transition:all .15s;}
.nav-item:hover{background:#f0f2f5;}
.nav-item.active{background:var(--primary-light);color:var(--primary);border-left-color:var(--primary);font-weight:600;}
.nav-icon{font-size:16px;flex-shrink:0;width:20px;text-align:center;}
.main{flex:1;margin-left:240px;padding:24px 32px;max-width:100%;overflow-x:hidden;}
.page{display:none;}
.page.active{display:block;}
.page-header{margin-bottom:20px;}
.page-header h2{font-size:22px;font-weight:700;}
.page-header p{color:var(--muted);font-size:13px;margin-top:4px;}

/* ===== Cards ===== */
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px;margin-bottom:16px;}
.card-title{font-size:15px;font-weight:700;margin-bottom:12px;display:flex;align-items:center;gap:8px;}

/* ===== Home Nav Grid ===== */
.home-hero{text-align:center;padding:40px 20px 30px;}
.home-hero h2{font-size:26px;margin-bottom:8px;}
.home-hero p{color:var(--muted);font-size:14px;}
.nav-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin-top:20px;}
.nav-card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;cursor:pointer;transition:all .2s;border:2px solid transparent;}
.nav-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.12);}
.nav-card-icon{font-size:28px;margin-bottom:8px;}
.nav-card h3{font-size:15px;font-weight:700;margin-bottom:4px;}
.nav-card p{font-size:12px;color:var(--muted);}
.convention-box{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;margin-top:20px;}
.convention-box h3{font-size:14px;font-weight:700;margin-bottom:10px;}
.convention-box ul{list-style:none;padding:0;}
.convention-box li{font-size:13px;padding:4px 0;display:flex;gap:6px;}
.convention-box li::before{content:'📌';flex-shrink:0;}

/* ===== Toggle ===== */
.toggle{border:1px solid var(--border);border-radius:var(--radius);margin-bottom:8px;overflow:hidden;}
.toggle-header{padding:12px 16px;cursor:pointer;font-weight:600;font-size:14px;display:flex;justify-content:space-between;align-items:center;background:#f9fafb;}
.toggle-header:hover{background:#f0f2f5;}
.toggle-arrow{transition:transform .2s;font-size:12px;}
.toggle.open .toggle-arrow{transform:rotate(90deg);}
.toggle-body{display:none;padding:14px 16px;}
.toggle.open .toggle-body{display:block;}
.lesson-card{border:1px solid var(--border);border-radius:8px;margin-bottom:8px;padding:10px 12px;font-size:13px;background:#fff;}
.lesson-card-head{font-weight:700;font-size:13.5px;margin-bottom:6px;color:var(--text);}
.lesson-card-row{margin:4px 0;line-height:1.55;color:var(--text);}
.lc-tag{display:inline-block;background:var(--primary-light);color:var(--primary);border-radius:4px;padding:1px 7px;font-size:12px;font-weight:600;margin-right:7px;flex:0 0 auto;}

/* ===== Table ===== */
.data-table{width:100%;border-collapse:collapse;font-size:13px;}
.data-table th{background:#f8f9fa;padding:10px 8px;text-align:left;font-weight:600;border-bottom:2px solid var(--border);white-space:nowrap;position:sticky;top:0;}
.data-table td{padding:8px;border-bottom:1px solid var(--border);vertical-align:top;}
.data-table tr:hover{background:#f5f7fa;}

/* ===== Forms ===== */
.form-group{margin-bottom:12px;}
.form-label{display:block;font-size:12px;font-weight:600;margin-bottom:4px;color:var(--text);}
.form-input,.form-select,.form-textarea{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:6px;font-size:13px;font-family:inherit;background:#fff;}
.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light);}
.form-textarea{resize:vertical;min-height:60px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.form-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;}

/* ===== Buttons ===== */
.btn{padding:8px 16px;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:6px;font-family:inherit;}
.btn-primary{background:var(--primary);color:#fff;}
.btn-primary:hover{background:#2563eb;}
.btn-green{background:var(--green);color:#fff;}
.btn-green:hover{background:#059669;}
.btn-red{background:var(--red);color:#fff;}
.btn-red:hover{background:#dc2626;}
.btn-outline{background:#fff;color:var(--text);border:1px solid var(--border);}
.btn-outline:hover{background:#f5f5f5;}
.btn-sm{padding:5px 10px;font-size:12px;}
.btn-row{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap;}

/* ===== Badges ===== */
.badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600;}
.badge-primary{background:var(--primary-light);color:var(--primary);}
.badge-green{background:var(--green-light);color:var(--green);}
.badge-red{background:var(--red-light);color:var(--red);}
.badge-purple{background:var(--purple-light);color:var(--purple);}
.badge-orange{background:var(--orange-light);color:var(--orange);}
.badge-gray{background:#e5e7eb;color:#4b5563;}

/* ===== TTS 点读/跟读 ===== */
.chip-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.chip{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:16px;background:#eef2ff;border:1px solid #c7d2fe;color:#3730a3;font-size:13px;cursor:pointer;user-select:none;transition:background .15s;}
.chip:hover{background:#e0e7ff;}
.chip .chip-sound{font-size:10px;opacity:.7;}
.tts-sentence{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 4px;border-bottom:1px dashed #e5e7eb;font-size:13px;}
.tts-sentence:last-child{border-bottom:none;}
.tts-sentence .ts-txt{flex:1;}
.tts-rate-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:10px;}
.tts-rate-row input[type=range]{flex:1;min-width:160px;}
.speak-btn{padding:2px 8px;font-size:11px;border:1px solid #c7d2fe;background:#eef2ff;color:#3730a3;border-radius:10px;cursor:pointer;margin-left:6px;vertical-align:middle;}
.speak-btn:hover{background:#e0e7ff;}
.listen-btn{display:inline-block;padding:2px 9px;margin:1px 2px;font-size:11px;font-weight:600;border:1px solid #bbf7d0;background:#f0fdf4;color:#15803d;border-radius:10px;cursor:pointer;text-decoration:none;white-space:nowrap;}
.listen-btn:hover{background:#dcfce7;border-color:#86efac;}
.play-big{display:inline-block;padding:5px 14px;font-size:12.5px;font-weight:700;background:var(--green-light);color:#15803d;border:1px solid #86efac;border-radius:8px;cursor:pointer;}
.play-big:hover{background:#bbf7d0;}
.bp-line{padding:5px 10px;border-radius:6px;margin:3px 0;cursor:pointer;transition:background .15s;line-height:1.6;}
.bp-line:hover{background:var(--primary-light);}
.bp-on{background:var(--primary-light);font-weight:600;border-left:3px solid var(--primary);}

/* ===== 英语朗读（朗读宝 App 式模块化） ===== */
.lb-tabs{display:flex;gap:6px;overflow-x:auto;padding:2px 2px 10px;margin-bottom:14px;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.lb-tabs::-webkit-scrollbar{display:none;}
.lb-tab{flex-shrink:0;padding:8px 14px;border-radius:20px;font-size:13px;font-weight:600;cursor:pointer;background:#fff;border:1px solid var(--border);color:var(--text);white-space:nowrap;transition:all .15s;}
.lb-tab:hover{border-color:var(--primary);color:var(--primary);}
.lb-tab.on{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 2px 6px rgba(59,130,246,.35);}
.lb-panel{display:none;animation:fadeIn .2s;}
.lb-panel.on{display:block;}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.lb-toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px;}
.lb-toolbar select{width:auto;min-width:140px;}
.lb-list{display:flex;flex-direction:column;}
.lb-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border:1px solid var(--border);border-radius:8px;margin-bottom:8px;background:#fff;font-size:13px;}
.lb-item .lb-no{width:26px;height:26px;border-radius:50%;background:var(--primary-light);color:var(--primary);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;flex-shrink:0;}
.lb-item .lb-txt{flex:1;line-height:1.5;}
.lb-item.playing{border-color:var(--primary);background:var(--primary-light);}
/* —— 精听课文四层导航 + 五步工作台 —— */
.lt-group{margin-bottom:18px;}
.lt-group h3{font-size:14px;margin:0 0 10px;}
.lt-book-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;}
.lt-book-card{display:flex;flex-direction:column;gap:4px;align-items:flex-start;padding:12px;border-radius:10px;border:1px solid var(--border);background:#fff;cursor:pointer;font-size:13px;transition:all .15s;text-align:left;color:var(--text);}
.lt-book-card:hover{border-color:var(--primary);box-shadow:0 2px 8px rgba(59,130,246,.15);}
.lt-book-card b{font-size:14px;}
.lt-crumb{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px;font-size:13px;}
.lt-steps{display:flex;gap:6px;overflow-x:auto;margin-bottom:12px;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.lt-steps::-webkit-scrollbar{display:none;}
.lt-step{flex-shrink:0;display:flex;align-items:center;gap:4px;padding:8px 14px;border-radius:20px;font-size:13px;font-weight:600;cursor:pointer;background:#fff;border:1px solid var(--border);color:var(--text);white-space:nowrap;transition:all .15s;}
.lt-step:hover{border-color:var(--primary);color:var(--primary);}
.lt-step.on{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 2px 6px rgba(59,130,246,.35);}
.lt-blindbox{padding:28px;text-align:center;border:2px dashed var(--border);border-radius:10px;color:var(--muted);font-size:14px;margin-top:10px;line-height:1.8;}
.lt-fulltext{font-size:15px;line-height:2;padding:14px 16px;border:1px solid var(--border);border-radius:10px;background:#fff;}
.lt-sen{cursor:pointer;border-radius:4px;padding:1px 2px;transition:background .15s;}
.lt-sen:hover{background:var(--primary-light);}
.lt-sen.lt-playing{background:var(--primary-light);box-shadow:inset 0 -2px 0 var(--primary);}
.lt-unit-card{cursor:pointer;transition:all .15s;}
.lt-unit-card:hover{border-color:var(--primary);background:var(--primary-light);}
.lt-note-ta{width:100%;min-height:150px;padding:12px;border:1px solid var(--border);border-radius:10px;font-size:14px;line-height:1.7;resize:vertical;font-family:inherit;}
.lb-score{font-size:20px;font-weight:800;color:var(--green);}
.lb-score.mid{color:var(--orange);}
.lb-score.bad{color:var(--red);}
.lb-score.big{font-size:34px;}
.lb-bar{height:8px;border-radius:4px;background:#e5e7eb;overflow:hidden;flex:1;max-width:220px;}
.lb-bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--green),#34d399);}
.lb-ref-score{background:var(--bg2,#f0fdf4);border:1px solid #bbf7d0;border-radius:8px;padding:8px 10px;margin-bottom:8px;font-size:14px;}
.lb-ref-score b{font-size:22px;font-weight:800;color:var(--green);}
.lb-ref-score b.bad{color:var(--red);}
.lb-rec-row{display:flex;align-items:center;gap:12px;margin-top:8px;padding:12px;background:#f8fafc;border-radius:8px;border:1px dashed var(--border);flex-wrap:wrap;}
.lb-rec-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:20px;font-size:13px;font-weight:700;cursor:pointer;border:none;color:#fff;transition:all .15s;}
.lb-rec-btn.rec{background:var(--red);animation:pulse 1.2s infinite;}
.lb-rec-btn.go{background:var(--primary);}
.lb-rec-btn.go:hover{background:#2563eb;}
.lb-rec-btn.stop{background:var(--red);}
.lb-rec-btn.stop:hover{background:#dc2626;}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,.5)}50%{box-shadow:0 0 0 8px rgba(239,68,68,0)}}
.lb-empty{padding:22px;text-align:center;color:var(--muted);font-size:13px;}
.game-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;}
.game-card{aspect-ratio:1.35;border:1.5px solid var(--border);border-radius:10px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;cursor:pointer;padding:8px;text-align:center;transition:all .15s;user-select:none;}
.game-card:hover{border-color:var(--primary);}
.game-card.flip{background:var(--primary-light);border-color:var(--primary);}
.game-card.ok{background:var(--green-light);border-color:var(--green);color:#065f46;cursor:default;opacity:.85;transform:scale(.96);}
.game-card.fail{background:var(--red-light);border-color:var(--red);animation:shake .3s;}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.phonics-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;}
.phonics-card{border:1px solid var(--border);border-radius:10px;padding:12px;background:#fff;}
.phonics-card h4{margin-bottom:2px;font-size:14px;display:flex;justify-content:space-between;align-items:center;}
.phonics-card .ph-key{font-size:19px;font-weight:800;color:var(--primary);}
.phonics-card .ph-sound{font-size:11px;color:var(--muted);}
.phonics-card .ph-words{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.pron-tips .chip{background:#fff3cd!important;border:1px solid #ffe69c!important;font-size:12px!important;color:#664d03!important;}
.ear-status-box{padding:8px 12px;border-radius:8px;background:var(--primary-light);margin:8px 0;font-size:13px;}
.essay-card{border:1px solid var(--border);border-radius:10px;padding:16px;margin-bottom:14px;background:#fff;}
.essay-card h4{font-size:15px;margin-bottom:2px;}
.essay-card .essay-meta{font-size:11px;color:var(--muted);margin-bottom:10px;}
.essay-sent{padding:6px 8px;border-radius:6px;margin:2px 0;font-size:13.5px;line-height:1.65;display:flex;gap:8px;align-items:baseline;}
.essay-sent:hover{background:#f8fafc;}
.essay-sent.playing{background:var(--primary-light);}
.essay-sent .es-no{color:var(--muted);font-size:11px;width:18px;flex-shrink:0;}
/* 经典美文 · 分区版 */
.lit-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:14px;}
.lit-cat{border-radius:14px;padding:18px 16px;color:#fff;cursor:pointer;box-shadow:0 3px 10px rgba(0,0,0,.14);transition:transform .15s,box-shadow .15s;position:relative;overflow:hidden;}
.lit-cat:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.2);}
.lit-cat-ico{font-size:38px;margin-bottom:8px;}
.lit-cat-name{font-size:17px;font-weight:700;margin-bottom:4px;}
.lit-cat-desc{font-size:12px;opacity:.95;line-height:1.5;margin-bottom:10px;}
.lit-cat-meta{font-size:11px;opacity:.9;background:rgba(255,255,255,.24);display:inline-block;padding:3px 10px;border-radius:12px;}
.lit-crumb{display:flex;gap:10px;align-items:center;margin-bottom:10px;flex-wrap:wrap;}
.lit-banner{border-radius:14px;padding:16px 20px;color:#fff;display:flex;gap:14px;align-items:center;margin-bottom:14px;box-shadow:0 3px 10px rgba(0,0,0,.14);}
.lit-banner-ico{font-size:42px;flex-shrink:0;}
.lit-banner-name{font-size:20px;font-weight:700;}
.lit-banner-desc{font-size:12.5px;opacity:.95;margin-top:2px;line-height:1.5;}
.lv-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:20px;font-size:13px;font-weight:600;cursor:pointer;border:1px solid var(--border);background:#fff;color:var(--text);transition:all .15s;}
.lv-chip.on{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 2px 6px rgba(59,130,246,.35);}
.lit-art-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-top:6px;}
.lit-art{border:1px solid var(--border);border-radius:12px;overflow:hidden;cursor:pointer;background:#fff;transition:transform .15s,box-shadow .15s;}
.lit-art:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.13);}
.lit-art-em{height:86px;display:flex;align-items:center;justify-content:center;font-size:46px;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.25);}
.lit-art-body{padding:10px 12px;}
.lit-art-title{font-size:14.5px;font-weight:700;line-height:1.35;margin-bottom:2px;}
.lit-art-zh{font-size:12px;color:var(--muted);line-height:1.55;margin-bottom:6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.lit-art-meta{font-size:11px;color:var(--muted);display:flex;gap:10px;flex-wrap:wrap;}
.lit-modal-top{display:flex;gap:12px;flex-wrap:wrap;align-items:stretch;margin-top:6px;}
.lit-sent{padding:7px 8px;border-radius:6px;margin:2px 0;display:flex;gap:8px;align-items:baseline;}
.lit-sent:hover{background:#f8fafc;}
.lit-sent.playing{background:var(--primary-light);}
.lit-en{font-size:14px;line-height:1.6;font-weight:500;}
.lit-en .speak-btn{margin-left:6px;vertical-align:middle;}
.lit-zh{font-size:12.5px;color:var(--muted);line-height:1.6;margin-top:2px;}
.dict-now{font-size:20px;font-weight:800;color:var(--primary);text-align:center;padding:12px;}
.dict-input{font-size:18px;text-align:center;letter-spacing:1px;}
.plan-item{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--border);border-radius:8px;margin-bottom:8px;background:#fff;font-size:13px;flex-wrap:wrap;}
.plan-dots{display:flex;gap:4px;margin-left:auto;}
.plan-dot{width:20px;height:20px;border-radius:50%;font-size:10px;display:flex;align-items:center;justify-content:center;background:#e5e7eb;color:#4b5563;font-weight:700;}
.plan-dot.on{background:var(--green);color:#fff;}
.plan-dot.today{outline:2px solid var(--orange);outline-offset:1px;}
.lb-stat{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px;}
.lb-stat .s{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:10px 18px;text-align:center;min-width:108px;}
.lb-stat .n{font-size:22px;font-weight:800;color:var(--primary);}
.lb-stat .l{font-size:11px;color:var(--muted);}
.rec-item{display:flex;gap:10px;align-items:flex-start;padding:10px;border:1px solid var(--border);border-radius:8px;margin-bottom:8px;background:#fff;font-size:13px;}
.rec-item .ri-t{flex:1;}
.rec-item .ri-score{font-weight:800;font-size:17px;}
.rec-item .ri-meta{font-size:11px;color:var(--muted);margin-top:2px;}
.lb-ai-card{border:1px solid var(--border);border-radius:10px;padding:14px;margin-bottom:10px;background:#fff;display:flex;gap:12px;align-items:flex-start;}
.lb-ai-card .ai-ico{font-size:24px;flex-shrink:0;}
.lb-ai-card h4{font-size:14px;margin-bottom:3px;}

/* ===== Stats ===== */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:16px;}
.stat-card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px;text-align:center;}
.stat-num{font-size:24px;font-weight:700;}
.stat-label{font-size:11px;color:var(--muted);margin-top:2px;}

/* ===== Callout ===== */
.callout{padding:14px 16px;border-radius:var(--radius);margin-bottom:14px;font-size:13px;}
.callout-info{background:var(--primary-light);border-left:4px solid var(--primary);}
.callout-warn{background:var(--orange-light);border-left:4px solid var(--orange);}
.callout-success{background:var(--green-light);border-left:4px solid var(--green);}

/* ===== Grammar Card ===== */
.grammar-card{border:1px solid var(--border);border-radius:var(--radius);margin-bottom:10px;overflow:hidden;}
.grammar-card-title{padding:10px 14px;font-weight:600;font-size:14px;cursor:pointer;background:#f9fafb;display:flex;justify-content:space-between;align-items:center;}
.grammar-card-title:hover{background:#f0f2f5;}
.grammar-card-body{display:none;padding:14px;}
.grammar-card.open .grammar-card-body{display:block;}
.grammar-section{margin-bottom:10px;}
.grammar-section-label{font-size:12px;font-weight:700;color:var(--muted);}
.grammar-examples{background:#f8f9fa;padding:8px 12px;border-radius:6px;font-size:13px;margin-top:4px;}

/* ===== Calendar ===== */
.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:12px;}
.calendar-day-header{text-align:center;font-size:11px;font-weight:600;color:var(--muted);padding:4px;}
.calendar-cell{min-height:70px;background:var(--card);border:1px solid var(--border);border-radius:6px;padding:4px;font-size:11px;cursor:pointer;transition:all .15s;}
.calendar-cell:hover{border-color:var(--primary);}
.calendar-cell.has-data{background:var(--green-light);border-color:var(--green);}
.calendar-cell.today{border:2px solid var(--primary);}
.calendar-cell.empty{background:transparent;border:none;cursor:default;}
.calendar-cell-num{font-weight:700;font-size:13px;}
.calendar-cell-status{font-size:10px;margin-top:2px;}
.calendar-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.calendar-nav h3{font-size:16px;}

/* ===== Resource ===== */
.resource-item{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--border);border-radius:6px;margin-bottom:6px;font-size:13px;}
.resource-item:hover{background:#f9fafb;}
.resource-item a{color:var(--primary);text-decoration:none;}
.resource-item a:hover{text-decoration:underline;}

/* ===== Filter bar ===== */
.filter-bar{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap;align-items:center;}
.filter-bar label{font-size:12px;color:var(--muted);}
.filter-bar select{padding:5px 8px;border:1px solid var(--border);border-radius:5px;font-size:12px;}

/* ===== Review ===== */
.review-section{margin-bottom:18px;}
.review-section h3{font-size:14px;font-weight:700;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid var(--border);}
.review-fill{background:#f8f9fa;padding:10px 14px;border-radius:6px;font-size:13px;margin-bottom:6px;}
.review-fill input{border:none;border-bottom:1px solid var(--border);background:transparent;font-size:13px;width:60%;padding:2px 4px;font-family:inherit;}
.review-fill input:focus{outline:none;border-bottom-color:var(--primary);}

/* ===== Modal ===== */
.modal-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.4);z-index:200;justify-content:center;align-items:flex-start;padding-top:60px;overflow-y:auto;}
.modal-overlay.show{display:flex;}
.modal{background:var(--card);border-radius:var(--radius);width:90%;max-width:560px;padding:20px;box-shadow:0 8px 32px rgba(0,0,0,.15);}
.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.modal-header h3{font-size:16px;font-weight:700;}
.modal-close{font-size:20px;cursor:pointer;color:var(--muted);background:none;border:none;line-height:1;}
.modal-body{max-height:60vh;overflow-y:auto;}
.modal-footer{margin-top:14px;display:flex;gap:8px;justify-content:flex-end;}

/* ===== Phase1 CSS ===== */
/* ===== Phase1: 首页看板 / SRS / 写作 / VIP / 打印 ===== */

/* 新页面主题色 */
#page-srs{--theme:#9333ea;--theme-light:#f3e8ff;--theme-deep:#7e22ce;}
#page-writing{--theme:#ea580c;--theme-light:#ffedd5;--theme-deep:#c2410c;}
.nav-item[data-page="srs"]{--nv:#9333ea;--nv-light:#f3e8ff;--nv-deep:#7e22ce;}
.nav-item[data-page="writing"]{--nv:#ea580c;--nv-light:#ffedd5;--nv-deep:#c2410c;}

/* ---- 首页学情看板 ---- */
.todo-card{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:var(--card);border:1px solid var(--border);margin-bottom:10px;cursor:pointer;transition:transform .15s,box-shadow .15s;}
.todo-card:hover{transform:translateY(-2px);box-shadow:0 4px 14px rgba(0,0,0,.08);}
.todo-card .todo-ico{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0;}
.todo-card .todo-num{font-size:22px;font-weight:800;line-height:1.1;}
.todo-card .todo-label{font-size:12px;color:var(--muted);}
.todo-card .todo-go{margin-left:auto;font-size:18px;color:var(--muted);}
.stat-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:6px;}
.stat-mini .sm{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:12px 10px;text-align:center;}
.stat-mini .sm b{font-size:20px;display:block;line-height:1.2;}
.stat-mini .sm span{font-size:11px;color:var(--muted);}
.trend-wrap{margin-top:10px;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:12px;}
.trend-bars{display:flex;align-items:flex-end;gap:6px;height:64px;margin-top:8px;}
.trend-bars .tb{flex:1;border-radius:4px 4px 0 0;background:linear-gradient(180deg,var(--theme),var(--theme-light));min-height:3px;position:relative;}
.trend-bars .tb i{position:absolute;top:-16px;left:0;right:0;text-align:center;font-size:10px;color:var(--muted);font-style:normal;}
.quick-tools{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.quick-tool{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px 8px;text-align:center;cursor:pointer;transition:transform .15s;}
.quick-tool:hover{transform:translateY(-2px);}
.quick-tool .qt-ico{font-size:24px;display:block;margin-bottom:6px;}
.quick-tool .qt-txt{font-size:12px;font-weight:600;}
.path-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.path-card{border-radius:14px;padding:14px 8px;text-align:center;cursor:pointer;color:#fff;transition:transform .15s;}
.path-card:hover{transform:translateY(-3px);}
.path-card b{display:block;font-size:14px;}
.path-card span{font-size:11px;opacity:.85;}

/* ---- SRS 智能背词 ---- */
.srs-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px;}
.srs-tab{padding:8px 16px;border-radius:20px;border:1px solid var(--border);background:var(--card);cursor:pointer;font-size:13px;font-weight:600;}
.srs-tab.active{background:var(--theme);color:#fff;border-color:var(--theme);}
.srs-go{background:var(--theme-light);border:1px solid var(--theme);border-radius:14px;padding:16px;margin-bottom:14px;text-align:center;}
.srs-go-t{font-size:14.5px;font-weight:700;color:var(--theme-deep);margin-bottom:10px;}
.srs-go-s{font-size:12px;color:var(--muted);margin-top:10px;line-height:1.7;}
.srs-go-quiet{background:var(--card);border-color:var(--border);}
.srs-go-quiet .srs-go-t{color:var(--text);font-weight:600;margin-bottom:8px;}
/* 首页「今天要背 N 个单词」入口条 */
.home-srs{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--card);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:14px;padding:12px 16px;margin-bottom:14px;cursor:pointer;transition:box-shadow .15s,transform .15s;}
.home-srs:hover{box-shadow:var(--shadow);transform:translateY(-1px);}
.home-srs-main{display:flex;align-items:center;gap:10px;min-width:0;}
.home-srs-i{font-size:24px;line-height:1;}
.home-srs-t{font-size:14.5px;font-weight:700;}
.home-srs-t b{color:var(--primary);font-size:17px;}
.home-srs-s{font-size:12px;color:var(--muted);margin-top:2px;}
.home-srs.hs-urgent{border-left-color:var(--green);background:var(--green-light);}
.home-srs.hs-urgent .home-srs-t b{color:#047857;}
.home-srs.hs-empty{border-left-color:var(--purple);background:var(--purple-light);}
.home-srs.hs-done{border-left-color:var(--green);cursor:default;}
.home-srs.hs-done:hover{transform:none;box-shadow:none;}
@media(max-width:768px){.home-srs{flex-direction:column;align-items:stretch;text-align:center;}.home-srs-main{justify-content:center;}.home-srs .btn{width:100%;}}
.srs-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:22px;text-align:center;margin-bottom:14px;}
.srs-word{font-size:34px;font-weight:800;letter-spacing:.5px;}
.srs-phon{font-size:15px;color:var(--muted);margin-top:4px;}
.srs-def{font-size:16px;margin-top:10px;}
.srs-sent{font-size:13px;color:var(--muted);margin-top:10px;padding:10px;background:var(--theme-light);border-radius:10px;line-height:1.6;}
.srs-sent b{color:var(--theme-deep);}
.srs-badge{display:inline-block;font-size:11px;padding:2px 10px;border-radius:10px;margin-right:4px;font-weight:600;}
.sb-new{background:#dbeafe;color:#1d4ed8;}
.sb-due{background:#fef3c7;color:#b45309;}
.sb-mature{background:#dcfce7;color:#15803d;}
.sb-hard{background:#fee2e2;color:#b91c1c;}
.rate-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:16px;}
.rate-btn{padding:12px 4px;border-radius:12px;border:1px solid var(--border);background:var(--card);cursor:pointer;font-size:13px;font-weight:700;transition:transform .1s;}
.rate-btn:active{transform:scale(.96);}
.rate-btn small{display:block;font-size:10px;color:var(--muted);font-weight:400;margin-top:2px;}
.rate-btn.rq1{border-color:#fca5a5;color:#b91c1c;}
.rate-btn.rq2{border-color:#fdba74;color:#c2410c;}
.rate-btn.rq3{border-color:#86efac;color:#15803d;}
.rate-btn.rq4{border-color:#a5b4fc;color:#4338ca;}
.bank-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;}
.bank-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px;}
.bank-card h4{font-size:14px;display:flex;justify-content:space-between;align-items:center;}
.bank-card .bc-meta{font-size:12px;color:var(--muted);margin:6px 0;}
.bank-sec{margin-bottom:18px;}
.bank-sec-t{font-size:13.5px;font-weight:700;margin:0 0 8px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;}
.bank-sec-t span{font-size:11.5px;font-weight:400;color:var(--muted);}
.srs-pick{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:13px 15px;margin-bottom:16px;}
.srs-pick-t{font-size:14.5px;font-weight:700;}
.srs-pick-s{font-size:12px;color:var(--muted);margin:5px 0 11px;line-height:1.75;}
.bank-card .bc-ver{display:inline-block;font-size:10.5px;line-height:15px;background:var(--theme-light);color:var(--theme-deep);padding:1px 6px;border-radius:8px;font-weight:600;white-space:nowrap;}
.bank-card .bc-done{color:#15803d;font-weight:700;}
.bank-card.bc-on{border-color:var(--theme);}
.vip-lock{font-size:11px;background:linear-gradient(90deg,#f59e0b,#d97706);color:#fff;padding:2px 8px;border-radius:10px;font-weight:600;}
.srs-quiz-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px;}
.srs-quiz-opt{padding:12px;border-radius:10px;border:1px solid var(--border);background:var(--card);cursor:pointer;font-size:14px;}
.srs-quiz-opt.right{background:#dcfce7;border-color:#86efac;}
.srs-quiz-opt.wrong{background:#fee2e2;border-color:#fca5a5;}
.srs-input{width:100%;padding:12px;border:2px solid var(--theme);border-radius:10px;font-size:18px;text-align:center;margin-top:12px;box-sizing:border-box;}

/* ---- 写作模块 ---- */
.writing-topics{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;}
.wt-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px;cursor:pointer;}
.wt-card h4{font-size:14px;}
.wt-card p{font-size:12px;color:var(--muted);margin-top:6px;}
.essay-textarea{width:100%;min-height:220px;padding:14px;border:1px solid var(--border);border-radius:12px;font-size:14px;line-height:1.8;box-sizing:border-box;font-family:inherit;}
.essay-textarea:focus{outline:none;border-color:var(--theme);}
.ai-score{display:flex;align-items:baseline;gap:10px;margin-bottom:10px;}
.ai-score b{font-size:38px;color:var(--theme);}
.ai-issue{padding:8px 12px;border-radius:8px;margin-bottom:6px;font-size:13px;line-height:1.6;}
.ai-issue.err{background:#fee2e2;color:#991b1b;}
.ai-issue.warn{background:#fef3c7;color:#92400e;}
.ai-issue.good{background:#dcfce7;color:#166534;}

/* ---- 全局搜索 / 拍照录入 ---- */
.gs-item{padding:10px 12px;border-bottom:1px solid var(--border);cursor:pointer;font-size:13px;}
.gs-item:hover{background:var(--theme-light);}
.gs-item b{color:var(--theme-deep);}
.gs-tag{font-size:10px;padding:1px 8px;border-radius:8px;background:var(--theme-light);color:var(--theme-deep);margin-right:6px;}
.photo-preview{width:100%;max-height:240px;object-fit:contain;border-radius:10px;border:1px solid var(--border);margin-top:8px;}

/* ---- VIP ---- */
.vip-card{background:linear-gradient(135deg,#1e1b4b,#4c1d95);color:#fff;border-radius:16px;padding:20px;margin-bottom:14px;}
.vip-card h3{font-size:18px;display:flex;align-items:center;gap:8px;}
.vip-card .vip-desc{font-size:12px;opacity:.8;margin:8px 0;line-height:1.7;}
.vip-input{width:100%;padding:10px;border-radius:10px;border:none;margin-top:8px;font-size:14px;box-sizing:border-box;}
.vip-feats{display:grid;grid-template-columns:1fr 1fr;gap:6px;font-size:12px;margin-top:8px;}
.vip-feats div{padding:4px 8px;background:rgba(255,255,255,.1);border-radius:8px;}

/* ---- 错题遮答自测 ---- */
.p1-masked>*{filter:blur(6px);user-select:none;transition:filter .25s;cursor:pointer}
.p1-masked>.grammar-section-label{filter:none;user-select:auto}

/* ---- 周报告打印 ---- */
#week-report{max-width:720px;margin:0 auto;}
.wr-section{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:14px;}
.wr-section h3{font-size:15px;margin-bottom:10px;color:var(--theme-deep);}
.wr-kv{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px dashed var(--border);font-size:13px;}
.wr-weak{display:inline-block;background:var(--theme-light);color:var(--theme-deep);border-radius:10px;padding:3px 12px;margin:3px;font-size:13px;}
@media print{
  body.print-report *{visibility:hidden;}
  body.print-report #week-report,body.print-report #week-report *{visibility:visible;}
  body.print-report #week-report{position:absolute;left:0;top:0;width:100%;}
  body.print-report .sidebar,body.print-report .menu-toggle{display:none!important;}
}

/* ---- 移动端增强（一期） ---- */
@media(max-width:768px){
  .rate-row{grid-template-columns:repeat(2,1fr);}
  .rate-btn{padding:14px 4px;font-size:15px;}
  .quick-tools{grid-template-columns:repeat(3,1fr);}
  .path-grid{grid-template-columns:repeat(2,1fr);}
  .stat-mini{grid-template-columns:repeat(3,1fr);}
  .srs-word{font-size:28px;}
  .srs-quiz-opts{grid-template-columns:1fr;}
  .modal-footer{flex-wrap:wrap;}
  .modal-footer .btn{flex:1;padding:12px 8px;}
  .form-row .btn,.card .btn{min-height:44px;}
  .tag-row .tag{padding:4px 10px;font-size:12px;}
  .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .btn{min-height:40px;}
  .srs-tabs{gap:6px;}
  .srs-tab{padding:8px 12px;}
}

/* ===== 高中进阶语法徽章样式 ===== */
.g-tag{display:inline-block;font-size:10px;font-weight:700;padding:1px 6px;border-radius:4px;vertical-align:middle;margin-right:2px}
.g-tag-G{background:#dbeafe;color:#1e40af}
.g-star{color:#f59e0b;font-weight:700;font-size:14px;vertical-align:middle}
.grammar-card-title span:first-child{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
/* ===== 短语库 + 熟词生义 CSS ===== */

/* 新页面主题色 */
#page-phrase{--theme:#ca8a04;--theme-light:#fef9c3;--theme-deep:#854d0e;}
#page-extended{--theme:#db2777;--theme-light:#fce7f3;--theme-deep:#9d174d;}
.nav-item[data-page="phrase"]{--nv:#ca8a04;--nv-light:#fef9c3;--nv-deep:#854d0e;}
.nav-item[data-page="extended"]{--nv:#db2777;--nv-light:#fce7f3;--nv-deep:#9d174d;}

/* ---- 通用：横幅 / 进度条 / 小题反馈 ---- */
.ph-banner{background:var(--theme-light);color:var(--theme-deep);padding:10px 14px;border-radius:10px;font-size:13px;margin-bottom:14px;line-height:1.6;}
.ph-progress-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:700;color:var(--theme-deep);margin-bottom:8px;}
.ph-bar{height:10px;background:var(--theme-light);border-radius:5px;overflow:hidden;}
.ph-bar-in{height:100%;width:0;background:var(--theme);border-radius:5px;transition:width .4s;}
.ph-cat-desc{font-size:12px;color:var(--muted);margin:2px 0 12px;line-height:1.5;}
.ph-cnt{font-size:12px;color:var(--muted);font-weight:400;margin-left:8px;}
.ph-fb{margin-top:8px;font-size:13px;line-height:1.6;}
.ph-ok{color:#15803d;font-weight:700;}
.ph-no{color:#dc2626;font-weight:700;}

/* ---- 短语库 ---- */
.ph-hot-cat{border:2px solid #fca5a5;box-shadow:0 2px 12px rgba(239,68,68,.10);}
.ph-hot-badge{display:inline-block;background:#ef4444;color:#fff;font-size:11px;padding:2px 10px;border-radius:999px;margin-right:8px;font-weight:700;vertical-align:middle;letter-spacing:.5px;}
.ph-items{display:flex;flex-direction:column;gap:10px;}
.ph-item{border:1px solid var(--border);border-radius:10px;padding:12px 14px;background:var(--bg);}
.ph-item-hot{border-color:#fecaca;background:#fffbeb;}
.ph-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.ph-p{font-weight:800;font-size:15px;color:var(--theme-deep);cursor:pointer;background:none;border:none;padding:0;font-family:inherit;}
.ph-p:hover{opacity:.7;}
.ph-m{font-size:13px;color:var(--text);}
.ph-ex{font-size:13px;color:var(--muted);margin:6px 0;display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.ph-quiz{margin-top:8px;background:var(--card);border:1px dashed var(--border);border-radius:8px;padding:10px 12px;}
.ph-quiz-q{font-size:13px;font-weight:600;margin-bottom:8px;line-height:1.5;}
.ph-quiz-ctrl{display:flex;gap:8px;}
.ph-in{flex:1;min-width:120px;}

/* ---- 熟词生义 ---- */
.ex-tip{background:var(--theme-light);color:var(--theme-deep);padding:12px 14px;border-radius:10px;font-size:13px;margin-bottom:14px;line-height:1.7;}
.ex-card{margin-bottom:16px;}
.ex-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px;}
.ex-w{font-size:20px;font-weight:800;color:var(--theme-deep);cursor:pointer;background:none;border:none;padding:0;font-family:inherit;}
.ex-w:hover{opacity:.7;}
.ex-base{font-size:12px;color:var(--muted);background:var(--theme-light);padding:3px 10px;border-radius:999px;}
.ex-senses{display:flex;flex-direction:column;gap:8px;margin-bottom:12px;}
.ex-sense{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;padding:8px 10px;background:var(--bg);border-radius:8px;}
.ex-sense-s{background:#fce7f3;color:#9d174d;padding:2px 10px;border-radius:999px;font-weight:700;font-size:12px;white-space:nowrap;}
.ex-sense-ex{font-weight:600;}
.ex-sense-t{color:var(--muted);font-size:12px;}
.ex-quiz{background:var(--bg);border:1px dashed var(--border);border-radius:8px;padding:10px 12px;}
.ex-quiz-q{font-size:13px;font-weight:600;margin-bottom:8px;line-height:1.5;}
.ex-opts{display:flex;gap:8px;flex-wrap:wrap;}
.ex-opt{padding:8px 16px;border-radius:8px;border:1px solid var(--border);background:var(--card);cursor:pointer;font-size:13px;font-weight:600;color:var(--text);}
.ex-opt:hover{border-color:var(--theme);color:var(--theme-deep);}
.ex-opt-right{background:#dcfce7!important;border-color:#15803d!important;color:#15803d!important;}
.ex-opt-wrong{background:#fee2e2!important;border-color:#dc2626!important;color:#dc2626!important;}

/* ---- 移动端 ---- */
@media (max-width:768px){
  .ph-quiz-ctrl{flex-direction:column;}
  .ph-in{min-width:0;}
  .ex-opt{padding:12px 18px;font-size:14px;min-height:44px;}
  .ex-w{font-size:18px;}
  .ph-p{font-size:14px;}
  .ph-head .btn-sm{min-height:36px;}
}

/* ===== Quiz Center（测验中心）===== */
#page-quizcenter{--theme:#0d9488;--theme-light:#ccfbf1;--theme-deep:#115e59;}
.nav-item[data-page="quizcenter"]{--nv:#0d9488;--nv-light:#ccfbf1;--nv-deep:#115e59;}
/* 单元卡上的小测按钮 */
.lc-quiz-btn{float:right;font-size:12px;padding:2px 10px;border:1px solid var(--theme,#0d9488);color:var(--theme,#0d9488);background:transparent;border-radius:6px;cursor:pointer;font-weight:500;margin-left:6px}
.lc-quiz-btn:hover{background:var(--theme-light,#ccfbf1)}
/* 答题浮层 */
#quiz-ov{position:fixed;inset:0;background:rgba(15,23,42,.58);z-index:1100;display:none;align-items:center;justify-content:center;padding:14px}
#quiz-ov.show{display:flex}
#quiz-panel{background:#fff;border-radius:16px;max-width:560px;width:100%;max-height:90vh;overflow:auto;padding:18px 20px 22px;box-shadow:0 12px 40px rgba(2,6,23,.25)}
.quiz-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}
.quiz-head b{font-size:15px}
.quiz-x{border:none;background:#f1f5f9;border-radius:8px;width:30px;height:30px;cursor:pointer;font-size:14px;color:#475569;flex:none}
.quiz-prog{height:8px;background:#e2e8f0;border-radius:99px;overflow:hidden}
.quiz-prog i{display:block;height:100%;background:#0d9488;border-radius:99px;transition:width .3s}
.quiz-count{font-size:12px;color:#64748b;margin:6px 0 10px}
.quiz-prompt{font-weight:500;font-size:15px;margin-bottom:12px}
.quiz-audio-big{display:flex;align-items:center;justify-content:center;gap:10px;width:64px;height:64px;margin:6px auto 14px;border-radius:50%;background:#ccfbf1;border:2px solid #0d9488;font-size:26px;cursor:pointer;flex-direction:column}
.quiz-audio-big span{font-size:10px;color:#115e59;line-height:1}
.quiz-stem{font-size:17px;line-height:1.6;padding:12px 14px;background:#f8fafc;border-radius:10px;margin-bottom:10px}
.quiz-blank{color:#0d9488;letter-spacing:1px}
.quiz-opts button.quiz-opt{display:block;width:100%;text-align:left;padding:12px 14px;margin:8px 0;border:1.5px solid #e2e8f0;border-radius:10px;background:#f8fafc;cursor:pointer;font-size:15px;color:#1e293b}
.quiz-opt .quiz-key{display:inline-block;width:22px;height:22px;line-height:22px;text-align:center;border-radius:6px;background:#e2e8f0;font-size:12px;margin-right:8px;flex:none}
.quiz-opt.ok{border-color:#16a34a;background:#f0fdf4}
.quiz-opt.ok .quiz-key{background:#bbf7d0;color:#15803d}
.quiz-opt.bad{border-color:#dc2626;background:#fef2f2}
.quiz-opt.bad .quiz-key{background:#fecaca;color:#b91c1c}
.quiz-spell-row{display:flex;gap:8px;margin:8px 0}
.quiz-spell-row .form-input{flex:1;font-size:17px;letter-spacing:1px}
.quiz-tip{padding:10px 12px;border-radius:10px;background:#fef9c3;border:1px solid #fde047;font-size:14px;margin-top:12px;line-height:1.6}
.quiz-tip-sound{cursor:pointer;margin-left:6px}
.quiz-score-ring{text-align:center;font-size:40px;margin:14px 0 0;color:#115e59}
.quiz-score-ring span{font-size:18px;color:#64748b}
.quiz-wrong-box{border:1px solid #e2e8f0;border-radius:12px;padding:12px 14px;margin-top:12px;max-height:220px;overflow:auto}
.quiz-wrong-item{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px dashed #e2e8f0;font-size:14px}
.quiz-wrong-item:last-child{border-bottom:none}
/* 测验中心页 */
.quiz-book-grid{display:flex;flex-direction:column;gap:18px}
.quiz-stage-group h3{margin-bottom:10px}
.quiz-book-card{border:1px solid #e2e8f0;border-radius:12px;padding:12px 14px;margin-bottom:10px;background:#fff}
.quiz-book-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.quiz-unit-chips{display:flex;flex-wrap:wrap;gap:6px}
.quiz-u{padding:5px 12px;border-radius:8px;border:1px solid #99f6e4;background:#f0fdfa;color:#115e59;cursor:pointer;font-size:13px;font-weight:500}
.quiz-u:hover{background:#ccfbf1}
.quiz-stat-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.quiz-stat{flex:1;min-width:110px;text-align:center;border:1px solid #e2e8f0;border-radius:12px;padding:14px 8px;background:#f8fafc}
.quiz-stat b{display:block;font-size:24px;color:#115e59}
.quiz-stat span{font-size:12px;color:#64748b}

/* ===== v2 upgrade css ===== */
/* v2.css —— 二期体验升级样式（首页门户/指南/路线图/错题模板/语法统一模板） */
#page-guide{--theme:#0891b2;--theme-light:#cffafe;--theme-deep:#155e75;}
.nav-item[data-page="guide"]{--nv:#0891b2;--nv-light:#cffafe;--nv-deep:#155e75;}
#page-roadmap{--theme:#7c3aed;--theme-light:#ede9fe;--theme-deep:#5b21b6;}
.nav-item[data-page="roadmap"]{--nv:#7c3aed;--nv-light:#ede9fe;--nv-deep:#5b21b6;}

/* ---- 首页门户 ---- */
.v2-slogan{display:flex;align-items:baseline;gap:4px;padding:18px 4px 4px;}
.v2-slogan b{font-size:24px;letter-spacing:.5px;color:var(--primary,#2563eb);}
.v2-slogan span{font-size:14px;color:var(--muted,#64748b);}
.v2-guide-banner{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#fffbeb,#fef3c7);border:1.5px solid #f59e0b;border-radius:14px;padding:14px 16px;margin:12px 0 8px;cursor:pointer;transition:transform .15s,box-shadow .15s;}
.v2-guide-banner:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(245,158,11,.18);}
.v2-guide-ico{font-size:26px;background:#fff;border-radius:12px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;flex:none;box-shadow:0 2px 6px rgba(0,0,0,.06);}
.v2-guide-txt{flex:1;min-width:0;}
.v2-guide-txt b{display:block;font-size:15px;color:#92400e;}
.v2-guide-txt span{display:block;font-size:12.5px;color:#a16207;margin-top:3px;line-height:1.5;}
.v2-go{font-size:24px;color:#d97706;flex:none;font-weight:300;}
.v2-status{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12.5px;color:var(--muted,#64748b);background:var(--bg-soft,#f8fafc);border-radius:10px;padding:8px 12px;margin:10px 0 4px;}
.v2-status b{color:var(--primary,#2563eb);font-size:14px;}
.v2-status span{margin-left:auto;color:var(--primary,#2563eb);cursor:pointer;font-weight:600;}
.v2-stage-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;}
.v2-stage{background:#fff;border:1.5px solid var(--st);border-radius:14px;padding:16px 14px;cursor:pointer;transition:transform .15s,box-shadow .15s;display:flex;flex-direction:column;gap:6px;}
.v2-stage:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.09);}
.v2-stage b{font-size:15.5px;color:var(--st);}
.v2-stage span{font-size:12.5px;color:var(--muted,#64748b);line-height:1.6;}
.v2-core-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;}
.v2-core{background:#fff;border:1px solid #e2e8f0;border-top:3px solid var(--st);border-radius:12px;padding:14px 12px;cursor:pointer;transition:transform .15s,box-shadow .15s;display:flex;flex-direction:column;gap:4px;text-align:left;}
.v2-core:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.08);}
.v2-ico{font-size:22px;}
.v2-core b{font-size:14px;color:#1e293b;}
.v2-core span{font-size:12px;color:var(--muted,#64748b);line-height:1.55;}
.v2-roadmap{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#f5f3ff,#ede9fe);border:1.5px solid #8b5cf6;border-radius:14px;padding:14px 16px;margin-top:14px;cursor:pointer;transition:transform .15s,box-shadow .15s;}
.v2-roadmap:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(139,92,246,.2);}
.v2-roadmap b{display:block;font-size:15px;color:#5b21b6;}
.v2-roadmap span{display:block;font-size:12.5px;color:#7c3aed;margin-top:3px;}
.v2-foot{margin-top:22px;padding:12px 4px 8px;border-top:1px solid #e2e8f0;font-size:11.5px;color:#94a3b8;line-height:1.7;text-align:center;}

/* ---- 新手指南 ---- */
.v2-step{display:flex;gap:14px;background:#fff;border:1px solid #e2e8f0;border-radius:14px;padding:16px;margin-bottom:12px;}
.v2-step-no{flex:none;width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#0891b2,#0e7490);color:#fff;font-size:17px;font-weight:700;display:flex;align-items:center;justify-content:center;}
.v2-step b{font-size:15px;display:block;margin-bottom:6px;}
.v2-step p{font-size:13px;color:var(--muted,#64748b);line-height:1.7;margin:0 0 8px;}
.v2-step-links{display:flex;gap:8px;flex-wrap:wrap;}
.v2-tpl-flow{display:inline-block;background:#cffafe;color:#155e75;border-radius:8px;padding:6px 12px;font-size:12.5px;font-weight:600;margin-bottom:8px;}
.v2-faq details{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:10px 14px;margin-bottom:8px;}
.v2-faq summary{font-size:13.5px;font-weight:600;cursor:pointer;color:#0f172a;}
.v2-faq p{font-size:12.5px;color:var(--muted,#64748b);line-height:1.7;margin:8px 0 0;}

/* ---- 路线图 ---- */
.v2-rm-grid{display:flex;flex-direction:column;gap:8px;margin-top:12px;}
.v2-rm-row{display:flex;gap:12px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:12px 14px;}
.v2-rm-mon{flex:none;width:64px;height:44px;border-radius:10px;background:linear-gradient(135deg,#7c3aed,#5b21b6);color:#fff;font-size:13.5px;font-weight:700;display:flex;align-items:center;justify-content:center;}
.v2-rm-body{flex:1;min-width:0;}
.v2-rm-body b{font-size:14px;}
.v2-rm-body p{font-size:12.5px;color:var(--muted,#64748b);line-height:1.65;margin:4px 0;}
.v2-rm-tip{display:block;font-size:11.5px;color:#86198f;}

/* ---- 列表小组件 ---- */
.v2-mini-list{display:flex;flex-direction:column;gap:6px;margin:8px 0 4px;}
.v2-mini-item{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:8px 12px;cursor:pointer;display:flex;flex-direction:column;gap:2px;}
.v2-mini-item:hover{border-color:var(--primary,#2563eb);}
.v2-weektpl{margin-bottom:14px;}

/* ---- 语法统一模板 ---- */
.g2-badge{display:inline-block;background:#1d4ed8;color:#fff;font-size:10px;border-radius:6px;padding:1px 6px;margin-right:6px;vertical-align:2px;}
.g2-star{display:inline-block;background:#fef3c7;color:#b45309;font-size:10px;border-radius:6px;padding:1px 6px;margin-right:6px;vertical-align:2px;}
.g2-formula{background:#f1f5f9;border-left:3px solid #94a3b8;border-radius:6px;padding:7px 10px;font-size:12.5px;color:#334155;margin-top:8px;line-height:1.7;font-family:ui-monospace,Consolas,monospace;}
.g2-mnem{font-size:12px;color:#7c2d12;background:#fff7ed;border-radius:6px;padding:6px 10px;margin-top:6px;}
.g2-trap .grammar-section-label{color:#b91c1c;}
.g2-trap p{background:#fef2f2;border-radius:8px;padding:8px 10px;margin:6px 0 0;}
.g2-reviewbox .grammar-section-label{color:#1d4ed8;}
.g2-q{border:1px solid #e2e8f0;border-radius:10px;padding:9px 11px;margin-top:8px;background:#fafafa;}
.g2-q-stem{font-size:13px;line-height:1.6;margin-bottom:7px;}
.g2-q-row{display:flex;gap:6px;flex-wrap:wrap;align-items:center;}
.g2-q-in{flex:1;min-width:120px;padding:6px 10px;font-size:13px;}
.g2-q-ans{font-size:12.5px;margin-top:7px;background:#fff;border-radius:8px;padding:7px 10px;line-height:1.6;}
.g2-cam{margin-top:10px;border:1px dashed #a5b4fc;border-radius:10px;padding:8px 12px;background:#eef2ff;}
.g2-cam summary{font-size:12.5px;font-weight:600;color:#4338ca;cursor:pointer;user-select:none;}
.g2-cam-body{font-size:12.5px;color:#4c1d95;line-height:1.7;margin-top:8px;}

/* ---- 移动端 ---- */
@media (max-width:640px){
.v2-slogan{padding-top:12px;}
.v2-slogan b{font-size:20px;}
.v2-stage-grid{grid-template-columns:1fr;}
.v2-core-grid{grid-template-columns:repeat(2,1fr);}
.v2-rm-row{flex-direction:column;gap:8px;}
.v2-rm-mon{width:100%;}
.v2-step{flex-direction:column;gap:8px;}
}

/* ---- 返回导航条 ---- */
.back-bar{display:flex;align-items:center;gap:10px;padding:6px 2px;margin-bottom:8px;border-bottom:1px solid var(--border);font-size:13px;}
.back-bar a{cursor:pointer;color:var(--primary);font-weight:700;white-space:nowrap;}
.back-bar a:hover{text-decoration:underline;}
.back-bar span{color:var(--muted);font-size:12px;margin-left:auto;}
.back-bar .nav-prev,.back-bar .nav-next{font-size:13px;padding:2px 8px;border-radius:6px;white-space:nowrap;flex-shrink:0;}
.back-bar .nav-prev.disabled,.back-bar .nav-next.disabled{opacity:.3;pointer-events:none;cursor:default;}
.home-fab{display:none;}

/* ===== Mobile ===== */
.menu-toggle{display:none;}
@media(max-width:768px){
.sidebar{transform:translateX(-100%);}
.sidebar.open{transform:translateX(0);}
.main{margin-left:0;padding:16px;}
.menu-toggle{display:flex;align-items:center;gap:4px;position:fixed;top:14px;left:14px;z-index:101;background:var(--card);border:1px solid var(--border);border-radius:8px;padding:8px 12px;font-size:16px;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.08);}
.home-fab{display:block;position:fixed;top:14px;right:14px;z-index:101;background:var(--primary);color:#fff;border:none;border-radius:8px;padding:8px 14px;font-size:14px;font-weight:700;cursor:pointer;box-shadow:0 2px 8px rgba(37,99,235,.3);}
.home-fab:active{transform:scale(.95);}
.main{padding-top:50px;}
.form-row,.form-row-3{grid-template-columns:1fr;}
}

/* ===== Utility ===== */
.empty-state{text-align:center;padding:40px 20px;color:var(--muted);}
.empty-state p{font-size:14px;margin-top:8px;}
.flex-between{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;}
.text-muted{color:var(--muted);}
.text-sm{font-size:12px;}
.text-center{text-align:center;}
.mt-2{margin-top:8px;}.mb-2{margin-bottom:8px;}
.tag-row{display:flex;gap:4px;flex-wrap:wrap;}
.divider{height:1px;background:var(--border);margin:14px 0;}
.quick-jump{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.quick-jump a{padding:4px 12px;border-radius:20px;font-size:12px;text-decoration:none;background:#f0f2f5;color:var(--text);cursor:pointer;}
.quick-jump a:hover{background:var(--primary-light);color:var(--primary);}
.section-anchor{scroll-margin-top:80px;}

/* ===== 🎮 单词乐园 ===== */
.game-hall-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:12px;margin-top:14px;}
.game-hall-card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:16px;cursor:pointer;transition:transform .15s,box-shadow .15s;display:flex;flex-direction:column;gap:6px;}
.game-hall-card:hover{transform:translateY(-3px);box-shadow:0 6px 16px rgba(0,0,0,.08);border-color:var(--primary);}
.game-hall-card .gh-ico{font-size:30px;}
.game-hall-card h3{margin:0;font-size:15px;color:var(--text);}
.game-hall-card p{margin:0;font-size:12px;color:var(--muted);line-height:1.5;flex:1;}
.game-hall-card .gh-best{font-size:12px;color:var(--primary);font-weight:600;}
.gm-topbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px;}
.gm-topbar .gm-title{font-size:17px;font-weight:700;}
.gm-stats{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0;}
.gm-stat{background:var(--primary-light);color:var(--primary);border-radius:8px;padding:6px 12px;font-size:13px;font-weight:600;}
.gm-stat b{font-size:16px;}
.gm-area{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:16px;}
/* 单词PK / 斩词忍者：四选一 */
.pk-question{font-size:22px;font-weight:700;text-align:center;padding:16px 10px;color:var(--text);}
.pk-question small{display:block;font-size:12px;color:var(--muted);font-weight:400;margin-top:4px;}
.pk-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:520px;margin:0 auto;}
.pk-opt{background:#fff;border:2px solid var(--border);border-radius:10px;padding:12px 8px;text-align:center;font-size:15px;cursor:pointer;transition:all .12s;font-weight:500;color:var(--text);}
.pk-opt:hover{border-color:var(--primary);background:var(--primary-light);}
.pk-opt.correct{background:#e8f5e9;border-color:var(--green);color:#1b5e20;animation:gmPop .3s;}
.pk-opt.wrong{background:#ffebee;border-color:var(--red);color:#b71c1c;animation:gmShake .35s;}
.pk-opt.dim{opacity:.45;pointer-events:none;}
.pk-opt:disabled{pointer-events:none;}
.gm-chall{background:linear-gradient(135deg,#fff1f2,#ffe4e6);border:1px solid #fecdd3;color:#9f1239;border-radius:12px;padding:10px 14px;font-size:13px;margin-bottom:12px;text-align:center;font-weight:600;}
.gm-vs{display:flex;align-items:stretch;justify-content:center;gap:8px;margin:14px auto;max-width:440px;}
.gm-vs-item{flex:1;background:#fff;border:2px solid var(--border);border-radius:12px;padding:12px 8px;text-align:center;}
.gm-vs-item.win{border-color:var(--theme);background:var(--theme-light);box-shadow:0 2px 10px rgba(0,0,0,.06);}
.gm-vs-name{font-size:13px;font-weight:700;color:var(--text);word-break:break-all;}
.gm-vs-score{font-size:30px;font-weight:800;color:var(--theme-deep);margin:2px 0;}
.gm-vs-sub{font-size:11px;color:var(--muted);}
.gm-vs-mid{align-self:center;font-size:18px;font-weight:800;color:var(--muted);}
.gm-vs-result{font-size:20px;font-weight:800;color:var(--theme-deep);margin:6px 0 12px;}
@keyframes gmPop{0%{transform:scale(.85)}60%{transform:scale(1.06)}100%{transform:scale(1)}}
@keyframes gmShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}
.gm-combo{text-align:center;font-size:14px;color:var(--muted);margin-top:8px;}
.gm-combo b{color:#e65100;}
.gm-timer-bar{height:8px;background:#eee;border-radius:5px;overflow:hidden;margin:10px 0 4px;}
.gm-timer-bar i{display:block;height:100%;background:linear-gradient(90deg,#ffb300,#ff5722);transition:width .5s linear;}
/* 打地鼠 */
.mole-hint{font-size:20px;font-weight:700;text-align:center;padding:8px;background:var(--primary-light);border-radius:10px;color:var(--primary);margin-bottom:12px;}
.mole-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:400px;margin:0 auto;}
.mole-cell{aspect-ratio:1/1;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;cursor:pointer;background:linear-gradient(180deg,#8d6e63,#6d4c41);color:#fff;border:4px solid #4e342e;box-shadow:inset 0 4px 8px rgba(0,0,0,.25);user-select:none;transition:transform .12s;}
.mole-cell:hover{transform:scale(1.06);}
.mole-cell.hit{background:linear-gradient(180deg,#ff7043,#d84315);animation:gmPop .3s;}
.mole-cell.miss{background:linear-gradient(180deg,#bdbdbd,#757575);animation:gmShake .35s;}
/* 小马过河 / 奇幻句子鸟：连词成句 */
.gm-sent-hint{font-size:13px;color:var(--muted);text-align:center;padding:6px 10px;background:#f5f5f5;border-radius:8px;margin-bottom:10px;}
.gm-blocks{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;min-height:44px;padding:10px;background:#fafafa;border:1px dashed var(--border);border-radius:10px;margin-bottom:12px;}
.word-block{background:#fff;border:2px solid var(--border);border-radius:8px;padding:7px 14px;font-size:15px;cursor:pointer;transition:all .12s;font-weight:500;color:var(--text);}
.word-block:hover{border-color:var(--primary);}
.word-block.used{opacity:.3;pointer-events:none;}
.word-block.in-bridge{background:var(--primary-light);border-color:var(--primary);}
.word-block.wrong-flash{border-color:var(--red);background:#ffebee;animation:gmShake .35s;}
.gm-bridge{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;min-height:44px;padding:10px;background:var(--primary-light);border:2px solid var(--primary);border-radius:10px;margin-bottom:12px;}
/* 小马过河进度 */
.horse-track{display:flex;gap:4px;align-items:center;justify-content:center;padding:8px;background:#e3f2fd;border-radius:10px;margin-bottom:10px;}
.horse-dot{width:44px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:14px;background:#fff;border:2px solid #90caf9;color:#90caf9;font-weight:600;transition:all .3s;}
.horse-dot.on{background:#bbdefb;border-color:var(--primary);color:var(--primary);}
.horse-dot.goal{background:#c8e6c9;border-color:var(--green);color:#1b5e20;}
.horse-msg{text-align:center;font-size:15px;font-weight:600;color:#1b5e20;min-height:22px;margin-top:6px;}
/* 气球大作战 */
.balloon-wrap{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:560px;margin:0 auto;}
.bal-col h4{text-align:center;margin:0 0 8px;font-size:13px;color:var(--muted);}
.bal-words{display:flex;flex-direction:column;gap:8px;}
.bal-word{background:#fff;border:2px solid var(--border);border-radius:10px;padding:10px;text-align:center;font-size:15px;font-weight:600;cursor:pointer;transition:all .12s;color:var(--text);}
.bal-word:hover{border-color:var(--primary);}
.bal-word.sel{border-color:var(--primary);background:var(--primary-light);box-shadow:0 0 0 3px rgba(64,120,255,.15);}
.bal-word.done{background:#e8f5e9;border-color:var(--green);color:#1b5e20;pointer-events:none;opacity:.85;}
.bal-balloons{display:flex;flex-direction:column;gap:8px;}
.bal-balloon{background:linear-gradient(180deg,#ff8a80,#ff5252);border-radius:50% 50% 46% 46%;padding:12px 8px;text-align:center;font-size:13px;font-weight:600;color:#fff;cursor:pointer;position:relative;transition:transform .15s;animation:balFloat 2.8s ease-in-out infinite;border:none;}
.bal-balloon:nth-child(even){background:linear-gradient(180deg,#80d8ff,#40c4ff);animation-delay:.7s;}
.bal-balloon:nth-child(3n){background:linear-gradient(180deg,#b9f6ca,#69f0ae);animation-delay:1.3s;}
.bal-balloon:nth-child(3n+1){background:linear-gradient(180deg,#ffd180,#ffab40);animation-delay:2s;}
.bal-balloon:hover{transform:scale(1.06);}
.bal-balloon::after{content:"";position:absolute;bottom:-10px;left:50%;transform:translateX(-50%);border-left:5px solid transparent;border-right:5px solid transparent;border-top:10px solid rgba(0,0,0,.18);}
.bal-balloon.done{animation:none;background:#c8e6c9;color:#1b5e20;opacity:.85;pointer-events:none;}
.bal-balloon.done::after{border-top-color:#a5d6a7;}
.bal-balloon.wrong{animation:gmShake .35s;}
@keyframes balFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
/* 小猫钓鱼 */
.cat-hint{text-align:center;font-size:19px;font-weight:700;padding:10px;background:linear-gradient(180deg,#e1f5fe,#b3e5fc);border-radius:10px;color:#01579b;margin-bottom:12px;}
.fish-pond{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:420px;margin:0 auto;}
.fish{background:linear-gradient(180deg,#80d8ff,#29b6f6);color:#01579b;border-radius:0 20px 20px 0;padding:10px 8px;text-align:center;font-size:15px;font-weight:700;cursor:pointer;position:relative;transition:transform .15s;animation:fishSwim 2.2s ease-in-out infinite;}
.fish:nth-child(even){background:linear-gradient(180deg,#ffcc80,#ffa726);animation-delay:.6s;}
.fish:nth-child(3n){background:linear-gradient(180deg,#a5d6a7,#66bb6a);animation-delay:1.1s;}
.fish::before{content:"▸";position:absolute;left:-14px;top:50%;transform:translateY(-50%);font-size:18px;color:inherit;}
.fish:hover{transform:scale(1.06);}
.fish.caught{background:#c8e6c9 !important;color:#1b5e20 !important;animation:gmPop .4s;pointer-events:none;opacity:.9;}
.fish.escaped{animation:gmShake .35s;opacity:.5;pointer-events:none;}
.fish-bucket{text-align:center;font-size:14px;color:var(--muted);margin-top:10px;}
.fish-bucket b{color:var(--primary);font-size:16px;}
@keyframes fishSwim{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-6px) rotate(2deg)}}
/* 排行榜 */
.gm-board{max-width:560px;margin:14px auto 0;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:12px;}
.gm-board h4{margin:0 0 8px;font-size:14px;}
.gm-board table{width:100%;border-collapse:collapse;font-size:13px;}
.gm-board td,.gm-board th{padding:6px 8px;border-bottom:1px solid var(--border);text-align:left;}
.gm-board tr.top1 td{background:#fff8e1;font-weight:600;}
.gm-board tr.top2 td{background:#f5f5f5;}
.gm-board tr.top3 td{background:#efebe9;}
.gm-board .rank-no{width:34px;color:var(--muted);}

/* ===== 朗读宝风格 · 全站板块主题色 ===== */
.page{--theme:var(--primary);--theme-light:var(--primary-light);--theme-deep:#1d4ed8;}
#page-home{--theme:#f59e0b;--theme-light:#fef3c7;--theme-deep:#b45309;}
#page-primary{--theme:#10b981;--theme-light:#d1fae5;--theme-deep:#047857;}
#page-middle{--theme:#3b82f6;--theme-light:#dbeafe;--theme-deep:#1d4ed8;}
#page-high{--theme:#8b5cf6;--theme-light:#ede9fe;--theme-deep:#6d28d9;}
#page-cambridge{--theme:#e11d48;--theme-light:#ffe4e6;--theme-deep:#be123c;}
#page-grammar{--theme:#14b8a6;--theme-light:#ccfbf1;--theme-deep:#0f766e;}
#page-errors{--theme:#ef4444;--theme-light:#fee2e2;--theme-deep:#b91c1c;}
#page-vocab{--theme:#16a34a;--theme-light:#dcfce7;--theme-deep:#15803d;}
#page-tts{--theme:#0ea5e9;--theme-light:#e0f2fe;--theme-deep:#0369a1;}
#page-games{--theme:#d946ef;--theme-light:#fae8ff;--theme-deep:#a21caf;}
#page-games[data-game="match"]{--theme:#d946ef;--theme-light:#fae8ff;--theme-deep:#a21caf;}
#page-games[data-game="pk"]{--theme:#ef4444;--theme-light:#fee2e2;--theme-deep:#b91c1c;}
#page-games[data-game="ninja"]{--theme:#6366f1;--theme-light:#e0e7ff;--theme-deep:#4338ca;}
#page-games[data-game="mole"]{--theme:#f59e0b;--theme-light:#fef3c7;--theme-deep:#b45309;}
#page-games[data-game="horse"]{--theme:#0ea5e9;--theme-light:#e0f2fe;--theme-deep:#0369a1;}
#page-games[data-game="balloon"]{--theme:#ec4899;--theme-light:#fce7f3;--theme-deep:#be185d;}
#page-games[data-game="cat"]{--theme:#06b6d4;--theme-light:#cffafe;--theme-deep:#0e7490;}
#page-games[data-game="bird"]{--theme:#10b981;--theme-light:#d1fae5;--theme-deep:#047857;}
#page-reading{--theme:#f97316;--theme-light:#ffedd5;--theme-deep:#c2410c;}
#page-calendar{--theme:#06b6d4;--theme-light:#cffafe;--theme-deep:#0e7490;}
#page-review{--theme:#6366f1;--theme-light:#e0e7ff;--theme-deep:#4338ca;}
#page-resources{--theme:#65a30e;--theme-light:#ecfccb;--theme-deep:#4d7c0f;}
#page-settings{--theme:#64748b;--theme-light:#f1f5f9;--theme-deep:#475569;}

/* 页头 / 卡片标题 / 按钮跟随主题色 */
.page-header{border-left:5px solid var(--theme);padding-left:14px;border-radius:2px;}
.page-header h2{color:var(--theme);}
.page .card-title{color:var(--theme-deep);}
.page .btn-primary{background:var(--theme);}
.page .form-input:focus,.page .form-select:focus,.page .form-textarea:focus{border-color:var(--theme);box-shadow:0 0 0 2px var(--theme-light);}
.page .callout-info{background:var(--theme-light);border-left-color:var(--theme);}
.page .toggle{border-left:3px solid transparent;}
.page .toggle.open{border-left-color:var(--theme);}
.page .grammar-card-title{color:var(--theme-deep);}

/* 学习页内部交互组件跟随主题色 */
.page .lb-tab:hover{border-color:var(--theme);color:var(--theme);}
.page .lb-tab.on{background:var(--theme);border-color:var(--theme);box-shadow:0 2px 6px rgba(0,0,0,.18);}
.page .lv-chip.on{background:var(--theme);border-color:var(--theme);box-shadow:0 2px 6px rgba(0,0,0,.18);}
.page .lt-step:hover{border-color:var(--theme);color:var(--theme);}
.page .lt-step.on{background:var(--theme);border-color:var(--theme);box-shadow:0 2px 6px rgba(0,0,0,.18);}
.page .bp-line:hover{background:var(--theme-light);}
.page .bp-on{background:var(--theme-light);border-left-color:var(--theme);}
.page .lc-tag{background:var(--theme-light);color:var(--theme-deep);}
.page .lb-item .lb-no{background:var(--theme-light);color:var(--theme-deep);}
.page .lb-item.playing{border-color:var(--theme);background:var(--theme-light);}
.page .lt-book-card:hover{border-color:var(--theme);}
.page .lt-sen:hover{background:var(--theme-light);}
.page .lt-sen.lt-playing{background:var(--theme-light);box-shadow:inset 0 -2px 0 var(--theme);}
.page .lt-unit-card:hover{border-color:var(--theme);background:var(--theme-light);}
.page .dict-now{color:var(--theme);}
.page .lb-stat .n{color:var(--theme);}
.page .ear-status-box{background:var(--theme-light);}
.page .essay-sent.playing{background:var(--theme-light);}
.page .lit-sent.playing{background:var(--theme-light);}
.page .quick-jump a:hover{background:var(--theme-light);color:var(--theme);}
.page .gm-stat{background:var(--theme-light);color:var(--theme-deep);}
.page .pk-opt:hover{border-color:var(--theme);background:var(--theme-light);}
.page .game-card:hover{border-color:var(--theme);}
.page .game-card.flip{background:var(--theme-light);border-color:var(--theme);}
.page .calendar-cell:hover{border-color:var(--theme);}
.page .calendar-cell.today{border-color:var(--theme);}
.page .resource-item a{color:var(--theme);}
.page .review-fill input:focus{border-bottom-color:var(--theme);}

/* 侧栏导航：图标彩色圆角块 + 激活态跟随主题色 */
.nav-item{--nv:#3b82f6;--nv-light:#dbeafe;--nv-deep:#1d4ed8;}
.nav-item[data-page="home"]{--nv:#f59e0b;--nv-light:#fef3c7;--nv-deep:#b45309;}
.nav-item[data-page="primary"]{--nv:#10b981;--nv-light:#d1fae5;--nv-deep:#047857;}
.nav-item[data-page="middle"]{--nv:#3b82f6;--nv-light:#dbeafe;--nv-deep:#1d4ed8;}
.nav-item[data-page="high"]{--nv:#8b5cf6;--nv-light:#ede9fe;--nv-deep:#6d28d9;}
.nav-item[data-page="cambridge"]{--nv:#e11d48;--nv-light:#ffe4e6;--nv-deep:#be123c;}
.nav-item[data-page="grammar"]{--nv:#14b8a6;--nv-light:#ccfbf1;--nv-deep:#0f766e;}
.nav-item[data-page="errors"]{--nv:#ef4444;--nv-light:#fee2e2;--nv-deep:#b91c1c;}
.nav-item[data-page="vocab"]{--nv:#16a34a;--nv-light:#dcfce7;--nv-deep:#15803d;}
.nav-item[data-page="tts"]{--nv:#0ea5e9;--nv-light:#e0f2fe;--nv-deep:#0369a1;}
.nav-item[data-page="games"]{--nv:#d946ef;--nv-light:#fae8ff;--nv-deep:#a21caf;}
.nav-item[data-page="reading"]{--nv:#f97316;--nv-light:#ffedd5;--nv-deep:#c2410c;}
.nav-item[data-page="calendar"]{--nv:#06b6d4;--nv-light:#cffafe;--nv-deep:#0e7490;}
.nav-item[data-page="review"]{--nv:#6366f1;--nv-light:#e0e7ff;--nv-deep:#4338ca;}
.nav-item[data-page="resources"]{--nv:#65a30e;--nv-light:#ecfccb;--nv-deep:#4d7c0f;}
.nav-item[data-page="settings"]{--nv:#64748b;--nv-light:#f1f5f9;--nv-deep:#475569;}
.nav-icon{width:26px;height:26px;border-radius:8px;background:var(--nv-light);display:inline-flex;align-items:center;justify-content:center;font-size:14px;flex:0 0 auto;}
.nav-item.active{background:var(--nv-light);color:var(--nv-deep);border-left-color:var(--nv);}

/* 首页/剑桥页导航卡片：彩色渐变卡片 */
.nav-card{background:linear-gradient(135deg,var(--nc-grad,#fff) 0,#fff 70%);border-color:var(--nc-border,transparent);}
.nav-card:hover{border-color:var(--nc,var(--primary));box-shadow:0 6px 16px var(--nc-shadow,rgba(0,0,0,.12));}
.nav-card h3{color:var(--nc-deep,var(--text));}
.nav-card .nav-card-icon{width:46px;height:46px;border-radius:12px;background:var(--nc-light,#f3f4f6);display:flex;align-items:center;justify-content:center;font-size:26px;}
.nav-card[onclick*="'primary'"]{--nc:#10b981;--nc-light:#d1fae5;--nc-deep:#047857;--nc-grad:#ecfdf5;--nc-border:#a7f3d0;--nc-shadow:rgba(16,185,129,.18);}
.nav-card[onclick*="'middle'"]{--nc:#3b82f6;--nc-light:#dbeafe;--nc-deep:#1d4ed8;--nc-grad:#eff6ff;--nc-border:#bfdbfe;--nc-shadow:rgba(59,130,246,.18);}
.nav-card[onclick*="'high'"]{--nc:#8b5cf6;--nc-light:#ede9fe;--nc-deep:#6d28d9;--nc-grad:#f5f3ff;--nc-border:#ddd6fe;--nc-shadow:rgba(139,92,246,.18);}
.nav-card[onclick*="'cambridge'"]{--nc:#e11d48;--nc-light:#ffe4e6;--nc-deep:#be123c;--nc-grad:#fff1f2;--nc-border:#fecdd3;--nc-shadow:rgba(225,29,72,.18);}
.nav-card[onclick*="'grammar'"]{--nc:#14b8a6;--nc-light:#ccfbf1;--nc-deep:#0f766e;--nc-grad:#f0fdfa;--nc-border:#99f6e4;--nc-shadow:rgba(20,184,166,.18);}
.nav-card[onclick*="'errors'"]{--nc:#ef4444;--nc-light:#fee2e2;--nc-deep:#b91c1c;--nc-grad:#fef2f2;--nc-border:#fecaca;--nc-shadow:rgba(239,68,68,.18);}
.nav-card[onclick*="'vocab'"]{--nc:#16a34a;--nc-light:#dcfce7;--nc-deep:#15803d;--nc-grad:#f0fdf4;--nc-border:#bbf7d0;--nc-shadow:rgba(22,163,74,.18);}
.nav-card[onclick*="'tts'"]{--nc:#0ea5e9;--nc-light:#e0f2fe;--nc-deep:#0369a1;--nc-grad:#f0f9ff;--nc-border:#bae6fd;--nc-shadow:rgba(14,165,233,.18);}
.nav-card[onclick*="'games'"]{--nc:#d946ef;--nc-light:#fae8ff;--nc-deep:#a21caf;--nc-grad:#fdf4ff;--nc-border:#f5d0fe;--nc-shadow:rgba(217,70,239,.18);}
.nav-card[onclick*="'reading'"]{--nc:#f97316;--nc-light:#ffedd5;--nc-deep:#c2410c;--nc-grad:#fff7ed;--nc-border:#fed7aa;--nc-shadow:rgba(249,115,22,.18);}
.nav-card[onclick*="'calendar'"]{--nc:#06b6d4;--nc-light:#cffafe;--nc-deep:#0e7490;--nc-grad:#ecfeff;--nc-border:#a5f3fc;--nc-shadow:rgba(6,182,212,.18);}
.nav-card[onclick*="'review'"]{--nc:#6366f1;--nc-light:#e0e7ff;--nc-deep:#4338ca;--nc-grad:#eef2ff;--nc-border:#c7d2fe;--nc-shadow:rgba(99,102,241,.18);}
.nav-card[onclick*="'resources'"]{--nc:#65a30e;--nc-light:#ecfccb;--nc-deep:#4d7c0f;--nc-grad:#f7fee7;--nc-border:#d9f99d;--nc-shadow:rgba(101,163,14,.18);}

/* 单词乐园：8 款游戏卡片各自配色 */
.game-hall-card{border-top:4px solid var(--gc,var(--primary));}
.game-hall-card:hover{border-color:var(--gc,var(--primary));}
.game-hall-card .gh-ico{background:var(--gc-light,transparent);border-radius:10px;width:46px;height:46px;display:flex;align-items:center;justify-content:center;font-size:26px;}
.game-hall-card h3{color:var(--gc-deep,var(--text));}
.game-hall-card .gh-best{color:var(--gc,var(--primary));}
.gh-match{--gc:#d946ef;--gc-light:#fae8ff;--gc-deep:#a21caf;}
.gh-pk{--gc:#ef4444;--gc-light:#fee2e2;--gc-deep:#b91c1c;}
.gh-ninja{--gc:#6366f1;--gc-light:#e0e7ff;--gc-deep:#4338ca;}
.gh-mole{--gc:#f59e0b;--gc-light:#fef3c7;--gc-deep:#b45309;}
.gh-horse{--gc:#0ea5e9;--gc-light:#e0f2fe;--gc-deep:#0369a1;}
.gh-balloon{--gc:#ec4899;--gc-light:#fce7f3;--gc-deep:#be185d;}
.gh-cat{--gc:#06b6d4;--gc-light:#cffafe;--gc-deep:#0e7490;}
.gh-bird{--gc:#10b981;--gc-light:#d1fae5;--gc-deep:#047857;}

/* ---- 移动端底部快捷栏 ---- */
.v4-mobbar{position:fixed;left:0;right:0;bottom:0;z-index:900;display:none;
  background:var(--card);border-top:1px solid var(--border);
  padding:6px 4px calc(6px + env(safe-area-inset-bottom));justify-content:space-around;box-shadow:0 -2px 12px rgba(0,0,0,.06);}
.v4-mobbar a{display:flex;flex-direction:column;align-items:center;gap:1px;font-size:11px;color:var(--muted);
  padding:4px 10px;border-radius:8px;cursor:pointer;text-decoration:none;min-width:48px;min-height:44px;justify-content:center;}
.v4-mobbar a b{font-size:18px;line-height:1}
.v4-mobbar a.on{color:var(--primary);background:var(--primary-light,#eef2ff)}
@media(max-width:768px){.v4-mobbar{display:flex} .main{padding-bottom:64px}}
/* ---- 轻量模式：关闭装饰性动画 ---- */
body.lite-mode .bal-fish,body.lite-mode .balloon,body.lite-mode .mole-cell{animation:none!important}
body.lite-mode *{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
@media(max-width:640px){
  body:not(.lite-mode) .bal-fish,body:not(.lite-mode) .balloon{animation:none}
  .v2-core-grid{grid-template-columns:repeat(2,1fr)}
  .btn{min-height:42px;font-size:14px}
  .nav-card p{font-size:12px}
  .page-header h2{font-size:20px}
}
/* ---- 错题/单词导出 PDF 打印样式 ---- */
@media print{
  body.print-v4 *{visibility:hidden}
  body.print-v4 #v4-print,body.print-v4 #v4-print *{visibility:visible}
  body.print-v4 #v4-print{position:absolute;left:0;top:0;width:100%;padding:16px}
  body.print-v4 .sidebar,body.print-v4 .menu-toggle,body.print-v4 .v4-mobbar{display:none!important}
}
#v4-print h2{font-size:18px;margin:0 0 4px}
#v4-print .v4p-sub{color:#666;font-size:12px;margin-bottom:12px}
#v4-print table{width:100%;border-collapse:collapse;font-size:12px}
#v4-print th,#v4-print td{border:1px solid #cbd5e1;padding:6px 8px;text-align:left;vertical-align:top}
#v4-print th{background:#f1f5f9}
#v4-print tr{page-break-inside:avoid}


/* 拆分版的「加载中」占位（app.js 首屏渲染后自动移除） */
#boot-splash{position:fixed;inset:0;z-index:20000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:var(--bg);color:var(--text);font:600 15px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
#boot-splash .bs-t{font-size:20px;font-weight:800}
#boot-splash .bs-d{font-size:13px;opacity:.65}
#boot-splash .bs-r{width:26px;height:26px;border:3px solid rgba(128,128,128,.25);border-top-color:currentColor;border-radius:50%;animation:bsSpin .8s linear infinite}
@keyframes bsSpin{to{transform:rotate(360deg)}}