:root{--bg:#000000;--text:#ffffff;--accent:#f8bd04;--muted:#cfcfcf;--btn-bg:#111111;--btn-border:#2a2a2a;--btn-hover:#1a1a1a}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:'Cairo', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Noto Kufi Arabic', 'Noto Sans Arabic', sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;direction:rtl}
img{max-width:100%;display:block}
.container{width:min(100%,980px);margin-inline:auto;padding:24px}
.header{display:flex;align-items:center;gap:14px;padding-block:10px 24px}
.logo{width:72px;height:auto}
.brand{font-weight:800;font-size:clamp(28px,3.8vw,40px);letter-spacing:.3px}
.brand .accent{color:var(--accent)}
.subtext{margin-top:6px;color:var(--muted);font-weight:500;line-height:1.7}
.card{background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.01));border:1px solid var(--btn-border);border-radius:16px;padding:18px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.actions{display:flex;flex-direction:column;gap:16px;margin-top:22px}

.btn{position:relative;display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 18px;border-radius:14px;border:1px solid var(--btn-border);background:var(--btn-bg);color:var(--text);text-decoration:none;font-weight:800;font-size:18px;transition:transform .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease;will-change:transform;user-select:none;-webkit-tap-highlight-color:transparent}
.btn:hover{background:var(--btn-hover);border-color:var(--accent);box-shadow:0 12px 28px rgba(255,189,89,.15);transform:translateY(-1px)}
.btn:active{transform:translateY(0)}

.btn.accent{background:linear-gradient(180deg,rgba(255,189,89,.2),rgba(255,189,89,.08));border-color:var(--accent)}
.note{margin-top:18px;font-size:14px;color:var(--muted)}
.count-wrap{min-height:calc(100dvh - 48px);display:grid;place-items:center;text-align:center}
.count-box{padding:28px 22px;border:1px solid var(--btn-border);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.01));width:min(96%,640px);margin-inline:auto}
.count-number{font-size:clamp(38px,9vw,72px);font-weight:900;color:var(--accent);margin:0}
.count-text{margin:6px 0 0;color:var(--muted);font-weight:600;font-size:clamp(16px,2.2vw,18px)}
.links{display:grid;gap:14px;margin-top:14px}
.footer{margin-top:28px;font-size:12px;color:#a8a8a8;text-align:center;opacity:.9}
:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:12px}
html,body{overscroll-behavior:none}


.btn img.icon{width:44px;height:44px;object-fit:contain;}