:root{--bg:#FFF9EC;--ink:#1B1A14;--soft:#6B6556;--line:#EADFC8;--accent:#E5502E;--card:#FFFFFF}
@media (prefers-color-scheme:dark){:root{--bg:#17150F;--ink:#FFF6DF;--soft:#B9B09B;--line:#332E22;--accent:#F06A49;--card:#211E16}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.75 -apple-system,BlinkMacSystemFont,"SF Arabic","Geeza Pro","Segoe UI","Noto Sans Arabic",Tahoma,sans-serif}
.wrap{max-width:40rem;margin:0 auto;padding:max(2.5rem,env(safe-area-inset-top)) 1rem 2rem}
.hero{text-align:center;padding:1.5rem 0 1rem}
.hero img{width:100%;max-width:22rem;height:auto;display:block;margin:0 auto}
.tag{font-size:1.45rem;font-weight:700;margin:1rem 0 .25rem}
.soon{display:inline-block;margin-top:.75rem;padding:.35rem .9rem;border:1.5px solid var(--accent);color:var(--accent);border-radius:999px;font-weight:600;font-size:.95rem}
ol.steps{list-style:none;padding:0;margin:2rem 0;display:grid;gap:.75rem}
ol.steps li{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:.9rem 1.1rem}
ol.steps b{color:var(--accent)}
.en{direction:ltr;text-align:left;border-top:1px solid var(--line);margin-top:2.5rem;padding-top:1.5rem}
.en .tag{text-align:left;font-size:1.25rem}
footer{margin-top:3rem;padding-top:1.25rem;border-top:1px solid var(--line);color:var(--soft);font-size:.9rem;display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;justify-content:center}
a{color:var(--accent)}
footer a{color:var(--soft)}
.msg{text-align:center;padding:2rem 0}
.msg img{width:5.5rem;height:auto}
.msg h1{font-size:1.5rem;margin:1rem 0 .25rem}