:root{--black:#050505;--obsidian:#0b0b0c;--coal:#121214;--graphite:#1b1b1e;--raised:#242428;--line:#38383e;--silver:#a7a7ad;--muted:#85858c;--white:#f7f7f8;--danger:#ff8585;--success:#91c7aa}
*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;background:var(--black);color:var(--white);font-family:"Noto Kufi Arabic",Tahoma,sans-serif;overflow-x:hidden}button,input,select{font:inherit}button{border:0}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 90% 0,#303034 0,transparent 28%),radial-gradient(circle at 5% 100%,#202023 0,transparent 30%),var(--black);opacity:.8}body:after{content:"";position:fixed;inset:0;pointer-events:none;opacity:.15;background-image:linear-gradient(30deg,transparent 47%,#fff 48%,#fff 48.7%,transparent 49.7%),linear-gradient(150deg,transparent 47%,#fff 48%,#fff 48.7%,transparent 49.7%);background-size:76px 132px}
.page-shell{position:relative;z-index:1;width:min(1240px,calc(100% - 64px));min-height:100vh;margin:auto;display:flex;flex-direction:column}header{height:106px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff12}.identity{display:flex;align-items:center;gap:14px;color:var(--white);text-decoration:none}.identity img{width:64px;height:64px;object-fit:contain;filter:grayscale(1) brightness(1.2) drop-shadow(0 5px 16px #000);border-radius:14px}.identity span{display:flex;flex-direction:column}.identity strong{font-size:18px}.identity small{font-family:Georgia,serif;font-size:9px;letter-spacing:3.5px;color:var(--silver)}.secure{display:flex;align-items:center;gap:9px;padding:9px 15px;border:1px solid var(--line);border-radius:12px;background:#ffffff08;color:var(--silver);font-size:10px}.secure i{color:var(--white)}
.hero{display:grid;grid-template-columns:1.04fr .96fr;align-items:center;gap:70px;flex:1;padding:46px 0 60px}.intro{position:relative;display:flex;align-items:center;min-height:560px;padding:24px 8px;overflow:hidden}.intro:before{content:"";position:absolute;right:-190px;width:430px;height:430px;border:1px solid #ffffff12;transform:rotate(45deg)}.intro-copy{position:relative;z-index:2;max-width:600px}.overline,.label{margin:0 0 16px;color:#c7c7cb;font-size:11px;font-weight:700}.overline{display:flex;align-items:center;gap:12px}.overline i{width:38px;height:1px;background:#a0a0a5}h1{margin:0 0 22px;font-size:clamp(44px,5vw,72px);line-height:1.35;letter-spacing:-2px}h1 em{font-style:normal;color:var(--silver);font-weight:500}.lead{max-width:560px;margin:0;color:#b1b1b6;font-size:13px;line-height:2.1}.seal{position:absolute;left:-20px;top:15px;width:390px;height:390px;object-fit:contain;filter:grayscale(1);opacity:.045}.journey{display:grid;grid-template-columns:auto 1fr auto 1fr auto;align-items:center;margin-top:48px}.journey>div{display:flex;align-items:center;gap:11px}.journey b{display:grid;place-items:center;width:38px;height:38px;border:1px solid #77777d;transform:rotate(45deg);color:#fff;font-size:10px}.journey span{display:flex;flex-direction:column;gap:5px}.journey strong{font-size:10px;white-space:nowrap}.journey small{color:#85858c;font-size:8px;white-space:nowrap}.journey>i{height:1px;margin:0 13px;background:#454549}
.card{position:relative;min-height:570px;padding:45px 54px 42px;background:linear-gradient(145deg,#1e1e21,#151517);border:1px solid #3d3d42;border-radius:24px;box-shadow:0 40px 100px #000c;overflow:hidden}.card:before,.card:after{content:"";position:absolute;width:78px;height:78px;border-color:#74747a;border-style:solid;opacity:.6}.card:before{top:14px;right:14px;border-width:1px 1px 0 0;border-radius:0 12px 0 0}.card:after{bottom:14px;left:14px;border-width:0 0 1px 1px;border-radius:0 0 0 12px}.ornament{position:absolute;top:-2px;left:50%;transform:translateX(-50%);color:#aaa;font-size:8px}.ornament:before,.ornament:after{content:"";display:inline-block;width:44px;height:1px;margin:0 8px;background:#777;vertical-align:middle}.progress{display:flex;align-items:flex-start;justify-content:center;margin:5px 0 43px}.progress>div{display:flex;flex-direction:column;align-items:center;gap:7px;color:#74747a}.progress div span{display:grid;place-items:center;width:29px;height:29px;border:1px solid #4d4d52;border-radius:50%;background:#29292d;color:#aaa;font-size:9px;font-weight:700}.progress small{font-size:8px}.progress .p{}.progress .active{color:#fff}.f8}.progress .active span{border-color:#eee;background:#eee;color:#111;box-shadow:0 00 0 44px #ffffff12}.progress>i{width:70px;height:1px;margin:14px 8px 0;background:#3b3b40}
.step{display:none}.step.active{display:block;animation:reveal .35s ease both}@keyframes reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.label{margin-bottom:7px;color:#a5a5aa}.card h2{margin:0;color:#fff;font-size:28px;line-height:1.55}.subtle{max-width:430px;margin:8px 0 26px;color:#aaaab0;font-size:10px;line-height:2}.subtle strong{color:#fff;direction:ltr;unicode-bidi:embed}.primary-btn{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:56px;padding:13px 22px;border:1px solid #55555b;border-radius:12px;background:#ededee;color:#111;font-size:11px;font-weight:800;text-decoration:none;cursor:pointer;box-shadow:0 12px 28px #0006;transition:.2s}.primary-btn:hover:not(:disabled){transform:translateY(-2px);background:#fff;box-shadow:0 16px 32px #0008}.primary-btn:disabled{opacity:.38;cursor:not-allowed}.primary-btn .fa-discord{font-size:19px}.primary-btn .arrow{position:absolute;left:20px;color:#555}.privacy{margin:14px 0 0;text-align:center;color:#77777e;font-size:8px}.privacy i{color:#aaa}.message{min-height:20px;margin:12px 0 0;font-size:9px;line-height:1.8}.message.error{color:var(--danger)}.message.success{color:var(--success)}
.profile{display:flex;align-items:center;gap:12px;margin:18px 0;padding:11px 13px;border:1px solid #3c3c41;border-radius:14px;background:#242428}.profile img{width:42px;height:42px;border:2px solid #55555b;border-radius:50%;object-fit:cover;background:#303034}.profile span{display:flex;flex:1;flex-direction:column}.profile small{color:#929298;font-size:8px}.profile strong{color:#fff;font-size:10px;direction:ltr;text-align:right}.profile>i{color:#ddd}label{display:block;margin-bottom:8px;color:#f5f5f6;font-size:9px;font-weight:700}.phone-field{display:grid;grid-template-columns:1fr 110px;gap:9px;direction:ltr}input,select{height:51px;padding:0 15px;border:1px solid #444449;border-radius:11px;outline:none;background:#29292d;color:#fff}input::placeholder{color:#777}input:focus,select:focus{border-color:#aaa;box-shadow:0 0 0 3px #ffffff12}#phone{direction:ltr;text-align:left}select{text-align:center;cursor:pointer}option{background:#242428}form .primary-btn{margin-top:14px}.otp-row{display:grid;grid-template-columns:repeat(4,62px);justify-content:center;gap:11px;margin:28px 0 19px}.otp-digit{height:64px;padding:0;border-radius:14px;text-align:center;font-size:21px;font-weight:700}.otp-actions{display:flex;justify-content:space-between;margin-top:13px}.text-btn{padding:5px;border-radius:8px;background:transparent;color:#c4c4c8;font-size:9px;font-weight:700;cursor:pointer}.text-btn:hover:not(:disabled){background:#ffffff0c}.text-btn:disabled{color:#666;cursor:not-allowed}.success{text-align:center;padding-top:10px}.success .subtle{margin-left:auto;margin-right:auto}.success-icon{display:grid;place-items:center;width:74px;height:74px;margin:0 auto 20px;border:1px solid #777;border-radius:50%;background:#ededee;color:#171719;font-size:24px;box-shadow:0 0 0 9px #ffffff0b}footer{display:flex;align-items:center;justify-content:center;gap:16px;height:62px;border-top:1px solid #ffffff12;color:#707077;font-size:8px}footer b{color:#bbb}
@media(max-width:950px){.page-shell{width:min(680px,calc(100% - 36px))}header{height:92px}.hero{grid-template-columns:1fr;gap:20px;padding-top:5px}.intro{min-height:auto;padding:35px 4px}.seal{width:270px;height:270px}.journey{margin-top:35px}.card{min-height:540px}footer{margin-top:24px}}
@media(max-width:560px){.page-shell{width:100%}header{height:82px;padding:0 18px}.identity img{width:52px;height:52px}.identity strong{font-size:14px}.secure span{display:none}.secure{padding:9px}.hero{gap:12px;padding:0}.intro{padding:34px 22px 26px}h1{font-size:38px}.lead{font-size:10px}.journey{grid-template-columns:1fr;gap:13px;margin-top:28px}.journey>i{display:none}.journey b{width:31px;height:31px}.card{min-height:560px;margin:0 12px 18px;padding:39px 25px;border-radius:20px}.progress>i{width:38px;margin-left:5px;margin-right:5px}.card h2{font-size:24px}.phone-field{grid-template-columns:1fr 98px}.otp-row{grid-template-columns:repeat(4,minmax(45px,1fr));gap:8px}.otp-digit{height:58px}footer{margin-top:0}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.progress .active span{box-shadow:0 0 0 4px #ffffff12}

/* Larger, high-contrast panel typography */
.card,.card h2,.card .label,.card .subtle,.card .subtle strong,.card label,.card .privacy,.card .message,.card .profile small,.card .profile strong,.card .progress>div,.card .text-btn{color:#fff}
.card h2{font-size:32px}.card .label{font-size:13px;margin-bottom:9px}.card .subtle{font-size:14px;line-height:1.9;margin-top:10px}.card label{font-size:13px;margin-bottom:10px}
.card .primary-btn{font-size:14px}.card .privacy{font-size:11px}.card .message{font-size:12px}.card .profile small{font-size:11px}.card .profile strong{font-size:13px}.card .progress small{font-size:10px}.card .progress div span{font-size:11px}.card .text-btn{font-size:12px}
.card input,.card select{font-size:14px;color:#fff}.card input::placeholder{color:#fff;opacity:.62}.card .text-btn:disabled{color:#fff;opacity:.4}
@media(max-width:560px){.card h2{font-size:28px}.card .subtle{font-size:13px}.card .primary-btn{font-size:13px}}

/* Islamic geometric background */
body:before{background:radial-gradient(circle at 84% 8%,#343438 0,transparent 27%),radial-gradient(circle at 8% 88%,#242427 0,transparent 31%),linear-gradient(135deg,#050505,#0b0b0c 48%,#050505);opacity:1}
body:after{inset:0;opacity:.16;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cg fill='none' stroke='%23ffffff' stroke-width='1'%3E%3Cpath d='M90 0 112 22 143 16 149 47 180 56 158 90 180 124 149 133 143 164 112 158 90 180 68 158 37 164 31 133 0 124 22 90 0 56 31 47 37 16 68 22Z'/%3E%3Cpath d='m90 38 14 29 38 23-38 23-14 29-14-29-38-23 38-23Z'/%3E%3Cpath d='M0 0 38 38M180 0l-38 38M0 180l38-38M180 180l-38-38'/%3E%3Ccircle cx='90' cy='90' r='9'/%3E%3C/g%3E%3C/svg%3E");background-size:180px 180px;background-position:center top}
.intro:before{right:auto;left:50%;top:8px;width:430px;height:520px;transform:translateX(-50%);border:1px solid #ffffff18;border-bottom:0;border-radius:215px 215px 18px 18px;box-shadow:inset 0 0 80px #ffffff05}
.intro:after{content:"◆";position:absolute;top:20px;left:50%;transform:translateX(-50%);color:#ffffff36;font-size:13px;text-shadow:0 24px 0 #ffffff18}
.card{backdrop-filter:blur(5px)}
@media(max-width:560px){body:after{background-size:130px 130px;opacity:.12}.intro:before{width:300px;height:390px;border-radius:150px 150px 12px 12px}}
.intro:before,.intro:after{display:none}
.seal{position:fixed;top:50%;left:50%;z-index:-1;width:620px;height:620px;transform:translate(-50%,-50%);opacity:.075;filter:grayscale(1) brightness(1.4);pointer-events:none}
@media(max-width:950px){.seal{width:520px;height:520px}}
@media(max-width:560px){.seal{width:390px;height:390px;opacity:.065}}
.seal{display:none}
