@font-face{font-family:DIN;src:url('assets/arabic.ttf') format('truetype');font-weight:400 800;font-display:swap}
@font-face{font-family:Signika;src:url('assets/signika.ttf') format('truetype');font-weight:700;font-display:swap}
:root{color-scheme:dark;--bg:#0c0c0f;--red:#ed2939;--muted:#96969f;--white:#f3f2f3}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--white);font-family:DIN,Arial,sans-serif}body::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 22% 48%,#67131e19,transparent 60%)}
a{color:inherit}.page{max-width:1440px;margin:auto;min-height:100svh;padding:0 6%;display:flex;flex-direction:column}.header{height:112px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff12;direction:ltr}.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand img{object-fit:contain}.brand>span{font-family:Signika,Arial,sans-serif;font-size:27px;letter-spacing:-.8px;line-height:1}.brand-jo{color:var(--red);margin-left:5px}small{display:block;font-family:Arial,sans-serif;font-size:7px;font-weight:600;letter-spacing:2.8px;margin-top:8px;color:#b5b5bc}.status{direction:rtl;font-size:14px;display:flex;align-items:center;gap:10px;color:#d1d0d5}.status i{width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 0 5px #ed293912}
main{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:5%;flex:1;padding:64px 0 70px;min-height:660px}.message{position:relative;z-index:2}.eyebrow{display:flex;align-items:center;justify-content:flex-end;gap:10px;color:#bcbcc5;font:700 11px Arial,sans-serif;letter-spacing:2.6px;margin:0 0 24px}.eyebrow span{width:24px;height:2px;background:var(--red)}h1{font-size:clamp(52px,5.8vw,84px);font-weight:400;line-height:1.13;letter-spacing:-2px;margin:0 0 23px}h1>span{color:var(--red)}.description{color:#aaaab5;font-size:19px;line-height:1.9;margin:0 0 30px}.update{border-right:2px solid var(--red);padding:9px 18px;display:flex;align-items:center;gap:14px;background:linear-gradient(to left,#ed29390b,transparent);margin-bottom:28px}.update strong{font-size:16px;font-weight:400}.update p{font-size:14px;color:var(--muted);margin:4px 0 0}.spinner{width:22px;height:22px;border:2px solid #ed29392e;border-top-color:var(--red);border-radius:50%;animation:spin 2s linear infinite;flex-shrink:0}.refresh{display:inline-flex;align-items:center;justify-content:center;gap:24px;background:var(--red);padding:12px 25px 14px;border:1px solid var(--red);text-decoration:none;font-size:17px;border-radius:4px;transition:background .2s,transform .2s}.refresh svg{width:19px;height:19px}.refresh:hover{background:#cf1c2c;transform:translateY(-2px)}.refresh:focus-visible,.brand:focus-visible{outline:3px solid white;outline-offset:5px}.footnote{color:#777782;font-size:13px;margin:17px 0 0}
.scene{position:relative;width:100%;aspect-ratio:1/1.08;isolation:isolate;display:flex;align-items:center;justify-content:center}.scene-grid{position:absolute;inset:0;background-image:linear-gradient(#ffffff04 1px,transparent 1px),linear-gradient(90deg,#ffffff04 1px,transparent 1px);background-size:42px 42px;mask-image:radial-gradient(ellipse,#000 20%,transparent 71%)}.red-disc{position:absolute;width:74%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 30% 30%,#ed3544,#c51b2a);z-index:-1;box-shadow:0 0 100px #d6213020}.orbit{position:absolute;border:1px solid #ffffff0e;border-radius:50%;width:88%;aspect-ratio:1;z-index:-1}.orbit-two{width:101%;border-style:dashed;opacity:.5}.orbit-one::after{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:var(--red);left:14%;top:13%}.mascot{width:71%;height:auto;object-fit:contain;filter:drop-shadow(0 24px 20px #0008);transform:rotate(-8deg);animation:float 6s ease-in-out infinite}.giant-type{position:absolute;left:0;right:0;top:10%;font:700 clamp(70px,10vw,150px) Signika,Arial,sans-serif;letter-spacing:-7px;text-align:center;color:transparent;-webkit-text-stroke:1px #ffffff16;z-index:-1}.cross{position:absolute;font:300 29px Arial;color:#5f5f69}.cross-one{left:4%;top:30%}.cross-two{right:3%;bottom:23%;color:var(--red)}.coordinate{position:absolute;font:9px monospace;letter-spacing:2px;color:#777782}.coordinate-top{top:1%;left:4%}.pause-tag{position:absolute;bottom:12%;right:0;display:flex;align-items:center;gap:13px;font:700 12px Arial,sans-serif;letter-spacing:1.5px;background:#19191e;border:1px solid #ffffff1a;box-shadow:0 10px 30px #0006;padding:18px 21px;transform:rotate(-6deg)}.pause-tag>span{color:var(--red);font-size:23px;line-height:1}.system-line{position:absolute;bottom:0;left:9%;right:9%;border-top:1px solid #ffffff16;padding-top:17px;font:10px monospace;letter-spacing:1px;color:#8e8e99;display:flex;align-items:center;gap:8px}.system-dot{width:5px;height:5px;border-radius:50%;background:var(--red)}.system-number{margin-left:auto;color:var(--red)}footer{min-height:72px;border-top:1px solid #ffffff12;display:flex;align-items:center;justify-content:space-between;color:#777782;font-size:12px;gap:20px;direction:ltr}footer>span:first-child{font:11px Arial,sans-serif}.footer-message{font:700 10px Arial,sans-serif;letter-spacing:2px}.red{color:var(--red)}footer>span:last-child{direction:rtl}.red:last-child{margin-right:5px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes float{50%{transform:translateY(-12px) rotate(-5deg)}}
@media(min-width:1500px){main{min-height:730px}}
@media(max-width:800px){.page{padding:0 6%}.header{height:90px}.brand>span{font-size:23px}.brand img{width:36px;height:42px}main{grid-template-columns:1fr;gap:42px;padding:42px 0;min-height:0}.message{text-align:center}.eyebrow{justify-content:center;font-size:10px;margin-bottom:20px}h1{font-size:64px}.description{font-size:17px}.update{max-width:330px;margin:0 auto 26px;text-align:right}.scene{width:min(390px,95%);margin:0 auto;grid-row:2;aspect-ratio:1/1.02}.giant-type{font-size:106px;top:7%}.coordinate-top{top:-2%}.footer-message{display:none}footer{min-height:66px}.footnote{font-size:12px}}
@media(max-width:360px){h1{font-size:54px}.description{font-size:15px}.status{font-size:12px}.brand>span{font-size:21px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}