:root{--red:#e53935;--red2:#b71c1c;--ink:#202124;--muted:#6b7280;--bg:#f7f7f8;--card:#fff;--line:#e5e7eb;--green:#15803d}*{box-sizing:border-box}body{margin:0;font-family:Arial,"Microsoft YaHei","Noto Sans SC",sans-serif;background:var(--bg);color:var(--ink)}a{text-decoration:none;color:inherit}.container{width:min(1100px,calc(100% - 32px));margin:auto}.narrow{max-width:720px}.topbar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.nav{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font-size:24px;font-weight:800;color:var(--red)}.brand span{font-size:16px;color:var(--ink)}nav{display:flex;gap:16px;flex-wrap:wrap}nav a{font-weight:600;color:#4b5563}nav a:hover{color:var(--red)}main.container{padding:30px 0 56px}.hero{background:linear-gradient(135deg,#fff 0%,#fff5f5 100%);border:1px solid #ffd9d9;border-radius:24px;padding:42px;display:flex;justify-content:space-between;align-items:center;gap:30px}.hero h1{font-size:44px;line-height:1.1;margin:14px 0}.hero p{font-size:18px;color:var(--muted);max-width:650px}.badge{display:inline-block;background:#ffe1e1;color:var(--red2);font-size:12px;font-weight:800;padding:8px 10px;border-radius:999px;letter-spacing:.08em}.hanzi-big{font-size:150px;color:var(--red);font-family:"KaiTi","STKaiti",serif;line-height:1}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}.btn,.smallbtn{border:0;border-radius:12px;background:var(--red);color:#fff;padding:12px 18px;font-weight:700;cursor:pointer;display:inline-block}.btn:hover,.smallbtn:hover{filter:brightness(.95)}.btn.secondary{background:#fff;color:var(--red);border:1px solid #f4aaaa}.smallbtn{padding:9px 12px;font-size:14px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:22px 0}.stat{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px;text-align:center}.stat b{font-size:30px;color:var(--red);display:block}.stat span{color:var(--muted)}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:0 5px 18px rgba(0,0,0,.03)}.feature{transition:.2s}.feature:hover{transform:translateY(-3px);border-color:#f3aaaa}.feature h3{margin-top:0}.feature p,.muted{color:var(--muted)}.pagehead{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.pagehead h1{margin:0 0 6px}.pagehead p{margin:0;color:var(--muted)}.toggles{display:flex;gap:12px;background:#fff;padding:12px 16px;border:1px solid var(--line);border-radius:12px}.lesson-tabs{display:flex;gap:10px;overflow:auto;margin-bottom:18px;padding-bottom:4px}.lesson-tabs a{white-space:nowrap;background:#fff;border:1px solid var(--line);padding:10px 14px;border-radius:999px}.lesson-tabs a.active{background:var(--red);color:white;border-color:var(--red)}.word-card{display:grid;grid-template-columns:150px 1fr auto;gap:22px;align-items:center;margin-bottom:14px}.hanzi{font-size:70px;text-align:center;color:var(--red2);font-family:"KaiTi","STKaiti",serif}.word-info>.pinyin{font-size:22px;color:#2563eb}.word-info>.vi{font-size:20px;font-weight:700;margin-top:6px}.example{margin-top:16px;padding-top:14px;border-top:1px dashed var(--line);display:flex;flex-direction:column;gap:5px}.example b{font-size:22px}.write-layout{display:grid;grid-template-columns:340px 1fr;gap:22px}.model-card{text-align:center}.hanzi-model{font-family:"KaiTi","STKaiti",serif;font-size:150px;color:var(--red2);line-height:1.1}.canvas-card{text-align:center}.canvas-wrap{position:relative;display:inline-block;max-width:100%;background:#fff;border:2px solid #d8b4b4;background-image:linear-gradient(45deg,transparent 49.6%,#ead0d0 50%,transparent 50.4%),linear-gradient(-45deg,transparent 49.6%,#ead0d0 50%,transparent 50.4%),linear-gradient(to right,transparent 49.8%,#ead0d0 50%,transparent 50.2%),linear-gradient(to bottom,transparent 49.8%,#ead0d0 50%,transparent 50.2%)}#writeCanvas{display:block;width:min(520px,100%);height:auto;touch-action:none;position:relative;z-index:2}#ghostChar{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:"KaiTi","STKaiti",serif;font-size:330px;color:rgba(229,57,53,.13);pointer-events:none;z-index:1}.quiz-list{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:18px}.quiz-item .qnum{font-size:12px;color:var(--muted);font-weight:700}.quiz-item h2{color:#2563eb;margin-bottom:4px}.quiz-item p{margin-top:0}.answer,input,textarea,select{width:100%;border:1px solid #d1d5db;border-radius:10px;padding:11px 12px;font-size:16px;background:#fff}.answer{font-size:24px;font-family:"Microsoft YaHei",sans-serif}.feedback{margin-top:8px;font-weight:700}.feedback.ok{color:var(--green)}.feedback.bad{color:var(--red)}#quizResult{margin-top:16px;font-size:22px;font-weight:800}.progressbar{height:18px;background:#eee;border-radius:999px;overflow:hidden}.progressbar>div{height:100%;background:var(--red)}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}label{display:block;font-weight:700;margin-bottom:12px}label input,label textarea,label select{margin-top:6px;font-weight:400}.success,.danger{padding:14px;border-radius:12px;margin:14px 0}.success{background:#dcfce7;color:#166534}.danger{background:#fee2e2;color:#991b1b}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:10px;border-bottom:1px solid var(--line);text-align:left}.table-cn{font-size:24px}footer{border-top:1px solid var(--line);background:#fff;color:var(--muted);padding:24px 0}@media(max-width:780px){nav{display:none}.hero{padding:26px}.hero h1{font-size:34px}.hanzi-big{font-size:95px}.grid3,.stats,.quiz-list,.admin-grid,.write-layout{grid-template-columns:1fr}.word-card{grid-template-columns:100px 1fr}.word-card .smallbtn{grid-column:1/-1}.hanzi{font-size:54px}.pagehead{align-items:flex-start;flex-direction:column}.toggles{width:100%}}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px}.section-head h2{margin:0}.smalltext{font-size:13px;margin-top:4px}.actions-cell{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.actions-cell form{margin:0}.secondary-btn{background:#fff;color:var(--red);border:1px solid #f4aaaa}.danger-btn{background:#b91c1c}.inline-filter{min-width:260px}.inline-filter select{margin:0}@media(max-width:780px){.section-head{align-items:flex-start;flex-direction:column}.inline-filter{min-width:0;width:100%}}

/* Stage 3 - Advanced Hanzi writing */
.write-stage3{display:grid;grid-template-columns:330px 1fr;gap:22px}.write-info-card{text-align:center;align-self:start;position:sticky;top:90px}.hanzi-word-model{font-family:"KaiTi","STKaiti",serif;font-size:clamp(52px,7vw,104px);color:var(--red2);line-height:1.15;margin:12px 0;overflow-wrap:anywhere}.write-meaning{font-size:18px;font-weight:700}.write-example{margin:18px 0;padding:14px;border-radius:12px;background:#fafafa;border:1px dashed var(--line);display:flex;flex-direction:column;gap:5px;text-align:left}.write-example b{font-size:20px}.write-example span{color:var(--muted)}.write-settings{display:grid;grid-template-columns:1fr 1fr;gap:10px;text-align:left;margin-top:18px}.write-settings label{font-size:13px}.write-settings select{margin-top:5px}.write-toolbar{justify-content:center}.writing-workspace{text-align:center;min-height:650px}.char-progress{margin-bottom:12px;color:var(--muted);font-size:16px}.counter-char{font-family:"KaiTi","STKaiti",serif;font-size:28px;color:var(--red2);vertical-align:middle}.single-canvas-host{display:flex;justify-content:center}.hanzi-board{width:min(520px,100%);aspect-ratio:1;position:relative;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 0 0 2px #d5a4a4 inset}.hanzi-canvas{display:block;width:100%;height:100%;touch-action:none;position:relative;z-index:2}.board-ghost{position:absolute;inset:0;align-items:center;justify-content:center;font-family:"KaiTi","STKaiti",serif;font-size:68%;color:rgba(229,57,53,.14);pointer-events:none;z-index:1;line-height:1}.char-nav{display:flex;justify-content:center;gap:12px;margin-top:18px}.char-nav button:disabled{opacity:.4;cursor:not-allowed}.word-mode-help{color:var(--muted);margin-bottom:16px}.multi-canvas-host{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:14px}.multi-char-item{width:150px}.multi-char-label{font-family:"KaiTi","STKaiti",serif;font-size:30px;color:var(--red2);margin-bottom:6px}.compact-board{width:150px}.multi-spacer{width:28px;height:150px}.multi-punct{font-size:45px;line-height:150px;color:var(--muted)}.empty-writing{padding:80px 20px;color:var(--muted)}.write-note{margin-top:20px}.item-navigation{display:flex;justify-content:space-between;gap:12px;margin-top:20px}.word-mode-panel[hidden],#singleModePanel[hidden]{display:none!important}@media(max-width:900px){.write-stage3{grid-template-columns:1fr}.write-info-card{position:static}.writing-workspace{min-height:0}.write-settings{grid-template-columns:1fr 1fr}}@media(max-width:560px){.write-settings{grid-template-columns:1fr}.multi-char-item,.compact-board{width:120px}.multi-spacer{width:18px;height:120px}.multi-punct{font-size:36px;line-height:120px}.char-nav{flex-direction:column}.char-nav .btn{width:100%}.item-navigation{flex-direction:column}.item-navigation .btn{text-align:center}}

/* Stage 4 - Stroke order trainer */
.stroke-panel{margin-top:18px;padding-top:16px;border-top:1px dashed var(--line);text-align:left}.stroke-panel-title{font-weight:800;margin-bottom:10px}.stroke-panel-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.stroke-panel-actions .smallbtn{width:100%;text-align:center}.stroke-panel-actions button:disabled{opacity:.45;cursor:not-allowed}.stroke-status{margin-top:10px;padding:10px 11px;border-radius:10px;background:#f8fafc;border:1px solid var(--line);color:var(--muted);font-size:13px;line-height:1.45}.stroke-status.ok{background:#f0fdf4;border-color:#bbf7d0;color:#166534}.stroke-status.bad{background:#fef2f2;border-color:#fecaca;color:#991b1b}.stage4-work-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}.workspace-label{font-size:13px;font-weight:800;color:var(--muted);margin-bottom:8px;text-transform:uppercase;letter-spacing:.04em}.stroke-order-host{width:100%;aspect-ratio:1;min-height:260px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 0 0 2px #d5a4a4 inset;background-image:linear-gradient(to right,transparent 49.8%,#ead0d0 50%,transparent 50.2%),linear-gradient(to bottom,transparent 49.8%,#ead0d0 50%,transparent 50.2%)}.stroke-order-host svg{max-width:100%;max-height:100%;display:block}.stroke-empty{padding:30px;color:var(--muted);text-align:center}.stroke-counter{margin-top:9px;font-weight:800;color:var(--red2)}
@media(max-width:1050px){.stage4-work-grid{grid-template-columns:1fr}.stroke-order-host{max-width:520px;margin:auto}.stroke-panel-actions{grid-template-columns:1fr}}

/* Stage 4.1 - Chinese Reading Audio */
.reading-audio-bar{display:grid;grid-template-columns:1.35fr 1fr;gap:18px;align-items:center;margin-bottom:18px}.reading-audio-main{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.reading-now{flex-basis:100%;color:var(--muted);font-size:14px;margin-top:3px}.reading-audio-settings{display:grid;grid-template-columns:140px 1fr;gap:12px}.reading-audio-settings label{margin:0;font-size:13px}.reading-audio-settings select{margin-top:5px}.speech-support-note{grid-column:1/-1;font-size:12px;color:var(--muted);padding-top:10px;border-top:1px dashed var(--line)}.hanzi-wrap{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0}.hanzi-wrap .hanzi{flex:1}.speaker-btn{border:1px solid #f0b7b7;background:#fff;color:var(--red2);width:42px;height:42px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:19px;line-height:1;flex:0 0 auto;transition:.15s}.speaker-btn:hover{background:#fff1f1;transform:scale(1.05)}.speaker-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.example-cn-row{display:flex;align-items:center;gap:10px}.example-cn-row b{flex:1}.example-cn-row .speaker-btn{width:36px;height:36px;font-size:16px}.reading-card{transition:border-color .2s,box-shadow .2s,background .2s}.reading-card.is-speaking{border-color:#f97316;background:#fffaf3;box-shadow:0 0 0 3px rgba(249,115,22,.12)}.reading-card.is-speaking .hanzi{color:#ea580c}.reading-example.is-speaking{background:#fff3df;border-radius:10px;padding:10px;margin-left:-10px;margin-right:-10px}.speaker-btn.is-speaking{background:var(--red);color:#fff;border-color:var(--red);animation:speakerPulse 1s ease-in-out infinite}@keyframes speakerPulse{0%,100%{box-shadow:0 0 0 0 rgba(229,57,53,.25)}50%{box-shadow:0 0 0 7px rgba(229,57,53,0)}}
@media(max-width:860px){.reading-audio-bar{grid-template-columns:1fr}.reading-audio-settings{grid-template-columns:1fr 1fr}}@media(max-width:560px){.reading-audio-settings{grid-template-columns:1fr}.reading-audio-main .btn{flex:1;text-align:center}.word-card.reading-card{grid-template-columns:1fr}.hanzi-wrap{justify-content:center}.word-card.reading-card .smallbtn{grid-column:auto}.hanzi-wrap .hanzi{flex:0 1 auto}.reading-pagehead .toggles{flex-wrap:wrap}}

/* Stage 4.2 - Bilingual Reading & Karaoke */
.article-title-card{margin:18px 0}.article-title-card h2{font-size:30px;margin:10px 0 6px}.bilingual-sentence{display:flex;gap:16px;align-items:flex-start;position:relative;transition:.2s ease}.bilingual-sentence.is-speaking{box-shadow:0 0 0 3px rgba(245,158,11,.22);transform:translateY(-1px)}.sentence-number{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#f3f4f6;font-weight:700;flex:0 0 auto}.sentence-content{flex:1;min-width:0}.zh-sentence-row{display:flex;gap:12px;align-items:flex-start}.zh-karaoke{font-size:30px;line-height:1.65;font-weight:700;letter-spacing:.02em;flex:1;word-break:break-word}.karaoke-token{display:inline;border-radius:7px;padding:1px 2px;transition:background .12s,color .12s,box-shadow .12s}.karaoke-token.active{background:#facc15;color:#111827;box-shadow:0 2px 8px rgba(250,204,21,.35)}.article-pinyin{font-size:17px;color:#64748b;margin-top:5px;font-style:italic}.article-vi{font-size:18px;line-height:1.65;margin-top:8px;color:#334155}.bilingual-sentence .speaker-btn{margin-top:5px}.bilingual-sentence .speaker-btn.is-speaking{animation:pulseSpeaker 1s infinite}.bilingual-sentence.is-paused{box-shadow:0 0 0 2px rgba(59,130,246,.16)}
@media(max-width:700px){.bilingual-sentence{gap:10px}.sentence-number{width:28px;height:28px;font-size:13px}.zh-karaoke{font-size:25px}.article-vi{font-size:16px}.zh-sentence-row{gap:8px}.reading-audio-main{align-items:flex-start}}

/* Stage 4.2.2 - Reading library */
.reading-library-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:28px 0 22px}.reading-library-hero h1{font-size:38px;margin:10px 0}.reading-library-hero p{max-width:760px;color:var(--muted);font-size:17px;line-height:1.7}.reading-library-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.reading-library-card{display:flex;gap:18px;align-items:flex-start;min-height:205px;transition:.18s ease}.reading-library-card:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(15,23,42,.08)}.reading-library-number{width:54px;height:54px;border-radius:15px;background:#fff1f1;color:var(--red2);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:20px;flex:0 0 auto}.reading-library-body{flex:1;min-width:0}.reading-library-body h2{margin:8px 0 9px;font-size:24px}.reading-library-body p{color:#475569;line-height:1.6;min-height:50px}.reading-library-meta{font-size:13px;color:#64748b}.reading-library-actions{margin-top:16px}.empty-reading-library{text-align:center;padding:46px 20px}.reading-detail-topline{display:flex;justify-content:space-between;align-items:center;margin:24px 0 8px}.back-link{font-weight:700;color:var(--red2);text-decoration:none}.reading-position{font-size:13px;color:var(--muted)}.article-switcher{display:flex;gap:8px;overflow-x:auto;padding:3px 0 8px;margin:2px 0 8px}.article-switcher a{white-space:nowrap;border:1px solid var(--line);padding:9px 13px;border-radius:999px;text-decoration:none;color:#475569;background:#fff}.article-switcher a.active{background:var(--red);border-color:var(--red);color:#fff}.article-title-card{margin-top:10px}
@media(max-width:780px){.reading-library-hero{align-items:flex-start;flex-direction:column}.reading-library-grid{grid-template-columns:1fr}.reading-library-hero h1{font-size:31px}}

/* Stage 4.2.3 - visible speed control + reliable karaoke */
.rate-control{margin:0}.setting-title{font-size:13px;font-weight:700;margin-bottom:6px}.rate-buttons{display:flex;gap:6px;flex-wrap:wrap}.rate-btn{border:1px solid #d1d5db;background:#fff;border-radius:999px;padding:8px 11px;font-weight:700;cursor:pointer;color:#475569}.rate-btn:hover{border-color:#ef4444;color:#b91c1c}.rate-btn.active{background:#dc2626;border-color:#dc2626;color:#fff}.bilingual-sentence.is-speaking{background:#fffdf1;border-color:#f59e0b}.zh-karaoke .karaoke-token.active{background:#facc15!important;color:#111827!important;box-shadow:0 2px 9px rgba(250,204,21,.5);transform:translateY(-1px)}.zh-karaoke .karaoke-token.done{color:#dc2626}.karaoke-status{font-size:12px;color:#64748b;margin-top:4px}.reading-audio-settings{align-items:end}
@media(max-width:680px){.rate-buttons{gap:5px}.rate-btn{padding:7px 9px;font-size:13px}}

/* Stage 4.2.4 - reading resume/progress controls */
.reading-playback-tools{grid-column:1/-1;display:flex;align-items:end;gap:14px;flex-wrap:wrap;padding:14px 0 2px;border-top:1px dashed var(--line)}
.reading-start-control{min-width:150px}.reading-start-control label{display:block;font-size:13px;font-weight:700;margin-bottom:5px}.reading-start-control select{min-width:135px}
.reading-check{display:flex!important;align-items:center;gap:7px!important;font-size:14px!important;font-weight:600;white-space:nowrap}.reading-check input{width:auto;margin:0}
.reading-step-buttons{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.reading-progress-wrap{grid-column:1/-1;padding-top:8px}.reading-progress-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13px;color:#64748b;margin-bottom:7px}
.reading-progress-track{height:10px;background:#eef2f7;border-radius:999px;overflow:hidden}.reading-progress-bar{height:100%;background:linear-gradient(90deg,#ef4444,#f59e0b);border-radius:999px;transition:width .25s ease}
.link-btn{border:0;background:transparent;color:#b91c1c;font-weight:700;cursor:pointer;padding:2px 0}.link-btn:hover{text-decoration:underline}
.sentence-number.sentence-jump{border:0;cursor:pointer;color:inherit}.sentence-number.sentence-jump:hover{background:#fee2e2;color:#b91c1c}
.bilingual-sentence.is-selected{border-color:#cbd5e1;background:#f8fafc}.bilingual-sentence.is-complete .sentence-number{background:#dcfce7;color:#166534}.bilingual-sentence.is-complete .sentence-number::after{content:'✓';position:absolute;transform:translate(14px,-13px);font-size:11px;background:#16a34a;color:#fff;border-radius:50%;width:16px;height:16px;display:flex;align-items:center;justify-content:center}
@media(max-width:760px){.reading-step-buttons{margin-left:0;width:100%}.reading-step-buttons .btn{flex:1}.reading-playback-tools{align-items:stretch}.reading-start-control{width:100%}.reading-start-control select{width:100%}}

/* Stage 4.2.5 - visible ghost character control */
.ghost-setting{display:flex!important;flex-direction:column;justify-content:flex-end}.ghost-switch-row{display:flex;align-items:center;gap:8px;min-height:42px;padding:8px 11px;border:1px solid var(--line);border-radius:10px;background:#fff}.ghost-switch-row input{width:18px;height:18px;margin:0;accent-color:var(--red)}.ghost-switch-row b{font-size:13px;color:#475569}.board-ghost{pointer-events:none;user-select:none}


/* Stage 5 - writing scoring and progress */
.writing-score-card{margin-top:12px;padding:12px;border:1px solid #e5e7eb;border-radius:12px;background:#fff}.writing-score-head{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:800}.writing-score-head b{font-size:22px;color:#64748b}.writing-score-head b.score-good{color:#15803d}.writing-score-head b.score-mid{color:#d97706}.writing-score-head b.score-low{color:#dc2626}.writing-score-meta,.writing-score-best{font-size:12px;color:#64748b;margin-top:6px;line-height:1.45}.writing-score-best{font-weight:700;color:#334155}.section-title{margin:28px 0 14px}.writing-stats{margin-top:0}.progress-two-col{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.hard-char-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.hard-char{border:1px solid #e5e7eb;border-radius:13px;padding:12px;text-align:center;background:#fff;display:flex;flex-direction:column;gap:3px}.hard-char:hover{border-color:#f3aaaa;background:#fffafa}.hard-char b{font-family:"KaiTi","STKaiti",serif;font-size:42px;color:#b91c1c;line-height:1.05}.hard-char span{font-weight:700;color:#2563eb}.hard-char em{font-style:normal;color:#475569;font-size:13px}.hard-char small{color:#64748b;margin-top:4px}.attempt-list{display:flex;flex-direction:column;gap:8px}.attempt-row{display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:10px;padding:9px;border:1px solid #eef2f7;border-radius:11px}.attempt-row:hover{background:#fafafa}.attempt-hanzi{font-family:"KaiTi","STKaiti",serif;font-size:31px;color:#b91c1c;text-align:center}.attempt-info{display:flex;flex-direction:column;font-weight:700;color:#334155}.attempt-info small{font-weight:400;color:#94a3b8;margin-top:2px}.score-pill{min-width:42px;text-align:center;border-radius:999px;padding:6px 8px;color:white}.score-pill.good{background:#16a34a}.score-pill.mid{background:#d97706}.score-pill.low{background:#dc2626}@media(max-width:900px){.progress-two-col{grid-template-columns:1fr}.hard-char-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.hard-char-grid{grid-template-columns:1fr 1fr}.writing-stats{grid-template-columns:1fr 1fr}.writing-stats .stat:last-child{grid-column:1/-1}}
/* Stage 6 - Strokes & Radicals */
.foundation-tabs{display:flex;gap:10px;margin:18px 0}.foundation-tab{border:1px solid #f1b2b2;background:#fff;color:#7c3030;padding:12px 18px;border-radius:14px;font-weight:800;cursor:pointer}.foundation-tab.active{background:#e53935;color:#fff;border-color:#e53935}.foundation-tab span{opacity:.75;margin-left:5px}.foundation-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}.foundation-toolbar>div:first-child{display:flex;flex-direction:column;gap:4px}.stroke-filters{display:flex;gap:8px;flex-wrap:wrap}.stroke-filters .active{background:#e53935;color:#fff}.foundation-progress{display:flex;align-items:center;gap:12px;margin:12px 2px 18px}.mini-progress{height:9px;background:#f5dddd;border-radius:999px;overflow:hidden;flex:1}.mini-progress i{display:block;width:0;height:100%;background:#e53935;transition:.25s}.stroke-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}.stroke-card,.radical-card{position:relative;background:#fff;border:1px solid #eee;border-radius:16px;padding:16px;box-shadow:0 4px 14px rgba(0,0,0,.04)}.stroke-card.is-learned,.radical-card.is-learned{border-color:#6ebf7c;background:#f7fff8}.learn-check{position:absolute;right:10px;top:10px;width:29px;height:29px;border-radius:50%;border:1px solid #ddd;background:#fff;color:#aaa;cursor:pointer;font-weight:900}.is-learned>.learn-check{background:#2e9e54;color:#fff;border-color:#2e9e54}.stroke-glyph{font-family:"Microsoft YaHei","SimSun",sans-serif;font-size:72px;line-height:1;text-align:center;color:#c62828;margin:6px 0 9px}.stroke-cn{text-align:center;font-weight:900;font-size:18px}.stroke-pinyin{text-align:center;color:#a44;margin:3px 0}.stroke-vi{text-align:center;font-weight:700;margin-bottom:8px}.stroke-card small{display:block;min-height:36px;color:#666}.stroke-card .practice-stroke{width:100%;margin-top:10px}.radical-toolbar input{width:min(360px,100%);padding:11px 13px;border:1px solid #ddd;border-radius:12px}.radical-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}.radical-card{display:flex;align-items:center;gap:14px}.radical-glyph{font-family:"Microsoft YaHei","SimSun",sans-serif;font-size:48px;color:#c62828;min-width:66px;text-align:center}.radical-card p{margin:3px 0 5px}.radical-card small{color:#777}.stroke-practice-modal{position:fixed;inset:0;background:rgba(0,0,0,.44);z-index:1000;display:grid;place-items:center;padding:18px}.stroke-practice-modal[hidden]{display:none}.stroke-practice-dialog{width:min(610px,96vw);position:relative}.modal-close{position:absolute;right:14px;top:12px;border:0;background:transparent;font-size:32px;cursor:pointer}.stroke-practice-info{display:flex;align-items:center;gap:20px;padding-right:40px}.practice-glyph{font-size:64px;color:#c62828}.stroke-practice-board{width:min(420px,90vw);aspect-ratio:1;margin:14px auto;border:2px solid #e7aaaa;border-radius:12px;background-image:linear-gradient(to right,transparent 49.8%,#efc5c5 50%,transparent 50.2%),linear-gradient(to bottom,transparent 49.8%,#efc5c5 50%,transparent 50.2%),linear-gradient(45deg,transparent 49.8%,#f4dada 50%,transparent 50.2%),linear-gradient(-45deg,transparent 49.8%,#f4dada 50%,transparent 50.2%)}#strokePracticeCanvas{width:100%;height:100%;display:block;touch-action:none}.stroke-practice-dialog .actions{justify-content:center;flex-wrap:wrap}@media(max-width:700px){.foundation-toolbar{align-items:stretch;flex-direction:column}.stroke-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.radical-grid{grid-template-columns:1fr}.stroke-glyph{font-size:58px}}

/* Stage 6.1 - stroke/radical pronunciation */
.foundation-card-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.foundation-card-actions .smallbtn{flex:1;min-width:92px}
.radical-info .radical-speak{margin-top:9px}
.speak-foundation{white-space:nowrap}
.speak-foundation:active{transform:scale(.97)}

/* Stage 6.2 */
.example-hanzi-link{font-weight:800;text-decoration:none;color:#c62828;padding:1px 3px;border-radius:5px}
.example-hanzi-link:hover{background:#fff1f1;text-decoration:underline}
.quick-char-practice{display:grid;grid-template-columns:220px minmax(0,1fr);gap:28px;align-items:start}
.quick-char-left{display:flex;flex-direction:column;gap:12px;align-items:stretch}
.quick-char-model{font-size:110px;line-height:1.15;text-align:center;color:#c62828;font-weight:500}
.quick-char-board-wrap{max-width:560px}
#quickCharCanvas{display:block;max-width:100%;touch-action:none;border-radius:12px;background:#fff}
.ghost-switch{display:flex;gap:8px;align-items:center;font-weight:700}
@media(max-width:760px){.quick-char-practice{grid-template-columns:1fr}.quick-char-left{max-width:520px}.quick-char-model{font-size:90px}}

/* Stage 6.3 Offline Hanzi */
.offline-setup-card{max-width:920px}.offline-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
.offline-summary>div{padding:16px;border:1px solid #eee;border-radius:12px;text-align:center}.offline-summary b{display:block;font-size:30px;color:#c62828}.offline-summary span{font-size:13px;color:#666}
.offline-progress{height:12px;background:#f1f1f1;border-radius:99px;overflow:hidden;margin:14px 0}.offline-progress i{display:block;width:0;height:100%;background:#e53935;transition:width .2s}
.offline-status{font-weight:700;margin:16px 0}.offline-log{max-height:360px;overflow:auto;border:1px solid #eee;border-radius:10px;background:#fafafa;padding:8px}
.offline-log-row{padding:5px 8px;border-bottom:1px dashed #ddd}.offline-log-row.ok{color:#2e7d32}.offline-log-row.bad{color:#c62828}.admin-offline-shortcut{margin:18px 0}
@media(max-width:640px){.offline-summary{grid-template-columns:1fr}}

/* Stage 6.3.2 - Hanzi fallback + explicit scoring */
.hanzi-offline-inline{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:8px 0 10px}
.hanzi-offline-inline .smallbtn{text-decoration:none}
.score-char-btn,.score-word-btn{font-weight:800}
.score-char-btn{background:#fff1f1;border-color:#e53935;color:#c62828}
.score-word-btn{background:#e53935!important;border-color:#e53935!important;color:#fff!important}
.stroke-panel-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:520px){.stroke-panel-actions{grid-template-columns:1fr}}

/* Stage 7 - Learner Progress Dashboard */
.progress-pagehead{align-items:flex-start}.danger-outline{color:#d32f2f!important;border-color:#ef9a9a!important}
.progress-overview-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:18px 0}
.progress-overview-card{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:17px;display:grid;grid-template-columns:auto 1fr;gap:12px;box-shadow:0 5px 18px rgba(0,0,0,.035)}
.progress-overview-card .p-icon{width:42px;height:42px;border-radius:12px;background:#fff1f1;display:grid;place-items:center;font-size:22px}
.progress-overview-card span{display:block;font-size:13px;color:#667085}.progress-overview-card b{display:block;font-size:25px;color:#d32f2f;margin:1px 0}.progress-overview-card small{color:#667085}
.mini-meter{grid-column:1/-1;height:7px;border-radius:99px;background:#f0f1f3;overflow:hidden}.mini-meter i{display:block;width:0;height:100%;background:#ef4444;border-radius:99px;transition:width .3s}
.progress-summary-strip{display:grid;grid-template-columns:repeat(6,1fr);gap:0;padding:0;overflow:hidden;margin-bottom:18px}
.progress-summary-strip>div{text-align:center;padding:17px 10px;border-right:1px solid #eee}.progress-summary-strip>div:last-child{border-right:0}.progress-summary-strip b{display:block;font-size:23px;color:#e53935}.progress-summary-strip span{font-size:12px;color:#667085}
.progress-dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.progress-module-card{min-width:0}.module-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:16px}.module-head>div{display:flex;align-items:center;gap:8px}.module-head h2{margin:0;font-size:20px}.module-head a{font-size:13px;text-decoration:none;color:#d32f2f;font-weight:700}.module-icon{font-size:22px}
.vocab-detail-grid,.writing-dashboard-stats,.reading-dashboard-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.vocab-detail-grid>div,.writing-dashboard-stats>div,.reading-dashboard-summary>div{background:#fafafa;border:1px solid #eee;border-radius:10px;padding:11px;text-align:center}.vocab-detail-grid span,.writing-dashboard-stats span,.reading-dashboard-summary span{display:block;font-size:12px;color:#667085}.vocab-detail-grid b,.writing-dashboard-stats b,.reading-dashboard-summary b{font-size:20px;color:#d32f2f}
.reading-progress-list{display:flex;flex-direction:column;gap:10px;margin-top:14px;max-height:360px;overflow:auto}.reading-progress-row{text-decoration:none;color:inherit;border:1px solid #eee;border-radius:11px;padding:11px;background:#fff}.reading-progress-title{display:flex;justify-content:space-between;gap:12px;margin-bottom:7px}.reading-progress-title span,.reading-progress-row small{font-size:12px;color:#667085}
.progressbar.slim{height:7px}.foundation-dashboard{display:flex;flex-direction:column;gap:18px}.foundation-row>div:first-child{display:flex;justify-content:space-between;margin-bottom:7px}.foundation-row span{color:#667085;font-size:13px}
.subsection-heading{margin-top:20px}.progress-wide-card{margin-top:18px}.recent-activity-list{display:flex;flex-direction:column}.recent-activity-row{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;padding:10px 4px;border-bottom:1px solid #eee;text-decoration:none;color:inherit}.recent-activity-row:last-child{border-bottom:0}.activity-icon{font-size:22px}.activity-main b,.activity-main small{display:block}.activity-main small,.activity-time{color:#667085;font-size:12px}
.local-data-note{margin-top:18px}
@media(max-width:1000px){.progress-overview-grid{grid-template-columns:repeat(2,1fr)}.progress-summary-strip{grid-template-columns:repeat(3,1fr)}.progress-summary-strip>div:nth-child(3){border-right:0}}
@media(max-width:760px){.progress-dashboard-grid{grid-template-columns:1fr}.progress-summary-strip{grid-template-columns:repeat(2,1fr)}.progress-overview-grid{grid-template-columns:1fr}.vocab-detail-grid,.writing-dashboard-stats,.reading-dashboard-summary{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:480px){.progress-summary-strip{grid-template-columns:1fr 1fr}.vocab-detail-grid,.writing-dashboard-stats,.reading-dashboard-summary{grid-template-columns:1fr}.recent-activity-row{grid-template-columns:34px 1fr}.activity-time{display:none}}

/* Stage 8 - Smart Review */
.smart-review-head{align-items:flex-start}.smart-review-actions{display:flex;gap:9px;flex-wrap:wrap}.smart-review-summary{display:grid;grid-template-columns:repeat(4,1fr);padding:0;overflow:hidden;margin-bottom:14px}.smart-review-summary>div{text-align:center;padding:18px 10px;border-right:1px solid #eee}.smart-review-summary>div:last-child{border-right:0}.smart-review-summary span,.smart-review-summary small{display:block;color:#667085;font-size:12px}.smart-review-summary b{font-size:27px;color:#e53935;display:block;margin:3px 0}.smart-review-progress{display:flex;align-items:center;gap:12px;margin:12px 0 18px}.smart-review-progress>div{height:10px;background:#eceff1;border-radius:99px;overflow:hidden;flex:1}.smart-review-progress i{display:block;height:100%;width:0;background:#e53935;transition:width .25s}.smart-review-progress span{font-size:13px;color:#667085;white-space:nowrap}.smart-review-tip{display:flex;gap:10px;align-items:center;margin-bottom:14px}.smart-review-tip span{color:#667085}.smart-review-list{display:flex;flex-direction:column;gap:12px}.smart-review-task{display:grid;grid-template-columns:42px 46px minmax(0,1fr) auto;gap:12px;align-items:center;padding:15px}.smart-review-task.done{opacity:.62;background:#fafafa}.smart-review-task.done h3{text-decoration:line-through}.review-check{width:34px;height:34px;border-radius:50%;border:2px solid #ef9a9a;background:#fff;color:#d32f2f;font-weight:900;font-size:18px;cursor:pointer}.smart-review-task.done .review-check{background:#2e7d32;color:#fff;border-color:#2e7d32}.review-task-icon{width:42px;height:42px;border-radius:12px;background:#fff1f1;display:grid;place-items:center;font-size:22px}.review-task-kicker{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#d32f2f;font-weight:800}.review-task-main h3{margin:3px 0 2px;font-size:22px}.review-task-main p{margin:0;color:#667085}.review-task-side{display:flex;align-items:center;gap:10px}.review-priority{font-size:11px;padding:5px 8px;border-radius:99px;background:#f3f4f6;color:#667085;font-weight:800}.review-priority.high{background:#ffebee;color:#c62828}.review-priority.medium{background:#fff8e1;color:#8d6e00}.small-review-btn{padding:9px 12px!important;white-space:nowrap}.review-empty-source{margin-top:16px}
@media(max-width:800px){.smart-review-summary{grid-template-columns:repeat(2,1fr)}.smart-review-task{grid-template-columns:38px 42px 1fr}.review-task-side{grid-column:2/-1;justify-content:space-between}.smart-review-tip{align-items:flex-start}}
@media(max-width:480px){.smart-review-summary{grid-template-columns:1fr 1fr}.smart-review-task{grid-template-columns:36px 1fr}.review-task-icon{display:none}.review-task-side{grid-column:2;flex-wrap:wrap}}

.progress-head-actions{display:flex;gap:9px;flex-wrap:wrap}

/* Stage 9 - Daily Goal & Streak */
.daily-goal-head{align-items:flex-start}.daily-goal-page{display:flex;flex-direction:column;gap:18px}
.daily-goal-hero{display:grid;grid-template-columns:230px 1fr;gap:30px;align-items:center;padding:28px}
.goal-ring-wrap{text-align:center}.goal-ring{width:180px;height:180px;border-radius:50%;margin:auto;display:grid;place-items:center;background:conic-gradient(#ef4444 0deg,#f1f1f1 0deg);position:relative}
.goal-ring:before{content:"";position:absolute;inset:16px;border-radius:50%;background:white}
.goal-ring>div{position:relative;z-index:1}.goal-ring b{font-size:44px;color:#e53935}.goal-ring span{font-size:20px;color:#667085}.goal-ring-caption{margin-top:10px;color:#667085;font-weight:700}
.goal-main-info{display:flex;flex-direction:column;gap:16px}.goal-streak-line{display:flex;align-items:center;gap:12px}.goal-fire{font-size:42px}.goal-streak-line b{display:block;font-size:28px}.goal-streak-line span{display:block;color:#667085}
.goal-setting-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.goal-setting-row label{font-weight:700}.goal-setting-row select{min-width:150px}.goal-progress-text{font-weight:700}.goal-actions{display:flex;gap:10px;flex-wrap:wrap}
.goal-week-card{padding:22px}.goal-week-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}.goal-day{border:1px solid #e5e7eb;border-radius:12px;padding:12px 8px;text-align:center;background:#fafafa}.goal-day span,.goal-day small{display:block;color:#667085;font-size:12px}.goal-day b{display:block;font-size:21px;margin:3px 0}.goal-day em{font-style:normal;font-weight:800;color:#d32f2f}.goal-day.is-goal{background:#fff1f1;border-color:#ef9a9a}.goal-day.is-today{box-shadow:inset 0 0 0 2px #e53935}
.goal-two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px}.goal-breakdown{display:flex;flex-direction:column}.breakdown-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #eee}.breakdown-row:last-child{border-bottom:0}.breakdown-row b{color:#e53935}
.achievement-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.achievement-grid>div{border:1px solid #eee;background:#fafafa;border-radius:12px;text-align:center;padding:16px}.achievement-grid b{display:block;font-size:28px;color:#e53935}.achievement-grid span{font-size:12px;color:#667085}
.progress-head-actions{display:flex;gap:10px;flex-wrap:wrap}
@media(max-width:800px){.daily-goal-hero{grid-template-columns:1fr}.goal-two-col{grid-template-columns:1fr}.goal-week-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:480px){.goal-week-grid{grid-template-columns:repeat(2,1fr)}.achievement-grid{grid-template-columns:1fr 1fr}}

/* Stage 10 - Admin Security, Settings, Analytics and Ad Zones */
.site-ad-zone{max-width:1180px;margin:14px auto;text-align:center;overflow:hidden;min-height:0}.site-ad-zone:empty{display:none}
.admin-login-body{min-height:100vh;background:#f7f7f8;display:grid;place-items:center}.admin-login-shell{width:min(460px,calc(100% - 28px));margin:40px auto}.admin-login-card{background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:28px;box-shadow:0 16px 45px rgba(0,0,0,.08)}.admin-login-brand{display:inline-block;margin-bottom:18px}.admin-login-card h1{margin:0 0 8px}.admin-login-form{display:flex;flex-direction:column;gap:14px;margin:20px 0}.admin-login-form label{display:flex;flex-direction:column;gap:6px;font-weight:700}.admin-login-form input{width:100%}
.admin-topbar{background:#fff;border-bottom:1px solid #e5e7eb}.admin-nav{display:flex;justify-content:space-between;align-items:center;min-height:64px;gap:20px}.admin-nav>div{display:flex;gap:14px;align-items:center}.admin-nav a{text-decoration:none}.admin-nav a.active{font-weight:800;color:#d32f2f}
.admin-settings-page{padding-top:20px;padding-bottom:50px}.settings-form{display:flex;flex-direction:column;gap:18px}.settings-section{margin-bottom:18px}.settings-section h2{margin-top:0}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.settings-grid.three{grid-template-columns:repeat(3,1fr)}.settings-grid label,.ad-setting-grid label{display:flex;flex-direction:column;gap:7px;font-weight:700}.code-textarea{font-family:Consolas,"Courier New",monospace;font-size:13px;line-height:1.45;width:100%;resize:vertical}.settings-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.toggle-setting{display:flex;align-items:center;gap:8px;font-weight:800;white-space:nowrap}.ad-setting-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.ad-setting-grid header{font-size:12px;font-weight:400;color:#667085}.ad-note{margin-top:12px;padding:10px 12px;background:#fff8e1;border-radius:9px;font-size:13px}.settings-savebar{position:sticky;bottom:12px;display:flex;justify-content:flex-end;padding:10px;background:rgba(255,255,255,.92);backdrop-filter:blur(5px);border-radius:12px}.password-section{margin-top:10px}.admin-security-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:18px 0;padding:14px 16px;border:1px solid #e5e7eb;background:#fff;border-radius:13px}.admin-security-bar>div:first-child span{display:block;color:#667085;font-size:12px;margin-top:3px}.admin-security-bar>div:last-child{display:flex;gap:8px}
.alert.ok{background:#ecfdf3;color:#166534;border:1px solid #bbf7d0;padding:10px 12px;border-radius:9px}.alert.bad{background:#fff1f2;color:#b91c1c;border:1px solid #fecdd3;padding:10px 12px;border-radius:9px}
@media(max-width:760px){.settings-grid,.settings-grid.three,.ad-setting-grid{grid-template-columns:1fr}.settings-title-row,.admin-security-bar,.admin-nav{align-items:stretch;flex-direction:column}.admin-nav{padding:12px 0}.admin-nav>div{flex-wrap:wrap}.settings-savebar{position:static}}


/* Stage 10.1 - Vietnamese UI font normalization */
:root{
  --ui-font:"Segoe UI",Tahoma,Arial,sans-serif;
  --cjk-font:"Microsoft YaHei","Microsoft JhengHei","Noto Sans CJK SC","Noto Sans SC","SimSun",sans-serif;
  --hand-font:"KaiTi","STKaiti","Microsoft YaHei","SimSun",serif;
}
html,body{font-family:var(--ui-font);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
button,input,select,textarea,optgroup,option{font-family:var(--ui-font);font-synthesis:none}
.btn,.smallbtn,.badge,nav a,label,.stat,.card,.pagehead,.muted,.feedback,.alert,.admin-nav,.settings-section,.goal-day,.module-head{font-family:var(--ui-font)}
.badge{letter-spacing:.025em!important;word-spacing:.02em;line-height:1.25}
/* Vietnamese/Latin UI labels should never inherit a Chinese typeface. */
.stroke-cn,.stroke-pinyin,.stroke-vi,.radical-info,.word-info,.write-meaning,.writing-score-card,.foundation-toolbar,.reading-pagehead,.reading-audio-bar{font-family:var(--ui-font)}
/* CJK glyphs only. */
.hanzi-big,.hanzi,.hanzi-model,.hanzi-word-model,.counter-char,.board-ghost,.multi-char-label,.hard-char b,.attempt-hanzi,.quick-char-model{font-family:var(--hand-font)!important}
.stroke-glyph,.radical-glyph,.practice-glyph,.table-cn,.answer,.zh-karaoke,.article-chinese,.reading-chinese{font-family:var(--cjk-font)!important}
/* Avoid synthetic bold/spacing artifacts in Vietnamese uppercase labels. */
.badge,.foundation-tab,.workspace-label,.setting-title,.stroke-panel-title{text-transform:none;letter-spacing:.015em}

/* Stage 10.2 - Branding, Favicon, YouTube & Facebook */
.brand-with-logo{display:flex!important;align-items:center;gap:9px;min-width:max-content}
.site-logo{display:block;max-height:42px;max-width:170px;width:auto;height:auto;object-fit:contain}
.brand-hanzi{font-family:"Microsoft YaHei","SimSun","Noto Sans CJK SC",sans-serif;font-size:23px;font-weight:800;color:#e53935}
.brand-text{font-family:"Segoe UI",Tahoma,Arial,sans-serif;font-weight:800;color:#111}
.nav{gap:14px}.nav nav{flex:1}
.social-links{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.social-links a{font-family:"Segoe UI",Tahoma,Arial,sans-serif;text-decoration:none;font-size:12px;font-weight:800;border-radius:999px;padding:6px 10px;white-space:nowrap}
.social-youtube{background:#fff0f0;color:#d50000;border:1px solid #ffcaca}
.social-facebook{background:#eef4ff;color:#1769aa;border:1px solid #c9ddff}
.footer-content{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.footer-content>div:first-child b,.footer-content>div:first-child span{display:block}.footer-content>div:first-child span{margin-top:4px;color:#777;font-size:13px}
.branding-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px}
.branding-upload-box{border:1px solid #e5e7eb;border-radius:13px;padding:16px;background:#fafafa}
.branding-upload-box h3{margin:0 0 12px}.branding-upload-box input[type=file]{display:block;margin:10px 0;width:100%}
.branding-preview{display:flex;align-items:center;min-height:70px;padding:10px;background:white;border:1px solid #eee;border-radius:10px}.branding-preview img{max-height:60px;max-width:240px;object-fit:contain}
.favicon-preview{width:70px;height:70px;display:grid;place-items:center;background:#fff;border:1px solid #eee;border-radius:10px}.favicon-preview img{max-width:48px;max-height:48px}
.remove-check{display:flex!important;flex-direction:row!important;align-items:center;gap:7px!important;font-weight:600!important;margin:8px 0}
.social-link-settings{margin-top:6px}.social-display-options{display:flex;gap:18px;flex-wrap:wrap;margin-top:14px}.social-display-options label{display:flex;align-items:center;gap:7px;font-weight:700}
@media(max-width:1100px){.social-links-header{display:none}.site-logo{max-width:135px}.nav{flex-wrap:wrap}.nav nav{order:3;width:100%}}
@media(max-width:760px){.branding-settings-grid{grid-template-columns:1fr}.footer-content{align-items:flex-start;flex-direction:column}}

/* Stage 10.3 - Keep Admin out of learner navigation */
.footer-right-links{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.footer-admin-link{font-family:"Segoe UI",Tahoma,Arial,sans-serif;font-size:11px;color:#999;text-decoration:none;padding:3px 5px}
.footer-admin-link:hover{color:#555;text-decoration:underline}

/* Stage 10.4 - Admin search, filters and pagination */
.admin-list-card{scroll-margin-top:18px}
.admin-section-head{gap:18px;align-items:flex-end;flex-wrap:wrap}
.admin-search-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.admin-search-form input[type=search]{min-width:290px}
.admin-item-filter{display:grid;grid-template-columns:minmax(260px,2fr) minmax(210px,1fr) 150px auto;gap:12px;align-items:end;padding:14px;margin:4px 0 18px;background:#fafafa;border:1px solid #eee;border-radius:12px}
.filter-field{display:flex;flex-direction:column;gap:6px}.filter-field label{font-size:12px;font-weight:800;color:#555}.filter-field input,.filter-field select{width:100%}
.filter-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.admin-pagination{display:flex;justify-content:space-between;align-items:center;gap:14px;padding-top:16px;flex-wrap:wrap}
.admin-pagination>span{color:#667085;font-size:13px}.admin-pagination>div{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.admin-pagination a{font-family:"Segoe UI",Tahoma,Arial,sans-serif;min-width:34px;height:34px;padding:0 9px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #e2e4e8;border-radius:8px;text-decoration:none;color:#333;background:#fff;font-size:13px;font-weight:700}
.admin-pagination a:hover{border-color:#ef9a9a;color:#d32f2f}.admin-pagination a.active{background:#e53935;border-color:#e53935;color:#fff}
.page-dots{padding:0 3px;color:#777}.empty-table{text-align:center!important;padding:28px!important;color:#777}
@media(max-width:900px){.admin-item-filter{grid-template-columns:1fr 1fr}.filter-search{grid-column:1/-1}.filter-actions{grid-column:1/-1}.admin-search-form input[type=search]{min-width:220px}}
@media(max-width:600px){.admin-item-filter{grid-template-columns:1fr}.filter-search,.filter-actions{grid-column:auto}.admin-pagination{align-items:flex-start;flex-direction:column}.admin-search-form{width:100%}.admin-search-form input[type=search]{min-width:0;flex:1;width:100%}}

/* Stage 10.5 - Lesson list filtering & visible pagination */
.lesson-search-form{display:grid;grid-template-columns:minmax(260px,1fr) 150px auto;gap:10px;align-items:end;min-width:min(620px,100%)}
.lesson-filter-field{display:flex;flex-direction:column;gap:6px}
.lesson-filter-field label{font-size:12px;font-weight:800;color:#555}
.lesson-filter-field input,.lesson-filter-field select{width:100%}
.lesson-filter-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.lesson-pagination{margin-top:4px}
@media(max-width:800px){.lesson-search-form{grid-template-columns:1fr 150px}.lesson-filter-actions{grid-column:1/-1}}
@media(max-width:520px){.lesson-search-form{grid-template-columns:1fr}.lesson-filter-actions{grid-column:auto}}

/* Stage 10.6 - Full mobile optimization & tappable hamburger menu */
.mobile-menu-toggle{
  display:none; width:42px; height:42px; min-width:42px; padding:0;
  align-items:center; justify-content:center; border:1px solid #e5e7eb;
  border-radius:10px; background:#fff; color:#222; font-size:22px; line-height:1;
  cursor:pointer; font-family:"Segoe UI",Tahoma,Arial,sans-serif;
}
.mobile-menu-toggle:active{transform:scale(.96)}
.mobile-nav-shell{position:relative}

@media(max-width:900px){
  html,body{max-width:100%;overflow-x:hidden}
  .container{width:min(100% - 24px,1180px)}
  .topbar .nav,.admin-nav{min-height:64px;display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;padding:9px 0}
  .brand-with-logo,.topbar .brand,.admin-nav .brand{min-width:0;max-width:calc(100% - 58px)}
  .brand-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .site-logo{max-height:38px;max-width:150px}
  .mobile-menu-toggle{display:inline-flex;position:relative;z-index:1002}
  .mobile-menu-panel,.topbar .nav>nav,.admin-mobile-menu{
    display:none!important; position:absolute!important; z-index:1001; top:calc(100% + 4px); left:0; right:0;
    background:#fff; border:1px solid #e5e7eb; border-radius:14px; padding:8px;
    box-shadow:0 14px 38px rgba(0,0,0,.14); max-height:calc(100vh - 90px); overflow:auto;
  }
  .mobile-menu-open .mobile-menu-panel,.mobile-menu-open>nav,.mobile-menu-open .admin-mobile-menu{display:flex!important;flex-direction:column!important;gap:3px!important}
  .mobile-menu-panel a,.topbar .nav>nav a,.admin-mobile-menu a{
    display:flex!important;align-items:center;width:100%;min-height:44px;padding:10px 12px!important;
    border-radius:9px;text-decoration:none!important;font-size:15px!important;white-space:normal!important;
  }
  .mobile-menu-panel a:hover,.admin-mobile-menu a:hover{background:#fff2f2}
  .social-links-header{display:none!important}

  /* General page layout */
  main.container{padding-top:14px}
  .pagehead{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:12px!important}
  .pagehead>.btn,.pagehead>div:last-child{align-self:flex-start}
  h1{font-size:clamp(24px,7vw,32px)}
  h2{font-size:clamp(20px,5vw,26px)}
  .card{border-radius:13px;padding:16px}
  .admin-grid,.progress-dashboard-grid,.goal-two-col,.quick-char-practice,.writing-layout,.reading-layout{grid-template-columns:1fr!important}
  .actions,.actions-cell{flex-wrap:wrap!important}
  button,.btn,.smallbtn,input,select,textarea{font-size:16px}
  input,select,textarea{max-width:100%}
  .btn,.smallbtn,button{min-height:40px}

  /* Tables remain usable via touch scrolling */
  .table-wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch;margin-left:-4px;margin-right:-4px;padding-bottom:4px}
  .table-wrap table{min-width:720px}
  .table-wrap th,.table-wrap td{white-space:normal;vertical-align:top}
  .actions-cell{min-width:145px}

  /* Admin search/filter controls */
  .admin-security-bar{flex-direction:column!important;align-items:stretch!important}
  .admin-security-bar>div:last-child{width:100%;display:flex;flex-wrap:wrap}
  .admin-security-bar .btn{flex:1}
  .admin-item-filter,.lesson-search-form,.settings-grid,.settings-grid.three,.ad-setting-grid,.branding-settings-grid{grid-template-columns:1fr!important;min-width:0!important;width:100%!important}
  .lesson-filter-actions,.filter-actions{grid-column:auto!important;width:100%}
  .lesson-filter-actions .btn,.filter-actions .btn{flex:1}
  .admin-section-head{align-items:stretch!important}
  .admin-search-form{width:100%!important}
  .admin-search-form input[type=search]{width:100%!important;min-width:0!important}
  .admin-pagination{flex-direction:column!important;align-items:flex-start!important}
  .admin-pagination>div{max-width:100%;overflow-x:auto;padding-bottom:3px}
  .settings-title-row{flex-direction:column!important}
  .settings-savebar{position:static!important}

  /* Learning pages */
  .progress-overview-grid{grid-template-columns:1fr!important}
  .progress-summary-strip{grid-template-columns:repeat(2,1fr)!important}
  .daily-goal-hero{grid-template-columns:1fr!important;padding:18px!important}
  .goal-week-grid{grid-template-columns:repeat(4,1fr)!important}
  .review-grid{grid-template-columns:1fr!important}
  .foundation-grid,.stroke-grid,.radical-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .reading-controls,.reading-toolbar{flex-wrap:wrap!important}
  .writing-canvas,.stroke-canvas,#writeCanvas,#quickCharCanvas{max-width:100%!important;height:auto!important}
  .footer-content{align-items:flex-start!important;flex-direction:column!important}
}

@media(max-width:520px){
  .container{width:min(100% - 16px,1180px)}
  .card{padding:13px}
  .site-logo{max-width:125px}
  .brand-text{font-size:14px}
  .goal-week-grid{grid-template-columns:repeat(2,1fr)!important}
  .foundation-grid,.stroke-grid,.radical-grid{grid-template-columns:1fr!important}
  .progress-summary-strip{grid-template-columns:1fr 1fr!important}
  .vocab-detail-grid,.writing-dashboard-stats,.reading-dashboard-summary,.achievement-grid{grid-template-columns:1fr!important}
  .admin-pagination a{min-width:38px;height:38px}
  .actions .btn,.actions button{flex:1 1 auto}
}

/* Stage 10.8 - Mobile hamburger reliability fix */
@media (max-width:900px){
  .mobile-nav-shell > .mobile-menu-toggle{
    display:inline-flex!important;
    visibility:visible!important;
    pointer-events:auto!important;
    position:relative!important;
    z-index:10020!important;
  }
  .mobile-nav-shell > [data-mobile-menu]{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }
  .mobile-nav-shell.mobile-menu-open > [data-mobile-menu]{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
    flex-direction:column!important;
  }
}

/* Stage 11 Production */
.legal-links{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}.legal-links a{font-size:12px;color:#777;text-decoration:none}.legal-links a:hover{text-decoration:underline}
.legal-page{max-width:900px}.legal-page h2{margin-top:26px}.error-page{text-align:center;max-width:700px;margin:50px auto}.error-code{font-size:90px;font-weight:900;color:#e53935;line-height:1}
.health-table{width:100%;border-collapse:collapse}.health-table th,.health-table td{padding:12px;border-bottom:1px solid #eee;text-align:left}.health-ok{color:#15803d}.health-bad{color:#b91c1c}
.installer-page{max-width:900px;padding-top:30px;padding-bottom:50px}.installer-form h2{margin-top:24px}.installer-form h2:first-child{margin-top:0}

.production-admin-notice{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:16px 0;padding:10px 13px;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:10px;font-size:13px}.production-admin-notice span{font-weight:800;color:#166534}.production-admin-notice a{font-weight:700;color:#166534}
@media(max-width:600px){.health-table{min-width:620px}.installer-form .settings-grid{grid-template-columns:1fr!important}}

/* Stage 11.2 - Learning Tools */
.tools-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:20px 0}.tool-card{display:flex;gap:18px;align-items:flex-start}.tool-icon{font-size:38px;line-height:1}.tool-content h2{margin:0 0 8px}.tool-content p{color:#5f6368;line-height:1.65;min-height:48px}.tools-note{margin:18px 0;line-height:1.6;background:#fffaf0}.tool-admin-item{margin-top:16px}.tool-admin-form textarea,.tool-admin-item textarea{width:100%;box-sizing:border-box}
@media(max-width:720px){.tools-grid{grid-template-columns:1fr}.tool-card{gap:12px}.tool-icon{font-size:32px}}

/* Stage 11.3 SEO Manager */
.seo-manager>label{display:block;margin-top:14px}.seo-manager textarea{width:100%;box-sizing:border-box}.seo-hint{font-size:12px;color:#777;font-weight:400}.seo-status-links{display:flex;gap:14px;margin-top:12px}.seo-status-links a{font-weight:700}.seo-pages-details{margin-top:20px;border-top:1px solid #eee;padding-top:16px}.seo-pages-details summary{cursor:pointer;font-weight:800}.seo-pages-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:16px}.seo-page-row{border:1px solid #eee;border-radius:12px;padding:14px}.seo-page-row h3{margin:0 0 10px}.seo-page-row label{display:block;margin-top:8px}.seo-page-row input,.seo-page-row textarea{width:100%;box-sizing:border-box}.seo-og-preview{margin-top:8px}.seo-og-preview img{max-width:260px;max-height:140px;border:1px solid #ddd;border-radius:10px;display:block;margin-bottom:6px}
@media(max-width:760px){.seo-pages-grid{grid-template-columns:1fr}}

/* Stage 12.1 Grammar */
.grammar-filter{display:grid;grid-template-columns:2fr 1fr auto;gap:10px;margin:18px 0}.grammar-category-chips{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 20px}.grammar-category-chips a{padding:7px 12px;border:1px solid #ddd;border-radius:999px;text-decoration:none}.grammar-category-chips a.active{background:#e53935;color:#fff}.grammar-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.grammar-card{text-decoration:none;color:inherit}.grammar-cat{display:inline-block;background:#fff1f1;color:#c62828;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:800}.grammar-pattern{font-family:"Microsoft YaHei",sans-serif;background:#f7f7f7;padding:7px 9px;border-radius:8px;margin-top:10px}.grammar-detail{max-width:900px;margin:auto}.grammar-breadcrumb{margin:18px 0;color:#777}.grammar-structure-box{background:#fff3f3;border-left:5px solid #e53935;padding:18px;border-radius:12px;margin:18px 0}.grammar-structure-box div{font-size:25px;font-weight:800;margin-top:6px}.grammar-content{line-height:1.75}.grammar-content img{max-width:100%;height:auto}.grammar-example{margin:10px 0}.grammar-example-cn{font-size:23px;font-weight:700}.grammar-example-py{color:#c62828}.grammar-speak-btn{border:0;background:#fff1f1;border-radius:50%;width:38px;height:38px}.grammar-admin-grid{grid-template-columns:.8fr 1.5fr}.grammar-admin-category-list>div{display:flex;justify-content:space-between;border-top:1px solid #eee;padding:10px 0}.grammar-admin-category-list small{display:block}.grammar-article-form>label{display:block;margin-top:12px}.grammar-article-form input,.grammar-article-form textarea,.grammar-article-form select{width:100%;box-sizing:border-box}.grammar-html-editor{font-family:Consolas,monospace}.grammar-admin-list{margin-top:18px}@media(max-width:900px){.grammar-card-grid{grid-template-columns:repeat(2,1fr)}.grammar-admin-grid{grid-template-columns:1fr}}@media(max-width:600px){.grammar-card-grid,.grammar-filter{grid-template-columns:1fr}}

/* Stage 12.2 - Dynamic hierarchical navigation */
.topbar nav{display:flex;align-items:center;gap:4px}.nav-dropdown{position:relative}.nav-dropdown-toggle{display:flex!important;align-items:center;gap:5px}.nav-caret{font-size:10px;opacity:.65}.nav-dropdown-menu{display:none;position:absolute;top:100%;left:0;min-width:220px;padding:7px;background:#fff;border:1px solid #e5e7eb;border-radius:11px;box-shadow:0 12px 30px rgba(0,0,0,.12);z-index:1100}.nav-dropdown:hover>.nav-dropdown-menu,.nav-dropdown.dropdown-open>.nav-dropdown-menu{display:flex;flex-direction:column}.nav-dropdown-menu>a,.nav-dropdown-menu>.nav-dropdown>.nav-dropdown-toggle{padding:9px 11px!important;border-radius:8px;white-space:nowrap}.nav-dropdown-menu>a:hover,.nav-dropdown-menu>.nav-dropdown>.nav-dropdown-toggle:hover{background:#fff1f1}.nav-dropdown-menu .nav-dropdown-menu{top:0;left:100%;margin-left:5px}
.menu-admin-grid{grid-template-columns:minmax(320px,.8fr) minmax(420px,1.2fr)}.menu-tree-row{display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid #eee;padding:10px 4px}.menu-tree-row small{display:block;color:#777;margin-top:3px}.menu-tree-row.depth-1{padding-left:20px}.menu-tree-row.depth-2{padding-left:40px}.menu-tree-row.depth-3{padding-left:60px}.menu-tree-row .actions{display:flex;gap:6px}.mock-coming{text-align:center;max-width:760px;margin:25px auto;padding:36px}.mock-icon{font-size:60px}
@media(max-width:900px){.topbar nav{align-items:stretch}.mobile-menu-panel .nav-dropdown{width:100%}.mobile-menu-panel .nav-dropdown-toggle{width:100%;justify-content:space-between}.mobile-menu-panel .nav-dropdown-menu{position:static!important;box-shadow:none;border:0;border-left:2px solid #f0b0b0;border-radius:0;margin:2px 0 4px 12px;padding:2px 0 2px 8px;min-width:0}.mobile-menu-panel .nav-dropdown:hover>.nav-dropdown-menu{display:none}.mobile-menu-panel .nav-dropdown.dropdown-open>.nav-dropdown-menu{display:flex}.mobile-menu-panel .nav-dropdown-menu .nav-dropdown-menu{margin-left:10px}.menu-admin-grid{grid-template-columns:1fr}}

/* Stage 13 - Mock Test Core */
.mock-filter{display:grid;grid-template-columns:2fr 1fr auto;gap:10px;margin:18px 0}.mock-level-chips{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 20px}.mock-level-chips a{padding:7px 12px;border:1px solid #e4e7ec;border-radius:999px;text-decoration:none;color:#444;background:#fff}.mock-level-chips a.active{background:#e53935;color:#fff;border-color:#e53935}.mock-test-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.mock-test-card h2{font-size:20px;margin:13px 0 8px}.mock-test-card p{color:#667085;line-height:1.55}.mock-test-top,.mock-test-meta{display:flex;gap:10px;justify-content:space-between;align-items:center;flex-wrap:wrap;font-size:13px}.mock-level{display:inline-flex;padding:5px 9px;background:#fff1f1;color:#c62828;border-radius:999px;font-size:12px;font-weight:800}.mock-test-meta{justify-content:flex-start;margin:15px 0;color:#667085}
.mock-exam{max-width:1180px;margin:auto}.mock-exam-header{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:18px 0}.mock-exam-header h1{margin:8px 0}.mock-timer-box{min-width:160px;text-align:center;padding:14px;border-radius:14px;background:#fff3f3}.mock-timer-box small{display:block;color:#8b3a3a;font-weight:800}.mock-timer-box b{display:block;font-size:31px;color:#d32f2f;margin-top:5px}.mock-start-panel{text-align:center;padding:34px}.mock-start-stats{display:flex;justify-content:center;gap:35px;flex-wrap:wrap;margin:24px 0}.mock-start-stats span{display:flex;flex-direction:column}.mock-start-stats b{font-size:28px;color:#d32f2f}.mock-big-btn{font-size:18px;padding:13px 24px}.mock-exam-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:18px;align-items:start}.mock-section-title{margin:24px 0 12px}.mock-section-title>span{font-weight:800;color:#c62828}.mock-section-title h2{margin:3px 0}.mock-question{scroll-margin-top:16px;margin-bottom:14px}.mock-question-number{display:flex;justify-content:space-between;color:#667085;font-size:13px;font-weight:800}.mock-question-cn{font-family:"Microsoft YaHei","SimSun",sans-serif;font-size:23px;font-weight:700;margin:14px 0 4px}.mock-question-pinyin{color:#c62828;margin-bottom:8px}.mock-question-text{font-size:17px;font-weight:700;line-height:1.6;margin:10px 0}.mock-options{display:flex;flex-direction:column;gap:8px;margin-top:12px}.mock-option{display:flex;align-items:flex-start;gap:10px;border:1px solid #e5e7eb;border-radius:11px;padding:11px 12px;cursor:pointer}.mock-option:hover{background:#fafafa}.mock-option input{margin-top:4px}.mock-option-key{display:grid;place-items:center;min-width:26px;height:26px;border-radius:50%;background:#f3f4f6;font-weight:800}.mock-option.correct-option{background:#ecfdf3;border-color:#86efac}.mock-option.wrong-option{background:#fff1f2;border-color:#fda4af}.mock-answer-review{margin-top:12px;padding:12px;background:#f8fafc;border-radius:9px}.mock-answer-review p{margin:5px 0 0;color:#475467}.mock-q-speak{border:0;background:#fff1f1;width:36px;height:36px;border-radius:50%;cursor:pointer}.mock-exam-sidebar{position:sticky;top:14px}.mock-sidebar-progress{text-align:center;margin-bottom:13px}.mock-question-nav{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.mock-question-nav a{display:grid;place-items:center;height:34px;border:1px solid #ddd;border-radius:7px;text-decoration:none;color:#444;background:#fff}.mock-question-nav a.answered{background:#e53935;border-color:#e53935;color:#fff}.mock-submit-btn{width:100%;margin-top:15px}.mock-result-panel{display:flex;gap:28px;align-items:center;max-width:800px;margin:28px auto;padding:28px}.mock-score-ring{width:150px;height:150px;min-width:150px;border-radius:50%;display:grid;place-items:center;align-content:center;background:#fff1f1;border:10px solid #ffcdd2}.mock-score-ring b{font-size:35px;color:#d32f2f}.mock-score-ring span{color:#777}.mock-result-info{flex:1}.mock-result-stats{display:flex;gap:25px;margin:18px 0}.mock-result-stats span{display:flex;flex-direction:column}.mock-result-stats b{font-size:25px}.mock-admin-sections>div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid #eee}.mock-admin-sections small{display:block;color:#777}.mock-option-editor{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}.mock-option-editor label{display:flex;align-items:center;gap:8px}.mock-option-editor label>span{width:28px;height:28px;display:grid;place-items:center;background:#f1f1f1;border-radius:50%;font-weight:800}.mock-option-editor input{flex:1}
@media(max-width:900px){.mock-test-grid{grid-template-columns:repeat(2,1fr)}.mock-exam-layout{grid-template-columns:1fr}.mock-exam-sidebar{position:static;order:-1}.mock-question-nav{grid-template-columns:repeat(8,1fr)}}
@media(max-width:600px){.mock-filter,.mock-test-grid{grid-template-columns:1fr}.mock-exam-header,.mock-result-panel{flex-direction:column;align-items:stretch}.mock-timer-box{width:auto}.mock-question-nav{grid-template-columns:repeat(5,1fr)}.mock-option-editor{grid-template-columns:1fr}.mock-result-stats{justify-content:space-between;gap:10px}}

/* Stage 13.2 - Admin Password Recovery */
.forgot-password-link{display:inline-block;text-align:center;margin-top:2px;font-size:13px;color:#c62828;text-decoration:none;font-weight:700}
.forgot-password-link:hover{text-decoration:underline}
.reset-instructions{background:#fff8e1;border:1px solid #f3d38a;border-radius:12px;padding:13px 15px;margin:16px 0;line-height:1.55}
.reset-instructions code{display:block;padding:10px 12px;background:#fff;border:1px solid #eadcae;border-radius:8px;font-weight:800;word-break:break-all}

/* Stage 13.3 - Advanced Mock Test */
.mock-passage{margin:12px 0 18px;background:#fffdf7;border-left:4px solid #f59e0b}.mock-passage-cn{font-family:"Microsoft YaHei","SimSun",sans-serif;font-size:22px;line-height:1.75}.mock-passage-pinyin{color:#b45309;line-height:1.65;margin-top:8px}.mock-passage-text{line-height:1.7;margin-top:10px}.mock-media-image{display:block;max-width:100%;max-height:500px;object-fit:contain;margin:14px auto;border-radius:12px}.question-media{max-height:360px}.mock-audio{width:min(100%,520px);display:block;margin:12px 0}.mock-fill-wrap{margin-top:14px}.mock-fill-input{width:min(100%,520px);padding:12px 14px;border:1px solid #d0d5dd;border-radius:10px;font-size:17px}.mock-fill-input.fill-correct{background:#ecfdf3;border-color:#22c55e}.mock-fill-input.fill-wrong{background:#fff1f2;border-color:#ef4444}.mock-media-admin{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:10px 0}.mock-media-admin img{max-width:240px;max-height:150px;object-fit:contain;border:1px solid #ddd;border-radius:9px}

/* Stage 13.5 - Mock Test Session & History */
.mock-flag-btn{border:1px solid #e4e7ec;background:#fff;color:#667085;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:700;cursor:pointer}.mock-flag-btn.active{background:#fff7d6;border-color:#fbbf24;color:#92400e}.mock-flag-btn:disabled{opacity:.6;cursor:default}.mock-question-nav a.flagged{box-shadow:inset 0 0 0 2px #f59e0b}.mock-question-nav a.answered.flagged{background:#d97706;border-color:#d97706}.mock-resume-box{max-width:680px;margin:0 auto 22px;text-align:left;background:#fff7ed;border:1px solid #fdba74;border-radius:13px;padding:15px}.mock-resume-box b{color:#9a3412}.mock-resume-box p{margin:6px 0 12px;color:#7c2d12}
.mock-history-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0}.mock-history-stat{text-align:center;padding:20px}.mock-history-stat b{display:block;font-size:31px;color:#d32f2f}.mock-history-stat span{color:#667085;font-size:13px}.mock-history-controls{margin-bottom:16px}.mock-history-controls .actions{margin-top:12px}.mock-history-list{display:flex;flex-direction:column}.mock-history-row{display:grid;grid-template-columns:70px minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 4px;border-bottom:1px solid #eee}.mock-history-row:last-child{border-bottom:0}.mock-history-score{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;font-size:18px;font-weight:900}.mock-history-score.pass{background:#ecfdf3;color:#15803d}.mock-history-score.fail{background:#fff1f2;color:#be123c}.mock-history-title{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.mock-history-title span{font-size:11px;font-weight:800;background:#fff1f1;color:#c62828;padding:4px 7px;border-radius:999px}.mock-history-meta{display:flex;gap:11px;flex-wrap:wrap;color:#667085;font-size:12px;margin-top:6px}.mock-history-status{font-size:12px;font-weight:800;padding:6px 9px;border-radius:999px}.mock-history-status.pass{background:#ecfdf3;color:#15803d}.mock-history-status.fail{background:#fff1f2;color:#be123c}.mock-history-empty{text-align:center;padding:35px}.mock-history-empty>div{font-size:50px}.mock-local-note{margin-top:16px;font-size:13px;line-height:1.6}
@media(max-width:700px){.mock-history-summary{grid-template-columns:1fr 1fr}.mock-history-row{grid-template-columns:58px minmax(0,1fr)}.mock-history-score{width:52px;height:52px}.mock-history-status{grid-column:2;justify-self:start}.mock-history-meta{flex-direction:column;gap:3px}}

/* Stage 13.6 - Mock Test Exam Modes */
.mock-mode-admin{margin:15px 0;padding:14px;border:1px solid #eee;border-radius:12px;background:#fafafa}.mock-mode-admin h3{margin:0 0 10px}
.mock-mode-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-width:720px;margin:24px auto}.mock-mode-card{border:1px solid #e5e7eb;border-radius:15px;padding:22px;background:#fff;cursor:pointer;text-align:left;transition:.16s transform,.16s border-color,.16s box-shadow}.mock-mode-card:hover{transform:translateY(-2px);border-color:#ef9a9a;box-shadow:0 8px 24px rgba(0,0,0,.07)}.mock-mode-card b{display:block;font-size:21px;margin-bottom:7px}.mock-mode-card span{color:#667085}.mock-mode-card.exam-mode b{color:#c62828}.mock-mode-card.practice-mode b{color:#166534}
.mock-exam-progressbar{height:8px;background:#eee;border-radius:999px;overflow:hidden;margin:0 0 10px}.mock-exam-progressbar>div{height:100%;width:0;background:#e53935;transition:width .2s}.mock-question-toolbar{position:sticky;top:4px;z-index:20;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:9px 11px;margin-bottom:13px}.mock-question-toolbar span{text-align:center;font-weight:800;color:#475467}.mock-question-toolbar button:disabled{opacity:.4}
.mock-section-progress{margin:10px 0 14px;border-top:1px solid #eee;padding-top:8px}.mock-section-progress>div{display:flex;justify-content:space-between;gap:10px;font-size:12px;padding:5px 0}.mock-section-progress span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mock-section-progress b{color:#c62828}
.mock-audio-wrap{margin:12px 0}.mock-audio-wrap .mock-audio{margin-bottom:3px}.mock-audio-status{display:block;color:#667085;font-size:12px}.mock-practice-mode .mock-timer-box{background:#ecfdf3}.mock-practice-mode .mock-timer-box b{color:#15803d;font-size:19px}
@media(max-width:600px){.mock-mode-picker{grid-template-columns:1fr}.mock-question-toolbar{grid-template-columns:1fr 1fr}.mock-question-toolbar span{grid-column:1/-1;grid-row:1}.mock-question-toolbar #mockPrevBtn{grid-column:1}.mock-question-toolbar #mockNextBtn{grid-column:2}}

/* Stage 13.7 - Detailed Results & Wrong Answer Review */
.mock-section-results{margin:18px 0;border-top:1px solid #eee;padding-top:14px}.mock-section-results h3{margin:0 0 10px}.mock-section-result-row{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:10px 0;border-bottom:1px dashed #e5e7eb}.mock-section-result-row:last-child{border-bottom:0}.mock-section-result-row div{display:flex;flex-direction:column}.mock-section-result-row span{font-size:12px;color:#667085;margin-top:3px}.mock-section-result-row strong{font-size:20px;color:#c62828}
.mock-history-sections{grid-column:1/-1;margin:3px 0 8px 76px;background:#fafafa;border-radius:10px;padding:8px 12px}.mock-history-sections summary{cursor:pointer;font-weight:800;color:#475467}.mock-history-sections>div{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:8px 0;border-bottom:1px dashed #ddd}.mock-history-sections>div:last-child{border-bottom:0}.mock-history-sections small{grid-column:1/-1;color:#667085}
@media(max-width:700px){.mock-history-sections{margin-left:0}.mock-section-result-row{align-items:flex-start}}

/* Stage 13.8 - Mock Test Analytics */
.mock-analytics-filter{margin-bottom:14px}.mock-analytics-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.mock-trend-chart{height:230px;display:flex;align-items:end;gap:7px;padding:20px 2px 4px;overflow-x:auto}.mock-trend-column{min-width:34px;flex:1;max-width:60px;height:100%;display:grid;grid-template-rows:22px 1fr 22px;align-items:end;text-align:center}.mock-trend-value{font-size:10px;font-weight:800;color:#475467}.mock-trend-bar-wrap{height:100%;display:flex;align-items:end;justify-content:center;background:#f4f4f5;border-radius:6px 6px 2px 2px;overflow:hidden}.mock-trend-bar-wrap i{display:block;width:100%;background:#e53935;border-radius:5px 5px 0 0}.mock-trend-column small{font-size:10px;color:#667085;white-space:nowrap}
.mock-skill-bars{display:flex;flex-direction:column;gap:13px}.mock-skill-row{display:grid;grid-template-columns:minmax(120px,1fr) minmax(120px,2fr) 48px;align-items:center;gap:10px}.mock-skill-label{display:flex;flex-direction:column}.mock-skill-label small{color:#667085;font-size:11px;margin-top:2px}.mock-skill-track{height:10px;background:#eee;border-radius:999px;overflow:hidden}.mock-skill-track i{display:block;height:100%;background:#e53935;border-radius:999px}.mock-skill-row strong{text-align:right;color:#c62828}
.mock-recommendations{display:flex;flex-direction:column;gap:10px}.mock-recommend-card{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start;padding:10px;background:#fff8f0;border-radius:10px}.mock-recommend-card>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#f59e0b;color:white;font-weight:900}.mock-recommend-card b{color:#92400e}.mock-recommend-card p{margin:4px 0 0;color:#667085;font-size:13px;line-height:1.45}
.mock-weak-tests{display:flex;flex-direction:column}.mock-weak-test-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:13px 0;border-bottom:1px solid #eee}.mock-weak-test-row:last-child{border-bottom:0}.mock-weak-test-row>div{min-width:0;display:flex;flex-direction:column}.mock-weak-test-row span{font-size:12px;color:#c62828;font-weight:800;margin-top:3px}.mock-weak-test-row small{color:#667085;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mock-analytics-empty{text-align:center;color:#667085;padding:22px}
@media(max-width:800px){.mock-analytics-grid{grid-template-columns:1fr}.mock-skill-row{grid-template-columns:minmax(100px,1fr) minmax(90px,1.4fr) 44px}.mock-weak-test-row{align-items:flex-start;flex-direction:column}}

/* Stage 13.9 - Random Question Generator */
.mock-random-builder{margin:18px 0}.mock-random-builder .mock-big-btn{margin-top:15px}.mock-random-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:16px 0}.mock-random-summary>div{text-align:center;padding:9px}.mock-random-summary b{display:block;font-size:24px;color:#c62828}.mock-random-summary span{font-size:12px;color:#667085}.mock-random-empty{text-align:center;padding:30px}.mock-random-exam{margin-top:16px}
@media(max-width:700px){.mock-random-summary{grid-template-columns:1fr 1fr}}

/* Stage 14.0 - Homepage Banner Slider */
.home-slider{position:relative;margin:18px 0 24px;border-radius:20px;overflow:hidden;background:#111;box-shadow:0 12px 30px rgba(0,0,0,.10);aspect-ratio:16/5}.home-slides,.home-slide{position:absolute;inset:0}.home-slide{opacity:0;visibility:hidden;transition:opacity .55s ease}.home-slide.active{opacity:1;visibility:visible}.home-slide img{width:100%;height:100%;object-fit:cover;display:block}.home-slide-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.66),rgba(0,0,0,.16) 65%,transparent);display:flex;align-items:center}.home-slide-content{max-width:620px;padding:38px 70px;color:#fff}.home-slide-content h2{font-size:clamp(25px,3.4vw,46px);line-height:1.12;margin:0 0 10px;color:#fff}.home-slide-content p{font-size:clamp(14px,1.6vw,19px);line-height:1.5;margin:0 0 18px;color:#fff}.home-slide-arrow{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.85);font-size:30px;cursor:pointer}.home-slide-arrow.prev{left:14px}.home-slide-arrow.next{right:14px}.home-slide-dots{position:absolute;z-index:3;left:50%;bottom:12px;transform:translateX(-50%);display:flex;gap:7px}.home-slide-dots button{width:9px;height:9px;border:0;border-radius:50%;background:rgba(255,255,255,.55);padding:0;cursor:pointer}.home-slide-dots button.active{width:25px;border-radius:999px;background:#fff}.admin-two-col{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(400px,1.2fr);gap:16px}.admin-slide-preview{display:block;width:100%;max-height:180px;object-fit:cover;border-radius:10px;margin:8px 0}.admin-slide-row{display:grid;grid-template-columns:120px 1fr auto;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid #eee}.admin-slide-row img{width:120px;height:68px;object-fit:cover;border-radius:8px}.admin-slide-row>div:nth-child(2){display:flex;flex-direction:column;min-width:0}.admin-slide-row small,.admin-slide-row span{color:#667085;margin-top:3px}
@media(max-width:800px){.home-slider{aspect-ratio:16/8;border-radius:14px}.home-slide-content{padding:25px 48px}.home-slide-arrow{width:34px;height:34px;font-size:24px}.admin-two-col{grid-template-columns:1fr}}
@media(max-width:520px){.home-slider{aspect-ratio:4/3}.home-slide-overlay{background:linear-gradient(90deg,rgba(0,0,0,.67),rgba(0,0,0,.28))}.home-slide-content{padding:24px 38px}.home-slide-content p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.home-slide-arrow.prev{left:7px}.home-slide-arrow.next{right:7px}}

/* Stage 14.2 - Grammar Rich Editor */
.grammar-rich-wrap{border:1px solid #d0d5dd;border-radius:12px;overflow:hidden;background:#fff;margin:6px 0 14px}.grammar-rich-toolbar{display:flex;gap:5px;align-items:center;flex-wrap:wrap;padding:8px;background:#f8fafc;border-bottom:1px solid #e5e7eb;position:sticky;top:0;z-index:5}.grammar-rich-toolbar button,.grammar-rich-toolbar select{border:1px solid #d0d5dd;background:#fff;border-radius:7px;padding:6px 8px;font-size:12px;cursor:pointer}.grammar-rich-toolbar button:hover{background:#fff1f1;border-color:#f2a4a4}.grammar-rich-editor,.grammar-source-editor{width:100%;min-height:430px;padding:20px;box-sizing:border-box;border:0;outline:0;line-height:1.75;font-size:16px}.grammar-source-editor{resize:vertical;font-family:Consolas,"Courier New",monospace;background:#111827;color:#e5e7eb}.grammar-editor-hint{padding:7px 12px;background:#fafafa;border-top:1px solid #eee;color:#667085;font-size:12px}.grammar-rich-editor h2{font-size:25px;margin:20px 0 8px}.grammar-rich-editor h3{font-size:20px;margin:18px 0 7px}.grammar-rich-editor blockquote{border-left:4px solid #ef5350;background:#fff5f5;padding:10px 14px;margin:12px 0}.grammar-rich-editor img{max-width:100%;height:auto}.grammar-inline-structure{background:#fff3f3;border:1px solid #ffcaca;border-left:5px solid #e53935;border-radius:10px;padding:12px 15px;margin:12px 0}.grammar-inline-structure small{display:block;color:#c62828;font-weight:800}.grammar-inline-structure strong{display:block;font-size:22px;margin-top:4px}.grammar-inline-example{border:1px solid #e5e7eb;border-radius:10px;padding:12px 14px;margin:10px 0}.grammar-inline-example .cn{font-family:"Microsoft YaHei","SimSun",sans-serif;font-size:22px;font-weight:700}.grammar-inline-example .py{color:#c62828;margin-top:3px}.grammar-inline-example .vi{color:#475467;margin-top:3px}.grammar-editor-table{width:100%;border-collapse:collapse;margin:12px 0}.grammar-editor-table td,.grammar-editor-table th{border:1px solid #d0d5dd;padding:8px}.grammar-figure{text-align:center;margin:16px auto}.grammar-figure img{max-width:100%;height:auto;border-radius:10px}.grammar-figure figcaption{font-size:12px;color:#667085;margin-top:5px}.grammar-preview-panel{border:1px solid #e5e7eb;border-radius:12px;margin:12px 0 16px;overflow:hidden}.grammar-preview-head{display:flex;justify-content:space-between;align-items:center;background:#f8fafc;padding:8px 12px;border-bottom:1px solid #e5e7eb}.grammar-preview-body{min-height:100px;padding:16px;background:#fff}.grammar-preview-body img{max-width:100%;height:auto}.grammar-preview-body .grammar-inline-structure{background:#fff3f3}.grammar-preview-body .grammar-inline-example{border:1px solid #e5e7eb}
@media(max-width:700px){.grammar-rich-toolbar{position:static}.grammar-rich-editor,.grammar-source-editor{min-height:340px;padding:14px}}

/* Stage 14.3 - Admin / Editor roles */
.admin-role-pill{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:800}.admin-role-pill.admin{background:#fff1f1;color:#c62828}.admin-role-pill.editor{background:#eff6ff;color:#1d4ed8}.editor-permission-box{line-height:1.5}.editor-permission-box p{margin:7px 0;padding:6px 9px;background:#fafafa;border-radius:8px}

/* Stage 14.4 - Activity Log & Content Safety */
.activity-filter{display:grid;grid-template-columns:2fr repeat(3,1fr) repeat(2,150px) auto auto;gap:8px;align-items:end}.activity-table td small{display:block;color:#667085;margin-top:3px}.activity-action{display:inline-flex;padding:4px 8px;border-radius:999px;background:#f3f4f6;font-size:11px;font-weight:800}.activity-action.delete{background:#fff1f2;color:#be123c}.activity-action.create{background:#ecfdf3;color:#15803d}.activity-action.update{background:#eff6ff;color:#1d4ed8}.activity-action.import{background:#fff7ed;color:#c2410c}.activity-action.login,.activity-action.logout{background:#f5f3ff;color:#6d28d9}.activity-table details pre{max-width:420px;max-height:220px;overflow:auto;white-space:pre-wrap;background:#111827;color:#e5e7eb;padding:8px;border-radius:7px;font-size:11px}.nowrap{white-space:nowrap}.pagination{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:15px}.safety-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin:16px 0}.safety-stats .card{text-align:center;padding:16px}.safety-stats b{display:block;font-size:27px;color:#c62828}.safety-stats span{font-size:12px;color:#667085}
@media(max-width:1000px){.activity-filter{grid-template-columns:1fr 1fr}.safety-stats{grid-template-columns:repeat(3,1fr)}}@media(max-width:600px){.activity-filter{grid-template-columns:1fr}.safety-stats{grid-template-columns:1fr 1fr}}

/* Stage 14.5 - Editor Delete Approval */
.delete-target{padding:14px;background:#fff7ed;border:1px solid #fed7aa;border-radius:10px;margin:12px 0}.delete-target b,.delete-target small{display:block}.delete-target small{color:#667085;margin-top:4px}.delete-tabs{display:flex;gap:8px;margin:14px 0;flex-wrap:wrap}.delete-tabs a{padding:9px 13px;border-radius:9px;background:#f3f4f6;text-decoration:none;color:#344054;font-weight:700}.delete-tabs a.active{background:#c62828;color:#fff}.delete-tabs b{display:inline-block;margin-left:4px;background:#fff;color:#c62828;border-radius:999px;padding:1px 6px}.approval-form input[name="review_note"]{min-width:220px;margin-bottom:7px}.request-status{display:inline-flex;padding:5px 9px;border-radius:999px;font-weight:800;font-size:12px}.request-status.approved{background:#ecfdf3;color:#15803d}.request-status.rejected{background:#fff1f2;color:#be123c}

/* Stage 15 - Chinese Pronunciation Learning */
.pronunciation-category-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:18px 0 28px}.pronunciation-cat-card{text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:5px}.pronunciation-cat-card b{font-size:18px;color:#c62828}.pronunciation-cat-card span{color:#667085;line-height:1.45}.pronunciation-cat-card small{margin-top:auto;font-weight:700}.pronunciation-section{margin:28px 0}.pronunciation-lesson-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}.pronunciation-lesson-card{text-decoration:none;color:inherit;transition:.18s transform,.18s box-shadow}.pronunciation-lesson-card:hover{transform:translateY(-2px);box-shadow:0 9px 25px rgba(0,0,0,.08)}.pronunciation-lesson-card>span{font-size:12px;font-weight:800;color:#c62828}.pronunciation-lesson-card h3{margin:7px 0}.pronunciation-lesson-card p{color:#667085;line-height:1.5}.pronunciation-lesson-card small{font-weight:800;color:#c62828}.pronunciation-detail{max-width:1000px;margin:0 auto}.pronunciation-detail-head{margin:12px 0 20px}.pronunciation-detail-head h1{font-size:clamp(28px,4vw,46px);margin:7px 0}.pronunciation-controls{display:flex;justify-content:space-between;gap:18px;align-items:center;margin:16px 0}.pronunciation-controls div{display:flex;flex-direction:column}.pronunciation-controls span{font-size:12px;color:#667085}.pronunciation-controls select{max-width:180px}.pronunciation-items{display:grid;gap:14px}.pronunciation-item{position:relative}.pronunciation-item-top{display:flex;justify-content:space-between;align-items:center}.pron-type{font-size:11px;text-transform:uppercase;font-weight:900;color:#c62828;background:#fff1f1;padding:5px 8px;border-radius:999px}.pron-label{font-size:20px}.pronunciation-main{text-align:center;padding:10px 0}.pron-pinyin{font-size:clamp(30px,5vw,50px);font-weight:900;color:#c62828;line-height:1.1}.pron-cn{font-size:clamp(25px,4vw,38px);margin-top:6px}.pron-vi{color:#667085;margin-top:5px}.pronunciation-actions{text-align:center;margin:10px 0}.pronunciation-note{background:#fff8e1;border-left:4px solid #f59e0b;padding:11px 14px;border-radius:8px;margin:12px 0}.pronunciation-note p{margin:5px 0 0;line-height:1.6}.pronunciation-example{background:#f8fafc;border-radius:10px;padding:12px 14px;margin-top:12px}.pronunciation-example .cn{font-size:21px;font-weight:700}.pronunciation-example .py{color:#c62828;margin-top:3px}.pronunciation-example .vi{color:#475467;margin-top:3px}.pronunciation-example-speak{border:0;background:transparent;cursor:pointer;font-size:17px}.pronunciation-image{display:block;max-width:100%;max-height:350px;object-fit:contain;margin:12px auto;border-radius:12px}
@media(max-width:600px){.pronunciation-controls{align-items:flex-start;flex-direction:column}.pronunciation-controls select{width:100%;max-width:none}}

/* Stage 15.0.2 - Pronunciation category navigation */
.pronunciation-cat-card.active{border-color:#ef5350;box-shadow:0 0 0 2px rgba(229,57,53,.12);background:#fff8f8}.pronunciation-cat-card.active b{color:#b71c1c}
.pronunciation-shadow-tip{display:flex;gap:8px;align-items:flex-start;background:#f0f9ff;border:1px solid #bae6fd;padding:10px 12px;border-radius:9px;margin:10px 0}.pronunciation-shadow-tip span{color:#475467;font-size:13px;line-height:1.45}@media(max-width:600px){.pronunciation-shadow-tip{flex-direction:column}}

/* Stage 16 - launch readiness */
.launch-progress{height:12px;background:#eef2f6;border-radius:999px;overflow:hidden}.launch-progress i{display:block;height:100%;background:#22c55e;border-radius:inherit}.launch-check-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px;margin:16px 0}.launch-check.pass{border-left:4px solid #22c55e}.launch-check.warn{border-left:4px solid #f59e0b}.launch-check p{margin:7px 0 0;color:#667085;font-size:13px}

/* Stage 16.0.1 - admin clean URL and SEO settings layout fix */
.admin-settings-grid{min-width:0}
.admin-settings-grid>*{min-width:0}
.admin-settings-grid input[type="text"],.admin-settings-grid input[type="url"],.admin-settings-grid textarea,.admin-settings-grid select{max-width:100%}
@media(min-width:760px){.admin-settings-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px 24px}}
@media(max-width:759px){.admin-settings-grid{display:block}.admin-settings-grid>*{margin-bottom:14px}}
.checkline{display:flex!important;align-items:center;gap:9px;white-space:normal}.checkline input[type=checkbox]{width:auto!important;flex:0 0 auto;margin:0}.checkline span{min-width:0}

/* Stage 16.0.2 - hard fix for SEO index row */
.seo-index-row{display:block;width:100%;margin:12px 0 14px;overflow:hidden}
.seo-index-row label{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;width:auto!important;max-width:100%!important;margin:0!important;padding:8px 0!important;white-space:normal!important}
.seo-index-row input[type="checkbox"]{display:block!important;position:static!important;float:none!important;flex:0 0 auto!important;width:18px!important;height:18px!important;min-width:18px!important;max-width:18px!important;margin:0!important;padding:0!important}
.seo-index-row span{display:block!important;min-width:0!important;max-width:100%!important;font-weight:700;line-height:1.4;overflow-wrap:anywhere}

/* Stage 16.0.3 - Settings page defensive layout */
.admin-settings-page .settings-form{width:100%;min-width:0}
.admin-settings-page .settings-section{min-width:0;overflow:hidden}
.admin-settings-page .settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}
.admin-settings-page .settings-grid>*{min-width:0}
.admin-settings-page input[type="text"],
.admin-settings-page input[type="url"],
.admin-settings-page input[type="password"],
.admin-settings-page input[type="number"],
.admin-settings-page input[type="file"],
.admin-settings-page textarea,
.admin-settings-page select{box-sizing:border-box;width:100%;max-width:100%}
.admin-settings-page input[type="checkbox"],
.admin-settings-page input[type="radio"]{width:auto;max-width:none}
.admin-settings-page .seo-index-row label{display:flex!important;align-items:center!important;gap:9px!important;width:100%!important}
.admin-settings-page .seo-index-row input[type="checkbox"]{width:18px!important;height:18px!important;flex:0 0 18px!important}
@media(max-width:760px){
  .admin-settings-page .settings-grid{grid-template-columns:1fr}
}