/* Skies of Egypt — page UI. Everything is scoped under .eks-wrap / .eks-stage. */
.eks-wrap,.eks-stage,.eks-modal,.eks-toast{--ink:#070d18;--ink2:#0c1526;--panel:#111d33;--panel2:#16253f;--line:rgba(233,185,73,.22);--gold:#e9b949;--gold2:#ffd97a;--sky:#4aa3e8;--txt:#f1ede2;--dim:#a8b0c0;--bad:#ff5d5d;--ok:#52e0a0;
  color:var(--txt)}
.eks-wrap{position:relative;color:var(--txt);background:radial-gradient(1200px 600px at 80% -10%,#1b2f55 0,transparent 60%),linear-gradient(180deg,#070d18,#0a1426 60%,#070d18);min-height:70vh;font-family:inherit;line-height:1.55;isolation:isolate}
.eks-wrap *,.eks-modal *,.eks-stage *{box-sizing:border-box}
.eks-wrap button,.eks-modal button,.eks-stage button{font:inherit;color:inherit;cursor:pointer}
.eks-modal,.eks-stage{font-family:inherit;line-height:1.55}
.eks-boot{display:grid;place-items:center;min-height:60vh}.eks-boot-in{text-align:center}.eks-logo{font-size:64px;animation:eks-fly 2.4s ease-in-out infinite}
@keyframes eks-fly{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-14px) rotate(4deg)}}
.eks-nojs{padding:40px;text-align:center}

/* top bar */
.eks-top{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:12px clamp(14px,3vw,36px);position:sticky;top:0;z-index:20;background:rgba(7,13,24,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.eks-brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.02em;font-size:20px}.eks-wing{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--gold),#b8821c);color:#1a1204;font-size:18px}
.eks-tabs{display:flex;gap:4px;flex:1;overflow-x:auto;scrollbar-width:none}.eks-tabs::-webkit-scrollbar{display:none}
.eks-tabs button{display:flex;align-items:center;gap:7px;padding:9px 15px;border:1px solid transparent;border-radius:12px;background:none;color:var(--dim);font-weight:700;white-space:nowrap;transition:.2s}
.eks-tabs button:hover{color:var(--txt);background:rgba(255,255,255,.05)}.eks-tabs button.on{color:#1a1204;background:linear-gradient(135deg,var(--gold),#f4c75a);box-shadow:0 6px 22px rgba(233,185,73,.28)}
.eks-acct{display:flex;align-items:center;gap:8px}.eks-chip{padding:5px 12px;border-radius:99px;font-weight:800;font-size:14px;background:var(--panel2);border:1px solid var(--line)}.eks-chip.coin{color:var(--gold2)}.eks-chip.lvl{color:var(--sky)}
.eks-callsign{background:none;border:0;font-weight:800;color:var(--txt);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}

/* buttons */
.eks-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;border-radius:12px;border:1px solid var(--line);background:var(--panel2);color:var(--txt);font-weight:800;text-decoration:none;transition:transform .15s,box-shadow .2s,filter .2s}
.eks-btn:hover{transform:translateY(-2px);filter:brightness(1.1)}.eks-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.eks-btn.gold{background:linear-gradient(135deg,var(--gold),#f6cd68);color:#1a1204;border-color:transparent;box-shadow:0 8px 26px rgba(233,185,73,.3)}
.eks-btn.ghost{background:rgba(255,255,255,.04)}.eks-btn.big{padding:14px 28px;font-size:18px;border-radius:14px}.eks-btn.sm{padding:6px 12px;font-size:13px}.eks-btn.danger{background:#5a1a1a;border-color:#a33}
.eks-link{background:none;border:0;color:var(--gold2);text-decoration:underline;padding:0;font-weight:700}

/* hero */
.eks-hero{position:relative;min-height:min(44vh,400px);display:flex;align-items:center;overflow:hidden;border-bottom:1px solid var(--line)}
.eks-hero::before{content:"";position:absolute;inset:0;background:var(--face) center 20%/cover;opacity:.32;filter:saturate(.9)}
.eks-hero-sky{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,13,24,.2),rgba(7,13,24,.95)),radial-gradient(900px 400px at 20% 100%,rgba(233,185,73,.25),transparent 70%)}
.eks-hero-in{position:relative;padding:clamp(22px,4vw,50px) clamp(18px,5vw,64px);max-width:860px}
.eks-kicker{display:inline-block;padding:4px 14px;border:1px solid var(--line);border-radius:99px;color:var(--gold2);font-weight:800;font-size:13px;letter-spacing:.14em;background:rgba(0,0,0,.35)}
.eks-hero h1{margin:10px 0 6px;font-size:clamp(44px,7vw,88px);line-height:1;font-weight:900;background:linear-gradient(180deg,#fff,var(--gold) 70%,#a4701a);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(0 6px 24px rgba(0,0,0,.5))}
.eks-hero p{font-size:clamp(16px,2vw,22px);color:#e5e0d2;max-width:620px;margin:0 0 22px}
.eks-cta{display:flex;gap:12px;flex-wrap:wrap}.eks-feats{list-style:none;display:flex;gap:10px 22px;flex-wrap:wrap;margin:24px 0 0;padding:0;color:var(--dim);font-weight:700}

/* body */
.eks-body{padding:clamp(16px,3vw,40px) clamp(14px,3vw,36px) 28px;max-width:1280px;margin:0 auto}
.eks-note{padding:12px 16px;margin:0 0 18px;border-radius:12px;background:rgba(74,163,232,.12);border:1px solid rgba(74,163,232,.35)}.eks-note.warn{background:rgba(233,185,73,.12);border-color:rgba(233,185,73,.4)}.eks-note.big{padding:32px;text-align:center;font-size:20px}
.eks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.eks-card{position:relative;display:flex;flex-direction:column;gap:6px;text-align:start;padding:18px 18px 16px;border-radius:18px;background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--line);min-height:190px;overflow:hidden;transition:transform .2s,border-color .2s,box-shadow .2s}
.eks-card:hover{transform:translateY(-5px);border-color:var(--gold);box-shadow:0 16px 38px rgba(0,0,0,.45)}
.eks-card.lock{opacity:.55;filter:grayscale(.55)}.eks-card .eks-no{position:absolute;top:8px;inset-inline-end:14px;font-size:56px;font-weight:900;color:rgba(255,255,255,.06);line-height:1}
.eks-card .eks-env{font-size:26px}.eks-card b{font-size:20px;line-height:1.2}.eks-card small{color:var(--dim);flex:1}
.eks-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px;font-size:13px;color:var(--dim);font-weight:700}.eks-lockmsg{color:var(--gold2)}.eks-best{font-style:normal;font-size:12px;color:var(--ok);font-weight:700}
.eks-weekly{position:absolute;top:12px;inset-inline-start:12px;padding:2px 10px;border-radius:99px;background:var(--gold);color:#1a1204;font-weight:900;font-size:11px}
.eks-stars{display:inline-flex;gap:2px;color:#3a455c;letter-spacing:0}.eks-stars i{font-style:normal}.eks-stars i.on{color:var(--gold);text-shadow:0 0 10px rgba(233,185,73,.6)}.eks-stars.big{font-size:34px;gap:6px}

/* hangar */
.eks-hangar{display:grid;grid-template-columns:1.1fr 1fr;gap:22px}
.eks-stagebox{position:relative;border-radius:20px;border:1px solid var(--line);background:radial-gradient(500px 300px at 50% 60%,#27406e,#0b1630 70%);min-height:360px;overflow:hidden}
.eks-stagebox canvas{position:absolute;inset:0;width:100%;height:100%}.eks-prev-name{position:absolute;bottom:14px;inset-inline-start:18px;font-size:28px;font-weight:900;text-shadow:0 2px 12px #000}
.eks-stagebox.nogl::after{content:"✈";position:absolute;inset:0;display:grid;place-items:center;font-size:120px;opacity:.5}
.eks-hpanel{background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:20px;padding:18px}
.eks-hpanel h3{margin:18px 0 8px;font-size:16px;color:var(--gold2)}
.eks-plist{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.eks-plist button{padding:9px 6px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid var(--line);display:flex;flex-direction:column;gap:2px}.eks-plist button.on{border-color:var(--gold);background:rgba(233,185,73,.14)}.eks-plist button.un b{opacity:.65}.eks-plist small{color:var(--dim);font-size:11px}
.eks-pdesc{color:var(--dim);margin:12px 0}.eks-stats{display:grid;gap:8px}.eks-stats>div{display:grid;grid-template-columns:110px 1fr;align-items:center;gap:10px;font-size:14px;font-weight:700}
.eks-bar{height:10px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}.eks-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--sky),var(--gold))}
.eks-buy{margin:14px 0 0;display:flex;gap:10px;align-items:center}.eks-buy.lockmsg{color:var(--gold2);font-weight:800}
.eks-liv{display:flex;gap:10px;flex-wrap:wrap}.eks-sw{position:relative;width:54px;height:54px;border-radius:14px;border:2px solid transparent;background:linear-gradient(135deg,var(--a) 55%,var(--b) 55%);padding:0}.eks-sw.on{border-color:#fff;box-shadow:0 0 0 3px var(--gold)}.eks-sw.un{filter:saturate(.5) brightness(.7)}.eks-sw small{position:absolute;bottom:-18px;inset-inline:-6px;text-align:center;font-size:10px;color:var(--dim);white-space:nowrap}.eks-sw i{display:none}.eks-liv{margin-bottom:22px}
.eks-ups{display:grid;gap:10px}.eks-up{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07)}
.eks-up .ic{font-size:26px}.eks-up small{display:block;color:var(--dim)}.eks-up .pips{display:flex;gap:4px;margin-top:5px}.eks-up .pips i{width:18px;height:7px;border-radius:4px;background:rgba(255,255,255,.12)}.eks-up .pips i.on{background:var(--gold)}.eks-up em{font-style:normal;font-weight:900;color:var(--ok)}
.eks-hint{color:var(--dim);font-size:14px}

/* leaderboard / help / settings */
.eks-seg{display:inline-flex;padding:4px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid var(--line);margin-bottom:18px;gap:4px;flex-wrap:wrap}.eks-seg button{padding:8px 18px;border:0;border-radius:10px;background:none;font-weight:800;color:var(--dim)}.eks-seg button.on{background:var(--gold);color:#1a1204}
.eks-rank{list-style:none;margin:0;padding:0;display:grid;gap:8px;max-width:640px}.eks-rank li{display:grid;grid-template-columns:48px 1fr auto;gap:10px;align-items:center;padding:12px 16px;border-radius:14px;background:var(--panel);border:1px solid rgba(255,255,255,.07)}.eks-rank li.me{border-color:var(--gold);background:rgba(233,185,73,.12)}.eks-rank .rk{font-size:22px;font-weight:900;text-align:center}.eks-rank em{font-style:normal;font-weight:900;color:var(--gold2)}
.eks-help,.eks-set{display:grid;grid-template-columns:1fr 1fr;gap:18px}.eks-hcard{padding:20px;border-radius:18px;background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--line)}.eks-hcard.wide{grid-column:1/-1}.eks-hcard h3{margin:0 0 12px;color:var(--gold2)}
.eks-hcard table{width:100%;border-collapse:collapse}.eks-hcard th{text-align:start;white-space:nowrap;padding:7px 14px 7px 0;color:var(--gold2);font-weight:900;font-family:ui-monospace,monospace}.eks-hcard td{padding:7px 0;color:var(--dim);border-bottom:1px solid rgba(255,255,255,.06)}.eks-hcard li{margin:6px 0;color:var(--dim)}
.eks-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.06)}.eks-row small{display:block;color:var(--dim)}.eks-row select{background:var(--ink2);color:var(--txt);border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.eks-row input[type=range]{flex:1;max-width:220px;accent-color:var(--gold)}.eks-row output{min-width:34px;text-align:end;color:var(--gold2);font-weight:800}
.eks-row input[type=checkbox]{position:absolute;opacity:0}.eks-tg{position:relative;flex:none;width:46px;height:26px;border-radius:99px;background:#2a3550;transition:.2s}.eks-tg::after{content:"";position:absolute;top:3px;inset-inline-start:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:.2s}
.eks-row input:checked+.eks-tg{background:var(--gold)}.eks-row input:checked+.eks-tg::after{inset-inline-start:23px}.eks-row input:focus-visible+.eks-tg{outline:2px solid var(--sky)}
.eks-actions{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0}
.eks-foot{padding:26px 16px 40px;text-align:center;color:var(--dim);font-size:13px}

/* modal */
.eks-modal{position:fixed;inset:0;z-index:99990;display:grid;place-items:center;padding:16px;background:rgba(2,6,14,.72);backdrop-filter:blur(6px)}.eks-modal[hidden]{display:none}
.eks-dlg{position:relative;width:min(560px,100%);max-height:92vh;overflow:auto;padding:26px;border-radius:22px;background:linear-gradient(160deg,#16253f,#0d172b);border:1px solid var(--gold);box-shadow:0 30px 80px rgba(0,0,0,.65);animation:eks-pop .25s cubic-bezier(.2,1.3,.4,1)}
@keyframes eks-pop{from{transform:scale(.92);opacity:0}}
.eks-x{position:absolute;top:12px;inset-inline-end:12px;width:34px;height:34px;border-radius:50%;border:0;background:rgba(255,255,255,.08)}
.eks-dlg form{display:grid;gap:14px}.eks-dlg label{display:grid;gap:6px;font-weight:700;color:var(--dim);font-size:14px}.eks-dlg input:not([type=checkbox]):not([type=range]){padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:#0a1224;color:var(--txt);font-size:16px}.eks-dlg input:focus{outline:2px solid var(--gold);border-color:transparent}
.eks-chk{display:flex!important;grid-template-columns:none;gap:10px;align-items:flex-start;font-weight:600!important}.eks-chk input{margin-top:5px;accent-color:var(--gold)}.eks-hp{position:absolute!important;left:-9999px;opacity:0;height:0}
.eks-err{margin:0;color:var(--bad);min-height:20px;font-weight:700}
.eks-mhead{display:flex;gap:14px;align-items:center;margin-bottom:8px}.eks-mhead .eks-env{font-size:42px}.eks-mhead h2{margin:0;font-size:28px}.eks-mhead small{color:var(--gold2);font-weight:800}.eks-mdesc{color:#d8d3c4;margin:0 0 14px}
.eks-dlg h4{margin:14px 0 8px;color:var(--gold2)}.eks-diffs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.eks-diffs button{display:flex;flex-direction:column;align-items:center;gap:3px;padding:12px 8px;border-radius:14px;background:rgba(255,255,255,.04);border:2px solid transparent;text-align:center}.eks-diffs button.on{border-color:var(--gold);background:rgba(233,185,73,.12)}.eks-diffs button.lk{opacity:.5}.eks-diffs small{color:var(--dim);font-size:11px;line-height:1.3}.eks-diffs span{font-size:22px}
.eks-loadout{display:flex;justify-content:space-between;align-items:center;margin:14px 0;padding:10px 14px;border-radius:12px;background:rgba(255,255,255,.04)}
.eks-rewards{display:flex;align-items:center;gap:16px;flex-wrap:wrap;font-weight:800;margin:6px 0}
.eks-dlg>.eks-btn.big{width:100%;margin-top:6px}

/* in-game stage */
html.eks-lock,html.eks-lock body{overflow:hidden}
.eks-stage{position:fixed;inset:0;z-index:99980;background:#000;touch-action:none;user-select:none;-webkit-user-select:none}.eks-stage[hidden]{display:none}
.eks-gc{position:absolute;inset:0;overflow:hidden;cursor:crosshair}
.eks-loading{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:18px;background:radial-gradient(600px 400px at 50% 40%,#16315e,#050a14);color:#fff;font-weight:800}
.eks-spin{width:54px;height:54px;border-radius:50%;border:5px solid rgba(255,255,255,.15);border-top-color:var(--gold,#e9b949);animation:eks-rot 0.9s linear infinite}.eks-spin.sm{width:30px;height:30px;border-width:4px;margin:10px auto}@keyframes eks-rot{to{transform:rotate(360deg)}}
.eks-rot{display:none;position:absolute;inset:0;z-index:50;background:#050a14;color:#fff;place-content:center;justify-items:center;text-align:center;font-size:20px;font-weight:800}.eks-rot span{font-size:70px}
@media (orientation:portrait){.eks-stage.touch .eks-rot{display:grid}}
.eks-stage .eks-modal{position:absolute}
.eks-toast{position:fixed;z-index:99999;inset-inline:0;bottom:22px;margin:auto;width:fit-content;max-width:92vw;padding:11px 20px;border-radius:99px;background:#0d172b;color:#fff;border:1px solid var(--gold,#e9b949);font-weight:800;box-shadow:0 12px 34px rgba(0,0,0,.5);animation:eks-pop .25s;transition:opacity .4s,transform .4s}.eks-toast.bad{border-color:#ff5d5d}.eks-toast.out{opacity:0;transform:translateY(12px)}
.eks-stage .eks-toast{position:absolute}
.eks-res{text-align:center}.eks-res h2{font-size:30px;margin:0 0 4px}.eks-res.win h2{color:#7dffb0}.eks-res.lose h2{color:#ff7a7a}.eks-why{color:var(--dim);margin:0 0 10px;min-height:20px}
.eks-rgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:10px;margin:14px 0}.eks-rgrid>div{padding:10px;border-radius:12px;background:rgba(255,255,255,.05)}.eks-rgrid small{display:block;color:var(--dim);font-size:12px}.eks-rgrid b{font-size:20px}
.eks-earn{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:10px 0 14px;font-weight:900}.eks-earn span{padding:6px 14px;border-radius:99px;background:rgba(233,185,73,.15);border:1px solid var(--line)}
.eks-pausebtns{display:grid;gap:10px;margin:14px 0}.eks-pauseset{display:grid;gap:10px;margin-top:8px;padding-top:12px;border-top:1px solid rgba(255,255,255,.08)}.eks-pauseset label{display:flex!important;align-items:center;gap:10px}.eks-pauseset input{flex:1;accent-color:var(--gold)}

/* touch controls (built by the game) */
.eks-touch{position:absolute;inset:0;z-index:6;pointer-events:none}.eks-touch>*{pointer-events:auto}
.eks-js{position:absolute;left:3vw;bottom:5vh;width:min(34vh,200px);height:min(34vh,200px);border-radius:50%;background:rgba(255,255,255,.08);border:2px solid rgba(255,255,255,.28);touch-action:none}.eks-js i{position:absolute;left:50%;top:50%;width:38%;height:38%;margin:-19% 0 0 -19%;border-radius:50%;background:rgba(233,185,73,.6);border:2px solid #fff}
.eks-thr{position:absolute;right:3vw;bottom:5vh;width:56px;height:min(34vh,200px);border-radius:16px;background:rgba(255,255,255,.08);border:2px solid rgba(255,255,255,.28);touch-action:none;overflow:hidden}.eks-thr i{position:absolute;bottom:0;left:0;right:0;background:rgba(74,163,232,.65)}.eks-thr span{position:absolute;top:6px;left:0;right:0;text-align:center;font-size:11px;font-weight:900;color:#fff}
.eks-tb{position:absolute;right:calc(3vw + 76px);bottom:5vh;display:grid;grid-template-columns:repeat(2,auto);gap:10px}.eks-tb button,.eks-tb2 button{width:64px;height:64px;border-radius:50%;border:2px solid rgba(255,255,255,.4);background:rgba(10,18,36,.55);font-size:26px;touch-action:none}.eks-tb button.big{width:84px;height:84px;font-size:34px;background:rgba(233,185,73,.4);grid-row:span 2}
.eks-tb2{position:absolute;right:calc(3vw + 76px);top:70px;display:flex;gap:10px}.eks-tb2 button{width:46px;height:46px;font-size:20px}
@media (max-width:860px){.eks-hangar,.eks-help,.eks-set{grid-template-columns:1fr}.eks-top{gap:8px}.eks-brand b{display:none}.eks-tabs button{padding:8px 11px}.eks-tabs button span{display:none}.eks-stagebox{min-height:260px}.eks-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.eks-grid{grid-template-columns:1fr}.eks-diffs{grid-template-columns:1fr}.eks-plist{grid-template-columns:1fr 1fr}.eks-chip.coin{font-size:12px}.eks-dlg{padding:20px 16px}}
@media (prefers-reduced-motion:reduce){.eks-logo,.eks-spin{animation:none}.eks-card,.eks-btn{transition:none}}