@font-face{font-family:'Nunito';font-weight:400 900;font-display:swap;src:url("/assets/fonts/nunito-var-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+2212}
@font-face{font-family:'Clarity Arabic';font-weight:400 800;font-display:swap;src:url("/assets/fonts/baloo-bhaijaan-2-arabic-wght-normal.woff2") format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+200C-200E,U+FB50-FDFF,U+FE70-FEFC}
:root,:root[data-theme='light']{color-scheme:light;--bg:#fff6ef;--surface:#fff;--line:#efe7f0;--fg:#201a2e;--fg-muted:#6b6478;--primary:#6d4bd6;--primary-ink:#5a38c0;--spark:#13b6c9;--ring:0 0 0 1px rgb(109 75 214/.6),0 0 0 4px rgb(109 75 214/.18)}
:root[data-theme='dark']{color-scheme:dark;--bg:#141221;--surface:#1e1b2e;--line:#2e2a40;--fg:#f3f0fb;--fg-muted:#a79fc0;--primary:#9b7dff;--primary-ink:#b9a4ff;--spark:#3fd4e6;--ring:0 0 0 1px rgb(155 125 255/.65),0 0 0 4px rgb(155 125 255/.22)}
*,*::before,*::after{box-sizing:border-box}
html{scrollbar-color:var(--primary) var(--bg)}
body{margin:0;background:var(--bg);color:var(--fg);font:600 1.02rem/1.75 'Nunito',system-ui,sans-serif;-webkit-font-smoothing:antialiased;caret-color:var(--primary)}
html:lang(ar) body{font-family:'Clarity Arabic','Nunito',system-ui,sans-serif;line-height:1.85}
::selection{background:rgb(124 77 255/.22)}
:focus-visible{outline:none;box-shadow:var(--ring);border-radius:6px}
a{color:var(--primary-ink);text-underline-offset:.22em}
.wrap{inline-size:min(100% - 2*clamp(16px,4vw,44px),760px);margin-inline:auto}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:16px}
.home{display:inline-flex;align-items:center;gap:10px;min-block-size:44px;text-decoration:none;color:var(--fg);font:900 1.35rem/1 'Nunito',system-ui,sans-serif;letter-spacing:-.02em}
.home svg{inline-size:38px;block-size:32px}
.home .m{fill:var(--primary)}.home .s{fill:var(--spark)}
.lang{min-block-size:44px;padding:0 16px;border:2px solid var(--line);background:var(--surface);border-radius:999px;font:800 .95rem inherit;font-family:inherit;color:var(--fg);cursor:pointer}
.lang:hover{border-color:var(--primary)}
main{padding-block:clamp(28px,5vw,64px) 72px}
article[hidden]{display:none}
h1{margin:0;font-size:clamp(2.2rem,5vw,3.2rem);line-height:1.15;font-weight:900;letter-spacing:-.02em;text-wrap:balance}
html:lang(ar) h1{font-weight:800;letter-spacing:0;line-height:1.35}
.intro{margin:14px 0 0;color:var(--fg-muted);font-size:1.12rem;max-inline-size:60ch}
.updated{margin:10px 0 0;color:var(--fg-muted);font-size:.92rem}
section{margin-block-start:40px}
h2{margin:0 0 10px;font-size:1.35rem;font-weight:900;line-height:1.3}
html:lang(ar) h2{font-weight:800}
h3{margin:18px 0 6px;font-size:1.05rem;font-weight:800}
p,li{max-inline-size:68ch}
p{margin:0 0 10px}
ul,ol{margin:0;padding-inline-start:1.2em;display:grid;gap:6px}
.num{font-family:'Nunito',system-ui,sans-serif;font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate}
footer{border-block-start:1px solid var(--line);padding-block:24px;color:var(--fg-muted);font-size:.92rem;display:flex;flex-wrap:wrap;gap:8px 20px}
footer a{color:var(--fg-muted)}
footer a[aria-current]{color:var(--fg);font-weight:800;text-decoration:none}
