:root{
  --bg: #f4f1ea; --card: #faf9f6; --text: #3b3532; --muted: #7a706b;
  --line: #e6e1d8; --accent: #d97746; --accent2: #f0e8df;
  --good:#16a34a; --bad:#dc2626; --warn:#d97706;
  --shadow:0 2px 10px rgba(60,50,40,.06);
  --radius:14px;
  --font-arabic: 'Amiri Quran', serif;
  --font-chinese: 'Noto Sans SC', sans-serif;
  --font-english: 'Montserrat', sans-serif;
  --py-size: 0.45em;
}
[data-theme="dark"]{
  --bg:#12151c; --card:#1a1f2a; --text:#e6e9ef; --muted:#9aa3b2;
  --line:#2a3140; --accent:#5b8cff; --accent2:#1e2740;
  --shadow:0 2px 10px rgba(0,0,0,.4);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: var(--font-arabic);
  background:var(--bg); color:var(--text); line-height:1.9; font-size:18px;
  transition:background .3s,color .3s; letter-spacing:normal !important;
}
.zh, .reader, .zh-s, .dlg-line .zh-t, .pop h4, .cmp-box h4 { font-family: var(--font-chinese); letter-spacing:.4px; }
.py, .pop .py, .py-line, input[type=text], input[type=search] { font-family: var(--font-english); letter-spacing: 0; }

#app{max-width:1100px;margin:0 auto;padding:16px; padding-bottom: 80px;}
header.top{display:flex;align-items:center;justify-content:space-between;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 20px;box-shadow:var(--shadow);margin-bottom:18px}
header.top h1{font-size:24px;margin:0;font-weight:700}
header.top .right{display:flex;gap:10px;align-items:center}
button{font-family:inherit;cursor:pointer;border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:10px;padding:9px 16px;font-size:16px;transition:.2s;letter-spacing:normal;font-weight:600}
button:hover{border-color:var(--accent);color:var(--accent)}
button.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
button.primary:hover{filter:brightness(1.08);color:#fff}
button.ghost{background:transparent}
button:disabled{opacity:.45;cursor:not-allowed}
nav.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
nav.tabs button{font-size:15px;padding:8px 14px}
nav.tabs button.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow);margin-bottom:18px}
.grid{display:grid;gap:14px}
.grid.c2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.grid.c3{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.stat{background:var(--accent2);border-radius:12px;padding:16px;position:relative}
.stat .n{font-size:30px;font-weight:700;color:var(--accent);line-height:1.2;font-family:var(--font-english)}
.stat .l{font-size:15px;color:var(--muted);margin-top:4px;display:flex;align-items:center;justify-content:space-between}
.help-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--accent);color:#fff;font-size:14px;font-weight:bold;cursor:pointer;margin-inline-start:6px}
.help-icon:hover{background:var(--good)}
h2{font-size:26px;margin:0 0 14px;font-weight:700}
h3{font-size:22px;margin:20px 0 10px;font-weight:700}
.muted{color:var(--muted);font-size:16px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
input[type=text],input[type=search],select,textarea{font-family:inherit;padding:10px 14px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--text);font-size:16px;width:100%;max-width:100%;letter-spacing:normal}
textarea{min-height:110px;resize:vertical}
.tag{display:inline-block;background:var(--accent2);color:var(--accent);border-radius:8px;padding:3px 10px;font-size:14px;margin:3px;font-weight:600}

/* تصميم بطاقات النصوص */
.text-grid{ display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; margin-top: 15px; }
.text-card{ background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; cursor: pointer; transition: transform 0.2s, box-shadow 0.2s; display: flex; flex-direction: column; }
.text-card:hover{ transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,0.08); border-color: var(--accent); }
.text-card-img{ height: 140px; background: linear-gradient(135deg, var(--accent2) 0%, var(--bg) 100%); display: flex; align-items: center; justify-content: center; font-size: 40px; color: var(--accent); position: relative; }
.text-card-tags{ position: absolute; top: 10px; right: 10px; display: flex; gap: 5px; }
.text-card-tag{ background: rgba(255,255,255,0.9); color: var(--accent); padding: 2px 8px; border-radius: 6px; font-size: 12px; font-weight: bold; }
[data-theme="dark"] .text-card-tag { background: rgba(0,0,0,0.7); }
.text-card-body{ padding: 15px; display: flex; flex-direction: column; flex: 1; }
.text-card-title-zh{ font-family: var(--font-chinese); font-size: 20px; font-weight: bold; direction: ltr; text-align: left; margin-bottom: 5px; }
.text-card-title-ar{ font-size: 16px; color: var(--text); font-weight: 600; margin-bottom: 8px; }
.text-card-intro{ font-size: 14px; color: var(--muted); flex: 1; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* القارئ */
.reader{ font-size:24px; line-height:2.4; direction:ltr; text-align:left; background:var(--card); padding:28px 32px; border-radius:var(--radius); border:1px solid var(--line); word-spacing: 0 !important; transition: font-size .3s, line-height .3s; }
.reader.show-py { line-height: 3.5; padding-top: 35px; }
.trans{display:none;margin-top:18px;border-top:1px dashed var(--line);padding-top:16px}
.trans.show{display:block}
.trans .pair{margin-bottom:12px;padding-bottom:10px;border-bottom:1px dotted var(--line)}
.trans .zh-s{font-size:18px;direction:ltr;text-align:left}
.trans .ar-s{color:var(--muted);font-size:17px;margin-top:4px}

.pop{position:fixed;z-index:9999;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 10px 34px rgba(0,0,0,.18);padding:20px 22px;min-width:280px;max-width:420px;display:none}
.pop h4{margin:0 0 6px;font-size:34px;direction:ltr;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:8px;line-height:1.2}
.pop .py{color:var(--accent);font-size:22px;direction:ltr;text-align:left;margin-bottom:10px;font-weight:700}
.pop .ar{font-size:22px;margin-bottom:12px;font-weight:600;line-height:1.6}
.pop .ex{font-size:19px;color:var(--text);direction:ltr;text-align:left;border-top:1px dashed var(--line);padding-top:12px;margin-top:12px}
.pop .ex .e-ar{color:var(--muted);font-size:18px;direction:rtl;text-align:right;margin-top:6px;font-weight:400}
.pop .pop-actions{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.pop .pop-actions button{margin:0;padding:8px 14px;font-size:15px;font-family:var(--font-arabic)}

.quiz-q{margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.quiz-q .q{font-weight:700;margin-bottom:10px;font-size:18px}
.opt{display:block;padding:10px 14px;border:1px solid var(--line);border-radius:10px;margin-bottom:8px;cursor:pointer;transition:.15s;font-size:17px}
.opt:hover{border-color:var(--accent)}
.opt.sel{border-color:var(--accent);background:var(--accent2)}
.opt.correct{border-color:var(--good);background:rgba(22,163,74,.12)}
.opt.wrong{border-color:var(--bad);background:rgba(220,38,38,.1)}
.badge{font-size:14px;padding:3px 9px;border-radius:20px;margin-inline-start:8px;font-family:var(--font-arabic)}
.badge.new{background:#e0f2fe;color:#0369a1}
.badge.learn{background:#fef3c7;color:#b45309}
.badge.master{background:#dcfce7;color:#15803d}
.badge.lv{background:var(--accent2);color:var(--accent);font-weight:700;margin:0;font-family:var(--font-english)}
.list-item{display:flex;justify-content:space-between;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;margin-bottom:8px;cursor:pointer;transition:.15s}
.list-item:hover{border-color:var(--accent);background:var(--accent2)}
.list-item .zh-w{direction:ltr;font-weight:600;font-size:22px;font-family:var(--font-chinese);letter-spacing:.4px}
.list-item .m{color:var(--muted);font-size:16px;margin-top:3px}
.progress-bar{height:9px;background:var(--line);border-radius:6px;overflow:hidden;margin-top:8px}
.progress-bar > div{height:100%;background:var(--accent);border-radius:6px;transition:width .4s}

.dlg-line{display:flex;gap:12px;margin-bottom:12px;padding:12px;border-radius:10px;line-height:2.4; word-spacing: 0 !important;}
.dlg-line:nth-child(odd){background:var(--accent2)}
.dlg-line .sp{font-weight:700;color:var(--accent);min-width:64px;font-size:17px}
.dlg-line .zh-t{direction:ltr;text-align:left;flex:1;font-size:20px;word-spacing: 0 !important;}
.dlg-line .ar-t{color:var(--muted);font-size:17px;direction:rtl;text-align:right;flex:1}
.show-py .zh-t { line-height: 3.5; }

/* قسم المقارنة الجديد */
.cmp-container { display: flex; flex-direction: column; gap: 20px; }
.cmp-header { text-align: center; margin-bottom: 10px; }
.cmp-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.cmp-card { border-radius: 12px; padding: 20px; border: 2px solid; position: relative; }
.cmp-card.blue { border-color: #3b82f6; background: rgba(59, 130, 246, 0.05); }
.cmp-card.orange { border-color: #f97316; background: rgba(249, 115, 22, 0.05); }
.cmp-card h4 { font-family: var(--font-chinese); font-size: 32px; margin: 0 0 5px 0; direction: ltr; text-align: left; }
.cmp-card.blue h4 { color: #2563eb; }
.cmp-card.orange h4 { color: #ea580c; }
.cmp-card .py { font-family: var(--font-english); font-size: 18px; color: var(--muted); direction: ltr; text-align: left; margin-bottom: 10px; }
.cmp-card .ar { font-size: 20px; font-weight: bold; margin-bottom: 15px; }
.cmp-card .ex-box { background: var(--card); border: 1px solid var(--line); padding: 10px; border-radius: 8px; margin-bottom: 10px; }
.cmp-card .ex-zh { font-family: var(--font-chinese); font-size: 18px; direction: ltr; text-align: left; margin-bottom: 5px; }
.cmp-card .ex-ar { font-size: 16px; color: var(--muted); }
.cmp-diff { background: var(--bg); padding: 15px; border-radius: 8px; border-right: 4px solid var(--accent); }
.cmp-quiz { background: var(--card); padding: 15px; border-radius: 8px; border: 1px solid var(--line); margin-top: 15px; }
.cmp-nav { display: flex; justify-content: space-between; margin-top: 20px; }

.hidden{display:none!important}
.toast{position:fixed;bottom:70px;left:50%;transform:translateX(-50%);background:#111827;color:#fff;padding:12px 22px;border-radius:10px;font-size:17px;z-index:10000;opacity:0;transition:.3s;pointer-events:none;max-width:90%;box-shadow:0 4px 12px rgba(0,0,0,0.2)}
.toast.show{opacity:1}
.audio-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0}
.small{font-size:15px}
.font-ctrl{display:inline-flex;gap:2px;align-items:center;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.font-ctrl button{border:none;border-radius:0;padding:7px 12px;font-size:16px;font-weight:700}
.font-ctrl span{padding:0 8px;font-size:15px;color:var(--muted);min-width:40px;text-align:center;font-family:var(--font-english)}
.fav-empty{color:var(--muted);font-size:16px;padding:12px;text-align:center;background:var(--accent2);border-radius:10px}
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.5);display:none;z-index:10001;align-items:center;justify-content:center}
.modal-box{background:var(--card);padding:24px;border-radius:14px;max-width:400px;box-shadow:var(--shadow);text-align:right}
.modal-box h3{margin-top:0;color:var(--accent)}
.modal-box button{margin-top:16px;width:100%}

/* ======= إصلاح عرض الكلمات والبينيين ======= */
.w {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    vertical-align: bottom;
    margin: 0 1px;
    padding: 0;
    cursor: pointer;
    border-radius: 6px;
    position: relative;
}
.w:hover { background: var(--accent2); }
.w .hz { display: inline; line-height: 1.2; }
.w .py { display: none; font-size: var(--py-size, 0.45em) !important; color: var(--accent); font-family: var(--font-english); white-space: nowrap; line-height: 1; margin-bottom: 2px; pointer-events: none; }
.show-py .w .py { display: block; }

.hl-fav { background-color: #fef08a !important; color: #1e293b !important; border-bottom: 2px solid #d97706; }
[data-theme="dark"] .hl-fav { background-color: #854d0e !important; color: #fef08a !important; border-bottom: 2px solid #fef08a; }

.hl-custom { background-color: #fecaca !important; color: #991b1b !important; border-bottom: 2px solid #ef4444; }
[data-theme="dark"] .hl-custom { background-color: #7f1d1d !important; color: #fca5a5 !important; border-bottom: 2px solid #ef4444; }

.py-line{color:var(--accent);font-family:var(--font-english);font-size:16px;direction:ltr;text-align:left;margin-top:3px;font-weight:600}
.sec-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:4px}
.sec-icon{font-size:32px}
.sec-card h3{margin:6px 0 4px;font-size:22px}
.sec-card p{margin:0}
.sec-card .tags{min-height:26px}

/* الشريط المتحرك */
.ticker-bar { position: fixed; bottom: 0; left: 0; right: 0; background: var(--card); border-top: 1px solid var(--line); display: flex; align-items: center; padding: 8px 16px; z-index: 9000; box-shadow: 0 -2px 10px rgba(0,0,0,0.05); overflow: hidden; height: 50px;}
.ticker-content { flex: 1; white-space: nowrap; overflow: hidden; font-family: var(--font-chinese); font-size: 20px; display: flex; align-items: center;}
.ticker-item { display: inline-block; margin-right: 50px; cursor: pointer; }
.ticker-item span.py { font-family: var(--font-english); color: var(--accent); font-size: 14px; margin-right: 5px; display: none; }
.ticker-item.show-py span.py { display: inline; }
.ticker-close { background: transparent; border: none; font-size: 20px; cursor: pointer; color: var(--muted); padding: 0 10px; }
.ticker-scroll { animation: ticker 30s linear infinite; display: flex; }
.ticker-scroll:hover { animation-play-state: paused; }
@keyframes ticker { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* تنسيقات ملف الـ PDF */
#export-container { background: #fff; color: #333; padding: 20px; font-family: 'Amiri Quran', serif; direction: rtl; }
.pdf-card { border: 2px solid #e5e7eb; border-radius: 10px; padding: 15px; margin-bottom: 15px; background: #faf9f6; page-break-inside: avoid; }
.pdf-card h2 { margin: 0 0 5px 0; font-family: 'Noto Sans SC', sans-serif; font-size: 28px; color: #d97746; direction: ltr; text-align: left; }
.pdf-card .pdf-py { font-family: 'Montserrat', sans-serif; font-size: 18px; color: #2f6feb; margin-bottom: 5px; direction: ltr; text-align: left; }
.pdf-card .pdf-ar { font-size: 20px; font-weight: bold; margin-bottom: 10px; }
.pdf-card .pdf-ex { font-size: 16px; border-top: 1px dashed #ccc; padding-top: 8px; font-family: 'Noto Sans SC', sans-serif; direction: ltr; text-align: left; }
.pdf-card .pdf-ex-ar { font-size: 15px; color: #666; margin-top: 4px; text-align: right; direction: rtl;}

@media(max-width: 640px) {
  nav.tabs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 8px; }
  nav.tabs button { flex: 0 0 auto; }
  .reader { font-size: 20px; padding: 16px; line-height: 2.2; }
  .reader.show-py { line-height: 3.2 !important; }
  .stat { padding: 12px; }
  .stat .n { font-size: 24px; }
  .cmp-cards { grid-template-columns: 1fr; }
  body { font-size: 16px; }
  .pop { width: 92% !important; max-width: 92% !important; max-height: 85vh; overflow-y: auto; padding: 18px; position: fixed; box-shadow: 0 10px 50px rgba(0,0,0,0.3); }
  .pop h4 { font-size: 28px; }
  .pop .py { font-size: 18px; }
  .pop .ar { font-size: 18px; }
}
/* أدوات المرحلة الأولى: تبويبات المستويات وسجل البحث */
.filter-tabs,.history-list{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.filter-tabs button,.history-chip{border:1px solid var(--line);background:var(--bg);color:var(--text);border-radius:9px;padding:7px 13px;cursor:pointer;font:inherit;font-size:14px}
.filter-tabs button.active{background:var(--accent);border-color:var(--accent);color:#fff}
.history-chip:hover{border-color:var(--accent);background:var(--accent2)}
.history-list{margin-bottom:14px}
@media(max-width:640px){.filter-tabs{gap:6px}.filter-tabs button,.history-chip{padding:7px 10px;font-size:13px}.font-ctrl button{padding:7px 10px}}

/* ======= المرحلة الثانية: إصلاحات وتحسينات ======= */
.ticker-content{direction:ltr}
.ticker-track{display:flex;width:max-content;animation:ticker 30s linear infinite}
.ticker-track:hover{animation-play-state:paused}
.text-card-tag.read{color:var(--good)}
.badge.lv-x{background:var(--line);color:var(--muted)}
.pop .pop-meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.trans.card{margin-top:18px}
.trans .pair .ghost.small,.ghost.small{padding:4px 10px;font-size:14px}
.show-py .dialogue-zh{line-height:3.2!important}
.dialogue-lines.hide-ar .dialogue-ar{display:none}
.listen-line{display:flex;gap:8px;align-items:flex-start;margin-bottom:8px}
.listen-line > button{flex:0 0 auto;margin-top:6px}
.ok{color:var(--good);font-weight:700}
.bad{color:var(--bad);font-weight:700}
/* المراجعة */
.review-card{transition:background .25s,border-color .25s}
.review-card.review-wrong{border-color:var(--bad);background:rgba(220,38,38,.08)}
.review-card.review-right{border-color:var(--good);background:rgba(22,163,74,.07)}
.review-word{direction:ltr;text-align:center;font-size:52px;margin:18px 0 6px;line-height:1.3}
.review-prompt{text-align:center;font-size:26px;font-weight:700;margin:18px 0 6px}
.review-feedback{margin-top:12px}
.review-feedback .answer{margin-top:6px;font-size:18px}
.opt:disabled{cursor:default;opacity:1}
/* الكتابة */
.w-label{font-weight:700;margin:16px 0 8px;color:var(--accent)}
.w-types{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px}
.w-type{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:right;padding:12px 14px;font-weight:400}
.w-type b{font-size:17px}
.w-type.active{border-color:var(--accent);background:var(--accent2);color:var(--text)}
.w-num{font-family:var(--font-english);font-weight:800;color:var(--accent);font-size:14px}
.writing-box h3{margin-top:10px;color:var(--accent)}
.writing-input{width:100%;font-family:var(--font-chinese);font-size:19px;direction:ltr;text-align:left;margin:10px 0;min-height:90px}
.writing-model{background:rgba(22,163,74,.08);border:1px solid var(--good);padding:12px 14px;border-radius:10px;margin-top:10px;direction:ltr;text-align:left}
.order-target,.order-bank{display:flex;flex-wrap:wrap;gap:8px;direction:ltr;min-height:54px;padding:10px;border-radius:10px;margin-top:10px}
.order-target{border:2px dashed var(--accent);background:var(--card)}
.order-bank{background:var(--bg);border:1px solid var(--line)}
.chip{font-family:var(--font-chinese);font-size:20px;padding:6px 12px;border-radius:9px;font-weight:500}
.chip.chosen{background:var(--accent);color:#fff;border-color:var(--accent)}
.chip.key{display:inline-flex;flex-direction:column;align-items:center;line-height:1.3}
.chip-py{font-family:var(--font-english);font-size:12px;color:var(--accent)}
.self-rate{margin-top:12px;padding-top:10px;border-top:1px dashed var(--line)}
.word-hero{text-align:center;padding:10px;background:var(--bg);border-radius:12px;margin:8px 0}
.word-hero .zh{font-size:40px;direction:ltr}
.word-hero .py-line{text-align:center;font-size:18px}
/* اختبار النص */
.quiz-context{background:var(--bg);border-radius:10px;padding:10px 12px;margin-bottom:12px}
.quiz-context mark{background:#fde68a;color:#1e293b;border-radius:4px;padding:0 2px}
.cmp-quiz .opt.correct,.cmp-quiz .opt.wrong{color:var(--text)}
@media(max-width:640px){.review-word{font-size:42px}.w-types{grid-template-columns:1fr 1fr}.chip{font-size:18px}}

/* =====================================================================
   الهوية البصرية الجديدة (المرحلة الثالثة)
   ===================================================================== */
:root{
  --bg:#f6f1e9; --card:#fffdf9; --text:#1f2430; --muted:#6b6560;
  --line:#e9e1d4; --accent:#c2410c; --accent2:#fdeee4; --accent-ink:#9a3412;
  --jade:#0f766e; --gold:#b45309;
  --shadow:0 1px 2px rgba(60,40,20,.05),0 8px 24px rgba(60,40,20,.06);
  --radius:18px;
  --font-ui:'IBM Plex Sans Arabic',system-ui,sans-serif;
  --font-read:'Noto Naskh Arabic','IBM Plex Sans Arabic',serif;
  --font-arabic:var(--font-ui);
  --font-brand:'Amiri',serif;
}
[data-theme="dark"]{
  --bg:#0e131a; --card:#161d27; --text:#e8ebf0; --muted:#9aa4b2;
  --line:#253041; --accent:#fb923c; --accent2:#2a2118; --accent-ink:#fdba74;
  --jade:#2dd4bf; --gold:#fbbf24;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 28px rgba(0,0,0,.35);
}
body{font-family:var(--font-ui);font-size:17px;line-height:1.8;background:
  radial-gradient(1200px 500px at 100% -10%,rgba(194,65,12,.07),transparent 60%),
  radial-gradient(900px 400px at -10% 0%,rgba(15,118,110,.06),transparent 60%),var(--bg);background-attachment:fixed}
#app{max-width:1180px;padding:18px 18px 110px}
h2{font-size:24px;letter-spacing:0}
h3{font-size:19px}
button{font-family:var(--font-ui);border-radius:12px;font-weight:600;padding:9px 16px}
button.primary{box-shadow:0 4px 14px rgba(194,65,12,.25)}
button.small,.small button{padding:5px 11px;font-size:14px}
.card{border-radius:var(--radius);padding:24px;border:1px solid var(--line)}

/* الرأس */
header.top{position:sticky;top:10px;z-index:50;backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);background:color-mix(in srgb,var(--card) 86%,transparent);border-radius:20px;padding:10px 16px;margin-bottom:14px}
.brand{display:flex;align-items:center;gap:12px;cursor:pointer}
.brand-mark{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--accent),#ea580c);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-chinese);font-size:26px;font-weight:700;box-shadow:0 6px 16px rgba(194,65,12,.3)}
.brand h1{font-family:var(--font-brand);font-size:28px;line-height:1;margin:0}
.brand-sub{font-size:12.5px;color:var(--muted)}
.icon-btn{background:transparent;border:1px solid var(--line);padding:7px 11px}
.sys-switch{display:inline-flex;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--bg)}
.sys-switch button{border:none;border-radius:0;background:transparent;padding:6px 10px;font-size:13px;font-family:var(--font-english)}
.sys-switch button.on{background:var(--accent);color:#fff}

/* التبويبات */
nav.tabs{display:grid;grid-template-columns:repeat(var(--cols,6),1fr);gap:8px;overflow:visible;padding:4px 0 12px;flex-wrap:initial}
nav.tabs button{width:100%;justify-content:center;flex:initial;border-radius:999px;background:var(--card);padding:7px 10px;font-size:14.5px;display:inline-flex;gap:6px;align-items:center;white-space:nowrap}
@media(max-width:1000px){nav.tabs button{flex-direction:column;gap:2px;font-size:13px;padding:8px 4px}}
nav.tabs button.active{background:var(--text);border-color:var(--text);color:var(--card)}
[data-theme="dark"] nav.tabs button.active{background:var(--accent);border-color:var(--accent);color:#111}
.tab-ico{font-size:16px;line-height:1}
.bottom-nav{display:none}

/* البطاقة الرئيسية */
.hero{display:flex;gap:24px;align-items:center;justify-content:space-between;background:linear-gradient(135deg,#7c2d12 0%,#c2410c 55%,#ea580c 100%);color:#fff;border-radius:24px;padding:28px 30px;margin-bottom:18px;box-shadow:0 18px 40px rgba(194,65,12,.25);position:relative;overflow:hidden}
.hero::after{content:"读";position:absolute;left:-10px;bottom:-60px;font-family:var(--font-chinese);font-size:220px;font-weight:700;opacity:.08;line-height:1}
.hero h2{color:#fff;font-size:30px;margin:4px 0 6px}
.hero p{margin:0 0 14px;opacity:.92;max-width:560px}
.hero-kicker{font-family:var(--font-english);font-size:13px;letter-spacing:.06em;opacity:.85}
.hero button{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.35);color:#fff}
.hero button.primary{background:#fff;color:var(--accent-ink);border-color:#fff}
.hero-ring{--p:0;width:132px;height:132px;flex:0 0 auto;border-radius:50%;background:conic-gradient(#fff calc(var(--p)*1%),rgba(255,255,255,.22) 0);display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.ring-in{width:104px;height:104px;border-radius:50%;background:rgba(124,45,18,.9);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.3}
.ring-in b{font-family:var(--font-english);font-size:24px}
.ring-in span{font-size:12px;opacity:.85}
.stats-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:18px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;box-shadow:var(--shadow)}
.stat-ico{font-size:20px}
.stat .n{font-size:24px;color:var(--text)}
.stat .l{font-size:13.5px}
.skill-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.skill{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:right;padding:16px;border-radius:16px;background:var(--bg);font-weight:500}
.skill b{font-size:17px}
.skill-ico{font-size:24px}
.skill:hover{transform:translateY(-2px);background:var(--accent2)}
.sec-card{border-radius:16px}

/* بطاقات النصوص */
.text-card{border-radius:18px;box-shadow:var(--shadow)}
.text-card-img{height:110px;background:linear-gradient(135deg,var(--accent2),var(--bg));font-size:34px}
.text-card-tag{border-radius:999px;font-family:var(--font-ui)}
.reader{border-radius:18px;box-shadow:var(--shadow)}
.trans .ar-s,.dialogue-ar,.review-prompt{font-family:var(--font-read)}
.trans .ar-s{font-size:18px;color:var(--text);opacity:.85}

/* الهوامش الثقافية */
.cnote-term{border-bottom:1px dotted var(--gold)}
.cnote-star{color:var(--gold);font-weight:700;cursor:pointer;padding:0 2px;font-size:.85em}
.cnote-footer{margin-top:16px;padding:14px 16px;border-radius:14px;background:color-mix(in srgb,var(--gold) 8%,var(--card));border:1px solid color-mix(in srgb,var(--gold) 30%,var(--line))}
.cnote-head{font-weight:700;color:var(--gold);margin-bottom:6px}
.cnote-item{font-size:15px;line-height:1.85;margin-bottom:6px;font-family:var(--font-read)}
.cnote-box{margin:8px 0;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,var(--gold) 10%,var(--card));font-size:15px;line-height:1.8}
.pop{border-radius:18px}
.pop-close{position:absolute;top:10px;left:10px;width:30px;height:30px;border-radius:50%;padding:0;font-size:14px}
.pop-sys{display:flex;gap:6px;margin:4px 0 8px;font-family:var(--font-english);font-size:12.5px}
.pop-sys span{padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.pop-sys span.on{border-color:var(--accent);color:var(--accent);font-weight:700}
.stroke-row{display:flex;gap:8px;flex-wrap:wrap;direction:ltr;margin-top:8px}
.stroke-cell{width:90px;height:90px;border:1px dashed var(--line);border-radius:10px;background:var(--bg);display:flex;align-items:center;justify-content:center;font-family:var(--font-chinese);font-size:48px}
.coverage{padding:12px 14px;border-radius:14px;background:var(--bg);border:1px solid var(--line)}

/* الجوال */
@media(max-width:900px){.stats-grid{grid-template-columns:repeat(3,1fr)}.skill-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){
  #app{padding:10px 10px 140px}
  header.top{top:6px;border-radius:16px;padding:8px 10px}
  .brand-mark{width:36px;height:36px;font-size:21px}
  .brand h1{font-size:23px}.brand-sub{display:none}
  header.top .icon-btn:first-of-type{display:none}
  nav.tabs{display:none}
  .bottom-nav{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:9500;background:color-mix(in srgb,var(--card) 92%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
  .bottom-nav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:1px;border:none;background:transparent;padding:4px 2px;font-size:11.5px;color:var(--muted);border-radius:12px}
  .bottom-nav button .tab-ico{font-size:20px}
  .bottom-nav button.active{color:var(--accent);background:var(--accent2)}
  .ticker-bar{bottom:calc(62px + env(safe-area-inset-bottom))}
  .hero{flex-direction:column;align-items:flex-start;padding:22px}
  .hero h2{font-size:24px}
  .hero-ring{align-self:center;width:118px;height:118px}.ring-in{width:94px;height:94px}
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .skill-grid{grid-template-columns:1fr 1fr}
  .card{padding:16px}
}
.more-sheet{position:fixed;inset:0;z-index:9600;background:rgba(0,0,0,.35);display:flex;align-items:flex-end}
.more-panel{width:100%;background:var(--card);border-radius:22px 22px 0 0;padding:18px 14px calc(80px + env(safe-area-inset-bottom));box-shadow:0 -10px 30px rgba(0,0,0,.2)}
.more-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.more-grid button{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 4px;font-size:13px;border-radius:14px;background:var(--bg)}
.more-grid button.active{background:var(--accent2);color:var(--accent)}
.more-grid .tab-ico{font-size:22px}
.stat .n{direction:ltr;text-align:right;font-family:var(--font-english)}

/* فهم النص */
.para-gap{height:.9em}
.comp-card{margin-top:16px}
.comp-q{border-top:1px solid var(--line);padding:14px 0}
.comp-kind{font-size:13px;color:var(--accent);font-weight:700;margin-bottom:4px}
.comp-zh{direction:ltr;text-align:left;font-size:20px;line-height:2}
.comp-ar{font-family:var(--font-read);margin:2px 0 8px}
.comp-opts .opt{display:inline-block;width:auto;min-width:90px;font-family:var(--font-chinese),var(--font-ui)}
.comp-fb{margin-top:8px;padding:0;border-radius:12px;font-size:15px;line-height:1.8}
.comp-fb.ok,.comp-fb.bad{padding:10px 12px}
.comp-fb.ok{background:color-mix(in srgb,var(--good,#16a34a) 10%,var(--card))}
.comp-fb.bad{background:color-mix(in srgb,var(--bad,#dc2626) 9%,var(--card))}
.comp-ev{direction:ltr;text-align:left;font-family:var(--font-chinese);margin-top:4px;opacity:.85}
.comp-score{font-weight:600;margin:6px 0}
.comp-summary{margin:8px 0;padding:12px;border-radius:12px;background:var(--bg)}
.order-line,.order-pool{display:flex;flex-wrap:wrap;gap:6px;direction:ltr;margin:6px 0;min-height:40px;padding:6px;border-radius:12px}
.order-line{border:1px dashed var(--line);background:var(--bg)}
.chip{font-family:var(--font-chinese);font-size:18px;padding:6px 12px;border-radius:10px}
.chip.on{background:var(--accent2);border-color:var(--accent);color:var(--accent-ink)}
.comp-gram{padding:8px 0;border-top:1px dashed var(--line)}
.comp-gram .zh{font-family:var(--font-chinese)}
.comp-ex{direction:ltr;text-align:left;font-size:17px;margin-top:4px;opacity:.9}

/* ===== بطاقات المزايا المتحركة ===== */
.feat-wrap{margin:0 0 18px;position:relative}
.feat-track{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.feat-card{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:16px 18px;border-radius:16px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);text-align:right;cursor:pointer;font-weight:400;animation:featIn .5s ease both;transition:transform .2s,border-color .2s}
.feat-card:hover{transform:translateY(-2px);border-color:var(--accent)}
.feat-ico{font-size:26px;line-height:1}
.feat-title{font-size:16px;color:var(--text)}
.feat-line{font-size:14px;color:var(--muted);line-height:1.6}
.feat-cta{font-size:13px;color:var(--accent);font-weight:700;margin-top:4px}
.feat-dots{display:flex;gap:6px;justify-content:center;margin-top:10px}
.feat-dot{width:8px;height:8px;border-radius:50%;padding:0;border:none;background:var(--line);cursor:pointer;transition:background .2s,width .2s}
.feat-dot.active{background:var(--accent);width:22px;border-radius:4px}
@keyframes featIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
@media(max-width:899px){.feat-track{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.feat-track{grid-template-columns:1fr}}
@media(prefers-reduced-motion: reduce){.feat-card{animation:none}}

/* ===== شارات بطاقات النصوص ===== */
.text-card-tag.comp{color:var(--jade);font-weight:700}
.text-card-tag.new,[data-theme="dark"] .text-card-tag.new{background:var(--accent);color:#fff;font-weight:800;border:none}

/* ===== انتقال ناعم + تركيز مرئي ===== */
#main{animation:viewFade 150ms ease}
@keyframes viewFade{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion: reduce){#main{animation:none}}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ===== صفحة «تقدّمي» ===== */
.legend{display:flex;gap:16px;justify-content:center;margin-bottom:12px;flex-wrap:wrap}
.legend-item{display:inline-flex;gap:6px;align-items:center;font-size:13px;color:var(--muted)}
.legend-dot{width:10px;height:10px;border-radius:2px}
.legend-dot.rev,.progress-bar.rev{background:var(--accent)}
.legend-dot.rd,.progress-bar.rd{background:var(--jade)}
.progress-chart{display:flex;gap:8px;align-items:flex-end;height:180px;margin:8px 0 16px;padding:10px 6px;background:var(--bg);border:1px solid var(--line);border-radius:14px;direction:ltr}
.progress-day{flex:1;display:flex;flex-direction:column;align-items:center;height:100%}
.progress-bars{flex:1;display:flex;gap:3px;align-items:flex-end;width:100%}
.progress-bar{flex:1;min-height:2px;border-radius:4px 4px 0 0;transition:height .3s}
.progress-day-label{font-size:12px;color:var(--muted);margin-top:6px}
.progress-list-item{display:flex;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:10px;margin-bottom:6px;background:var(--card)}
.progress-list-item .zh{font-family:var(--font-chinese);font-size:20px;flex:0 0 auto}
.progress-badge{background:var(--accent2);color:var(--accent-ink);padding:3px 10px;border-radius:999px;font-size:13px;font-weight:700;font-family:var(--font-english);white-space:nowrap}
.progress-cta{display:flex;gap:14px;align-items:center;width:100%;padding:14px 16px;margin-bottom:18px;border-radius:16px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);text-align:right;cursor:pointer;font-weight:400;transition:transform .2s,border-color .2s}
.progress-cta:hover{transform:translateY(-1px);border-color:var(--accent)}
.progress-cta-ico{font-size:26px;line-height:1}
.progress-cta-body{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.progress-cta-body b{font-size:16px}
.progress-cta-arrow{color:var(--accent);font-size:20px;font-weight:700}
@media(max-width:640px){.progress-chart{height:140px}.progress-day-label{font-size:11px}}

/* ===== أيقونات الأقسام على بطاقات النصوص (جديد) ===== */
.text-card-img.sec-culture{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#92400e}
.text-card-img.sec-stories{background:linear-gradient(135deg,#dbeafe,#bfdbfe);color:#1e40af}
.text-card-img.sec-articles{background:linear-gradient(135deg,#e0e7ff,#c7d2fe);color:#3730a3}
.text-card-img.sec-daily{background:linear-gradient(135deg,#dcfce7,#bbf7d0);color:#166534}
[data-theme="dark"] .text-card-img.sec-culture{background:linear-gradient(135deg,#422006,#78350f);color:#fde68a}
[data-theme="dark"] .text-card-img.sec-stories{background:linear-gradient(135deg,#172554,#1e3a8a);color:#bfdbfe}
[data-theme="dark"] .text-card-img.sec-articles{background:linear-gradient(135deg,#312e81,#3730a3);color:#c7d2fe}
[data-theme="dark"] .text-card-img.sec-daily{background:linear-gradient(135deg,#052e16,#14532d);color:#bbf7d0}

/* ===== صفحة الهوامش الثقافية (جديد) ===== */
.culture-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.culture-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:10px;border-right:4px solid var(--gold)}
.culture-card-title{font-weight:700;color:var(--gold);font-size:16px;line-height:1.5;margin:0}
.culture-card-def{font-size:15px;line-height:1.85;font-family:var(--font-read);flex:1;margin:0;color:var(--text);opacity:.92}
.culture-card-cta{align-self:flex-start;margin-top:auto}
/* ================= إضافات 2026-11-10 ================= */
/* تمييز المنطوق */
.sent{border-radius:6px;transition:background .2s}
.speaking{background:rgba(250,204,21,.22);box-shadow:0 0 0 3px rgba(250,204,21,.22);border-radius:6px}
.speaking-w .hz{background:#facc15;color:#111;border-radius:4px}
[data-theme="dark"] .speaking{background:rgba(250,204,21,.14)}
/* التراكيب */
.gr-mark{position:relative}
.show-gr .gr-mark{border-bottom:3px solid var(--gc);background:color-mix(in srgb,var(--gc) 14%,transparent);border-radius:3px;cursor:pointer}
.gr-detail,.gr-panel{margin-top:14px}
.gr-detail{border:1px solid var(--line);border-right:5px solid var(--gc);background:var(--card);border-radius:14px;padding:14px 16px;box-shadow:var(--shadow)}
.gr-title{font-size:20px;color:var(--gc)}
.gr-ex{direction:ltr;text-align:left;margin:6px 0;padding:6px 10px;background:var(--bg);border-radius:10px}
.gr-ex .muted{direction:rtl;text-align:right}
.show-gr .gr-ex .gr-mark,.gr-ex .gr-mark{border-bottom:3px solid var(--gc);background:color-mix(in srgb,var(--gc) 14%,transparent)}
.gr-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px;margin-top:10px}
.gr-item{display:flex;flex-wrap:wrap;align-items:center;gap:6px;text-align:right;background:var(--card);border:1px solid var(--line);border-right:4px solid var(--gc);border-radius:12px;padding:10px 12px;font-weight:500}
.gr-item:hover{border-color:var(--gc)}
.gr-dot{width:10px;height:10px;border-radius:50%;background:var(--gc);display:inline-block}
.text-actions{margin-top:16px;gap:8px}
/* تدريبات النص */
.text-ex{margin-top:16px}
.text-ex .filter-tabs{margin-bottom:8px}
.ex-stage{min-height:140px;padding:12px 0}
.ex-ctx{direction:ltr;text-align:left;font-size:21px;line-height:2;background:var(--bg);border-radius:12px;padding:10px 14px;margin:8px 0}
.ex-ctx mark{background:#fde68a;color:#111;border-radius:4px;padding:0 2px}
.ex-big{font-size:46px;text-align:center;margin:8px 0}
.ex-opts .opt.zh{font-size:20px;text-align:center;direction:ltr}
.ex-fb{margin-top:10px;border-radius:12px}
.ex-fb.is-ok,.ex-fb.is-bad{padding:10px 14px}
.ex-fb.is-ok{background:color-mix(in srgb,var(--good) 10%,transparent);border:1px solid color-mix(in srgb,var(--good) 35%,transparent)}
.ex-fb.is-bad{background:color-mix(in srgb,var(--bad) 8%,transparent);border:1px solid color-mix(in srgb,var(--bad) 30%,transparent)}
.why-wrong{margin-top:6px;padding:8px 12px;border-radius:10px;background:var(--accent2);line-height:1.9}
.why-wrong .zh{font-size:19px}
.opt.correct{border-color:var(--good)!important;background:color-mix(in srgb,var(--good) 14%,transparent)}
.opt.wrong{border-color:var(--bad)!important;background:color-mix(in srgb,var(--bad) 12%,transparent)}
/* الاستماع */
.listen-line{display:flex;gap:8px;align-items:flex-start}
.listen-ar{direction:rtl;text-align:right;font-family:var(--font-read);font-size:16px;color:var(--muted);line-height:1.8;margin:2px 0 10px}
.hide-ar .listen-ar{display:none}
/* المقارنة */
.cmp2-nav{display:flex;gap:6px;overflow-x:auto;padding:10px 0;margin:6px 0 4px;scrollbar-width:thin}
.cmp2-pill{white-space:nowrap;font-family:var(--font-chinese);background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-weight:500}
.cmp2-pill.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.cmp2-pill.done:not(.on)::after{content:" ✓";color:var(--good)}
.cmp2-vs{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:stretch;margin:12px 0}
.cmp2-mid{align-self:center;font-weight:800;color:var(--muted);font-size:18px}
.cmp2-card{border-radius:18px;padding:16px;border:1px solid var(--line);background:var(--card);box-shadow:var(--shadow)}
.cmp2-card.c0{border-top:6px solid #2563eb}.cmp2-card.c1{border-top:6px solid #ea580c}
.cmp2-word{display:flex;justify-content:space-between;align-items:center;direction:ltr}
.cmp2-word .zh{font-size:40px;font-weight:700}
.cmp2-card.c0 .cmp2-word .zh{color:#2563eb}.cmp2-card.c1 .cmp2-word .zh{color:#ea580c}
.cmp2-ar{font-size:18px;font-weight:600;margin:4px 0 10px}
.cmp2-ex{background:var(--bg);border-radius:12px;padding:10px}
.cmp2-ex .zh-s{direction:ltr;text-align:left;font-size:19px}
.cmp2-ex mark{background:#fde68a;color:#111;border-radius:4px}
.cmp2-box{border-radius:14px;padding:12px 16px;margin:10px 0;line-height:1.9}
.cmp2-box.diff{background:color-mix(in srgb,var(--jade) 9%,transparent);border-right:5px solid var(--jade)}
.cmp2-box.warn{background:color-mix(in srgb,var(--warn) 10%,transparent);border-right:5px solid var(--warn)}
.cmp2-box-h{font-weight:700;margin-bottom:4px}
.cmp2-quiz{border:2px dashed var(--line);border-radius:16px;padding:14px;margin-top:12px;text-align:center}
.cmp2-q{font-size:24px;direction:ltr;margin:10px 0}
.cmp2-opt{min-width:110px;font-size:22px;text-align:center;display:inline-block}
@media (max-width:640px){.cmp2-vs{grid-template-columns:1fr}.cmp2-mid{justify-self:center}}
/* كلمة الآن */
.wotd{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--card),var(--accent2))}
.wotd-body{padding:6px 0}
.wotd-body.in{animation:wotdIn .5s ease}
@keyframes wotdIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.wotd-top{display:flex;justify-content:space-between;align-items:center;gap:12px;direction:ltr}
.wotd-zh{font-size:46px;font-weight:700;line-height:1.2}
.wotd-meta{direction:rtl;text-align:right}
.wotd-ar{font-size:20px;font-weight:600;margin-top:4px}
.wotd-ex{direction:ltr;text-align:left;font-size:19px;margin-top:6px}
.wotd-ex mark{background:#fde68a;color:#111;border-radius:4px}
.wotd-bar{height:4px;background:var(--line);border-radius:4px;margin-top:10px;overflow:hidden}
.wotd-bar div{height:100%;width:0;background:var(--accent);transition:width .25s linear}
/* الألعاب */
.game-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin-top:14px}
.game-tile{display:flex;flex-direction:column;gap:6px;text-align:right;padding:18px;border-radius:18px;border:1px solid var(--line);background:var(--card);box-shadow:var(--shadow);transition:transform .15s}
.game-tile:hover{transform:translateY(-3px);border-color:var(--accent)}
.game-ico{font-size:34px}
.game-best{font-size:13px;color:var(--accent-ink);margin-top:auto}
.game-stage{margin-top:14px}
.game-hud{text-align:center;font-weight:700;color:var(--accent-ink);margin-bottom:6px}
.game-word{font-size:52px;text-align:center;margin:10px 0}
.game-prompt{text-align:center;font-size:22px;font-weight:600}
.game-end{text-align:center;padding:20px}
.game-big{font-size:64px;font-weight:800;color:var(--accent)}
.match-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.match-card{min-height:72px;border-radius:14px;border:1px solid var(--line);background:var(--card);font-size:16px;transition:.2s}
.match-card.zh{font-family:var(--font-chinese);font-size:26px}
.match-card.sel{border-color:var(--accent);background:var(--accent2)}
.match-card.ok{opacity:.35;border-color:var(--good);pointer-events:none}
.match-card.no{border-color:var(--bad);animation:shake .3s}
@keyframes shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
@media (max-width:640px){.match-grid{grid-template-columns:repeat(3,1fr)}}
.build-chip{font-size:26px;min-width:56px}

/* ================= إضافات الجولة الثانية ================= */
/* شريط «كلمات تتجدد» */
.wbar{position:relative;display:flex;gap:12px;align-items:center;width:100%;padding:12px 16px;margin:-6px 0 18px;border-radius:16px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);overflow:hidden}
.wbar-body{flex:1;display:flex;gap:14px;align-items:center;min-width:0}
.wbar-body.in{animation:wotdIn .45s ease}
.wbar-word{display:flex;flex-direction:column;align-items:center;background:none;border:none;padding:0 6px;cursor:pointer;line-height:1.2}
.wbar-word .zh{font-size:28px;font-weight:700}
.wbar-py{font-size:13px;color:var(--accent-ink);font-weight:500}
.wbar-mid{display:flex;flex-direction:column;min-width:0}
.wbar-mid b{font-size:16px}
.wbar-ex{direction:ltr;text-align:left;font-family:var(--font-chinese);font-size:15px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wbar-ex mark{background:#fde68a;color:#111;border-radius:3px}
.wbar-ctl{display:flex;gap:4px}
.wbar-ctl button{padding:4px 9px}
.wbar-prog{position:absolute;bottom:0;right:0;left:0;height:3px;background:transparent}
.wbar-prog div{height:100%;width:0;background:var(--accent);transition:width .25s linear}
@media (max-width:640px){.wbar{flex-wrap:wrap}.wbar-ex{display:none}}
/* أسئلة الفهم */
.comp-ar-row{display:flex;align-items:flex-start;gap:6px;margin:2px 0 8px}
.comp-ar-tg{padding:0 8px;font-size:13px;border-radius:8px;background:var(--bg);border:1px solid var(--line);font-weight:700}
.comp-q .comp-ar{display:none;margin:0}
.show-qa .comp-q .comp-ar,.comp-q.qa-on .comp-ar{display:block}
.show-qa .comp-ar-tg{display:none}
.comp-opts2{direction:ltr;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:6px 0}
.comp-opts2.tf{grid-template-columns:repeat(2,minmax(0,160px))}
.comp-opts2 .opt{text-align:left;margin:0;font-size:18px}
.opt-in{display:flex;align-items:center;gap:10px}
.opt-l{flex:none;width:26px;height:26px;border-radius:50%;background:var(--bg);border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-family:var(--font-ui);font-weight:700;color:var(--muted)}
@media (max-width:640px){.comp-opts2{grid-template-columns:1fr}}
.comp-zh{font-size:22px}
/* بنك الفروق */
.cmpb-hero{display:flex;justify-content:space-between;align-items:center;gap:16px}
.cmpb-ring{--p:0;flex:none;width:92px;height:92px;border-radius:50%;background:conic-gradient(var(--accent) calc(var(--p)*1%),var(--line) 0);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}
.cmpb-ring::before{content:"";position:absolute;inset:8px;border-radius:50%;background:var(--card)}
.cmpb-ring b,.cmpb-ring span{position:relative;line-height:1.2}
.cmpb-ring span{font-size:12px;color:var(--muted)}
.cmpb-cats{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 12px}
.chip.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.cmpb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.cmpb-card{display:flex;flex-direction:column;gap:6px;text-align:right;padding:14px;border-radius:16px;border:1px solid var(--line);background:var(--card);transition:transform .15s,border-color .15s;font-weight:400}
.cmpb-card:hover{transform:translateY(-2px);border-color:var(--accent)}
.cmpb-card.done{border-color:color-mix(in srgb,var(--good) 45%,var(--line))}
.cmpb-pair{direction:ltr;display:flex;align-items:center;justify-content:center;gap:10px}
.cmpb-pair .zh{font-size:28px;font-weight:700}
.cmpb-pair .a{color:#2563eb}.cmpb-pair .b{color:#ea580c}
[data-theme="dark"] .cmpb-pair .a{color:#60a5fa}[data-theme="dark"] .cmpb-pair .b{color:#fb923c}
.cmpb-vs{color:var(--muted)}
.cmpb-ar{font-size:13px;color:var(--muted);text-align:center;line-height:1.6}
.cmpb-meta{display:flex;gap:6px;align-items:center;justify-content:center}
.cmpb-ok{color:var(--good);font-weight:800}
.cmpq{border-top:1px dashed var(--line);padding:10px 0}
/* نصوصي */
.mylib-hero{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.mylib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-top:16px}
.mylib-card{cursor:pointer;padding:16px;border-radius:18px;border:1px solid var(--line);background:linear-gradient(180deg,var(--card),var(--bg));box-shadow:var(--shadow);display:flex;flex-direction:column;gap:8px;transition:transform .15s}
.mylib-card:hover{transform:translateY(-3px);border-color:var(--accent)}
.mylib-title{font-size:20px;font-weight:700;color:var(--accent-ink);direction:ltr;text-align:left}
.mylib-prev{direction:ltr;text-align:left;color:var(--muted);font-size:15px;line-height:1.7;min-height:52px}
.mylib-meta{display:flex;flex-wrap:wrap;gap:5px}
.mylib-foot{display:flex;justify-content:space-between;align-items:center}
.chip-s{font-size:12px;padding:2px 9px;border-radius:999px;background:var(--bg);border:1px solid var(--line);white-space:nowrap}
.chip-s.known{color:var(--good)}
.mylib-empty{text-align:center;padding:40px 10px}
.mynew-ta{height:260px;direction:ltr;text-align:left;font-family:var(--font-chinese);font-size:19px;line-height:1.9}
.myr{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
@media (max-width:900px){.myr{grid-template-columns:1fr}}
.myr-title{text-align:center;color:var(--accent-ink);font-size:30px;margin:14px 0 6px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.myr-chips{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-bottom:10px}
.myr-tools{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.myr-reader{margin-top:8px}
.myr-reader.spaced .w{margin:0 .18em}
.myr-reader.mark-unk .w.unk .hz{border-bottom:2px dotted var(--accent)}
.myr-reader .w.in-deck .hz{background:color-mix(in srgb,var(--jade) 16%,transparent);border-radius:4px}
.myr-reader:not(.show-py) .w[data-py]{position:relative}
@media (hover:hover){.myr-reader:not(.show-py) .w[data-py]:hover::after{content:attr(data-py);position:absolute;bottom:100%;left:50%;transform:translateX(-50%);background:var(--text);color:var(--card);font-size:13px;font-family:var(--font-ui);padding:1px 7px;border-radius:6px;white-space:nowrap;pointer-events:none;line-height:1.6}}
.myr-side{position:sticky;top:90px;max-height:calc(100vh - 110px);overflow:auto;padding:18px}
.myr-card{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:12px;padding:8px 10px;margin-top:8px;background:var(--bg)}
.myr-side-acts{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.myr-empty{padding:16px;text-align:center;border:1px dashed var(--line);border-radius:12px;margin-top:8px}
.myr-tr{margin-top:10px}
.myr-details{margin-top:12px}
.myr-lv-row{display:grid;grid-template-columns:80px 1fr 40px;gap:8px;align-items:center;margin:4px 0}
.myr-lv-bar{height:8px;background:var(--line);border-radius:6px;overflow:hidden}
.myr-lv-bar div{height:100%;background:var(--accent)}
.save-choice{margin-top:10px;padding:10px;border-radius:12px;background:var(--accent2);display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.save-choice b{width:100%}
/* مثال النافذة المنبثقة */
.pop-ex-zh.show-py{line-height:2.8}
.pop-py-btn{margin-top:4px}
/* الطباعة */
#print-root{display:none}
@media print{
  body.printing>*:not(#print-root){display:none!important}
  body.printing{background:#fff!important}
  body.printing #print-root{display:block;direction:rtl;color:#1f2430;font-family:'Noto Naskh Arabic','IBM Plex Sans Arabic','Segoe UI',Tahoma,sans-serif}
  @page{size:A4;margin:12mm}
  #print-root h1{font-size:18px;margin:0 0 10px}
  #print-root .pg{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:start}
  #print-root .pc{border:1px solid #d9cfbf;border-radius:10px;padding:10px 12px;break-inside:avoid;page-break-inside:avoid}
  #print-root .pc-zh{font-family:'Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif;font-size:30px;direction:ltr;text-align:left;line-height:1.3}
  #print-root .pc-py{color:#9a3412;direction:ltr;text-align:left;font-family:Montserrat,Arial,sans-serif}
  #print-root .pc-ar{font-size:16px;margin-top:2px}
  #print-root .pc-ex{border-top:1px dashed #d9cfbf;margin-top:6px;padding-top:6px;font-size:14px}
  #print-root .pc-exz{font-family:'Noto Sans SC','Microsoft YaHei',sans-serif;direction:ltr;text-align:left;line-height:2.1}
  #print-root rt{font-size:9px;color:#9a3412;font-family:Arial,sans-serif}
  #print-root .pc-exa{color:#6b6560;font-size:13px}
  #print-root .pfoot{margin-top:10px;font-size:11px;color:#6b6560}
}
.myr-tools .chip,.cmpb-cats .chip{font-family:var(--font-ui);font-size:14px;padding:5px 12px}
.comp-head{display:flex;justify-content:space-between;align-items:center}
.comp-q .comp-ar{margin:2px 0 8px}
.comp-ar-tg{padding:1px 10px;font-size:12px}
.myr-tools select{min-width:150px}

/* ================= المسار ================= */
.path-hero{background:linear-gradient(135deg,var(--accent2),var(--card))}
.path-kicker{font-weight:700;color:var(--accent);letter-spacing:.5px;margin-bottom:4px}
.path-sel,.path-topic{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--text);font:inherit;margin-top:8px}
.path-lv{margin:22px 4px 12px}
.path-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin-bottom:18px}
.path-st{display:flex;flex-direction:column;gap:6px;align-items:flex-start;text-align:right;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--text);cursor:pointer;font:inherit}
.path-st:hover{border-color:var(--accent)}
.path-st.done{border-color:var(--good)}
.path-st.skipped{opacity:.75}
.path-st.soon{opacity:.45;cursor:default;border-style:dashed}
.path-st-n{width:32px;height:32px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}
.path-st.soon .path-st-n{background:var(--muted)}
.path-st-t{font-weight:600;line-height:1.5}
.path-st-m{font-size:13px;color:var(--muted)}
.path-bar{width:100%;height:5px;border-radius:5px;background:var(--line);overflow:hidden}
.path-bar i{display:block;height:100%;background:var(--good)}
.path-arts{display:flex;flex-direction:column;gap:10px;margin-bottom:18px}
.path-art{display:flex;gap:14px;align-items:center;text-align:right;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--text);cursor:pointer;font:inherit}
.path-art:hover{border-color:var(--accent)}
.path-art.done .path-art-n{background:var(--good)}
.path-art-n{flex:none;width:36px;height:36px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}
.path-art-b{display:flex;flex-direction:column;gap:2px;min-width:0}
.path-art-zh{font-family:var(--font-chinese);font-size:21px;font-weight:600;direction:ltr;text-align:right}
.path-art-ar{font-weight:600}
.path-art-m{font-size:13px;color:var(--muted)}
.path-words{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;direction:ltr;justify-content:flex-end}
.path-w{display:inline-flex;flex-direction:column;align-items:center;padding:6px 12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--text);cursor:pointer;line-height:1.35}
.path-w b{font-family:var(--font-chinese);font-size:20px;font-weight:500}
.path-w small{font-family:var(--font-english);font-size:11px;color:var(--accent)}
.path-w.foc{border-color:var(--accent);background:var(--accent2)}
.path-title{direction:ltr;text-align:left;font-size:30px;margin:14px 0 2px}
.path-sub{color:var(--muted);margin-bottom:10px}
.path-tools{margin:12px 0}
.path-tools .chip{font-family:inherit;font-size:15px;border:1px solid var(--line);background:var(--card);color:var(--text);cursor:pointer}
.path-body{box-shadow:none;padding:20px 22px}
.path-line{margin-bottom:6px}
.path-ar{display:none;direction:rtl;text-align:right;font-size:16px;line-height:1.8;color:var(--muted);margin:0 0 12px}
.path-body.show-ar .path-ar{display:block}
.path-body .w.p-focus .hz{border-bottom:2px solid var(--accent)}
.path-target{margin-top:16px;padding-top:14px;border-top:1px dashed var(--line)}
.path-know details,.path-q .path-qi{border-top:1px solid var(--line);padding:10px 0}
.path-know summary,.path-q>summary,.path-make>summary{cursor:pointer;font-weight:600}
.path-know details p{margin:8px 0 0;line-height:1.9}
.path-ans{min-height:48px;border:1px dashed var(--line);border-radius:10px;padding:8px;display:flex;flex-wrap:wrap;gap:6px;direction:ltr;margin-bottom:8px}
.path-pool{display:flex;flex-wrap:wrap;gap:6px;direction:ltr;margin-bottom:6px}
.path-pool .chip,.path-ans .chip{border:1px solid var(--line);background:var(--card);color:var(--text);cursor:pointer}
.path-pool .chip:disabled{opacity:.3}
.path-topics{margin:8px 0}
.path-topics .chip-s{cursor:pointer;border:1px solid var(--line);background:var(--card);color:var(--text);font:inherit;font-size:14px;padding:4px 10px;border-radius:999px}
.path-prompt,.path-paste{width:100%;margin-top:8px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--text);font:inherit;font-size:15px;line-height:1.7}
.path-paste{direction:ltr;text-align:left}
.path-res{margin-top:10px}
.path-lib{display:flex;gap:12px;align-items:center;justify-content:space-between;width:100%;text-align:right;padding:10px 14px;margin-top:8px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--text);cursor:pointer;font:inherit}
.path-lib .zh{font-family:var(--font-chinese);font-size:18px}
.path-opt{display:inline-flex;align-items:center;gap:6px}
.path-opt select{padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--text);font:inherit}
.path-revzone{margin-top:14px}
.path-flash{font-size:46px;text-align:center;margin:10px 0}
.path-flash-b{text-align:center;margin-bottom:10px}
.path-flash-b .py{color:var(--accent);direction:ltr}
.is-ok{color:var(--good);font-weight:600}
.is-bad{color:var(--bad);font-weight:600}
@media(max-width:640px){.path-title{font-size:25px}.path-grid{grid-template-columns:1fr 1fr}.path-body{padding:14px}}

/* ================= v5 — المسار الذهبي والواجهة ================= */
:root{ --gold:#c8921a; --gold2:#f7e7b6; --gold-ink:#7a5408; --gold-grad:linear-gradient(135deg,#f6d36b 0%,#d4a017 45%,#a86f06 100%); }
[data-theme="dark"]{ --gold:#e8b84a; --gold2:#3a2f14; --gold-ink:#f3d58a; }
.gold-btn{background:var(--gold-grad);color:#3a2600;border:1px solid #b9850f;font-weight:700;box-shadow:0 6px 16px rgba(200,146,26,.28)}
.gold-btn:hover{filter:brightness(1.06);color:#3a2600;border-color:#b9850f}
.chip-s.gold{background:var(--gold2);border-color:var(--gold);color:var(--gold-ink);font-weight:700}
button.link{background:none;border:0;padding:0;color:var(--accent-ink);font-size:14px;font-weight:600}
button.link:hover{text-decoration:underline}

/* الرئيسية: عبارة متناوبة + لوحة الاختيار */
.hero{align-items:stretch}
.hero-text{flex:1;min-width:0;position:relative;z-index:1}
.hero-quote{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;background:none;border:0;padding:0;margin:0 0 4px;color:#fff;text-align:right;cursor:pointer;font-weight:400}
.hero-quote:hover{color:#fff;border:0}
.hero-quote.in{animation:hqIn .6s ease}
.hq-zh{font-size:19px;font-weight:700;letter-spacing:1px}
.hq-py{font-family:var(--font-english);font-size:12px;opacity:.75;direction:ltr}
.hq-ar{font-size:14px;opacity:.85;flex-basis:100%}
@keyframes hqIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.choice{display:grid;grid-template-columns:1.25fr 1fr;gap:14px;margin:6px 0 12px}
.choice-card{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:right;padding:16px 18px;border-radius:18px;font:inherit;color:#fff;cursor:pointer;position:relative;overflow:hidden;min-height:150px}
.choice-card.gold{background:var(--gold-grad);color:#2d1d00;border:1px solid rgba(255,236,170,.9);box-shadow:0 10px 26px rgba(80,40,0,.35)}
.choice-card.gold:hover{color:#2d1d00;border-color:#fff;transform:translateY(-2px)}
.choice-card.gold::after{content:"✦";position:absolute;left:14px;top:6px;font-size:54px;opacity:.22}
.choice-card.free{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.35);cursor:default}
.choice-badge{font-size:13px;font-weight:700;padding:2px 10px;border-radius:999px;background:rgba(255,255,255,.35)}
.choice-card.free .choice-badge{background:rgba(255,255,255,.18)}
.choice-title{font-size:21px}
.choice-line{font-size:15px;line-height:1.6;opacity:.92}
.choice-meta{font-size:12px;opacity:.85}
.choice-bar{width:100%;height:7px;border-radius:7px;background:rgba(60,35,0,.2);overflow:hidden;margin-top:auto}
.choice-bar i{display:block;height:100%;background:#fff8dc}
.choice-acts{margin-top:auto}
.hero .choice-acts button{background:#fff;color:var(--accent-ink);border-color:#fff}
.hero-mini{align-items:center}
.hero-sys{font-family:var(--font-english);font-size:12px;opacity:.75}
@media(max-width:820px){.choice{grid-template-columns:1fr}.choice-card{min-height:auto}}

/* المسار الذهبي */
body.in-path nav.tabs button.active{background:var(--gold-grad);border-color:var(--gold);color:#2d1d00}
.path-hero{display:flex;gap:22px;align-items:center;justify-content:space-between;background:radial-gradient(120% 140% at 100% 0%,var(--gold2) 0%,var(--card) 60%);border-color:var(--gold);position:relative;overflow:hidden}
.path-hero::after{content:"金";position:absolute;left:10px;bottom:-40px;font-family:var(--font-chinese);font-size:170px;font-weight:700;color:var(--gold);opacity:.08;line-height:1}
.path-hero-txt{flex:1;min-width:0;position:relative;z-index:1}
.path-hero h2{margin:2px 0 6px}
.path-hero p{color:var(--muted);margin:0 0 14px}
.path-kicker{color:var(--gold-ink);font-weight:800;letter-spacing:.3px}
.path-ring{--p:0;width:118px;height:118px;flex:none;border-radius:50%;background:conic-gradient(var(--gold) calc(var(--p)*1%),var(--line) 0);display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.path-ring .ring-in{width:92px;height:92px;border-radius:50%;background:var(--card);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.3}
.path-ring b{font-family:var(--font-english);font-size:22px;color:var(--gold-ink)}
.path-ring span{font-size:12px;color:var(--muted);font-family:var(--font-english)}
.path-start>summary{cursor:pointer;font-weight:700}
.path-level{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:14px;box-shadow:var(--shadow);overflow:hidden}
.path-level>summary{display:flex;align-items:center;gap:12px;padding:14px 18px;cursor:pointer;list-style:none}
.path-level>summary::-webkit-details-marker{display:none}
.path-level[open]>summary{border-bottom:1px solid var(--line)}
.path-level .path-grid{padding:14px;margin:0}
.path-lv-badge{width:40px;height:40px;border-radius:12px;background:var(--gold-grad);color:#2d1d00;display:flex;align-items:center;justify-content:center;font-family:var(--font-english);font-weight:800;font-size:19px;flex:none}
.path-lv-t{display:flex;flex-direction:column;line-height:1.4;flex:1}
.path-lv-p{font-family:var(--font-english);font-size:13px;color:var(--muted)}
.path-bar.mini{width:90px;flex:none}
.path-st-n{background:var(--gold);color:#fff}
.path-st.done .path-st-n{background:var(--good)}
.path-st.current{border-color:var(--gold);box-shadow:0 0 0 3px var(--gold2)}
.path-st.current .path-st-m{color:var(--gold-ink);font-weight:700}
.path-art-n{background:var(--gold)}
.path-bar i{background:linear-gradient(90deg,var(--gold),var(--good))}
.path-stage-head h2{margin:10px 0 2px}
.path-stage-nav{justify-content:space-between;margin-bottom:18px}
.path-finish.full{border-color:var(--gold);background:radial-gradient(120% 120% at 0% 0%,var(--gold2),var(--card) 70%)}
.path-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;color:var(--muted);font-size:14px}
.path-crumbs>:last-child{margin-inline-start:auto}
.path-dots{display:flex;gap:6px;margin:12px 0 0}
.path-dots .pd{width:28px;height:8px;padding:0;border-radius:6px;background:var(--line);border:0}
.path-dots .pd.done{background:var(--good)}
.path-dots .pd.on{background:var(--gold);width:44px}
.path-line{position:relative;padding-inline-start:30px}
.path-ar-tg{position:absolute;right:0;top:6px;width:24px;height:24px;padding:0;border-radius:50%;font-size:12px;line-height:22px;opacity:.45}
.path-ar-tg:hover,.path-line.ar-on .path-ar-tg{opacity:1;border-color:var(--gold);color:var(--gold-ink)}
.path-line.ar-on .path-ar{display:block}
.path-body .w.p-focus .hz{border-bottom:2px solid var(--gold)}
.path-body .w.p-guest .hz{border-bottom:2px dotted var(--muted)}
.path-guests{margin-top:12px}
.path-guests .path-w{opacity:.8;border-style:dashed}
.path-w.zero{opacity:.65}
.path-score{margin-top:8px}
.confetti{position:fixed;inset:0;pointer-events:none;z-index:9999;overflow:hidden}
.confetti i{position:absolute;top:-12px;width:8px;height:14px;border-radius:2px;animation:conf 2.2s ease-in forwards}
@keyframes conf{to{transform:translateY(105vh) rotate(540deg);opacity:.2}}
@media(max-width:640px){.path-hero{flex-direction:column;align-items:flex-start}.path-ring{align-self:center}.path-bar.mini{display:none}}

/* الاستماع الجديد */
.seg{display:inline-flex;border:1px solid var(--line);border-radius:12px;overflow:hidden;margin:4px 0 10px;flex-wrap:wrap}
.seg button{border:0;border-radius:0;padding:7px 14px;font-size:15px;background:var(--card)}
.seg button+button{border-inline-start:1px solid var(--line)}
.seg button.on{background:var(--accent);color:#fff}
.seg.small{margin:0}.seg.small button{padding:4px 10px;font-size:13px}
.ls-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:12px}
.ls-card{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:right;padding:14px;border-radius:14px;font:inherit}
.ls-card-zh{font-size:20px;font-weight:600;direction:ltr;align-self:stretch;text-align:right}
.ls-card-m{display:flex;gap:6px;margin-top:6px}
.ls-bar{position:sticky;top:6px;z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px;margin:14px 0 6px;border:1px solid var(--line);border-radius:14px;background:var(--card);box-shadow:var(--shadow)}
.ls-play{min-width:110px}
.ls-lbl{font-size:13px;color:var(--muted)}
.ls-status{margin-inline-start:auto}
.ls-list{display:flex;flex-direction:column;gap:10px}
.ls-card-s{display:flex;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--bg);cursor:pointer;transition:.2s}
.ls-card-s.on{border-color:var(--accent);background:var(--card);box-shadow:0 0 0 3px var(--accent2)}
.ls-side{display:flex;flex-direction:column;align-items:center;gap:6px;flex:none}
.ls-n{font-family:var(--font-english);font-size:12px;color:var(--muted)}
.ls-ico{width:36px;height:36px;padding:0;border-radius:50%;font-size:16px}
.ls-rep-c{font-family:var(--font-english);font-size:12px;color:var(--accent-ink);font-weight:700;min-height:16px}
.ls-main{flex:1;min-width:0}
.ls-sp{font-weight:700;font-size:14px;color:var(--accent-ink)}
.ls-zh{direction:ltr;text-align:left;font-size:22px;padding:22px 0 0 !important;box-shadow:none;border:0;background:none;line-height:2.6 !important}
.ls-ar{color:var(--muted);font-size:16px;margin-top:2px}
.ls-list.no-py .ls-zh .py{display:none}.ls-list.no-py .ls-zh{padding-top:0 !important;line-height:2 !important}
.ls-list.no-ar .ls-ar{display:none}
.ls-reveal{display:none}
.ls-list.blind .ls-card-s:not(.revealed) .ls-zh,.ls-list.blind .ls-card-s:not(.revealed) .ls-ar{filter:blur(7px);pointer-events:none;user-select:none}
.ls-list.blind .ls-card-s:not(.revealed) .ls-reveal{display:inline-block;margin-top:6px}
.ls-notes h3{font-size:18px}
.ls-vocab{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 14px}
.ls-v{display:flex;flex-direction:column;align-items:flex-start;padding:6px 12px;border-radius:12px;font-weight:400;line-height:1.4;text-align:right}
.ls-v b{font-size:19px}.ls-v-py{font-family:var(--font-english);font-size:12px;color:var(--accent-ink)}.ls-v-ar{font-size:13px}.ls-v-lv{font-family:var(--font-english);font-size:11px;color:var(--muted)}
.ls-gram{padding:6px 0;border-top:1px dashed var(--line)}
@media(min-width:1000px){ #main:has(.ls-player){display:grid;grid-template-columns:1fr 300px;gap:18px;align-items:start} .ls-notes{position:sticky;top:12px} }

/* متفرقات */
.text-nav{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:10px 0 0;padding-top:10px;border-top:1px dashed var(--line)}
.culture-more{margin-top:auto}
.culture-more summary{cursor:pointer;font-weight:600;color:var(--accent-ink);font-size:15px}
.culture-occ{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.culture-occ-i{display:flex;gap:8px;align-items:center;text-align:right;padding:6px 10px;font-size:15px;font-weight:400;border-radius:10px}
.culture-occ-i .zh{direction:ltr}
.wbar-head{display:flex;flex-direction:column;align-items:center;gap:0;flex:none}
.wbar-k{font-size:12px;font-weight:700;color:var(--accent-ink);white-space:nowrap}
mark.fill-ans{background:var(--accent2);color:var(--accent-ink);border-radius:6px;padding:0 4px}
.my-ed{flex:none}
.hero .hero-quote,.hero .hero-quote:hover{background:none;border:0;box-shadow:none}
.path-lv-p,.path-ring span,.choice-meta b{direction:ltr;unicode-bidi:isolate}
.path-line{padding-inline-start:0;padding-left:34px}
.path-ar-tg{right:auto;left:0}
.ls-bar .chip{font-size:14px;padding:6px 12px;border-radius:999px}

/* ===== v6 (تدقيق 2026-11-11): خطوط صينية احتياطية — Google Fonts محجوب في الصين، وبدونها كان المتصفح يختار خطًّا يابانيًّا/تقليديًّا فتظهر الفاصلة 「，」 والنقطة 「。」 في غير موضعهما ===== */
:root{--font-chinese:'Noto Sans SC','PingFang SC','Hiragino Sans GB','Microsoft YaHei','Source Han Sans SC','Noto Sans CJK SC',sans-serif}
.alt-senses{margin:10px 0;padding:10px 12px;border-radius:12px;background:var(--accent2);border:1px dashed color-mix(in srgb,var(--accent) 45%,transparent);font-size:14.5px;line-height:1.8}
.alt-senses>b{display:block;margin-bottom:4px;color:var(--accent-ink,var(--accent))}
.alt-s{padding:4px 0;border-top:1px solid var(--line)}
.alt-s:first-of-type{border-top:0}
.alt-s .py{font-family:var(--font-english);color:var(--accent)}
/* علامات الترقيم الصينية تُحاذى مع صناديق الكلمات (كانت ترتفع فتبدو 「，」 كفاصلة علوية و「。」 كدائرة درجة) */
.pn{display:inline-flex;flex-direction:column;justify-content:flex-end;vertical-align:bottom;line-height:1.2}
.ctx-sense{margin:8px 0 4px;padding:8px 12px;border-radius:10px;background:color-mix(in srgb,var(--gold,#b45309) 14%,var(--card));border-inline-start:4px solid var(--gold,#b45309);font-size:16px}
.ctx-sense .py{font-family:var(--font-english);color:var(--gold,#b45309)}
.fav-explain{display:grid;gap:6px;padding:12px 14px;margin:0 0 14px;border-radius:12px;background:var(--accent2);font-size:15px;line-height:1.8}
.text-card.from-path .text-card-img{background:linear-gradient(135deg,#fde68a,#f59e0b)}
[data-theme="dark"] .text-card.from-path .text-card-img{background:linear-gradient(135deg,#78350f,#b45309)}
/* ضغطة مطوّلة: البينيين فوق الكلمة */
.w{-webkit-touch-callout:none}
.py-peek{position:absolute;transform:translate(-50%,-100%);z-index:9999;background:var(--text);color:var(--card);font:600 17px var(--font-english);padding:5px 12px;border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.25);pointer-events:none;animation:peekIn .12s ease-out}
.py-peek::after{content:"";position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);border:6px solid transparent;border-bottom:0;border-top-color:var(--text)}
@keyframes peekIn{from{opacity:0;transform:translate(-50%,-80%)}to{opacity:1;transform:translate(-50%,-100%)}}
/* كلمة العدّ */
.mw-box{margin:10px 0;padding:8px 12px;border-radius:12px;border:1px solid var(--line);font-size:14.5px;line-height:1.8}
.mw-box>summary{cursor:pointer;font-weight:700;color:var(--jade,#0f766e)}
.mw-info{display:grid;gap:2px;margin-top:6px;padding-top:6px;border-top:1px dashed var(--line)}
/* تحديد المستوى */
.place-welcome h3{margin-top:0}
.place-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-top:10px}
.place-c{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:right;padding:14px 16px;font-weight:400;background:var(--card);border:1px solid var(--line)}
.place-c b{font-size:17px}
.place-c span{font-size:13.5px;color:var(--muted)}
.place-c.gold{border-color:var(--gold,#b45309);background:color-mix(in srgb,var(--gold,#b45309) 10%,var(--card))}
.place-test{max-width:620px;margin-inline:auto;text-align:center}
.place-bar{height:6px;border-radius:6px;background:var(--line);overflow:hidden;margin:10px 0 18px}
.place-bar i{display:block;height:100%;background:var(--gold,#b45309);transition:width .3s}
.place-word{font:700 54px var(--font-chinese);margin:8px 0 18px}
.place-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.place-opts .opt{padding:12px;font-size:16px}
.place-skip{margin-top:14px}
.place-res{font-size:18px;font-weight:600;line-height:1.9}

/* ===== v6 (2026-11-11) ===== */
.chip.ui{font-family:var(--font-ui,var(--font-arabic));font-size:14px;padding:5px 12px}
.chip-wrap{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
/* السلسلة والتشخيص */
.streak-info{margin:12px 0;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--bg)}
.know-box{display:flex;flex-wrap:wrap;gap:5px;align-items:center;margin:6px 0}
.know-chip{font-size:12px;padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.know-chip.k2{background:color-mix(in srgb,var(--good) 14%,transparent);color:var(--good);border-color:color-mix(in srgb,var(--good) 40%,transparent)}
.know-chip.k1{background:color-mix(in srgb,var(--warn,#b45309) 12%,transparent);color:var(--warn,#b45309);border-color:color-mix(in srgb,var(--warn,#b45309) 40%,transparent)}
/* بنك الجمل */
.sent-list{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.sent-item{display:flex;gap:8px;align-items:flex-start;padding:8px 10px;border:1px solid var(--line);border-radius:10px}
.v6-sent{direction:ltr;text-align:left;font-size:19px;line-height:2}
/* نسبة المعرفة والتلوين */
.know-bar{display:flex;align-items:center;gap:10px;margin-top:10px}
.know-track{flex:0 0 140px;height:8px;border-radius:99px;background:color-mix(in srgb,#3b82f6 22%,transparent);overflow:hidden;display:flex}
.know-track i{display:block;height:100%}
.kb-k{background:var(--good)}.kb-l{background:var(--warn,#d97706)}
.text-card-tag.kp.good{background:color-mix(in srgb,var(--good) 18%,#fff);color:var(--good)}
.text-card-tag.kp.mid{background:color-mix(in srgb,#d97706 16%,#fff);color:#b45309}
.text-card-tag.kp.hard{background:color-mix(in srgb,#3b82f6 14%,#fff);color:#1d4ed8}
body.kc-on .w.ks-n .hz{box-shadow:inset 0 -2px 0 #3b82f6}
body.kc-on .w.ks-l .hz{background:linear-gradient(90deg,#d97706 55%,transparent 0) 0 100%/6px 2px repeat-x}
/* قبل القراءة */
.path-pre{margin:12px 0;padding:12px 14px;border-radius:12px;border:1px dashed var(--accent);background:color-mix(in srgb,var(--accent) 6%,transparent)}
.pre-q{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;margin-top:8px}
.pre-n{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--accent);color:#fff;font-size:13px;flex:0 0 auto}
.pre-a{flex-basis:100%;margin-inline-start:30px}.pre-a summary{cursor:pointer;color:var(--accent);font-size:14px}.pre-a p{margin:4px 0}
/* مرآة اللغتين والمصاحبات */
.mir-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px;margin-top:10px}
.mir-card{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:var(--card)}
.mir-card.compact{padding:10px 12px}
.mir-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.mir-zh{font-size:24px;direction:ltr;text-align:left}
.mir-card.compact .mir-zh{font-size:20px}
.mir-lit{color:var(--muted);font-size:14px;margin-top:4px}
.mir-ar{margin-top:4px}
.mir-note{font-size:14px;margin-top:6px;padding:6px 8px;border-radius:8px;background:var(--bg)}
.mir-exbox{margin-top:8px;border-top:1px dashed var(--line);padding-top:6px;position:relative}
.mir-exbox .ghost{position:absolute;top:4px;left:0}
.mir-ex{direction:ltr;text-align:left;font-size:18px;line-height:2;padding-left:34px}
.mir-in-text summary{cursor:pointer;font-weight:700}
.co-row{padding:8px 0;border-bottom:1px solid var(--line)}
.co-head{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.co-zh{font-size:20px}
.co-ex{margin-top:4px}
.colloc-box{margin:8px 0;padding:8px 10px;border-radius:10px;background:var(--bg);font-size:14px}
.colloc-row .link.zh{font-size:17px}
/* لوحة الكتابة الصينية */
.ime-fab{position:absolute;z-index:60;font-size:12px;padding:3px 8px;border-radius:8px;opacity:.85;display:none}
.ime-panel{position:fixed;left:0;right:0;bottom:0;z-index:300;background:var(--card);border-top:1px solid var(--line);box-shadow:0 -6px 20px rgba(0,0,0,.12);padding:10px 12px calc(10px + env(safe-area-inset-bottom));display:none}
.ime-row{display:flex;gap:8px;align-items:center}
.ime-py{flex:1;direction:ltr;text-align:left;font-size:18px}
.ime-cands{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0;min-height:38px;max-height:120px;overflow:auto}
.ime-c{font-family:var(--font-chinese);font-size:20px;padding:4px 10px;border-radius:8px}
.ime-c small{font-size:10px;color:var(--muted);margin-inline-end:3px;vertical-align:super}
.ime-punct{display:flex;gap:4px;flex-wrap:wrap}.ime-punct button{font-family:var(--font-chinese);min-width:36px;padding:4px}
body.ime-open{padding-bottom:180px}
/* محاكي HSK */
.game-tile.disabled{opacity:.45;cursor:not-allowed}
.hsk-mock{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px;padding:12px 14px;border:1px solid var(--accent);border-radius:12px}
.hsk-prog{height:6px;border-radius:99px;background:var(--line);overflow:hidden;margin:10px 0 6px}.hsk-prog i{display:block;height:100%;background:var(--accent)}
.hsk-passage{direction:ltr;text-align:left;font-size:19px;line-height:2.1;padding:10px 12px;border-radius:10px;background:var(--bg);margin-bottom:10px}
.hsk-star,.hsk-qq{direction:ltr;text-align:left;font-size:20px;line-height:2.1;margin:8px 0}
.hsk-blank{color:var(--accent);font-weight:700;font-family:var(--font-chinese)}
.hsk-pyblank{display:inline-flex;flex-direction:column;align-items:center;vertical-align:bottom;line-height:1.2;color:var(--accent);font-family:var(--font-chinese)}
.hsk-pyblank small{font-size:13px;font-family:var(--font-english,sans-serif)}
.hsk-slot{min-height:52px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:8px;border:2px dashed var(--line);border-radius:10px;direction:ltr}
.hsk-bank{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;direction:ltr}
.hsk-by{margin-top:8px;font-size:15px}
.hsk-q .opt.zh-s{font-family:var(--font-chinese);font-size:18px;text-align:left;direction:ltr}
/* تحدّ نفسك */
.climb-sent{direction:ltr;text-align:left;display:flex;flex-wrap:wrap;gap:2px 4px;font-size:26px;line-height:1.5;margin:10px 0;align-items:flex-start}
.climb-w{display:inline-flex;flex-direction:column;align-items:center}
.climb-q{font-size:11px;line-height:1;padding:2px 7px;border-radius:99px;margin-top:2px;opacity:.55;font-family:var(--font-ui,var(--font-arabic))}
.climb-w:hover .climb-q,.climb-w.open .climb-q{opacity:1}
.climb-w.asked .climb-hz{color:var(--accent)}
.climb-w.open .climb-q{background:var(--accent);color:#fff;border-color:var(--accent)}
.climb-sent .pn{align-self:flex-start}
.climb-slot{position:relative}
.climb-slot:not(:empty)::before{content:"";position:absolute;top:-8px;left:var(--ax,30px);border:8px solid transparent;border-top:0;border-bottom-color:var(--accent);transform:translateX(-50%)}
.climb-card{border:2px solid var(--accent);border-radius:12px;padding:10px 12px;background:var(--card)}
.climb-ex{margin-top:6px}.climb-ex .zh-s{direction:ltr;text-align:left;font-size:18px;line-height:2}
.climb-tr{text-align:center;margin-top:10px;padding:8px;border-radius:10px;background:var(--bg)}
/* ذاكرة البطاقات */
.mem-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}
@media(max-width:520px){.mem-grid{grid-template-columns:repeat(3,1fr)}}
.mem-card{position:relative;height:84px;border-radius:12px;padding:6px;font-size:15px;perspective:600px}
.mem-card .mem-face{display:none}.mem-card .mem-back{font-family:var(--font-chinese);font-size:26px;opacity:.35}
.mem-card.up .mem-face{display:block}.mem-card.up .mem-back{display:none}
.mem-card.up{background:var(--accent2);border-color:var(--accent)}
.mem-card.done{background:color-mix(in srgb,var(--good) 18%,transparent);border-color:var(--good);pointer-events:none}
.mem-face.zh{font-family:var(--font-chinese);font-size:24px}
/* مطر الكلمات */
.rain-sky{position:relative;height:260px;border-radius:14px;overflow:hidden;margin:10px 0;background:linear-gradient(#dbeafe,#eff6ff)}
[data-theme=dark] .rain-sky{background:linear-gradient(#0f172a,#1e293b)}
.rain-drop{position:absolute;top:0;transform:translateX(-50%);font-size:30px;padding:4px 12px;border-radius:12px;background:var(--card);box-shadow:var(--shadow);transition:opacity .3s}
.rain-drop.pop{opacity:0;transform:translateX(-50%) scale(1.4);transition:.3s}
.rain-drop.splash{background:color-mix(in srgb,var(--bad) 20%,var(--card))}
.rain-ground{position:absolute;bottom:0;left:0;right:0;height:16%;background:linear-gradient(transparent,color-mix(in srgb,#16a34a 35%,transparent))}
bdi.zh-i{font-family:var(--font-chinese)}

/* ================= الحساب والمزامنة ================= */
.acc-btn{min-width:38px;font-weight:800;font-family:var(--font-english)}
.acc-btn.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.acc-btn.err{box-shadow:0 0 0 2px var(--bad)}
.acc{max-width:560px;margin-inline:auto}
.acc-head{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.acc-avatar{width:56px;height:56px;border-radius:50%;background:var(--gold-grad,var(--accent));color:#2d1d00;display:flex;align-items:center;justify-content:center;font:800 24px var(--font-english)}
.acc-sync{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:12px;background:var(--accent2);margin-bottom:12px}
.acc-sync.bad{background:#fee2e2;color:#7f1d1d}
.acc-box{border-top:1px solid var(--line);padding:12px 0;margin-top:12px}
.acc-box>summary{cursor:pointer;font-weight:600}
.acc-box.danger>summary{color:var(--bad)}
.acc-form{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.acc-form input{padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--text);font:inherit;font-size:16px}
.acc-or{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:14px;margin:16px 0 6px}
.acc-or::before,.acc-or::after{content:"";flex:1;height:1px;background:var(--line)}
.g-btn{display:flex;align-items:center;justify-content:center;gap:10px;padding:11px 16px;border:1px solid var(--line);border-radius:12px;background:#fff;color:#1f1f1f;font-weight:700;text-decoration:none;box-shadow:var(--shadow)}
.g-btn:hover{border-color:#4285f4}
.g-logo{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:800 15px var(--font-english);color:#fff;background:conic-gradient(#ea4335 0 25%,#fbbc05 0 50%,#34a853 0 75%,#4285f4 0)}
.acc-box.warn{background:#fff7e6;border:1px solid #f3d38a;border-radius:12px;padding:10px 12px}
[data-theme="dark"] .acc-box.warn{background:#3a2e12;border-color:#6b5420}
.acc-legal{margin-top:14px;text-align:center}
.acc-legal a,.acc-forgot{color:var(--accent);text-decoration:underline}
a.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border:1px solid var(--line);border-radius:10px;text-decoration:none;color:var(--text);background:var(--card)}