@font-face { font-family:"DIN Next LT Arabic"; src:url("../../assets/DINNextLTArabic-Regular.ttf") format("truetype"); font-weight:400; font-display:swap; }
@font-face { font-family:"DIN Next LT Arabic"; src:url("../../assets/DINNextLTArabic-Bold.ttf") format("truetype"); font-weight:700; font-display:swap; }
:root { color-scheme:light; --ink:#101820; --muted:#647180; --paper:#f4f2ed; --card:#fffdfa; --cyan:#1dc9de; --line:rgba(29,201,222,.3); }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; min-height:100vh; font-family:"DIN Next LT Arabic",Arial,sans-serif; color:var(--ink); background:radial-gradient(circle at 15% 10%,rgba(29,201,222,.14) 0,transparent 36%),var(--paper); }
.download-page { width:min(100% - 32px,760px); min-height:100vh; margin:0 auto; padding:max(28px,env(safe-area-inset-top)) 0 max(28px,env(safe-area-inset-bottom)); display:grid; align-content:center; gap:24px; }
.download-brand { display:flex; align-items:center; justify-content:center; gap:12px; color:inherit; text-decoration:none; font-size:1.2rem; font-weight:700; }
.download-brand img { width:54px; height:54px; border-radius:14px; }
.download-card { padding:clamp(28px,7vw,58px); text-align:center; background:var(--card); border:1px solid var(--line); border-radius:28px; box-shadow:0 24px 80px rgba(16,24,32,.1); }
.download-kicker { margin:0 0 18px; color:#087f91; font-size:.72rem; font-weight:700; letter-spacing:.12em; }
h1 { margin:0; font-size:clamp(2rem,8vw,3.4rem); line-height:1.2; }
#download-message { margin:18px auto 0; max-width:520px; color:var(--muted); line-height:1.8; }
.download-actions { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin-top:32px; }
.android-flow { display:grid; gap:14px; margin-top:30px; text-align:start; }
.android-step { display:grid; grid-template-columns:auto minmax(0,1fr); gap:14px; padding:20px; border:1px solid rgba(16,24,32,.11); border-radius:18px; background:rgba(255,255,255,.72); }
.android-step__number { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:var(--ink); color:#fff; font-weight:700; }
.android-step h2 { margin:1px 0 8px; font-size:1.18rem; }
.android-step p { margin:0 0 14px; color:var(--muted); line-height:1.7; font-size:.86rem; }
.membership-check { display:flex; align-items:flex-start; gap:10px; margin:14px 0; padding:13px; border:1px solid rgba(29,201,222,.26); border-radius:12px; background:rgba(29,201,222,.06); color:var(--ink); line-height:1.6; cursor:pointer; }
.membership-check input { width:20px; height:20px; flex:0 0 auto; margin-top:2px; accent-color:#087f91; }
.android-step .android-note { margin:12px 0 0; font-size:.76rem; }
.download-button { display:grid; gap:4px; padding:17px 20px; color:var(--ink); text-decoration:none; border:1px solid var(--line); border-radius:16px; background:#fff; }
.download-button--official { grid-column: 1 / -1; }
.download-button--primary { color:#fff; background:var(--ink); border-color:var(--ink); }
.download-button--disabled { cursor:not-allowed; color:#87919a; border-color:rgba(16,24,32,.08); background:rgba(16,24,32,.05); }
.download-button span { font-size:.72rem; opacity:.7; }
.download-button strong { font-size:1rem; }
.download-button:focus-visible { outline:3px solid rgba(29,201,222,.35); outline-offset:3px; }
.download-help { margin:24px auto 0; color:var(--muted); font-size:.84rem; line-height:1.8; }
@media (max-width:560px) { .download-actions { grid-template-columns:1fr; } .download-card { padding:26px 18px; border-radius:22px; } .android-step { grid-template-columns:1fr; } }