/* عرض المعلم المصمم (خطة العروض §٨): شريحة ١٦:٩ مقفلة تكبر وتصغر كلها معا كشريحة باوربوينت.
   الالوان والقواعد من مرجع تصميم عروض المعلم في مستودع المحرك (DECK-DESIGN-REFERENCE-v1 §٢):
   ارضية هادئة وبطاقات بيضاء · ازرق للمفهوم · اخضر للمثال والصواب · برتقالي للتنبيه والخطا (لا احمر).
   وحدة القياس داخل الشريحة em: عرض الشريحة 44em وارتفاعها 24.75em في كل مقاس، فلا يقص نص بتغير الشاشة.
   والشريحة فاتحة دائما كشريحة العرض على البروجكتور، فلا وضع داكن لها. والرموز على .dk لا :root،
   فلا تمس رموز التطبيق الذي يحملها. */

.dk {
  --ink: #14223a; --muted: #52627c; --canvas: #f1f5fa; --line: #d8e1ec; --chrome: #f4f7fb; --chrome-line: #dde3ee; --white: #ffffff;
  --blue: #1565a8; --blue-d: #0d4a80; --blue-t: #e7f0fa; --blue-m: #7fb3e0;
  --green: #1a7f4b; --green-d: #0f4a2c; --green-t: #e4f4ea;
  --orange: #c2410c; --orange-d: #8a2c08; --orange-t: #fdeee5;
  --counter: #f4c43a; --counter-hi: #ffe08a; --counter-line: #a87a00; --neg: #c8382f; --neg-hi: #e8695f; --neg-line: #7f1d17;
  --tile: #1e8a52; --tile-line: #0f5c35; --mat: #f6efe0; --mat-line: #c9b48a; --cup: #cfe9f7; --cup-line: #4e8fb5;
  --hl-a: #fbd3e6; --hl-b: #cdeedb; --hl-c: #cfe6fb;
  --board: #1f3b31; --chalk: #f3f0e4; --chalk-dim: #aebfb6; --chalk-ans: #ffe08a;
  --font: "Thmanyah Sans", "Noto Sans Arabic App", "Noto Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif;
  color-scheme: light;
  direction: rtl; display: flex; flex-direction: column; height: 100%; min-height: 0; font-family: var(--font); color: var(--ink); background: var(--chrome);
  -webkit-tap-highlight-color: transparent;
}
.dk-host { height: 100%; }
.dk *, .dk *::before, .dk *::after { box-sizing: border-box; }
.dk button { font-family: inherit; color: inherit; line-height: 1.25; }
.dk :focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }
.dk [hidden] { display: none !important; }

/* ── الاطار: العنوان والتقدم فوق، والاسهم الصغيرة تحت ── */
.dk-top { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; min-height: 52px; background: var(--white); border-bottom: 1px solid var(--chrome-line);
  padding-block: 6px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.dk-ttl { flex: 1 1 auto; min-width: 0; font-size: clamp(16px, 2.6vh, 30px); font-weight: 700; color: var(--blue); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dk-tb { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 12px; border-radius: 10px; border: 2px solid #c9d4e3;
  background: var(--white); color: var(--muted); font-weight: 700; font-size: clamp(13px, 1.9vh, 20px); cursor: pointer; white-space: nowrap; text-decoration: none; }
.dk-tb:hover { border-color: var(--blue); color: var(--blue); }
.dk-tb svg { width: 1.15em; height: 1.15em; display: block; flex: 0 0 auto; }
.dk-prog { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.dk-segs { display: flex; gap: 2px; width: clamp(110px, 26vw, 520px); }
.dk-seg { flex: 1 1 0; min-width: 3px; height: 22px; padding: 0; border: 0; background: none; cursor: pointer; display: flex; align-items: center; }
.dk-seg::before { content: ""; display: block; width: 100%; height: 8px; border-radius: 2px; background: var(--chrome-line); transition: background .2s, transform .2s; }
.dk-seg.is-done::before { background: var(--blue-m); }
.dk-seg.is-cur::before { background: var(--blue); transform: scaleY(1.5); }
.dk-count { font-size: clamp(11px, 1.6vh, 18px); color: var(--muted); font-weight: 600; font-variant-numeric: tabular-nums; }
@media (max-width: 760px) { .dk-tb .lb { display: none; } .dk-segs { width: 90px; } }

.dk-stage { flex: 1 1 auto; min-width: 0; min-height: 0; display: flex; align-items: center; justify-content: center; padding: 4px 8px;
  cursor: pointer; -webkit-user-select: none; user-select: none; }
.dk-frame { position: relative; flex: 0 0 auto; overflow: hidden; background: var(--canvas); border: 3px solid var(--blue); border-radius: 14px; font-size: var(--fs, 16px); line-height: 1.4; }
.dk-pnav { flex: 0 0 auto; display: flex; align-items: center; justify-content: flex-end; gap: 10px;
  padding-block: 4px 8px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.dk-arw { width: 46px; height: 46px; padding: 0; border-radius: 50%; border: 2px solid #c9d4e3; background: var(--white); color: var(--muted); cursor: pointer; opacity: .85;
  display: flex; align-items: center; justify-content: center; }
.dk-arw svg { width: 22px; height: 22px; display: block; }
.dk-arw:hover { opacity: 1; border-color: var(--blue); color: var(--blue); }
.dk-arw:disabled { opacity: .3; cursor: default; }
@media (max-height: 500px) { .dk-top { min-height: 40px; padding-block: 3px; } .dk-pnav { padding-block: 2px 4px; } .dk-arw { width: 44px; height: 44px; } }

/* ── داخل الشريحة ── */
.dk-sc { position: absolute; inset: 0; --acc: var(--blue); --acc-t: var(--blue-t); }
.dk-sc.is-example { --acc: var(--green); --acc-t: var(--green-t); }
.dk-sc.is-practice { --acc: var(--blue-d); --acc-t: var(--blue-t); }
.dk-deco { position: absolute; inset: 0; pointer-events: none; }
.dk-deco svg { display: block; width: 100%; height: 100%; }
.dk-abs { position: absolute; display: flex; align-items: center; justify-content: center; text-align: center; min-width: 0; }
.dk-hd { justify-content: flex-start; gap: .5em; text-align: right; font-size: 1.5em; font-weight: 700; line-height: 1.2; color: var(--ink); padding: 0 0 .16em;
  background: linear-gradient(var(--acc), var(--acc)) right bottom / 2.2em .1em no-repeat; }
.dk-kick { flex: 0 0 auto; font-size: .55em; font-weight: 700; color: var(--acc); background: var(--acc-t); border-radius: 2em; padding: .2em .9em; line-height: 1.5; }
.dk-card { background: var(--white); border-radius: .5em; box-shadow: 0 .06em .28em rgba(20, 34, 58, .12), 0 0 0 .03em var(--line); }
.dk-ptl { font-size: .72em; font-weight: 700; color: var(--muted); line-height: 1.3; }
.dk-txt { justify-content: flex-start; text-align: right; font-weight: 500; line-height: 1.5; }

/* الكشف المتدرج: ما لم يحن مكانه محجوز، فلا يقفز ما حوله */
.dk-rv { opacity: 0; visibility: hidden; transition: opacity .35s, visibility 0s .35s; }
.dk-rv.on { opacity: 1; visibility: visible; transition: opacity .35s; }
.dk-still, .dk-still * { transition: none !important; }

/* الرياضيات: عربية من اليمين بارقام الكتاب، والسطر لا ينكسر */
.dk-m { direction: rtl; unicode-bidi: isolate; white-space: nowrap; font-variant-numeric: tabular-nums; font-weight: 700; }
.dk-nw { white-space: nowrap; }
.dk-qeq { position: relative; display: inline-block; }
.dk-qeq::before { content: "؟"; position: absolute; top: -.62em; left: 50%; transform: translateX(-50%); font-size: .6em; line-height: 1; }
/* تظليل الكتاب: الكلمة في النص ونظيرتها في المعادلة باللون نفسه */
.dk-hl { border-radius: .2em; padding: 0 .15em; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.dk-hl.is-a { background: var(--hl-a); }
.dk-hl.is-b { background: var(--hl-b); }
.dk-hl.is-c { background: var(--hl-c); }

/* جدول خطوات الحل: الحد تحت الحد كما في الكتاب */
.dk-eqs { display: grid; grid-template-columns: repeat(5, max-content); justify-content: center; align-content: start; row-gap: .28em; }
.dk-eqs.has-notes { grid-template-columns: repeat(5, max-content) minmax(0, 1fr); justify-content: stretch; }
.dk-eqs > .dk-row { display: contents; }
.dk-c { padding: .05em .28em; text-align: center; white-space: nowrap; font-weight: 700; font-variant-numeric: tabular-nums; direction: rtl; unicode-bidi: isolate; }
.dk-c.is-tag { color: var(--acc); padding-left: .6em; text-align: right; }
.dk-c.is-note { text-align: right; font-weight: 500; font-size: .74em; color: var(--blue-d); padding-right: 1.2em; white-space: normal; align-self: center; }
.dk-row.is-op .dk-c:not(.is-note):not(.is-tag) { color: var(--blue); border-bottom: .08em solid var(--ink); }
.dk-row.is-ok .dk-c:not(.is-note):not(.is-tag) { color: var(--green); }
.dk-row.is-ok .dk-c.is-note { color: var(--green-d); font-weight: 700; }
.dk-row.is-res .dk-c:not(.is-note):not(.is-tag) { color: var(--green-d); }

/* السطر الشارح تحت المشهد: يتبدل مع كل نقرة */
.dk-say { justify-content: flex-start; text-align: right; background: var(--white); color: var(--ink); border-radius: .45em; border-right: .22em solid var(--acc);
  padding: 0 .8em; font-weight: 600; line-height: 1.35; box-shadow: 0 .06em .28em rgba(20, 34, 58, .12); }
.dk-say0 { position: absolute; inset: 0; }
.dk-swap { position: absolute; inset: 0; display: flex; align-items: center; padding: 0 .8em; border-radius: .45em; }
.dk-swap.is-key { background: var(--green-t); color: var(--green-d); }
.dk-say:has(.dk-swap.is-key.on) { border-right-color: var(--green); }

/* ── قطع النماذج: الكوب وقطع العد وبطاقات الجبر ── */
.dk-pc { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; line-height: 1; direction: rtl; unicode-bidi: isolate; }
.dk-pc.pc-1, .dk-pc.pc-m1 { width: 1.9em; height: 1.9em; border-radius: .28em; font-size: 1em; box-shadow: inset 0 -.08em 0 rgba(0, 0, 0, .12); }
.dk-pc.pc-1 { color: #5a4100; background: linear-gradient(145deg, var(--counter-hi), var(--counter) 60%); border: .08em solid var(--counter-line); }
.dk-pc.pc-m1 { color: var(--white); background: linear-gradient(145deg, var(--neg-hi), var(--neg) 60%); border: .08em solid var(--neg-line); font-size: .9em; width: 2.1em; height: 2.1em; }
.dk-pc.pc-x { width: 1.6em; height: 4.1em; border-radius: .25em; color: var(--white); font-size: 1.05em; background: linear-gradient(90deg, var(--tile), #26a463 50%, var(--tile));
  border: .08em solid var(--tile-line); }
.dk-pc.pc-p, .dk-pc.pc-n { width: 1.7em; height: 1.7em; border-radius: 50%; font-size: 1.1em; box-shadow: inset 0 -.08em 0 rgba(0, 0, 0, .15); }
.dk-pc.pc-p { color: #5a4100; background: radial-gradient(circle at 35% 30%, var(--counter-hi), var(--counter) 65%); border: .08em solid var(--counter-line); }
.dk-pc.pc-n { color: var(--white); background: radial-gradient(circle at 35% 30%, var(--neg-hi), var(--neg) 65%); border: .08em solid var(--neg-line); }
.dk-pc.pc-cup { width: 2.6em; height: 3.2em; }
.dk-pc.pc-cup svg { display: block; width: 100%; height: 100%; }
/* القطعة داخل سطر نص: اصغر وفي منتصف السطر */
.dk-inl { display: inline-flex; vertical-align: middle; font-size: .62em; margin: 0 .15em; }
.dk-inl.pc-x { height: 2.3em; width: 1.3em; font-size: .6em; }
.dk-inl.pc-cup { height: 2.2em; width: 1.9em; }

/* ── لوحة المعادلة ── */
.dk-mat { flex-direction: column; gap: .35em; padding: .45em .6em .6em; }
.dk-pans { flex: 1 1 auto; width: 100%; min-height: 0; display: flex; align-items: stretch; gap: .5em; }
.dk-pan { flex: 1 1 0; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; align-content: center; justify-content: center; gap: .45em;
  background: var(--mat); border: .07em solid var(--mat-line); border-radius: .45em; padding: .4em; }
.dk-eq { flex: 0 0 auto; align-self: center; font-size: 1.6em; font-weight: 700; color: var(--ink); }
.dk-grp { display: flex; flex-direction: column; align-items: center; gap: .35em; padding: .22em; border-radius: .45em; border: .09em solid transparent;
  transition: border-color .3s, background .3s, transform .6s ease-in, opacity .6s ease-in, visibility 0s; }
.dk-grp.is-row { flex-direction: row; }
.dk-grp.is-ring { border-color: var(--blue); background: var(--blue-t); }
.dk-grp.is-off { transform: translateY(-3.2em); opacity: 0; visibility: hidden; transition: transform .6s ease-in, opacity .6s ease-in, visibility 0s .6s; }
.dk-pans .is-hide { opacity: 0; visibility: hidden; transform: translateY(-1.2em); }
.dk-pans .dk-pc { transition: opacity .45s, transform .45s, box-shadow .3s; }
.dk-pans .dk-pc.is-new { box-shadow: 0 0 0 .14em var(--blue); }
.dk-pans.is-done .dk-pc { box-shadow: 0 0 0 .14em var(--green); }
.dk-sym { flex-direction: column; justify-content: flex-start; gap: .55em; padding: .45em .8em .6em; }
.dk-sym .dk-eqs { font-size: 1.25em; }
.dk-static { flex-direction: column; gap: .3em; padding: .4em .5em; }
.dk-static .dk-pans { font-size: .8em; }
.dk-static .dk-ptl, .dk-tblc .dk-ptl { text-align: right; }
.dk-mnote { width: 100%; text-align: right; font-size: .78em; font-weight: 600; line-height: 1.4; color: var(--muted); }
.dk-mnote .dk-inl { font-size: .8em; }
.dk-mcap { display: flex; width: 100%; gap: .5em; font-size: .78em; font-weight: 700; color: var(--muted); }
.dk-mcap span { flex: 1 1 0; text-align: center; }
.dk-mcap span.eq { flex: 0 0 auto; }

/* ── الميزان: العدد نفسه يطرح من الكفتين او يضاف اليهما فيبقى متوازنا ── */
.dk-bal { padding: .3em; }
.dk-bal svg { display: block; width: 100%; height: 100%; overflow: visible; }
.dk-bal .rm, .dk-bal .ad { transition: transform .7s ease-in, opacity .7s ease-in; transform-box: fill-box; }
.dk-bal .ad { transform: translateY(-70px); opacity: 0; }
.dk-sc.k1 .dk-bal .rm { transform: translateY(-70px); opacity: 0; }
.dk-sc.k1 .dk-bal .ad { transform: none; opacity: 1; }
.dk-bal .n1 { transition: opacity .3s; }
.dk-bal .n2 { opacity: 0; transition: opacity .3s .5s; }
.dk-sc.k1 .dk-bal .n1 { opacity: 0; }
.dk-sc.k1 .dk-bal .n2 { opacity: 1; }

/* ── سطور المفهوم: تسمية وقاعدة ── */
.dk-def { justify-content: flex-start; align-items: flex-start; gap: .7em; text-align: right; padding: .45em .8em; }
.dk-lab { flex: 0 0 5.6em; font-weight: 700; color: var(--acc); line-height: 1.45; }
.dk-dt { flex: 1 1 auto; min-width: 0; font-weight: 500; line-height: 1.45; }
.dk-dt .dk-m { color: var(--ink); }
.dk-exs { display: flex; gap: 2.4em; }
.dk-ex { display: flex; flex-direction: column; align-items: center; gap: .1em; }
.dk-ex .dk-ptl { font-size: .8em; }
.dk-ex .dk-eqs { font-size: .95em; }

/* ── العنوان ── */
.dk-tcol { flex-direction: column; align-items: flex-start; justify-content: center; gap: .75em; text-align: right; }
.dk-tkick { font-size: .9em; font-weight: 700; color: var(--acc); background: var(--acc-t); border-radius: 2em; padding: .18em .9em; line-height: 1.5; }
.dk-t1 { font-size: 2.4em; line-height: 1.15; color: var(--ink); font-weight: 700; text-wrap: balance; }
.dk-t1 .acc { display: block; color: var(--acc); }
.dk-goal { display: flex; align-items: center; gap: .6em; background: var(--white); border-radius: .5em; padding: .55em .9em; font-size: .95em; font-weight: 500; line-height: 1.45;
  box-shadow: 0 .06em .28em rgba(20, 34, 58, .12); border-right: .2em solid var(--green); }
.dk-goal b { color: var(--green-d); }
.dk-gico { flex: 0 0 auto; width: 1.25em; height: 1.25em; border-radius: 50%;
  background: radial-gradient(circle, var(--green) 0 20%, var(--white) 21% 40%, var(--green) 41% 60%, var(--green-t) 61%); }
/* لوحة العنوان: هامشها اضيق من البطاقة فيتسع صف من ثلاث بطاقات جبر في كل مقاس */
.dk-tart { padding: .6em; }

/* ── المثال: المسالة والهدف ── */
.dk-prob { justify-content: flex-start; gap: .6em; text-align: right; padding: 0 .9em; font-weight: 700; font-size: 1.12em; line-height: 1.45; }
.dk-prob.is-long { font-size: .92em; font-weight: 500; align-items: center; }
.dk-badge { flex: 0 0 auto; width: 1.6em; height: 1.6em; border-radius: 50%; background: var(--acc); color: var(--white); display: flex; align-items: center; justify-content: center;
  font-size: .8em; font-weight: 700; }
.dk-prob.is-long .dk-badge { font-size: .9em; }
.dk-side { flex-direction: column; align-items: stretch; justify-content: flex-start; gap: .4em; padding: .6em .8em; text-align: right; }
.dk-side .dk-say0 { position: relative; inset: auto; flex: 1 1 auto; }
.dk-side .dk-swap { align-items: flex-start; bottom: auto; padding: .3em .5em; font-weight: 600; line-height: 1.45; font-size: .95em; }
.dk-solve { align-items: flex-start; justify-content: flex-start; padding: .55em 1em; font-size: 1.12em; }
.dk-solve .dk-eqs { width: 100%; }

/* ── المسالة اللفظية: التعبير اللفظي ⇐ المتغير ⇐ المعادلة ── */
.dk-tr { flex-direction: column; align-items: stretch; justify-content: center; gap: .35em; padding: .5em .9em; }
.dk-trr { display: flex; align-items: center; gap: .7em; min-height: 2.2em; }
.dk-trl { flex: 0 0 5.2em; display: flex; flex-direction: column; align-items: center; font-size: .72em; font-weight: 700; color: var(--blue-d); text-align: center; line-height: 1.25; }
.dk-trl::after { content: ""; display: block; width: 0; height: 0; margin-top: .25em; border-left: .6em solid transparent; border-right: .6em solid transparent; border-top: .5em solid var(--blue-m); }
.dk-trr:last-child .dk-trl::after { display: none; }
.dk-trt { flex: 1 1 auto; min-width: 0; text-align: right; font-weight: 600; line-height: 1.45; font-size: .95em; padding: .1em .15em; } /* هامش جانبي لحشوة التظليل عند طرف السطر */
.dk-ans { justify-content: flex-start; text-align: right; background: var(--green-t); color: var(--green-d); border-radius: .45em; border-right: .22em solid var(--green);
  padding: 0 .8em; font-weight: 700; line-height: 1.35; }

/* ── تحقق من فهمك: الخيارات والتغذية الراجعة ── */
/* .35em: على 1280 و1366 يكبر زر «الحل» الى ٤٤ بكسل (حد اللمس) فيحتاج العمود فسحة */
.dk-qcol { flex-direction: column; align-items: stretch; justify-content: flex-start; gap: .35em; }
.dk-qhd { display: flex; align-items: center; gap: .5em; background: var(--white); border-radius: .45em; padding: .35em .7em; box-shadow: 0 .06em .28em rgba(20, 34, 58, .12);
  text-align: right; line-height: 1.4; }
.dk-qhd.is-stem { font-size: .82em; font-weight: 600; align-items: flex-start; }
.dk-ql { flex: 0 0 auto; width: 1.6em; height: 1.6em; border-radius: 50%; background: var(--blue); color: var(--white); display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: .85em; }
.dk-qhd .dk-m { font-size: 1.12em; }
.dk-ogrid { display: grid; gap: .45em; }
.dk-opt { min-height: max(var(--minhit, 0px), 2.3em); display: flex; align-items: center; justify-content: center; gap: .5em; background: var(--white); color: var(--ink); border: .07em solid #cfd9e6; border-radius: .45em;
  box-shadow: 0 .05em .18em rgba(20, 34, 58, .1); font-weight: 700; font-size: 1em; cursor: pointer; padding: 0 .6em; }
.dk-opt.is-long { justify-content: flex-start; text-align: right; white-space: normal; font-size: .8em; font-weight: 600; line-height: 1.35; padding: .35em .6em; min-height: 2.6em; }
.dk-olet { flex: 0 0 auto; width: 1.5em; height: 1.5em; border-radius: 50%; background: var(--blue-t); color: var(--blue-d); display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: .85em; }
.dk-opt:hover { border-color: var(--blue); }
.dk-opt.is-sel { border-color: var(--green); background: var(--green-t); color: var(--green-d); box-shadow: 0 0 0 .1em var(--green); }
.dk-opt.is-sel .dk-olet { background: var(--green); color: var(--white); }
.dk-opt.is-wrong { border-color: var(--orange); background: var(--orange-t); color: var(--orange-d); opacity: .85; }
.dk-opt.is-wrong .dk-olet { background: var(--orange); color: var(--white); }
.dk-opt.is-done:not(.is-sel) { opacity: .5; }
.dk-solb { align-self: flex-start; flex: 0 0 auto; min-height: max(var(--minhit, 0px), 1.9em); min-width: var(--minhit, 0px); display: inline-flex; align-items: center; gap: .35em; padding: 0 .8em; border-radius: .45em;
  border: .08em solid var(--blue); background: var(--white); color: var(--blue); font-weight: 700; font-size: .78em; cursor: pointer; white-space: nowrap; }
.dk-solb:hover { background: var(--blue-t); }
.dk-fb { justify-content: flex-start; text-align: right; color: var(--muted); background: var(--white); border: .06em dashed #b9c8db; border-radius: .4em;
  padding: 0 .8em; font-weight: 600; line-height: 1.35; font-size: .92em; }
.dk-fb.is-ok { color: var(--green-d); background: var(--green-t); border: 0; border-right: .2em solid var(--green); }
.dk-fb.is-no { color: var(--orange-d); background: var(--orange-t); border: 0; border-right: .2em solid var(--orange); }
.dk-fb.is-end { color: var(--white); background: var(--green); border: 0; font-weight: 700; }

/* ── تمارين الكتاب: كل سؤال برقمه وزر حله ── */
.dk-lead { justify-content: flex-start; text-align: right; font-weight: 700; font-size: .95em; line-height: 1.4; }
.dk-qgrid { display: grid; align-content: start; gap: .55em .9em; }
.dk-qc { display: flex; align-items: center; gap: .6em; background: var(--white); border-radius: .5em; padding: .45em .7em; min-width: 0;
  box-shadow: 0 .06em .28em rgba(20, 34, 58, .12), 0 0 0 .03em var(--line); }
.dk-qc.is-col { flex-direction: column; align-items: stretch; }
.dk-qc .dk-qrow { display: flex; align-items: center; gap: .6em; min-width: 0; }
.dk-qn { flex: 0 0 auto; min-width: 1.75em; height: 1.75em; padding: 0 .3em; border-radius: .9em; background: var(--acc); color: var(--white); display: flex; align-items: center;
  justify-content: center; font-weight: 700; font-size: .78em; font-variant-numeric: tabular-nums; }
.dk-qt { flex: 1 1 auto; min-width: 0; text-align: right; line-height: 1.45; font-weight: 500; padding-block: .1em; }
.dk-qt .dk-m { font-size: 1.1em; line-height: 1.3; }
.dk-qt.is-eq { display: flex; align-items: center; }
.dk-qt.is-eq .dk-m { line-height: 1.7; }
.dk-qt b { color: var(--blue-d); }
.dk-qc .dk-solb { align-self: center; font-size: .7em; min-height: max(var(--minhit, 0px), 2.2em); padding: 0 .7em; }
.dk-qc.is-col .dk-solb { align-self: flex-start; }
.dk-qc .dk-pans { min-height: 5.5em; font-size: .72em; }
.dk-fig { padding: .5em; }
.dk-fig svg { display: block; width: 100%; height: 100%; overflow: visible; }
.dk-tblc { flex-direction: column; align-items: stretch; justify-content: flex-start; padding: .45em; }
.dk-tbl { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.dk-tbl th, .dk-tbl td { border: .05em solid #e3c79b; padding: .25em .4em; text-align: center; line-height: 1.3; }
.dk-tbl th { background: #fbe3b8; color: #5a3a00; font-weight: 700; font-size: .85em; }
.dk-tbl td { font-weight: 600; }
.dk-tbl tr:nth-child(even) td { background: #fffaf0; }
.dk-tbl td.is-h { font-weight: 700; color: var(--blue-d); }
.dk-chip { justify-content: flex-start; gap: .5em; text-align: right; font-size: .78em; font-weight: 600; color: var(--muted); }
.dk-chip b { color: var(--blue-d); }

/* ── جدول المفاهيم (النماذج) ── */
.dk-tblx { padding: .4em .5em; }
.dk-tblx .dk-tbl { height: 100%; }
.dk-tblx th { font-size: .9em; }
.dk-tblx td { vertical-align: middle; height: 3.4em; }
.dk-tblx td .dk-pc { margin: 0 auto; }
.dk-tblx td .dk-inl { font-size: 1em; }

/* ── الملاحظة: ارشادات للدراسة · الربط مع الحياة · المفردات ── */
.dk-notes { flex-direction: column; align-items: stretch; justify-content: center; gap: .7em; }
.dk-note { display: flex; flex-direction: column; gap: .3em; background: var(--white); border-radius: .5em; padding: .7em 1em; text-align: right; line-height: 1.5;
  box-shadow: 0 .06em .28em rgba(20, 34, 58, .12); border-right: .22em solid var(--acc); }
.dk-note h3 { margin: 0; font-size: 1em; font-weight: 700; color: var(--acc); }
.dk-note p { margin: 0; font-weight: 500; }
.dk-note .src { font-size: .78em; color: var(--muted); font-weight: 600; }
.dk-photo { position: absolute; overflow: hidden; border-radius: .5em; box-shadow: 0 .06em .28em rgba(20, 34, 58, .2); }
.dk-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dk-art { display: flex; align-items: center; justify-content: center; gap: .6em; font-size: 1.4em; font-weight: 700; }

/* ── الاشكال: صندوق حر · كسر · اس · مستوى احداثي · صورة من الكتاب ── */
.dk-x { flex-direction: column; align-items: stretch; justify-content: flex-start; gap: .3em; padding: .4em .5em; }
.dk-x.dk-card { padding: .45em .6em; }
.dk-x > .dk-ptl { flex: 0 0 auto; text-align: right; }
.dk-x > :not(.dk-ptl) { flex: 1 1 auto; min-height: 0; }
.dk-fsvg { width: 100%; height: 100%; min-height: 0; }
.dk-fsvg svg { display: block; width: 100%; height: 100%; overflow: visible; }
.dk-fph { position: relative; width: 100%; height: 100%; overflow: hidden; border-radius: .35em; }
.dk-fph img { display: block; width: 100%; height: 100%; object-fit: contain; }
.dk-ftext { text-align: right; line-height: 1.5; font-weight: 500; }
.dk-x .dk-tbl { align-self: flex-start; }
.dk-qfig { width: 100%; min-height: 0; }
.dk-fr { display: inline-flex; flex-direction: column; align-items: stretch; vertical-align: middle; font-size: .7em; line-height: 1.5; margin: 0 .12em; }
.dk-fr > span { line-height: 1.5; padding: 0 .15em; text-align: center; }
.dk-fr > span:first-child { border-bottom: .09em solid currentColor; }
.dk-sup { font-size: .6em; line-height: 0; }

/* ── لوح الحل: سبورة خضراء للمعلم، خطوة مع كل نقرة ── */
.dk-board { position: absolute; left: 4%; top: 14%; width: 92%; height: 72%; z-index: 5; display: flex; flex-direction: column; gap: .45em; padding: .7em 1.1em;
  background: var(--board); color: var(--chalk); border-radius: .5em; box-shadow: 0 .2em .8em rgba(10, 20, 15, .45); cursor: pointer; overflow: hidden; }
.dk-bhd { display: flex; align-items: center; gap: .6em; }
.dk-bt { flex: 1 1 auto; min-width: 0; font-weight: 700; font-size: .9em; color: var(--chalk-dim); }
.dk-bx { flex: 0 0 auto; width: 1.8em; height: 1.8em; border-radius: 50%; border: .07em solid var(--chalk-dim); background: none; color: var(--chalk); cursor: pointer;
  display: flex; align-items: center; justify-content: center; font-size: .9em; }
.dk-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .3em; min-height: 0; }
.dk-steps li { font-weight: 700; font-size: 1.05em; line-height: 1.5; display: flex; gap: .6em; align-items: center; }
.dk-steps.is-dense li { font-size: .9em; }
.dk-steps li .n { flex: 0 0 auto; color: var(--chalk-dim); font-size: .7em; }
.dk-steps li .s { min-width: 0; }
.dk-steps li.is-ans { color: var(--chalk-ans); }
.dk-bfoot { margin-top: auto; font-size: .72em; color: var(--chalk-dim); font-weight: 600; }

/* ── النوافذ: صفحة الكتاب مرجعا للمعلم، وخريطة الدرس ── */
.dk-ref { position: fixed; inset: 0; z-index: 20; display: flex; flex-direction: column; background: rgba(20, 34, 58, .55);
  padding-block: max(16px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-bottom, 0px));
  padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.dk-refin { margin: auto; width: min(1100px, 100%); max-height: 100%; min-height: 0; display: flex; flex-direction: column; background: var(--white); border-radius: 14px; overflow: hidden;
  box-shadow: 0 10px 40px rgba(0, 0, 0, .3); }
.dk-refhd { display: flex; align-items: center; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--chrome-line); }
.dk-refhd b { flex: 1 1 auto; font-size: 18px; color: var(--ink); }
.dk-refhd span { color: var(--muted); font-size: 15px; font-weight: 600; }
.dk-refx { width: 44px; height: 44px; border-radius: 50%; border: 2px solid #c9d4e3; background: var(--white); color: var(--muted); cursor: pointer; font-size: 18px; flex: 0 0 auto; }
.dk-refbody { overflow: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.dk-refbody img { display: block; max-width: 100%; height: auto; margin: 0 auto; }
.dk-map { display: grid; gap: 14px; }
.dk-map h3 { margin: 0 0 6px; font-size: 15px; color: var(--muted); }
.dk-map ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.dk-map button { width: 100%; min-height: 44px; display: flex; align-items: center; gap: 10px; text-align: right; padding: 6px 12px; border-radius: 10px; border: 1px solid var(--chrome-line);
  background: var(--white); color: var(--ink); cursor: pointer; font-weight: 600; font-size: 16px; line-height: 1.35; }
.dk-map button:hover { border-color: var(--blue); }
.dk-map button.is-cur { border-color: var(--blue); background: var(--blue-t); }
.dk-map button .i { flex: 0 0 auto; min-width: 2em; color: var(--blue); font-weight: 700; font-variant-numeric: tabular-nums; }

@media (prefers-reduced-motion: reduce) { .dk *, .dk *::before { transition-duration: 0s !important; transition-delay: 0s !important; } }