:root{--bg:#F7F6F2;--card:#fff;--line:#E8E4D8;--text:#1F2120;--muted:#5d5f5c;--accent:#A4500F;--warn-bg:#FDF1E7}
@media (prefers-color-scheme:dark){:root{--bg:#121214;--card:#1c1c1f;--line:#2e2e33;--text:#F3F1EA;--muted:#b4b2ab;--accent:#F0A060;--warn-bg:#2a1f16}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.75 "IBM Plex Sans Arabic",system-ui,sans-serif}
main{max-width:760px;margin:0 auto;padding:24px 16px 64px}
header{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
h1,h2,h3{font-family:Cairo,"IBM Plex Sans Arabic",sans-serif;line-height:1.35}
h1{font-size:1.7rem;margin:.4em 0}
h2{font-size:1.25rem;margin:1.8em 0 .4em}
h3{font-size:1.05rem;margin:1.3em 0 .3em}
a{color:var(--accent)}
nav{display:flex;gap:16px}
.draft{background:var(--warn-bg);border:1px solid var(--line);border-radius:18px;padding:12px 16px;margin:16px 0}
section{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:8px 20px 20px;margin:20px 0}
.meta{color:var(--muted);font-size:.9rem}
ul{padding-inline-start:1.3em}
[dir=ltr]{text-align:left}