/* ————— ورقةُ الصفحات النصّية: الخصوصية والشروط —————
   التوكناتُ هنا **نسخةٌ ثالثة** عن `Theme.swift`: الأولى في التطبيق، والثانية
   في `index.html`. لم تُستخرج المشتركةُ من صفحة الغلاف عن قصد — تلك صفحةٌ
   قائمةٌ بذاتها بلا ملفٍّ خارجيٍّ واحد، وذلك أهمُّ من ألّا يُكتب اللونُ مرتين.
   وهاتان الصفحتان تتشاركان هذا الملف، فالتكرار في موضعٍ واحدٍ لا اثنين. */

@font-face{font-family:Baloo;src:url("fonts/BalooBhaijaan2-Medium.ttf") format("truetype");font-weight:500;font-display:swap}
@font-face{font-family:Baloo;src:url("fonts/BalooBhaijaan2-SemiBold.ttf") format("truetype");font-weight:600;font-display:swap}
@font-face{font-family:Baloo;src:url("fonts/BalooBhaijaan2-Bold.ttf") format("truetype");font-weight:700;font-display:swap}
@font-face{font-family:Baloo;src:url("fonts/BalooBhaijaan2-ExtraBold.ttf") format("truetype");font-weight:800;font-display:swap}

:root{
  --bg-top:#F8EFDC; --bg-mid:#F1E3C6; --bg-deep:#F1E3C6;
  --surface:#FFFDF6; --surface-edge:#D9C69C; --surface-stroke:transparent;
  --tile-stroke:#E4D5B2; --tile-edge:#D9C69C;
  --cream-chip:#F3EBD7; --cream-chip-edge:#D9C69C; --cream-chip-ink:#8A7A57;
  --ink:#4E3E20; --ink-strong:#5C4B29; --ink-2:#8C7B58; --ink-muted:#A6936C;
  --accent:#58AC2E; --accent-soft:#EFF8E4; --accent-soft-ink:#356A17; --accent-soft-edge:#9CC97E;
  --ring-green-stroke:#B8DC96;
  --ambient:rgba(120,90,40,.18);
  --t-caption:11.5px; --t-note:13px; --t-row:15px; --t-section:17px;
  --t-title:21px; --t-screen:26px; --t-hero:32px;
  --r-piece:14px; --r-tile:18px; --r-card:22px;
  --d-chip:3px; --d-tile:4px; --d-card:6px;
  --gutter:22px;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg-top:#453722; --bg-mid:#292016; --bg-deep:#1B150F;
    --surface:#2E2517; --surface-edge:#17120B; --surface-stroke:#453925;
    --tile-stroke:#4B3F2B; --tile-edge:#17120B;
    --cream-chip:#EFE5CB; --cream-chip-edge:#C9B482;
    --ink:#F4EDDF; --ink-strong:#F0E7D2; --ink-2:#B8AC97; --ink-muted:#8D816B;
    --accent:#7ACC4B; --accent-soft:#2E3B1C; --accent-soft-ink:#B8E895; --accent-soft-edge:#17120B;
    --ring-green-stroke:#5A8A38;
    --ambient:rgba(0,0,0,.40);
  }
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:Baloo,"Geeza Pro",system-ui,sans-serif;
  font-weight:500;font-size:var(--t-row);
  color:var(--ink);
  background:var(--bg-mid);
  background-image:linear-gradient(180deg,var(--bg-top) 0%,var(--bg-mid) 58%,var(--bg-deep) 100%);
  background-attachment:fixed;
  line-height:1.8;
}
img{max-width:100%;height:auto;display:block}
svg{display:block}
a{color:var(--accent);text-decoration:none;font-weight:700}
a:hover{text-decoration:underline}

/* عرضٌ مقيّد بمقاس القراءة: سطرٌ نصّيٌّ بعرض 1000 نقطة لا يُقرأ. */
.wrap{max-width:720px;margin:0 auto;padding-inline:var(--gutter)}

header{padding-block:20px 4px}
.bar{display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:11px;color:var(--ink)}
.brand img{width:40px;height:40px;border-radius:var(--r-piece)}
.brand b{font-size:var(--t-title);font-weight:800}
.back{font-size:var(--t-note);font-weight:700;color:var(--ink-2)}

.doc{
  margin-block:26px 40px;
  background:var(--surface);border:2px solid var(--surface-stroke);
  border-radius:var(--r-card);
  box-shadow:0 var(--d-card) 0 var(--surface-edge), 0 16px 28px -16px var(--ambient);
  padding:clamp(22px,4vw,34px);
}
.doc h1{font-size:clamp(24px,4vw,var(--t-hero));font-weight:800;line-height:1.3}
.stamp{font-size:var(--t-note);color:var(--ink-muted);margin-top:6px}

/* الخلاصةُ أولاً: من قرأ سطراً واحداً يقرأ هذا. */
.lead{
  margin-top:20px;padding:16px 18px;
  background:var(--accent-soft);border:2px solid var(--accent-soft-edge);
  border-radius:var(--r-tile);box-shadow:0 var(--d-tile) 0 var(--accent-soft-edge);
  color:var(--accent-soft-ink);font-size:var(--t-section);font-weight:600;line-height:1.7;
}

.doc h2{font-size:var(--t-title);font-weight:800;color:var(--ink-strong);margin-top:30px}
.doc p{margin-top:10px;color:var(--ink-2)}
.doc p strong{color:var(--ink-strong);font-weight:700}
.doc ul{margin-top:10px;padding-inline-start:0;list-style:none}
/* **الصفُّ ليس `flex`.** كان كذلك، فصار `<b>App Store:</b>` عنصراً مرناً
   مستقلاً عن نصّه بعده، فانضغط العنوانُ إلى عمودٍ من كلمتين فوق بعضهما.
   النقطةُ الآن `::before` مطلقةُ الموضع، والنصُّ يجري سطراً واحداً كما يجب. */
.doc li{position:relative;padding-inline-start:18px;color:var(--ink-2);margin-top:8px}
.doc li::before{
  content:"";position:absolute;inset-inline-start:0;top:12px;
  width:7px;height:7px;border-radius:2px;background:var(--accent);
}
.doc li b{color:var(--ink-strong);font-weight:700}

footer{padding-block:0 44px}
.foot{border-top:2px solid var(--tile-stroke);padding-top:22px;
  display:flex;flex-wrap:wrap;gap:6px 20px;align-items:center;justify-content:space-between;
  color:var(--ink-muted);font-size:var(--t-note)}