:root{
  --bg:#EFE9DC; --bg-2:#E4DCCB; --panel:#F7F3EA; --line:#CFC5B0; --line-soft:#DED5C2;
  --ink:#2A2D30; --ink-2:#5B5E62; --ink-3:#8A8377;
  --r2:#D9672B; --r2-soft:#F3D9C8; --r1:#3E7C4B; --r1-soft:#D3E3D2; --obl:#4F6D86; --obl-soft:#D5DFE7;
  --warn:#A8452B;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:"IBM Plex Sans Arabic","Noto Sans Arabic",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#1E2124; --bg-2:#25292D; --panel:#2A2E33; --line:#454B52; --line-soft:#33383E;
    --ink:#ECE6D8; --ink-2:#B8B1A3; --ink-3:#847E72;
    --r2:#E9814A; --r2-soft:#4A3122; --r1:#6FB07D; --r1-soft:#233A2A; --obl:#8FB0C9; --obl-soft:#243440; --warn:#E07A5F;
  }
}
:root[data-theme="dark"]{
  --bg:#1E2124; --bg-2:#25292D; --panel:#2A2E33; --line:#454B52; --line-soft:#33383E;
  --ink:#ECE6D8; --ink-2:#B8B1A3; --ink-3:#847E72;
  --r2:#E9814A; --r2-soft:#4A3122; --r1:#6FB07D; --r1-soft:#233A2A; --obl:#8FB0C9; --obl-soft:#243440; --warn:#E07A5F;
}
*{box-sizing:border-box}
html{direction:rtl}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased}
a{color:inherit}
.num,code{font-family:var(--mono);font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate}
code{font-size:.92em;background:var(--bg-2);padding:1px 6px;border-radius:3px}
.topbar{position:sticky;top:0;z-index:1000;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 20px;border-bottom:1px solid var(--line);background:var(--panel);font-size:14px}
.topbar .brand{font-weight:700;text-decoration:none}
.topbar nav{display:flex;gap:4px 18px;flex-wrap:wrap}
.topbar nav a{text-decoration:none;color:var(--ink-2)}
.topbar nav a[aria-current]{color:var(--ink);font-weight:600;border-bottom:2px solid var(--r2)}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:12px}
h1,h2,h3{font-weight:700;line-height:1.3;text-wrap:balance;margin:0}
p{margin:0 0 12px;max-width:68ch}
.tag{display:inline-block;font-family:var(--mono);font-size:11px;padding:0 7px;border-radius:2px;line-height:1.7;white-space:nowrap}
.tag.r1{background:var(--r1-soft);color:var(--r1)} .tag.r2{background:var(--r2-soft);color:var(--r2)} .tag.obl{background:var(--obl-soft);color:var(--obl)}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}