/* سند — نظام تصميم V3 «الولادة الجديدة»: Dark Premium.
   Midnight Navy + Deep Slate + Electric Cyan. الأخضر محصور في Success States فقط. */
:root{
  --bg:#090D17;            /* Midnight Navy مُلطَّف نحو الرمادي العميق */
  --s1:#0E1422;            /* Deep Slate — سطح مرتفع */
  --s2:#141B2B;            /* أعلى */
  --s3:#1D2638;            /* طبقة تفاعل */
  --hair:#222C40;          /* خط شعري Slate */
  --ink:#F4F7FC;           /* White */
  --ink2:#A9B7CF;          /* Soft Gray */
  --ink3:#7E92B5;          /* Soft Gray باهت — AA ≥4.5:1 على الخلفية والأسطح */
  --acc:#2BD9FE;           /* Electric Cyan */
  --acc-dim:#17A8CC;
  --acc-glow:rgba(43,217,254,.10);
  --warn:#F0B354;
  --warn-bg:rgba(240,179,84,.10);
  --alert:#FF6B5A;
  --alert-bg:rgba(255,107,90,.10);
  --ok:#4ADE9B;            /* الأخضر — Success States فقط (موثق/مكتمل/متصل) */
  --ok-bg:rgba(74,222,155,.09);
  --r:18px; --r-lg:26px; --r-sm:12px;
  --ease:cubic-bezier(.22,1,.36,1);
  --dur:.25s;              /* سرعة موحدة لتفاعلات hover/press */
  --shadow-1:0 1px 2px rgba(2,6,18,.35),0 6px 16px rgba(2,6,18,.28);
  --shadow-pop:0 12px 34px rgba(2,6,18,.5);
  --safe-t:env(safe-area-inset-top);
  --safe-b:env(safe-area-inset-bottom);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%;margin:0;background:var(--bg);overscroll-behavior:none}
body{
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"SF Arabic","SF Pro Text","Segoe UI",Tahoma,"Noto Kufi Arabic",sans-serif;
  font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased;
  display:flex;flex-direction:column;
}
h1,h2,h3{margin:0;line-height:1.3;letter-spacing:-.01em}
p{margin:0}
button{font-family:inherit;font-size:inherit;color:inherit;border:0;background:none;cursor:pointer}
a{color:var(--acc);text-decoration:none}
[hidden]{display:none!important}

/* ── الهيكل ── */
.center{display:contents}/* على الهاتف والتابلت: غلاف شفاف — لا يغيّر ترتيب العناصر الحالي */
.stage{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;position:relative}
.pad{max-width:560px;margin-inline:auto;padding:calc(var(--safe-t) + 14px) 20px calc(var(--safe-b) + 56px)}

/* شريط تقدم شعري */
.prog{position:sticky;top:0;z-index:30;height:2px;background:transparent}
.prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--acc-dim),var(--acc));
  border-radius:0 2px 2px 0;transition:width .5s var(--ease)}

/* ── رأس سند V4 — بطل الصفحة: تايبوغرافي قائد، هالة ضوء، تنفس أكبر، لا Avatar ── */
.hero{padding:42px 0 26px;opacity:0;transform:translateY(14px);animation:rise .7s var(--ease) forwards;position:relative}
.hero::before{content:'';position:absolute;inset:-46px -70px auto;height:280px;pointer-events:none;
  background:radial-gradient(58% 100% at 72% 0%,rgba(43,217,254,.075),transparent 72%)}
.hero > *{position:relative}
.hero h1{font-size:clamp(2.3rem,3.2vw + 1rem,3.05rem);font-weight:800;margin-bottom:14px;color:#fff;line-height:1.28}
.hero .sub{color:var(--ink2);font-size:1.07rem;line-height:1.85;max-width:24em}
.hero .sub b{color:var(--ink);font-weight:700}

/* ── بطاقات الاقتراح ── */
.deck{display:grid;gap:15px;margin-top:28px}
.sug{
  display:flex;align-items:center;gap:14px;width:100%;text-align:start;
  background:linear-gradient(165deg,var(--s2),var(--s1));
  border:1px solid rgba(255,255,255,.05);border-radius:var(--r);padding:18px;box-shadow:var(--shadow-1);
  transition:transform var(--dur) var(--ease),border-color var(--dur),box-shadow var(--dur);
  opacity:0;transform:translateY(14px);animation:rise .55s var(--ease) forwards;
}
.sug:nth-child(1){animation-delay:.06s}.sug:nth-child(2){animation-delay:.12s}
.sug:nth-child(3){animation-delay:.18s}.sug:nth-child(4){animation-delay:.24s}
.sug:nth-child(5){animation-delay:.30s}
.sug:active{transform:scale(.975)}
.sug:hover{border-color:rgba(43,217,254,.32);box-shadow:0 0 0 1px var(--acc-glow),0 10px 30px rgba(0,0,0,.35)}
.sug:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.sug .ic{width:44px;height:44px;flex:0 0 auto;border-radius:14px;display:grid;place-items:center;
  font-size:1.25rem;background:var(--s3);border:1px solid var(--hair);
  transition:transform var(--dur) var(--ease)}
.sug:hover .ic{transform:scale(1.08)}
.sug .tx{flex:1;font-weight:600;font-size:1rem;line-height:1.4}
.sug .tx small{display:block;color:var(--ink3);font-size:.82rem;font-weight:400;margin-top:2px}
.sug .go{color:var(--ink3);font-size:1.1rem;transition:transform var(--dur) var(--ease),color var(--dur)}
.sug:hover .go{color:var(--acc);transform:translateX(-4px)}

/* ── كتل الحوار (لا فقاعات) ── */
.turn{margin-bottom:16px;opacity:0;transform:translateY(10px);animation:rise .5s var(--ease) forwards}
.turn.me{text-align:start;margin-bottom:8px}
.turn.settled{opacity:1;transform:none;animation:none}
.turn .who{font-size:.72rem;font-weight:800;letter-spacing:.06em;color:var(--ink3);margin-bottom:5px}
.turn.sanad .who{color:var(--acc)}
.turn .body{font-size:1.02rem;line-height:1.75;white-space:pre-wrap}
.turn.me .body{color:var(--ink2);padding-inline-start:14px;border-inline-start:2px solid var(--hair)}
.turn.sanad{padding-bottom:12px;border-bottom:1px solid rgba(28,42,78,.45)}
.turn.sanad:last-of-type{border-bottom:0}

/* ── سؤال موجَّه ── */
.ask{opacity:0;transform:translateY(14px);animation:rise .5s var(--ease) forwards}
.ask .step{font-size:.74rem;font-weight:800;color:var(--acc);letter-spacing:.05em;margin-bottom:8px}
.ask h2{font-size:1.45rem;font-weight:800;margin-bottom:8px;line-height:1.35}
.ask .hint{color:var(--ink2);font-size:.94rem;margin-bottom:24px}
.opts{display:grid;gap:8px}
.opt{
  display:flex;align-items:center;gap:13px;width:100%;text-align:start;
  background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-sm);padding:15px 17px;
  font-size:1rem;font-weight:600;transition:all var(--dur) var(--ease);
}
.opt:active{transform:scale(.98)}
.opt[aria-pressed="true"],.opt:hover{background:var(--s2);border-color:rgba(43,217,254,.4);color:var(--acc)}
.opt .dot{width:20px;height:20px;border-radius:50%;border:2px solid var(--hair);flex:0 0 auto;
  display:grid;place-items:center;transition:all var(--dur) var(--ease)}
.opt[aria-pressed="true"] .dot{border-color:var(--acc);background:var(--acc)}
.opt[aria-pressed="true"] .dot::after{content:'';width:7px;height:7px;border-radius:50%;background:var(--bg);
  animation:pop .3s var(--ease)}
.numin{width:100%;background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-sm);
  padding:17px 18px;font-size:1.3rem;font-weight:700;color:var(--ink);outline:none;text-align:center;
  font-variant-numeric:tabular-nums;transition:border-color .3s}
.numin:focus{border-color:var(--acc)}
.numin::placeholder{color:var(--ink3);font-weight:400;font-size:1rem}

/* ── أزرار ── */
.cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
  background:var(--acc);color:#04121A;border-radius:var(--r-sm);padding:16px;
  font-size:1.02rem;font-weight:800;box-shadow:0 8px 24px rgba(43,217,254,.22);
  transition:transform var(--dur) var(--ease),opacity var(--dur),box-shadow var(--dur)}
.cta:hover{transform:translateY(-1px);box-shadow:0 10px 28px rgba(43,217,254,.30)}
.cta:active{transform:scale(.98)}
.cta:disabled{opacity:.3;box-shadow:none}
.cta.ghost{background:transparent;border:1px solid var(--hair);color:var(--ink);box-shadow:none}
.cta.ghost:hover{border-color:var(--ink3);box-shadow:none}
.cta.sm{padding:11px 18px;width:auto;font-size:.9rem;border-radius:11px}
.back{color:var(--ink3);font-size:.9rem;font-weight:600;padding:10px 0;margin-top:16px}
.back:hover{color:var(--ink2)}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:8px}

/* ── بطاقة توصية — مختصرة، بلا ترتيب رقمي، تفاصيلها تفتح عند الطلب ── */
.rec{background:linear-gradient(165deg,var(--s2),var(--s1));border:1px solid var(--hair);
  border-radius:var(--r);overflow:hidden;margin-bottom:16px;box-shadow:var(--shadow-1);
  opacity:0;transform:translateY(16px);animation:rise .55s var(--ease) forwards}
.rec:nth-child(2){animation-delay:.09s}.rec:nth-child(3){animation-delay:.18s}
.rec-top{padding:16px 16px 0;display:flex;align-items:center;gap:12px}
.rec-t{flex:1;min-width:0}
.rec-t h3{font-size:1.14rem;font-weight:800;line-height:1.35}
.rec-t .org{color:var(--ink2);font-size:.88rem;margin-top:2px}
.meta{display:grid;gap:8px}
.mrow{display:flex;align-items:flex-start;gap:11px;font-size:.9rem}
.mrow .mi{width:26px;flex:0 0 auto;text-align:center;opacity:.75}
.mrow .mk{color:var(--ink3);font-size:.76rem;font-weight:700;display:block}
.mrow .mv{color:var(--ink);line-height:1.5}
.mrow a{word-break:break-word}

/* ── حالة نقص البيانات ── */
.gap{background:var(--warn-bg);border:1px solid rgba(240,179,84,.24);border-radius:var(--r);
  padding:16px 18px;margin-bottom:14px}
.gap b{display:block;color:var(--warn);font-weight:800;font-size:.95rem;margin-bottom:6px}
.gap p{color:var(--ink2);font-size:.92rem;line-height:1.65}
.gap-act{width:100%;text-align:start;cursor:pointer;transition:border-color .3s,transform .25s var(--ease)}
.gap-act:hover{border-color:rgba(240,179,84,.5)}
.gap-act:active{transform:scale(.985)}
.gap-go{display:inline-block;margin-top:10px;color:var(--warn);font-weight:800;font-size:.85rem}

/* ── الخط الزمني ── */
.tl{position:relative;padding-inline-start:30px;margin-top:6px}
.tl::before{content:'';position:absolute;inset-inline-start:9px;top:14px;bottom:14px;width:2px;
  background:linear-gradient(180deg,var(--acc-dim),var(--hair));border-radius:2px;opacity:.55}
.tli{position:relative;padding:11px 0;opacity:0;transform:translateX(-10px);
  animation:slide .5s var(--ease) forwards}
.tli:nth-child(2){animation-delay:.08s}.tli:nth-child(3){animation-delay:.16s}
.tli:nth-child(4){animation-delay:.24s}.tli:nth-child(5){animation-delay:.32s}
.tli::before{content:'';position:absolute;inset-inline-start:-26px;top:18px;width:12px;height:12px;
  border-radius:50%;background:var(--s3);border:2px solid var(--bg);box-shadow:0 0 0 2px var(--hair)}
.tli.now::before{background:var(--acc);box-shadow:0 0 0 2px var(--acc-glow),0 0 16px var(--acc-glow)}
.tli.past::before{background:var(--acc-dim)}
.tli.past{opacity:.5}
.tli .d{font-size:.76rem;font-weight:800;color:var(--acc);letter-spacing:.03em}
.tli.past .d{color:var(--ink3)}
.tli .h{font-weight:700;font-size:1rem;margin-top:2px}
.tli .s{color:var(--ink2);font-size:.88rem;margin-top:3px;line-height:1.55}

/* ── بطاقة موعد ── */
.dl{background:linear-gradient(165deg,var(--s2),var(--s1));border:1px solid var(--hair);
  border-radius:var(--r);padding:16px;margin-bottom:12px;box-shadow:var(--shadow-1);
  transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease);
  opacity:0;transform:translateY(12px);animation:rise .5s var(--ease) forwards}
.dl:hover{transform:translateY(-1px)}
.dl.urgent{border-color:rgba(255,107,90,.35);box-shadow:0 0 0 1px var(--alert-bg)}
.dl-h{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.dl-h .t{flex:1;font-weight:700;font-size:1rem;line-height:1.4}
.chip{font-size:.7rem;font-weight:800;border-radius:999px;padding:4px 11px;white-space:nowrap;
  background:var(--s3);color:var(--ink2)}
.chip.hot{background:var(--alert-bg);color:var(--alert)}
.chip.ok{background:rgba(74,222,155,.12);color:var(--ok)}
.chip.soon{background:var(--warn-bg);color:var(--warn)}
.dl .w{color:var(--ink2);font-size:.9rem;line-height:1.6}
.dl .act{margin-top:12px;padding-top:12px;border-top:1px solid var(--hair);
  display:flex;align-items:center;gap:9px;font-size:.86rem}
.dl .act .k{color:var(--ink3);font-weight:700}
.src{margin-top:11px;display:inline-flex;align-items:center;gap:6px;font-size:.82rem;color:var(--acc)}
.src::after{content:'↗';font-size:.9em;opacity:.7}
.srcorg{color:var(--ink3);font-size:.72rem;margin-top:3px}
.dl.done{opacity:.55}
.dl.done .src{color:var(--ink3)}

/* ── مؤشر تفكير ── */
.think{display:inline-flex;gap:5px;align-items:center;padding:4px 0}
.think i{width:7px;height:7px;border-radius:50%;background:var(--acc);opacity:.35;
  animation:pulse 1.3s infinite}
.think i:nth-child(2){animation-delay:.16s}.think i:nth-child(3){animation-delay:.32s}

/* ── المؤلِّف — بأسلحة ChatGPT الديسكتوب: مرتفع، ظل ناعم، إرسال متحرك ── */
.composer{flex:0 0 auto;background:linear-gradient(180deg,transparent,var(--bg) 22%);
  padding:14px 20px calc(var(--safe-b) + 14px)}
.composer form{max-width:560px;margin-inline:auto;display:flex;gap:9px;align-items:center;
  background:var(--s1);border:1px solid var(--hair);border-radius:26px;padding:5px;
  box-shadow:var(--shadow-pop);transition:border-color var(--dur) var(--ease),box-shadow var(--dur)}
.composer form:focus-within{border-color:rgba(43,217,254,.45);
  box-shadow:var(--shadow-pop),0 0 0 3px var(--acc-glow)}
.composer input{flex:1;background:none;border:0;outline:none;color:var(--ink);
  padding:14px 20px;font-size:1rem;line-height:1.5}
.composer input::placeholder{color:var(--ink3)}
.composer .send{width:44px;height:44px;border-radius:50%;background:var(--acc);color:#04121A;
  display:grid;place-items:center;font-size:1.1rem;flex:0 0 auto;
  box-shadow:0 6px 16px rgba(43,217,254,.28);
  transition:transform var(--dur) var(--ease),opacity var(--dur),box-shadow var(--dur)}
.composer .send:hover{transform:scale(1.07)}
.composer .send:active{transform:scale(.9)}
.composer .send:disabled{opacity:.28;box-shadow:none}

/* ── تنقّل سفلي ── */
.tabs{flex:0 0 auto;background:rgba(9,13,23,.86);backdrop-filter:blur(24px) saturate(160%);
  -webkit-backdrop-filter:blur(24px) saturate(160%);border-top:1px solid var(--hair);
  padding:8px 12px calc(var(--safe-b) + 8px)}
.tabs-in{max-width:560px;margin-inline:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.tab{display:flex;flex-direction:column;align-items:center;gap:4px;padding:7px 0;border-radius:var(--r-sm);
  color:var(--ink3);font-size:.68rem;font-weight:700;min-height:48px;
  transition:color var(--dur),background-color var(--dur)}
.tab:hover{background:var(--s1)}
.tab svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;transition:stroke-width var(--dur)}
.tab[aria-current="page"]{color:var(--acc)}
.tab[aria-current="page"] svg{stroke-width:2.3}

/* ── شريط Beta وائتمان ريتمك — ضمن شريط التنقل الثابت، ظاهر بكل مقاس ── */
.metabar{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;
  padding-top:7px;font-size:.68rem;color:var(--ink3)}
.beta-pill{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;
  background:var(--s2);border:1px solid var(--hair);color:var(--ink3);font-weight:700;letter-spacing:.02em}
.metabar-credit a{color:var(--ink3);text-decoration:underline;text-underline-offset:2px}
.metabar-credit a:hover{color:var(--acc)}

/* ── متفرقات ── */
/* أرضية هدف اللمس — كل عنصر تفاعلي ≥44px */
.sug,.opt,.cta,.back,.src,.send,.tab,.numin{min-height:44px}
.src{align-items:center}
.sec{font-size:.74rem;font-weight:800;color:var(--ink3);letter-spacing:.07em;margin:30px 0 14px}
.sec:first-child{margin-top:4px}
.muted{color:var(--ink2);font-size:.9rem;line-height:1.65}
.tiny{color:var(--ink3);font-size:.75rem;line-height:1.6;text-align:center;margin-top:24px}
.note{background:var(--warn-bg);border:1px solid rgba(240,179,84,.2);border-radius:var(--r-sm);
  padding:11px 14px;font-size:.8rem;color:var(--warn);font-weight:600;margin-bottom:16px}
.empty{text-align:center;padding:48px 20px}
.empty .e{font-size:2.4rem;margin-bottom:14px;opacity:.55}
.empty h3{font-size:1.1rem;font-weight:800;margin-bottom:8px}
.empty p{color:var(--ink2);font-size:.94rem;margin-bottom:20px}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;inset-inline-start:-999px;top:8px;z-index:99;background:var(--acc);color:#04121A;
  padding:10px 16px;border-radius:11px;font-weight:800}
.skip:focus{inset-inline-start:12px}

@keyframes rise{to{opacity:1;transform:translateY(0)}}
@keyframes slide{to{opacity:1;transform:translateX(0)}}
@keyframes pulse{0%,70%,100%{opacity:.3;transform:scale(1)}35%{opacity:1;transform:scale(1.25)}}

/* ══ Companion Shell — لوحات الديسكتوب/التابلت (الموبايل <768px لا يتغير إطلاقاً) ══ */
.rail,#railToggle,#railScrim{display:none}

/* مكوّنات اللوحات — مشتركة بين الديسكتوب ودرج التابلت */
.rail-head{font-size:.78rem;font-weight:800;color:var(--ink3);letter-spacing:.07em;
  display:flex;align-items:center;gap:8px}
.rail-head::after{content:'';flex:1;height:1px;background:var(--hair);opacity:.6}
.rail-card{background:var(--s2);border:1px solid rgba(255,255,255,.05);
  border-radius:var(--r);padding:16px;box-shadow:0 8px 22px rgba(2,6,18,.22);
  transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease),box-shadow var(--dur)}
.rail-card:hover{border-color:rgba(43,217,254,.14);transform:translateY(-1px);
  box-shadow:0 12px 28px rgba(2,6,18,.3)}
.rail-k{font-size:.72rem;font-weight:800;color:var(--ink3);margin-bottom:6px;
  display:flex;align-items:center;gap:6px}
.rail-k svg{width:14px;height:14px;stroke:var(--acc);fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.rail-v{font-size:.95rem;font-weight:700;line-height:1.5}
.rail-sub{color:var(--ink2);font-size:.82rem;line-height:1.55;margin-top:4px}
.rail-bar{height:5px;border-radius:99px;background:var(--s3);overflow:hidden;margin-top:12px}
.rail-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc-dim),var(--acc));
  border-radius:99px;box-shadow:0 0 6px var(--acc-glow);transition:width .6s var(--ease)}
/* Knowledge Panel — الحالة الفارغة الجميلة */
.rail-ph{color:var(--ink3);font-size:.83rem;line-height:1.65;text-align:center;
  padding:24px 16px;border:1px dashed var(--hair);border-radius:var(--r);
  display:flex;flex-direction:column;align-items:center;gap:10px}
.rail-ph svg{width:28px;height:28px;stroke:var(--ink3);fill:none;stroke-width:1.5;
  stroke-linecap:round;stroke-linejoin:round;opacity:.7}
.rail-ph .ph-t{font-weight:700;color:var(--ink2);font-size:.86rem}
.rail-src{display:block;font-size:.83rem;color:var(--acc);line-height:1.5;margin-top:10px;
  padding:6px 8px;margin-inline:-8px;border-radius:8px;word-break:break-word;min-height:44px;
  transition:background-color var(--dur),transform var(--dur) var(--ease)}
.rail-src:hover{background:var(--s2);transform:translateX(-2px)}
.rail-src::after{content:' ↗';opacity:.6}
.rail-inst{display:block;font-size:.71rem;color:var(--ink3);margin-top:1px}
.rail .cta{font-size:.9rem;padding:12px;min-height:44px}
.rail-dl{font-size:.85rem;font-weight:700;line-height:1.5}
.rail-dl small{display:block;color:var(--ink2);font-weight:400;font-size:.78rem;margin-top:4px}
/* هيكل تحميل — Skeleton */
.skel{display:block;height:12px;border-radius:8px;background:var(--s3);
  position:relative;overflow:hidden;margin-top:8px}
.skel::after{content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);
  animation:shimmer 1.6s infinite}
.skel.w60{width:60%}.skel.w85{width:85%}
@keyframes shimmer{from{transform:translateX(100%)}to{transform:translateX(-100%)}}
@keyframes pop{from{transform:scale(.3)}to{transform:scale(1)}}

/* بطاقة «مرحلتك الحالية» — قائدة لوحة رحلتي: طبقة مرتفعة بظل عميق، لا حدود صارخة */
.rail-next{border:1px solid rgba(43,217,254,.14);padding:18px 16px;
  background:linear-gradient(165deg,rgba(43,217,254,.055),var(--s2) 60%);
  box-shadow:0 16px 38px rgba(2,6,18,.38)}
.rail-next .rail-k{color:var(--acc);font-size:.76rem}
.rail-next .rail-v{font-size:1.06rem;font-weight:800;line-height:1.45;margin-top:2px}
.rail-next .cta{margin-top:14px}
/* مهامك — قائمة إنجاز مصغرة */
.rail-task{display:flex;align-items:center;gap:9px;font-size:.83rem;padding:6px 0;color:var(--ink2)}
.rail-task .tk{width:18px;height:18px;border-radius:50%;border:2px solid var(--hair);flex:0 0 auto;
  display:grid;place-items:center;font-size:.62rem;font-weight:800;color:#04121A;
  transition:all var(--dur) var(--ease)}
.rail-task.done{color:var(--ink3)}
.rail-task.done .tk{background:var(--acc);border-color:var(--acc)}

/* الاقتراح الذكي — أول بطاقة، مميزة بهدوء */
.sug.smart{border-color:rgba(43,217,254,.34);
  background:linear-gradient(165deg,rgba(43,217,254,.08),var(--s1) 55%)}
.sug.smart .ic{background:rgba(43,217,254,.12);border-color:rgba(43,217,254,.3)}

/* تلميح اليوم */
.tip{color:var(--ink3);font-size:.8rem;margin-top:20px;display:flex;gap:8px;align-items:flex-start;
  line-height:1.6}
.tip span[aria-hidden]{flex:0 0 auto}

/* ── تابلت 768–1199px: درج «رحلتي» قابل للطي ── */
@media (min-width:768px) and (max-width:1199.5px){
  #railToggle{display:inline-flex;align-items:center;gap:8px;position:fixed;z-index:60;
    inset-inline-start:14px;bottom:96px;background:var(--s2);border:1px solid var(--hair);
    color:var(--ink);border-radius:999px;padding:11px 18px;font-size:.85rem;font-weight:800;
    box-shadow:0 10px 26px rgba(0,0,0,.45);transition:transform .25s var(--ease)}
  #railToggle:active{transform:scale(.95)}
  body.rail-open #railScrim{display:block;position:fixed;inset:0;z-index:65;
    background:rgba(0,0,0,.55);animation:fadein .25s var(--ease)}
  body.rail-open .rail-r{display:flex;flex-direction:column;gap:13px;position:fixed;z-index:70;
    top:0;bottom:0;inset-inline-start:0;width:min(320px,86vw);overflow-y:auto;
    background:var(--bg);border-inline-end:1px solid var(--hair);
    padding:calc(var(--safe-t) + 20px) 18px calc(var(--safe-b) + 20px);
    animation:drawerin .3s var(--ease)}
}
@keyframes fadein{from{opacity:0}}
@keyframes drawerin{from{transform:translateX(24px);opacity:.4}}

/* ── شعار قراري — علامة تجارية بوزن بصري ومساحة تنفس (التنقل العلوي للديسكتوب) ── */
.brand{display:none}
.brandmark{height:26px;width:auto;display:block;margin-bottom:22px;opacity:.92}

/* ── ديسكتوب ≥1200px: نظام Grid حقيقي — ثلاث مناطق مستقلة بصرياً، بلا absolute ── */
@media (min-width:1200px){
  body{display:grid;height:100dvh;overflow:hidden;
    /* RTL — المسار الأول = اليمين «رحلتي» minmax(280,320) · الثاني = الوسط minmax(620,1fr) · الثالث = اليسار minmax(240,280) */
    grid-template-columns:minmax(280px,320px) minmax(620px,1fr) minmax(240px,280px);
    grid-template-rows:auto auto minmax(0,1fr);
    column-gap:26px;padding:0 22px 22px;
    max-width:1760px;margin-inline:auto}
  .prog{grid-column:1/-1;grid-row:1;position:relative}
  /* ترويسة كاملة العرض — منطقة علامة تجارية بحضور: Monogram «المسار إلى القرار» + Wordmark مكبّر + تنفس فاخر */
  .tabs{grid-column:1/-1;grid-row:2;border-top:0;border-bottom:1px solid rgba(255,255,255,.05);
    background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;
    padding:20px 6px;margin-bottom:22px;display:flex;align-items:center;gap:34px}
  .tabs-in{max-width:none;display:flex;gap:6px;flex:0 0 auto;margin-inline-start:10px}
  .tab{flex-direction:row;gap:8px;min-height:42px;padding:9px 17px;font-size:.83rem;border-radius:var(--r-sm)}
  .tab svg{width:19px;height:19px}
  .tab[aria-current="page"]{background:var(--s2)}
  .brand{display:flex;align-items:center;gap:14px;order:-1;line-height:0;padding-inline-end:14px}
  .brand .mono{width:40px;height:40px;display:block;flex:0 0 auto}
  .brand img{height:42px;width:auto;display:block;transition:opacity var(--dur)}
  .brand:hover{opacity:.85}
  /* الشعار داخل الهيرو للهاتف فقط — الديسكتوب تحمله الترويسة */
  .brandmark{display:none}
  /* الديسكتوب: شريط الحقوق يلتحق بنهاية الترويسة بدل التكديس أسفل الأزرار */
  .metabar{margin-inline-start:auto;padding-top:0;flex-wrap:nowrap}

  /* المناطق الثلاث — نفس الخط العلوي، radius موحد، حدود شبه خفية + ظلال عمق، خلفية متمايزة بدرجة بسيطة، ودخول متدرج */
  .rail-r,.center,.rail-l{grid-row:3;min-height:0;border-radius:var(--r-lg);
    border:1px solid rgba(255,255,255,.045);box-shadow:0 22px 54px rgba(2,6,18,.28);
    opacity:0;transform:translateY(10px);animation:rise .55s var(--ease) forwards}
  .rail-r{grid-column:1;background:var(--s1);animation-delay:.06s}
  .center{grid-column:2;background:#101626;display:flex;flex-direction:column}
  .rail-l{grid-column:3;background:#0B101C;animation-delay:.12s}

  /* الوسط — البطل: تمرير داخلي، وصندوق الإدخال مثبت أسفله داخل العمود فقط */
  .stage{flex:1 1 auto;min-height:0}
  .pad{max-width:760px;margin-inline:auto;padding:20px 20px 28px}
  .pad.welc{display:flex;flex-direction:column;justify-content:safe center;min-height:100%}
  .pad.welc .hero{padding-top:8px}
  .composer{flex:0 0 auto;background:transparent;padding:0 20px 20px}
  .composer form{max-width:760px;margin-inline:auto}

  /* اللوحتان — padding 24px وscroll داخلي مستقل لكل عمود */
  .rail{display:flex;flex-direction:column;gap:14px;overflow-y:auto;min-height:0;padding:24px}
  .rail-r{grid-column:1}
  .rail-l{grid-column:3}
}
@media (min-width:1400px){
  body{column-gap:30px;padding:0 28px 24px}
}

/* ── شاشات ضيقة جداً (Fold ~280–340px): لا Overflow أبداً ── */
@media (max-width:340px){
  .pad{padding-inline:16px}
  .hero h1{font-size:1.6rem}
  .sug{padding:14px 16px;gap:12px}
  .sug .ic{width:40px;height:40px;font-size:1.1rem}
  .composer{padding-inline:12px}
  .composer input{padding:12px 14px}
  .tabs-in{gap:2px}
  .tab{font-size:.64rem}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important}
  .hero,.sug,.turn,.ask,.rec,.tli,.dl{opacity:1;transform:none}
}

/* ══ Companion V2 — ذاكرة سند، المبادرة، الإنجاز، ملف الطالب (بلا مكتبات، نفس التوكنز) ══ */

/* لافتة سند الاستباقية — موعد قريب من بيانات الرحلة الرسمية */
.banner{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:var(--warn-bg);border:1px solid rgba(240,179,84,.3);border-radius:var(--r);
  padding:13px 16px;margin-bottom:20px;font-size:.92rem;font-weight:600;
  opacity:0;transform:translateY(-8px);animation:rise .5s var(--ease) forwards}
.banner.hot{background:var(--alert-bg);border-color:rgba(255,107,90,.35)}
.banner .b-t{flex:1;min-width:200px;line-height:1.55;color:var(--ink)}
.banner .b-go{background:var(--warn);color:#241A05;border-radius:10px;padding:9px 16px;
  font-size:.83rem;font-weight:800;min-height:40px;transition:transform var(--dur) var(--ease)}
.banner.hot .b-go{background:var(--alert);color:#2A0E08}
.banner .b-go:active{transform:scale(.96)}

/* سطر الذاكرة — «آخر مرة سألتني عن… نكمل؟» */
.memline{display:flex;align-items:center;gap:9px;margin-top:12px;padding:10px 14px;
  background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-sm);
  color:var(--ink2);font-size:.87rem;text-align:start;width:100%;min-height:44px;
  transition:border-color var(--dur),background-color var(--dur)}
.memline:hover{border-color:rgba(43,217,254,.35);background:var(--s2)}
.memline b{color:var(--acc)}
.memline span[aria-hidden]{flex:0 0 auto}

/* بطاقة الاسم — مرة واحدة، قابلة للتخطي */
.namecard{background:linear-gradient(165deg,var(--s2),var(--s1));border:1px solid var(--hair);
  border-radius:var(--r);padding:16px;margin-top:20px;box-shadow:var(--shadow-1)}
.namecard b{font-size:.95rem}
.namecard p{color:var(--ink3);font-size:.82rem;margin-top:4px;line-height:1.6}
.nc-row{display:flex;gap:8px;margin-top:12px}
.nc-row input{flex:1;background:var(--s1);border:1px solid var(--hair);border-radius:11px;
  padding:11px 14px;color:var(--ink);font-size:.95rem;outline:none;min-height:44px;min-width:0;
  font-family:inherit;transition:border-color var(--dur)}
.nc-row input:focus{border-color:var(--acc)}
.nc-skip{display:block;margin-top:10px;color:var(--ink3);font-size:.8rem;font-weight:600;min-height:40px}
.nc-skip:hover{color:var(--ink2)}

/* الإجراء التالي — لا جواب يقف عند نقطة */
.nacts{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.nact{background:var(--s2);border:1px solid var(--hair);border-radius:999px;
  padding:9px 15px;font-size:.82rem;font-weight:700;color:var(--acc);min-height:40px;
  transition:all var(--dur) var(--ease)}
.nact:hover{border-color:rgba(43,217,254,.4);background:rgba(43,217,254,.08);transform:translateY(-1px)}
.nact:active{transform:scale(.96)}

/* مراحل الرحلة داخل لوحة «رحلتي» — Timeline احترافي: خط واصل + عقد حالة حديثة */
.rstg{display:flex;align-items:center;gap:9px;font-size:.85rem;padding:9px 0;color:var(--ink2);
  position:relative;padding-inline-start:28px}
.rstg::before{content:'';position:absolute;inset-inline-start:8px;top:0;bottom:0;width:1.5px;
  background:rgba(255,255,255,.05)}
.rstg:first-of-type::before{top:20px}
.rstg:last-of-type::before{bottom:auto;height:20px}
.rstg.done::before{background:rgba(74,222,155,.22)}
.rstg .tk{position:absolute;inset-inline-start:0;top:10px;z-index:1;width:18px;height:18px;border-radius:50%;
  border:2px solid var(--hair);background:var(--s2);flex:0 0 auto;
  display:grid;place-items:center;font-size:.62rem;font-weight:800;color:#06231B;
  transition:all var(--dur) var(--ease)}
.rstg.done{color:var(--ink3)}
.rstg.done .tk{background:var(--ok);border-color:var(--ok)}
.rstg.now{color:var(--ink);font-weight:700}
.rstg.now .tk{border-color:var(--acc);box-shadow:0 0 0 3px var(--acc-glow);
  animation:nodepulse 2.6s var(--ease) infinite}
.rstg.todo{color:var(--ink3)}
@keyframes nodepulse{0%,100%{box-shadow:0 0 0 3px var(--acc-glow)}50%{box-shadow:0 0 0 6px rgba(43,217,254,.05)}}

/* إنجازاتك — رصينة، بلا نقاط ولا ألعاب */
.ach{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px}
.ach-c{font-size:.74rem;font-weight:700;border-radius:999px;padding:6px 12px;
  background:var(--s3);color:var(--ink3);border:1px solid transparent}
.ach-c.on{background:var(--ok-bg);color:var(--ok);border-color:rgba(74,222,155,.25)}/* إنجاز = Success */

/* Knowledge Center — صف مصدر بمونوغرام الجهة ونوع المصدر وتاريخ التحقق */
.kc-row{display:flex;gap:10px;align-items:flex-start;padding:8px 0}
.kc-row + .kc-row{border-top:1px solid rgba(28,42,78,.5)}
.kc-mg{width:30px;height:30px;border-radius:10px;flex:0 0 auto;display:grid;place-items:center;
  background:var(--s3);border:1px solid var(--hair);color:var(--acc);font-size:.85rem;font-weight:800}
.kc-mid{flex:1;min-width:0}
.kc-mid .rail-src{margin-top:0;min-height:0;padding:2px 6px;margin-inline:-6px}
.kc-meta{display:block;font-size:.71rem;color:var(--ink3);margin-top:3px;line-height:1.5}

/* وسم التوصية الشخصية — الثقة: تمييز الرأي عن المعلومة الرسمية (عنبري دائماً) */
.rectag{display:inline-block;font-size:.66rem;font-weight:800;border-radius:999px;
  padding:3px 9px;margin-inline-start:6px;vertical-align:middle;
  background:var(--warn-bg);color:var(--warn);border:1px solid rgba(240,179,84,.25)}

/* وسم دليل البرنامج — أخضر لنسبة رسمية حقيقية، عنبري لتوصية ميول بلا نسبة.
   لا يظهر النص العنبري كاحتمال قبول أبداً — «توصية ميول فقط» صريحة. */
.rec-evid{margin:10px 16px 0;display:inline-block;font-size:.78rem;font-weight:700;
  border-radius:999px;padding:4px 12px}
.rec-evid.ok{background:var(--ok-bg);color:var(--ok)}
.rec-evid.na{background:var(--warn-bg);color:var(--warn)}

/* زر الحفظ داخل صف أزرار البطاقة (.ract) — لم يعد مستقلاً */

/* صفحة «ملفي» — رقائق المعلومات والصفوف */
.pchips{display:flex;flex-wrap:wrap;gap:8px}
.pchip{font-size:.85rem;font-weight:700;border-radius:999px;padding:9px 15px;
  background:var(--s2);border:1px solid var(--hair);color:var(--ink2)}
.pchip.acc{color:var(--acc);border-color:rgba(43,217,254,.3);background:rgba(43,217,254,.07)}
.saved-row{display:flex;align-items:center;gap:10px;width:100%;text-align:start;
  background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-sm);
  padding:13px 16px;margin-bottom:8px;transition:border-color var(--dur)}
.saved-row .sr-t{flex:1;font-weight:600;font-size:.93rem;line-height:1.5;min-width:0}
.saved-row .sr-x{color:var(--ink3);font-size:.8rem;font-weight:700;padding:6px 10px;min-height:40px}
.saved-row .sr-x:hover{color:var(--alert)}
.saved-row .sr-go{color:var(--acc);font-size:.78rem;font-weight:700;flex:0 0 auto}
.saved-row.q{cursor:pointer}
.saved-row.q:hover{border-color:rgba(43,217,254,.35)}

/* ══ توازن بصري V2 — اللوحة اليسرى أهدأ من اليمنى، ولا منافسة للمحادثة ══ */

/* اليسار أخف حدوداً وبلا ظل — حاضر وظيفياً، هادئ بصرياً */
.rail-l .rail-card{background:transparent;border-color:rgba(28,42,78,.55);box-shadow:none}
.rail-l .rail-card:hover{border-color:rgba(28,42,78,.9);transform:none}
.rail-l .rail-head{color:var(--ink3)}

/* وسم نوع المعلومة — رسمية (أخضر Success) / توصية (عنبري) */
.kbadge{font-size:.64rem;font-weight:800;border-radius:999px;padding:3px 9px;
  margin-inline-start:auto;white-space:nowrap;flex:0 0 auto;
  background:var(--ok-bg);color:var(--ok);border:1px solid rgba(74,222,155,.22)}
.kbadge.reco{background:var(--warn-bg);color:var(--warn);border-color:rgba(240,179,84,.25)}

/* حالة المصادر — نقطة حية صغيرة بلا توهج */
.src-state{display:flex;align-items:center;gap:9px;font-size:.88rem;font-weight:700;margin-top:2px}
.src-state .dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;background:var(--ink3)}
.src-state.ok .dot{background:var(--ok)}
.src-state.warn{color:var(--warn)}
.src-state.warn .dot{background:var(--warn)}

/* الإفصاح التدريجي — زر بقية المصادر */
.kc-more{margin-top:10px;color:var(--ink3);font-size:.78rem;font-weight:700;
  padding:8px 0;min-height:40px;text-align:start;width:100%;transition:color var(--dur)}
.kc-more:hover{color:var(--acc)}

/* ملاحظة ما قبل أول سؤال — نص خفيف، ليست بطاقة */
.l-note{color:var(--ink3);font-size:.78rem;line-height:1.7;padding:2px 6px;text-align:center}

/* تابلت: الدرج يعرض اللوحتين — اليمنى ثم اليسرى تحتها بفاصل شعري */
@media (min-width:768px) and (max-width:1199.5px){
  body.rail-open .rail-l{display:flex;flex-direction:column;gap:13px;position:static;
    width:auto;overflow:visible;background:none;border:0;
    padding:16px 2px 4px;margin-top:14px;border-top:1px solid var(--hair)}
}

/* ══ إصلاح منطق التوصيات وتجربة الهاتف ══ */

/* بطاقة «كيف رتبت لك الخيارات؟» — تسبق النتائج */
.how{background:var(--s1);border:1px solid var(--hair);border-radius:var(--r);
  padding:16px 18px;margin-bottom:18px}
.how b{display:block;color:var(--acc);font-weight:800;font-size:.95rem;margin-bottom:6px}
.how p{color:var(--ink2);font-size:.92rem;line-height:1.65}

/* تصنيف التوافق — بديل الترتيب الرقمي */
.match-tag{flex:0 0 auto;font-size:.66rem;font-weight:800;border-radius:999px;padding:4px 11px;
  background:rgba(43,217,254,.1);color:var(--acc);border:1px solid rgba(43,217,254,.22);white-space:nowrap}
.rec-why{color:var(--ink2);font-size:.93rem;line-height:1.65;padding:10px 16px 0;margin:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* أزرار البطاقة الثلاثة — اعرف أكثر · احفظ الخيار · قارن */
.rec-acts{display:flex;gap:8px;flex-wrap:wrap;padding:12px 16px 14px}
.ract{flex:1;min-width:90px;background:var(--s3);border:1px solid var(--hair);border-radius:11px;
  padding:10px 12px;font-size:.83rem;font-weight:700;color:var(--acc);min-height:44px;
  transition:all var(--dur) var(--ease)}
.ract:hover:not(:disabled){border-color:rgba(43,217,254,.4)}
.ract:active{transform:scale(.97)}
.ract:disabled{color:var(--ok);cursor:default}
.rec-more{padding:0 16px 16px}
.rec-more .meta{border-top:1px solid var(--hair);padding-top:12px}

/* حالات الحقول — متوفر (أخضر) · غير متوفر (أحمر) · لم يُعلن بعد (عنبري) */
.st{width:10px;height:10px;border-radius:50%;flex:0 0 auto;margin:5px 8px 0}
.st.ok{background:var(--ok)}
.st.miss{background:var(--alert)}
.st.wait{background:var(--warn)}

/* لوحة المقارنة — بالمتاح الموثق فقط */
.cmp{background:linear-gradient(165deg,var(--s2),var(--s1));border:1px solid var(--hair);
  border-radius:var(--r);padding:16px;margin-bottom:16px;box-shadow:var(--shadow-1)}
.cmp-h{font-size:.78rem;font-weight:800;color:var(--ink3);letter-spacing:.05em;margin-bottom:12px}
.cmp-g{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.cmp-c{background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-sm);padding:12px;
  display:flex;flex-direction:column;gap:6px;font-size:.78rem;color:var(--ink2);line-height:1.55}
.cmp-c b{font-size:.9rem;color:var(--ink)}
.cmp-n{color:var(--ink3);font-size:.78rem;line-height:1.6;margin-top:12px}

/* زر «رحلتي» داخل شريط التنقل على التابلت — لا عائم فوق المحتوى أبداً */
#railToggle.as-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  position:static;inset:auto;padding:7px 0;border-radius:var(--r-sm);color:var(--ink3);
  font-size:.68rem;font-weight:700;min-height:48px;background:none;border:0;box-shadow:none}
#railToggle.as-tab:hover{background:var(--s1)}
#railToggle.as-tab[aria-expanded="true"]{color:var(--acc)}
@media (min-width:768px) and (max-width:1199.5px){
  .tabs-in{grid-template-columns:repeat(5,1fr)}
}

/* ══ القرار الجريء الثالث — الثقة هي العرض (Trust as the Hero Surface) ══ */

/* شريط الثقة — تحت كل جواب موقف صريح. الرسمي فيروزي، التوصية عنبرية، ولا يتشابهان لثانية */
.tstrip{display:flex;align-items:center;gap:9px;margin-top:12px;padding:9px 13px;
  border-radius:11px;font-size:.8rem;font-weight:700;line-height:1.5}
.tstrip .ts-ic{flex:0 0 auto;width:19px;height:19px;border-radius:50%;display:grid;
  place-items:center;font-size:.68rem;font-weight:900}
.tstrip .ts-tx b{font-weight:800}
.tstrip.ok{background:var(--ok-bg);border:1px solid rgba(74,222,155,.26);color:var(--ok)}
.tstrip.ok .ts-ic{background:var(--ok);color:#06231B}
.tstrip.reco{background:var(--warn-bg);border:1px solid rgba(240,179,84,.24);color:var(--warn)}
.tstrip.reco .ts-ic{background:rgba(240,179,84,.18);color:var(--warn)}

/* بطاقة المصدر — نجم مشارك بجانب الجواب: حد أخضر بارز يقول «هذه معلومة رسمية موثقة» */
.srccard{margin-top:10px;background:var(--s1);border:1px solid rgba(74,222,155,.18);
  border-inline-start:3px solid var(--ok);border-radius:var(--r-sm);padding:13px 15px;
  display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow-1)}
.srccard-h{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.srccard-h .kbadge{margin-inline-start:0}
.srccard-t{font-size:.74rem;color:var(--ink3);font-weight:600;line-height:1.5}

/* دخول متتابع — الجواب يقود، الثقة تتبعه، المصدر يحرس (180ms) */
.tstrip.in{opacity:0;transform:translateY(8px);animation:rise .45s var(--ease) .05s forwards}
.srccard.in{opacity:0;transform:translateY(8px);animation:rise .45s var(--ease) .18s forwards}
@media (prefers-reduced-motion:reduce){
  .tstrip.in,.srccard.in{opacity:1;transform:none;animation:none}
}

/* ══ إعادة بناء الهيكل — Accordion اليمين والحالة الفارغة المصممة لليسار ══ */

/* Accordion «إنجازاتك وتذكيراتك» — قسم مستقل مطوي افتراضياً، بلا حركات جديدة */
.acc{background:var(--s1);border:1px solid var(--hair);border-radius:var(--r);overflow:hidden}
.acc-sum{display:flex;align-items:center;gap:8px;width:100%;padding:15px 16px;cursor:pointer;
  font-size:.85rem;font-weight:800;color:var(--ink2);list-style:none;min-height:48px;
  transition:color var(--dur)}
.acc-sum::-webkit-details-marker{display:none}
.acc-sum:hover{color:var(--ink)}
.acc-sum svg{width:14px;height:14px;stroke:var(--acc);fill:none;stroke-width:1.7;flex:0 0 auto}
.acc-sum .acc-ar{margin-inline-start:auto;color:var(--ink3);font-size:1rem;
  transform:rotate(-90deg);transition:transform var(--dur) var(--ease)}
.acc[open] .acc-sum .acc-ar{transform:rotate(0deg)}
.acc-body{padding:2px 16px 16px;border-top:1px solid var(--hair)}
.acc-rem{margin-top:14px}

/* الحالة الفارغة المصممة للعمود الأيسر — ارتفاع متوازن، أيقونة، عنوان، شرح */
.kc-empty{border:1px dashed rgba(28,42,78,.9);border-radius:var(--r);
  padding:26px 18px;margin-top:2px}
.kc-empty svg{width:30px;height:30px;stroke:var(--ink3);fill:none;stroke-width:1.5;
  margin:0 auto 12px;display:block}
.kc-empty .ph-t{text-align:center;font-weight:700;color:var(--ink2);font-size:.88rem}
.kc-empty .ph-s{color:var(--ink3);font-size:.79rem;line-height:1.7;text-align:center;margin-top:7px}

/* سطر البيانات الوصفية لبطاقة الجهات المتصلة */
.inst-meta{margin-top:10px;padding-top:9px;border-top:1px solid var(--hair)}

/* ══ V3 — Intelligence Feed للعمود الأيسر: عناصر صغيرة أنيقة، فواصل شعرية، لا بطاقات ══ */

/* تسمية قسم التغذية — نقطة حالة + نص صغير بتباعد أحرف */
.feed-lbl{display:flex;align-items:center;gap:8px;font-size:.72rem;font-weight:800;color:var(--ink3);
  letter-spacing:.07em;margin:8px 2px 1px}
.feed-lbl::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--ink3);flex:0 0 auto}
.feed-lbl.ok{color:var(--ok)}
.feed-lbl.ok::before{background:var(--ok)}
.feed-lbl.reco{color:var(--warn)}
.feed-lbl.reco::before{background:var(--warn)}

/* عنصر التغذية — بلاطة حية صغيرة: طبقة خفيفة + حد شبه خفي + دخول متدرج */
.feed{display:flex;flex-direction:column;gap:10px}
.fi{display:flex;gap:11px;align-items:flex-start;padding:12px 13px;text-decoration:none;color:inherit;
  background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);border-radius:14px;
  transition:background var(--dur),transform var(--dur) var(--ease),border-color var(--dur);
  opacity:0;transform:translateY(6px);animation:rise .45s var(--ease) forwards}
.fi:nth-child(2){animation-delay:.06s}
.fi:nth-child(3){animation-delay:.12s}
.fi:nth-child(4){animation-delay:.18s}
.fi:last-child{border-bottom:1px solid rgba(255,255,255,.05)}
a.fi:hover{background:rgba(255,255,255,.04);border-color:rgba(43,217,254,.18);transform:translateY(-1px)}
.fi-ic{width:27px;height:27px;border-radius:9px;flex:0 0 auto;display:grid;place-items:center;
  background:var(--s2);border:1px solid rgba(255,255,255,.05)}
.fi-ic svg{width:13px;height:13px;stroke:var(--acc);fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.fi.ok .fi-ic svg{stroke:var(--ok)}
.fi.warn .fi-ic svg{stroke:var(--warn)}
.fi-tx{flex:1;min-width:0}
.fi-t{display:block;font-size:.84rem;font-weight:700;color:var(--ink);line-height:1.55}
a.fi:hover .fi-t{color:var(--acc)}
.fi-m{display:block;font-size:.72rem;color:var(--ink3);margin-top:2px;line-height:1.55}

/* ══ المرحلة 3 — مركز الأدوات الذكية + صقل بطاقة التوصية + نقص هادئ ══ */

/* تسمية قسم الأدوات — بعنبر خافت يميزها عن التغذية المعرفية */
.feed-lbl.tools::before{background:var(--warn);opacity:.7}

/* شبكة الأدوات — عمودان مدمجان داخل اللوحة اليسرى */
.tools{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0 14px}
.tool{display:flex;flex-direction:column;align-items:flex-start;gap:7px;text-align:start;
  background:linear-gradient(160deg,var(--s2),var(--s1));border:1px solid rgba(255,255,255,.05);
  border-radius:14px;padding:12px 12px 11px;cursor:pointer;
  transition:border-color var(--dur),transform var(--dur) var(--ease),box-shadow var(--dur)}
.tool:hover{border-color:rgba(43,217,254,.20);transform:translateY(-2px);box-shadow:var(--shadow-1)}
.tool:active{transform:scale(.98)}
.tool:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.tool-ic{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;
  background:var(--acc-glow);border:1px solid rgba(43,217,254,.14)}
.tool-ic svg{width:15px;height:15px;stroke:var(--acc);fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.tool-ic.big{width:44px;height:44px;border-radius:13px;flex:0 0 auto}
.tool-ic.big svg{width:22px;height:22px}
.tool-n{font-size:.82rem;font-weight:800;color:var(--ink);line-height:1.4}
.tool-tag{font-size:.68rem;color:var(--ink3);line-height:1.5}

/* نافذة تعريف الأداة — وسطية على سطح المكتب */
.tsheet-scrim{position:fixed;inset:0;background:rgba(4,8,18,.6);backdrop-filter:blur(3px);
  opacity:0;transition:opacity .3s var(--ease);z-index:60}
.tsheet-scrim.on{opacity:1}
.tsheet{position:fixed;inset:0;margin:auto;width:min(430px,92vw);height:fit-content;max-height:82vh;
  overflow:auto;background:var(--s1);border:1px solid var(--hair);border-radius:var(--r-lg);
  padding:22px;z-index:61;box-shadow:var(--shadow-pop);
  opacity:0;transform:translateY(16px) scale(.97);transition:opacity .32s var(--ease),transform .32s var(--ease)}
.tsheet.on{opacity:1;transform:none}
.tsheet-grip{display:none}
.tsheet-h{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.tsheet-h > div{flex:1;min-width:0}
.tsheet-h h3{font-size:1.06rem;font-weight:800}
.tsheet-h p{font-size:.8rem;color:var(--ink2);margin-top:3px;line-height:1.55}
.soon{flex:0 0 auto;font-size:.66rem;font-weight:800;color:var(--warn);
  background:var(--warn-bg);border:1px solid rgba(240,179,84,.22);border-radius:99px;padding:3px 10px}
.tsheet-pts{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.tsheet-pts li{font-size:.86rem;color:var(--ink2);line-height:1.6;padding-inline-start:16px;position:relative}
.tsheet-pts li::before{content:'';position:absolute;inset-inline-start:0;top:.62em;width:6px;height:6px;
  border-radius:50%;background:var(--acc);opacity:.8}
.tsheet-n{margin-top:14px;font-size:.76rem;color:var(--ink3);line-height:1.65;
  border-top:1px solid var(--hair);padding-top:12px}
.tsheet-x{margin-top:14px;width:100%;padding:12px;border-radius:12px;font-weight:800;font-size:.9rem;
  background:var(--s3);border:1px solid var(--hair);color:var(--ink);
  transition:border-color var(--dur),background var(--dur)}
.tsheet-x:hover{border-color:rgba(43,217,254,.25)}

/* «ليش رشحنا لك» — سبب التوصية في إطار هادئ بدل فقرة عائمة */
.rec-why2{margin:12px 16px 0;display:flex;flex-direction:column;gap:6px;
  background:rgba(43,217,254,.05);border:1px solid rgba(43,217,254,.12);
  border-radius:13px;padding:11px 13px}
.why-k{display:flex;align-items:center;gap:6px;font-size:.7rem;font-weight:800;color:var(--acc);letter-spacing:.02em}
.why-k svg{width:12px;height:12px;stroke:var(--acc);fill:none;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round}
.why-t{font-size:.9rem;color:var(--ink);line-height:1.65}

/* حالة «قيد التوثيق» — رمادية هادئة بدل الأحمر: النقص معلومة لا عطل */
.st.na{background:var(--ink3);opacity:.55}

/* تنبيه التغطية الهادئ — Coverage-aware UI: يعلم بلا إنذار */
.cov-note{display:flex;gap:12px;align-items:flex-start;margin-top:18px;
  background:var(--s1);border:1px solid var(--hair);border-radius:var(--r);padding:15px 17px}
.cov-note svg{width:18px;height:18px;flex:0 0 auto;margin-top:3px;
  stroke:var(--ink3);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.cov-note b{display:block;font-size:.92rem;font-weight:800;color:var(--ink);margin-bottom:4px}
.cov-note p{font-size:.88rem;color:var(--ink2);line-height:1.7}

/* الموبايل — الأدوات والنافذة والتنفس */
@media (max-width:767.5px){
  .tools{grid-template-columns:1fr 1fr;gap:7px}
  .tool{padding:11px 10px 10px}
  .tool-tag{display:none}                 /* الاسم والأيقونة يكفيان على الشاشة الصغيرة */
  .tsheet{inset:auto 0 0;margin:0;width:100%;max-height:78vh;
    border-radius:22px 22px 0 0;border-bottom:0;
    padding:14px 18px calc(18px + var(--safe-b));
    transform:translateY(100%)}
  .tsheet.on{transform:none}
  .tsheet-grip{display:block;width:40px;height:4px;border-radius:99px;
    background:var(--s3);margin:0 auto 12px}
  .rec-why2{margin:12px 14px 0}
  .cov-note{padding:13px 14px}
}
@media (prefers-reduced-motion:reduce){
  .tsheet,.tsheet-scrim{transition:none}
  .tool:hover{transform:none}
}

/* لوحة الحساب — دخول برمز البريد */
.acct-btn{background:rgba(255,255,255,.06);color:inherit;border:1px solid rgba(255,255,255,.14);
  border-radius:999px;padding:.34rem .8rem;font:inherit;font-size:.82rem;cursor:pointer}
.acct-btn:hover{background:rgba(255,255,255,.11)}
.acct{position:fixed;inset-inline-end:1rem;inset-block-end:5rem;z-index:60;width:min(21rem,calc(100vw - 2rem));
  background:#111827;border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:1rem 1.05rem;
  box-shadow:0 18px 48px rgba(0,0,0,.5)}
.acct[hidden]{display:none}
.acct-h{margin:0 0 .2rem;font-size:1rem}
.acct-sub{margin:0 0 .7rem;font-size:.82rem;opacity:.75}
.acct-mid{margin:.1rem 0 .6rem;font-size:.85rem}
.acct-note,.acct-consent{margin:.6rem 0 0;font-size:.74rem;opacity:.62;line-height:1.6}
.acct input{width:100%;box-sizing:border-box;margin:0 0 .5rem;padding:.55rem .7rem;font:inherit;font-size:.88rem;
  color:inherit;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:9px}
.acct-do{width:100%;padding:.55rem;font:inherit;font-size:.88rem;cursor:pointer;color:#04202b;
  background:#2BD9FE;border:0;border-radius:9px}
.acct-do:hover{filter:brightness(1.07)}
.acct-msg{margin-top:.55rem;font-size:.8rem;min-height:1.1em}
.acct-msg.ok{color:#6ee7b7}
.acct-msg.bad{color:#fca5a5}
.acct-wait{margin:.2rem 0 .7rem;font-size:.84rem;line-height:1.75}
.acct-alt{width:100%;margin-top:.45rem;padding:.5rem;font:inherit;font-size:.82rem;cursor:pointer;
  color:inherit;background:transparent;border:1px solid rgba(255,255,255,.16);border-radius:9px}
.acct-alt:hover{background:rgba(255,255,255,.06)}

/* رحلة الطالب */
.jsheet{position:fixed;inset-inline:0;inset-block-end:0;z-index:70;max-height:88vh;overflow-y:auto;
  background:#0F1623;border-top:1px solid rgba(255,255,255,.12);border-radius:18px 18px 0 0;
  padding:1.1rem 1.2rem 2.4rem;box-shadow:0 -18px 54px rgba(0,0,0,.55);
  max-width:44rem;margin-inline:auto}
.jsheet[hidden]{display:none}
.j-top{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.j-h{margin:0;font-size:1.15rem}
.j-x{background:none;border:0;color:inherit;font-size:1.05rem;cursor:pointer;opacity:.7;padding:.3rem}
.j-x:hover{opacity:1}
.j-sub{margin:.7rem 0 .5rem;font-size:.86rem;opacity:.78}
.j-states{display:flex;flex-wrap:wrap;gap:.4rem}
.j-state{padding:.42rem .75rem;font:inherit;font-size:.82rem;cursor:pointer;color:inherit;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:999px}
.j-state:hover{background:rgba(255,255,255,.1)}
.j-state.on{background:#2BD9FE;color:#04202b;border-color:#2BD9FE;font-weight:600}
.j-hint{margin:.75rem 0 .55rem;font-size:.85rem;opacity:.8}
.j-prog{height:7px;border-radius:99px;background:rgba(255,255,255,.09);overflow:hidden}
.j-prog>i{display:block;height:100%;background:#2BD9FE;transition:width .25s ease}
.j-prog-t{margin:.35rem 0 .9rem;font-size:.78rem;opacity:.68}
.j-next{background:rgba(43,217,254,.09);border:1px solid rgba(43,217,254,.28);
  border-radius:12px;padding:.7rem .85rem;margin-bottom:1rem}
.j-next.j-done{background:rgba(110,231,183,.1);border-color:rgba(110,231,183,.3)}
.j-next-l{font-size:.72rem;opacity:.72;margin-bottom:.2rem}
.j-next-t{font-size:.95rem;font-weight:600;line-height:1.6}
.j-next-w{font-size:.74rem;opacity:.7;margin-top:.25rem}
.j-h3{margin:1.1rem 0 .5rem;font-size:.95rem}
.j-list{list-style:none;margin:0;padding:0}
.j-item{display:flex;align-items:flex-start;gap:.55rem;padding:.42rem 0;font-size:.87rem;
  line-height:1.65;cursor:pointer}
.j-item input{margin-top:.28rem;accent-color:#2BD9FE;width:1.02rem;height:1.02rem;flex:none}
.j-week{margin-bottom:.7rem}
.j-week-t{font-size:.82rem;opacity:.75;margin:.5rem 0 .1rem}
.j-wa{margin-top:1.15rem;padding-top:.9rem;border-top:1px solid rgba(255,255,255,.1)}
.j-wa input[type=text],.j-wa input:not([type=checkbox]){width:100%;box-sizing:border-box;
  margin:.5rem 0 .45rem;padding:.5rem .65rem;font:inherit;font-size:.86rem;color:inherit;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:9px}
.j-save-wa{padding:.42rem .8rem;font:inherit;font-size:.8rem;cursor:pointer;color:inherit;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:9px}
.j-note{margin:.5rem 0 0;font-size:.75rem;opacity:.6;line-height:1.65}
.j-status{margin-top:.85rem;font-size:.8rem;min-height:1.1em}
.j-status.ok{color:#6ee7b7}
.j-status.bad{color:#fca5a5}

/* لمسة دافئة + مساحة أوسع — أقل نيون وأقل حدود زرقاء */
:root{ --art-warm:#E8A87C; --art-cool:#2BD9FE; --art-line:rgba(255,255,255,.30);
       --art-bg:#0F1623; --art-fill:rgba(255,255,255,.03) }
.j-hero{display:flex;align-items:center;gap:.9rem;margin:1rem 0 .3rem}
.stage-art{width:96px;height:72px;flex:none}
.j-where{margin:0;font-size:.95rem;line-height:1.75;opacity:.9}
.j-next{background:rgba(232,168,124,.08);border:1px solid rgba(232,168,124,.24)}
.j-next-why{margin-top:.4rem;font-size:.79rem;opacity:.72;line-height:1.7}
.j-tip{margin:.9rem 0 .2rem;padding:.75rem .85rem;font-size:.86rem;line-height:1.75;
  background:rgba(255,255,255,.04);border-inline-start:2px solid var(--art-warm);border-radius:0 10px 10px 0}
.j-tip-l{display:block;font-size:.7rem;opacity:.6;margin-bottom:.2rem}
.j-guide{margin:.7rem 0 .2rem;font-size:.83rem;line-height:1.8;opacity:.72}
.j-stages{gap:.45rem}
.j-stage.on{background:var(--art-warm);color:#2a1408;border-color:var(--art-warm)}
.jsheet{padding-bottom:2.8rem}
.j-h3{margin-top:1.4rem}
.j-prog>i{background:var(--art-warm)}

/* ═══ إعادة التصميم: هادئ، mobile-first، كروت أقل ═══ */
:root{ --warm:#E8A87C; --warm-soft:rgba(232,168,124,.10); --warm-line:rgba(232,168,124,.26) }

/* مسار الرحلة — عمودي دائماً */
.j-path{list-style:none;margin:.4rem 0 0;padding:0}
.j-node{position:relative;padding-inline-start:1.75rem;padding-bottom:1.4rem}
.j-node::before{content:'';position:absolute;inset-inline-start:.42rem;top:1.5rem;bottom:-.2rem;
  width:1px;background:rgba(255,255,255,.12)}
.j-node:last-child::before{display:none}
.j-dot{position:absolute;inset-inline-start:0;top:.28rem;width:.88rem;height:.88rem;border-radius:50%;
  border:1.5px solid rgba(255,255,255,.24);display:grid;place-items:center;font-size:.55rem;
  background:var(--art-bg,#0F1623);transition:transform .2s ease,background .2s ease}
.j-node.done .j-dot{background:rgba(255,255,255,.16);border-color:transparent;color:#cfe}
.j-node.cur .j-dot{background:var(--warm);border-color:var(--warm);transform:scale(1.25)}
.j-node-t{margin:0;font-size:.92rem;font-weight:500;opacity:.5;line-height:1.5}
.j-node.done .j-node-t{opacity:.42;text-decoration:none}
.j-node.cur .j-node-t{opacity:1;font-size:1.12rem;font-weight:650}
.j-node-hint{margin:.15rem 0 0;font-size:.72rem;opacity:.4}

/* بطاقة المرحلة الحالية — الوحيدة المفتوحة */
.j-card{margin-top:.85rem;animation:jfade .28s ease both}
@keyframes jfade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.j-card .j-next{background:var(--warm-soft);border:1px solid var(--warm-line);border-radius:12px}
.j-prog-t{margin:.9rem 0 .3rem;font-size:.78rem;opacity:.62}
.j-tip{border-inline-start:2px solid var(--warm)}
.j-tip-l{display:none}

/* مبدّل المرحلة — مطوي، خيارات تحت بعض */
.j-switch{margin-top:.4rem;border-top:1px solid rgba(255,255,255,.08);padding-top:.9rem}
.j-switch>summary{cursor:pointer;font-size:.84rem;opacity:.66;list-style:none;padding:.3rem 0}
.j-switch>summary::-webkit-details-marker{display:none}
.j-switch>summary::after{content:' ⌄'}
.j-switch[open]>summary::after{content:' ⌃'}
.j-switch-list{display:flex;flex-direction:column;gap:.5rem;margin-top:.7rem}
.j-opt{width:100%;text-align:start;padding:.72rem .85rem;font:inherit;font-size:.88rem;cursor:pointer;
  color:inherit;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10);
  border-radius:11px;min-height:44px;transition:background .18s ease}
.j-opt:hover{background:rgba(255,255,255,.08)}
.j-opt.on{background:var(--warm);color:#2a1408;border-color:var(--warm);font-weight:600}

/* الورقة — شاشة كاملة على الموبايل */
.jsheet{inset-block-start:0;max-height:100dvh;height:100dvh;border-radius:0;
  padding:1.15rem 1.15rem 3rem;overflow-y:auto}
@media (min-width:700px){
  .jsheet{inset-block-start:auto;height:auto;max-height:88vh;border-radius:18px 18px 0 0;
    max-width:38rem;padding:1.4rem 1.6rem 2.6rem}
}
.j-item{padding:.5rem 0;min-height:44px;align-items:center}
.j-item input{width:1.3rem;height:1.3rem;margin-top:0}
.j-hero{gap:1rem;margin:.2rem 0 .9rem}

/* آخر المستجدات — قسم ثانوي مطوي */
.updates{margin-top:1.6rem;border-top:1px solid rgba(255,255,255,.08);padding-top:.9rem}
.updates>summary{cursor:pointer;font-size:.86rem;opacity:.7;list-style:none;padding:.35rem 0}
.updates>summary::-webkit-details-marker{display:none}
.updates>summary::after{content:' ⌄';opacity:.7}
.updates[open]>summary::after{content:' ⌃'}

@media (prefers-reduced-motion:reduce){
  .j-card{animation:none} .j-dot{transition:none} .j-opt{transition:none}
}

/* ═══ إصلاح التخطيط: ترحيب أقصر، بانر شريط، خيارات ظاهرة ═══ */

/* ترحيب: ٢٥٣px ← ~١٣٥px (‑٤٦٪) وسطران كحد أقصى */
.hero{padding:14px 0 12px}
.hero::before{display:none}                 /* التوهج كان يضخّم الإحساس بالفراغ */
.hero h1{font-size:clamp(1.6rem,2vw + .7rem,2.05rem);margin-bottom:6px;line-height:1.2}
.hero .sub{font-size:.97rem;line-height:1.6;max-width:34em;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hero .brandmark{margin-bottom:2px}
/* التجاوز الأفقي كان ٥٩٠px داخل ٥٢٠px */
.hero{max-width:100%;overflow-x:clip}
.hero h1,.hero .sub{overflow-wrap:anywhere}

/* بانر الموعد: شريط تنبيه مستقل فوق كل شي، بسيط */
.banner{margin:0 0 14px;padding:.6rem .8rem;border-radius:12px;
  display:flex;align-items:center;gap:.7rem;flex-wrap:nowrap}
.banner .b-t{font-size:.86rem;line-height:1.5;margin:0;flex:1;min-width:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.banner .b-go{flex:0 0 auto;padding:.42rem .8rem;font-size:.82rem;min-height:38px}
@media (max-width:520px){
  .banner{flex-wrap:wrap}
  .banner .b-go{width:100%}
}

/* الخيارات: أقصر عشان ٤ تظهر فوق الطية، وكل البطاقة قابلة للنقر */
.deck{gap:9px;margin-top:14px}
.sug{padding-block:.62rem;cursor:pointer}
.sug .ic{width:36px;height:36px;border-radius:11px}
.sug .tx{font-size:.94rem;line-height:1.35}
.sug .tx small{font-size:.78rem;margin-top:1px}
.sug:hover{border-color:rgba(232,168,124,.30);box-shadow:none}  /* حدود أهدأ، بلا توهّج */
.sug:hover .go{color:var(--warm,#E8A87C)}

/* الخامس فما فوق: مطوي خلف زر واضح — لا محتوى مخفي بلا إشارة */
.deck > .sug:nth-child(n+5){display:none}
.deck.more-open > .sug:nth-child(n+5){display:flex;animation:jfade .24s ease both}
.more-btn{width:100%;margin-top:2px;padding:.6rem;font:inherit;font-size:.86rem;cursor:pointer;
  color:inherit;background:transparent;border:1px dashed rgba(255,255,255,.18);border-radius:11px;
  min-height:44px;transition:background .18s ease}
.more-btn:hover{background:rgba(255,255,255,.05)}

/* الأعمدة الجانبية أضيق — الوسط يأخذ المساحة */
@media (min-width:1100px){
  .rail{max-width:15rem}
}
@media (prefers-reduced-motion:reduce){ .deck.more-open > .sug{animation:none} }

/* ═══ إلغاء تخطيط الثلاثة أعمدة — عمود واحد متمركز ═══
   الأعمدة الجانبية ما تنحذف: «رحلتي» تصير شريط أفقي فوق المحتوى،
   و«مساعدك اليوم/الأدوات» ينزل قسماً سفلياً بعد المحتوى. */
@media (min-width:1200px){
  body{
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto auto minmax(0,1fr) !important;
    height:auto !important; overflow:visible !important;
    max-width:none !important; padding:0 22px 22px !important;
    column-gap:0 !important;
  }
  .prog,.tabs{grid-column:1/-1 !important}

  /* حاوية واحدة متمركزة أوسع */
  .center{display:flex !important;flex-direction:column;
    grid-column:1/-1 !important; grid-row:3 !important;
    width:100%; max-width:56rem; margin-inline:auto; min-height:0}
  .stage{overflow:visible !important}

  /* «رحلتي» ← شريط أفقي مختصر فوق المحتوى */
  .rail-r{grid-column:1/-1 !important; grid-row:3 !important;
    order:-1; display:flex !important; flex-direction:row !important;
    flex-wrap:wrap; gap:10px; overflow:visible !important;
    width:100%; max-width:56rem; margin:0 auto 4px; padding:0 !important;
    align-self:start}
  .rail-r > *{flex:1 1 15rem; min-width:0}
  .rail-r .rail-head{font-size:.78rem}

  /* «مساعدك اليوم / الأدوات» ← قسم سفلي بعد المحتوى */
  .rail-l{grid-column:1/-1 !important; grid-row:4 !important;
    display:grid !important; grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));
    gap:12px; overflow:visible !important;
    width:100%; max-width:56rem; margin:22px auto 0; padding:0 !important;
    border-top:1px solid rgba(255,255,255,.07); padding-top:18px !important}

  /* الترحيب لا يتجاوز 120px */
  .hero{padding:10px 0 8px}
  .hero h1{font-size:1.75rem;margin-bottom:4px}
  .hero .sub{font-size:.94rem;line-height:1.55}

  /* البانر أصغر وأضيق */
  .banner{max-width:40rem;margin-inline:0;padding:.5rem .7rem}
  .banner .b-t{font-size:.82rem;-webkit-line-clamp:1}
  .banner .b-go{min-height:34px;padding:.34rem .7rem;font-size:.79rem}
}

/* ═══ «رحلتي» بطاقة أفقية مختصرة داخل المحتوى ═══ */
.jstrip{display:flex !important;flex-direction:row !important;flex-wrap:wrap;align-items:stretch;
  gap:10px; width:100% !important; max-width:none !important;
  margin:0 0 14px !important; padding:0 !important; overflow:visible !important;
  order:0 !important; grid-column:auto !important; grid-row:auto !important}
/* المعروض: المرحلة + الخطوة + الزر، ونسبة التقدم. الباقي في «رحلتي» الكاملة */
.jstrip > .rail-head{display:none}
.jstrip > .rail-card{flex:1 1 15rem;min-width:0;margin:0;padding:.7rem .85rem}
/* nth-child لا nth-of-type: كلها div فتُحسب الترويسة ضمنها */
.jstrip > .rail-card:nth-child(n+4){display:none}
.jstrip > .acc{display:none}
.jstrip .rail-next{flex:2 1 20rem}
/* مختصرة: بلا أزرار عملاقة ولا ارتفاع زائد */
.jstrip .rail-card *{font-size:.85rem;line-height:1.5}
.jstrip .rail-card .rail-head,.jstrip .rail-card small{font-size:.72rem}
.jstrip .rail-cta,.jstrip button{width:auto !important;min-height:36px;padding:.4rem .9rem !important;
  font-size:.82rem !important;border-radius:9px;margin-top:.45rem}
@media (max-width:560px){ .jstrip > .rail-card{flex:1 1 100%} }

/* ═══ عرض أوسع على الديسكتوب + شريط رحلتي أخف ═══ */
@media (min-width:1200px){
  .center,.rail-r,.rail-l{max-width:67.5rem !important}   /* 1080px بدل 896 */
  .stage .pad{max-width:none}
  .hero .sub{max-width:46em}
}
/* الشريط أخف: صف واحد، ارتفاع أقل */
.jstrip{margin:18px 0 0 !important;gap:8px}
.jstrip > .rail-card{padding:.55rem .75rem !important;border-radius:12px}
.jstrip .rail-card *{font-size:.82rem;line-height:1.45}
.jstrip .rail-cta,.jstrip button{min-height:32px;padding:.32rem .8rem !important;
  font-size:.79rem !important;margin-top:.35rem}
/* بطاقات الخيارات أقصر عشان الأربعة تكتمل فوق الطية */
.sug{padding-block:.5rem}
.sug .ic{width:32px;height:32px}
.deck{gap:7px;margin-top:10px}

/* ═══ ضبط نهائي: تسلسل أضيق وشريط أخف ═══ */
.banner{margin-bottom:10px !important}
.hero{padding:6px 0 4px !important}
@media (min-width:1200px){ .hero{padding:4px 0 2px !important} }
.hero .sub{line-height:1.5}
/* الشريط بين الترحيب والخيارات — ارتفاع صغير */
.jstrip{margin:10px 0 !important;gap:8px}
.jstrip > .rail-card{padding:.45rem .7rem !important}
.jstrip .rail-card *{font-size:.79rem;line-height:1.4}
.jstrip .rail-cta,.jstrip button{min-height:30px;padding:.26rem .75rem !important;
  font-size:.77rem !important;margin-top:.28rem}
.jstrip .rail-card .prog,.jstrip .rail-card progress{margin-top:.3rem}
/* مسافة أقل قبل «شنو تبي تسوي اليوم؟» وبين الخيارات */
.sec{margin:10px 0 4px !important}
.deck{margin-top:8px !important;gap:6px}

/* ═══ صقل: «رحلتي» صف أفقي واحد وأخف ═══ */
.jstrip{margin:6px 0 10px !important;gap:0 !important;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);
  border-radius:13px;padding:.42rem .6rem !important;flex-wrap:nowrap;align-items:center}
/* البطاقات تفقد هيئتها وتصير مقاطع في شريط واحد */
.jstrip > .rail-card{background:transparent !important;border:0 !important;box-shadow:none !important;
  padding:.18rem .7rem !important;margin:0 !important;flex:0 1 auto;
  display:flex;align-items:center;gap:.5rem;min-width:0}
.jstrip > .rail-card + .rail-card{border-inline-start:1px solid rgba(255,255,255,.09) !important}
.jstrip .rail-next{flex:1 1 auto}
.jstrip .rail-card *{font-size:.78rem !important;line-height:1.35 !important;margin:0 !important}
.jstrip .rail-card .rail-head{opacity:.6;white-space:nowrap}
.jstrip .rail-card > *{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jstrip .rail-cta,.jstrip button{min-height:28px !important;padding:.22rem .7rem !important;
  font-size:.76rem !important;margin:0 0 0 auto !important;flex:0 0 auto;white-space:nowrap}
.jstrip .rail-card progress,.jstrip .rail-card .prog{max-width:5rem;margin:0 !important}
@media (max-width:560px){
  .jstrip{flex-wrap:wrap;padding:.5rem .6rem !important}
  .jstrip > .rail-card{flex:1 1 100%;padding:.28rem .3rem !important}
  .jstrip > .rail-card + .rail-card{border-inline-start:0 !important;
    border-top:1px solid rgba(255,255,255,.09) !important;padding-top:.4rem !important}
  .jstrip .rail-cta,.jstrip button{margin-inline-start:0 !important}
}
/* خيارات أخف */
.sug{padding-block:.38rem !important;padding-inline:.7rem}
.sug .ic{width:29px;height:29px;border-radius:9px}
.sug .tx{font-size:.9rem}
.sug .tx small{font-size:.75rem}
.deck{gap:5px !important}

/* عنوان الحقل يُقرأ بقارئ الشاشة ولا يُرى — البديل عنه أن نضع
   العنوان في placeholder وحده، وهو يختفي أول ما يكتب المستخدم
   فيفقد من يستعمل قارئ الشاشة اسم الحقل تماماً. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
