:root{
  --deep-teal:#103F3A; --dark-teal:#0B2F2C; --gold:#C79B3B;
  --off-white:#F7F4ED; --surface:#FFFCF6; --ink:#182523; --border:#E2D9C9;
  --muted:#5A6764;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--off-white); color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Naskh Arabic",
    "Geeza Pro",Tahoma,Arial,sans-serif;
  line-height:1.85; font-size:17px;
}
header{background:var(--deep-teal); color:var(--off-white); padding:34px 20px 30px}
header .wrap{max-width:820px;margin:0 auto}
header h1{margin:0 0 6px; font-size:26px; letter-spacing:.2px}
header p{margin:0; color:var(--gold); font-size:15px}
main{max-width:820px; margin:0 auto; padding:28px 20px 64px}
section{background:var(--surface); border:1px solid var(--border);
  border-radius:14px; padding:20px 22px; margin:0 0 18px}
h2{font-size:20px; margin:0 0 12px; color:var(--dark-teal)}
h3{font-size:17px; margin:20px 0 8px; color:var(--dark-teal)}
p,li{margin:0 0 10px}
ul{padding-inline-start:22px; margin:0 0 10px}
a{color:var(--deep-teal); text-decoration:underline; text-underline-offset:3px}
a:hover{color:var(--gold)}
.updated{color:var(--muted); font-size:14px; margin:0}
.tablewrap{overflow-x:auto; -webkit-overflow-scrolling:touch; margin:0 0 12px}
table{border-collapse:collapse; width:100%; min-width:520px; font-size:15px}
th,td{border:1px solid var(--border); padding:9px 11px; text-align:start; vertical-align:top}
th{background:#EFEADF; color:var(--dark-teal); font-weight:600}
.note{background:#EFEADF; border-inline-start:4px solid var(--gold);
  border-radius:8px; padding:12px 14px; margin:0 0 12px}
.btn{display:inline-block; background:var(--deep-teal); color:var(--off-white);
  padding:12px 20px; border-radius:10px; text-decoration:none; font-weight:600; margin:4px 0}
.btn:hover{background:var(--dark-teal); color:var(--off-white)}
footer{border-top:1px solid var(--border); margin-top:26px; padding-top:16px;
  color:var(--muted); font-size:14px}
[lang="en"]{direction:ltr; text-align:left}
[lang="en"] .tablewrap table{min-width:560px}