:root{--bg: #0b0820;--bg-2: #140f33;--panel: rgba(22, 16, 54, .72);--line: rgba(185, 166, 255, .18);--text: #ece8ff;--muted: #9d95c9;--accent: #b48cff;--accent-2: #6fd6ff;--gold: #f4d58d;--danger: #ff7a9a;--ok: #7ef0c1;--radius: 16px;--font: "Outfit", "Cairo", system-ui, sans-serif;--display: "Cinzel", "Cairo", serif;color-scheme:dark}html[dir=rtl]{--font: "Cairo", "Outfit", system-ui, sans-serif;--display: "Cairo", "Cinzel", serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%}html{background:var(--bg)}body{background:radial-gradient(120% 80% at 50% 0%,#241a5c 0%,var(--bg-2) 35%,var(--bg) 75%) fixed;color:var(--text);font-family:var(--font);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}#root{min-height:100vh;display:flex;flex-direction:column}.starfield{position:fixed;inset:0;z-index:0;pointer-events:none}.starfield canvas{display:block}header.top,main,footer.foot{position:relative;z-index:1}header.top{display:flex;align-items:center;justify-content:space-between;padding:18px max(16px,env(safe-area-inset-left)) 0;max-width:1100px;width:100%;margin:0 auto}.brand{font-family:Cinzel,serif;letter-spacing:.4em;color:var(--text);text-decoration:none;font-weight:700}nav{display:flex;gap:14px;align-items:center;flex-wrap:wrap;justify-content:flex-end}nav a,.link{color:var(--muted);text-decoration:none;background:none;border:0;font:inherit;cursor:pointer;padding:4px 2px}nav a:hover,.link:hover{color:var(--text)}.lang{background:transparent;color:var(--text);border:1px solid var(--line);border-radius:999px;padding:6px 14px;font:inherit;cursor:pointer}main{flex:1;display:flex;align-items:flex-start;justify-content:center;padding:24px 16px 40px}.hero{text-align:center;margin-top:30vh;max-width:640px}.title{font-family:Cinzel,serif;font-size:clamp(44px,10vw,84px);letter-spacing:.22em;margin:0;line-height:1;text-shadow:0 0 40px rgba(180,140,255,.55)}.title span{display:block;font-size:.28em;letter-spacing:.7em;color:var(--gold);margin-top:14px;padding-inline-start:.7em}.tagline{color:var(--muted);font-size:18px;margin:22px auto 30px;max-width:30em}.card{width:100%;max-width:440px;margin-top:8vh;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:28px 24px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 30px 80px #00000073,inset 0 1px #ffffff0d}.card.wide{max-width:680px}.card h1{font-family:var(--display);font-weight:700;font-size:26px;margin:0 0 14px;letter-spacing:.04em}.card h2{font-size:15px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin:28px 0 10px;font-weight:600}html[dir=rtl] .card h2{letter-spacing:0}.steps{color:var(--accent);font-size:13px;letter-spacing:.1em;margin:-6px 0 16px}.lead{font-size:18px}.muted{color:var(--muted)}form{display:flex;flex-direction:column;gap:16px}.field{display:flex;flex-direction:column;gap:6px}.label{font-size:14px;color:var(--muted)}.hint{font-size:13px;color:var(--muted);opacity:.85}.error-text{font-size:13px;color:var(--danger)}input,select{width:100%;font:inherit;color:var(--text);background:#08051ab3;border:1px solid var(--line);border-radius:12px;padding:12px 14px;outline:none}input:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px #b48cff2e}.has-error input{border-color:var(--danger)}input.code{font-size:28px;letter-spacing:.5em;text-align:center;font-variant-numeric:tabular-nums}input[type=date]::-webkit-calendar-picker-indicator{filter:invert(.8)}button,.button{font:inherit;cursor:pointer;border-radius:12px;padding:12px 18px;border:1px solid var(--line);background:transparent;color:var(--text);text-decoration:none;display:inline-block;text-align:center}button:disabled{opacity:.5;cursor:not-allowed}.primary{background:linear-gradient(135deg,#8d5cff,#5a7dff);border-color:transparent;font-weight:600;box-shadow:0 8px 30px #8d5cff59}.primary:not(:disabled):hover{filter:brightness(1.08)}.primary.big{padding:16px 34px;font-size:18px}.ghost:hover{border-color:var(--accent)}.danger{border-color:#ff7a9a80;color:var(--danger)}.small{padding:6px 12px;font-size:14px}.row{display:flex;gap:12px}.row>*{flex:1}.row.wrap{flex-wrap:wrap}.alt{color:var(--muted);font-size:14px;text-align:center;margin:16px 0 0}.alt a{color:var(--accent-2);text-decoration:none}.choices{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.choice{padding:10px}.choice.on{border-color:var(--accent);background:#b48cff24}.check{display:flex;gap:12px;align-items:flex-start;font-size:15px;cursor:pointer}.check input{width:20px;height:20px;margin-top:2px;flex:none;accent-color:var(--accent)}.notice{border-radius:12px;padding:10px 14px;margin:0 0 14px;font-size:14px;background:#6fd6ff14;border:1px solid rgba(111,214,255,.25)}.notice.error{background:#ff7a9a14;border-color:#ff7a9a59}.notice.ok{background:#7ef0c114;border-color:#7ef0c14d}.facts{display:grid;grid-template-columns:max-content 1fr;gap:6px 18px;margin:0}.facts dt{color:var(--muted)}.facts dd{margin:0;overflow-wrap:anywhere}.sessions{list-style:none;padding:0;margin:0 0 14px;display:flex;flex-direction:column;gap:8px}.sessions li{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:12px}.sessions small{display:block;color:var(--muted)}.sessions em{color:var(--ok);font-style:normal}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.stats div{border:1px solid var(--line);border-radius:12px;padding:14px 8px;text-align:center}.stats b{display:block;font-size:28px;font-family:Cinzel,serif;color:var(--gold)}.stats span{color:var(--muted);font-size:13px}.loading{width:10px;height:10px;border-radius:50%;background:var(--accent);margin-top:40vh;box-shadow:0 0 30px var(--accent);animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{50%{transform:scale(1.8);opacity:.5}}footer.foot{display:flex;justify-content:center;gap:18px;color:var(--muted);font-size:12px;padding:16px;opacity:.8}@media (max-width: 520px){.card{margin-top:2vh;padding:22px 16px}.stats{grid-template-columns:repeat(2,1fr)}.hero{margin-top:26vh}}@media (prefers-reduced-motion: reduce){.loading{animation:none}}textarea{width:100%;font:inherit;color:var(--text);background:#08051ab3;border:1px solid var(--line);border-radius:12px;padding:12px 14px;resize:vertical}textarea:focus{border-color:var(--accent);outline:none}input[type=search]{margin-bottom:12px}.small{font-size:13px}.ok-text{color:var(--ok)}.error-text{color:var(--danger)}.img-ph{display:inline-block;background:#b48cff14;border-radius:12px}.card h3{font-size:15px;margin:18px 0 8px;color:var(--gold);font-weight:600}button.small,.button.small{padding:6px 12px;font-size:14px}.hub{width:100%;max-width:760px;display:flex;flex-direction:column;gap:16px;margin-top:2vh}.hub .card{max-width:none;margin-top:0}.hero-card{display:flex;gap:20px;align-items:center}.avatar{width:150px;height:190px;flex:none;display:grid;place-items:center}.avatar img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 24px rgba(180,140,255,.45))}.dot-avatar{width:34px;height:34px;border-radius:50%;background:radial-gradient(circle,#fff 0%,#d9c8ff 35%,rgba(138,92,255,.4) 70%,transparent 100%);box-shadow:0 0 40px 12px #b48cff73;animation:pulse 3s ease-in-out infinite}.hero-info{flex:1;min-width:0}.hero-info h1{margin:0 0 8px}.stage{color:var(--gold);letter-spacing:.08em;font-size:14px;margin:0 0 4px}.titles{color:var(--gold);font-size:13px;margin:8px 0 0}.bar{height:8px;border-radius:99px;background:#ffffff14;overflow:hidden;margin:4px 0}.bar-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#8d5cff,#6fd6ff);transition:width .6s ease}.bar-fill.gold{background:linear-gradient(90deg,#c9952f,var(--gold))}.bar-fill.ok{background:linear-gradient(90deg,#2fae7f,var(--ok))}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 4px;border:1px solid var(--line);border-radius:99px;font-size:13px}.chip span{color:var(--muted)}.chip-icon{width:24px;height:24px}.pending{display:flex;flex-direction:column;gap:8px}.pending-item{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;text-decoration:none;color:var(--text);background:linear-gradient(135deg,#8d5cff40,#5a7dff26);border:1px solid rgba(180,140,255,.45);font-weight:600}.pulse{width:10px;height:10px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px var(--gold);animation:pulse 1.6s ease-in-out infinite;flex:none}.today-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px 20px;margin-bottom:8px}.today-grid>div{display:flex;flex-direction:column}.goal-list{list-style:none;padding:0;margin:0 0 12px;display:flex;flex-direction:column;gap:8px}.goal-row,.subject-card{display:flex;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--text)}.goal-row:hover,.subject-card:hover{border-color:var(--accent)}.goal-row span,.subject-card span{display:flex;flex-direction:column;min-width:0}.dom-icon{width:44px;height:44px;flex:none;border-radius:10px}.dom-icon.big{width:72px;height:72px}.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.pillar{display:flex;flex-direction:column;align-items:center;text-align:center;text-transform:capitalize}.pil-icon{width:40px;height:40px}.pillar .bar{width:100%}.orbs{display:flex;gap:16px;flex-wrap:wrap}.orb{display:flex;flex-direction:column;align-items:center;gap:6px}.orb-icon{width:64px;height:64px;filter:drop-shadow(0 0 14px rgba(180,140,255,.5))}.dev{border-style:dashed}.dev input{max-width:140px}.skill-card{display:flex;gap:12px;align-items:flex-start;padding:12px;border:1px solid var(--line);border-radius:14px}.skill-card.big{padding:16px;margin:10px 0 16px}.skill-card b{display:block}.skill-card p{margin:4px 0 0}.skill-icon{width:64px;height:64px;border-radius:12px;flex:none}.skill-card.big .skill-icon{width:96px;height:96px}.rarity{text-transform:uppercase;letter-spacing:.1em;font-size:11px;color:var(--muted)}.rarity-rare{border-color:#6faaff99}.rarity-epic{border-color:#be78ffb3}.rarity-ultimate{border-color:#f4b45acc;box-shadow:0 0 24px #f4b45a33}.rarity-divine{border-color:#fff;box-shadow:0 0 30px #ffffff40}.skill-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}.cinematic{position:fixed;inset:0;z-index:20;background:#000;display:grid;place-items:center}.cinematic video{width:100%;height:100%;object-fit:contain}.cinematic .skip{position:absolute;top:20px;inset-inline-end:20px;background:#00000080}.scene{width:100%;max-width:900px;margin-top:2vh;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--panel)}.still{display:block;width:100%;max-height:52vh;object-fit:cover}.scene-text{padding:20px 22px 24px}.watcher-line{font-size:18px;line-height:1.6;font-style:italic;color:#e3dcff}html[dir=rtl] .watcher-line{font-style:normal}.prompt{font-weight:600;color:var(--gold)}.scene-options{display:grid;gap:10px}.option{text-align:start}.option:hover{border-color:var(--accent);background:#b48cff14}.mode-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.mode{display:flex;flex-direction:column;gap:8px;text-align:start;padding:18px}.mode b{font-size:17px}.mode span{color:var(--muted);font-size:14px}.mode.recommended{border-color:var(--accent)}.mode:hover{background:#b48cff14}.choice-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.choice-grid.species{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.choice-card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 8px;text-align:center}.choice-card.on{border-color:var(--accent);background:#b48cff1f}.choice-card small{font-size:12px;text-transform:capitalize}.choice-img{width:100%;height:130px;object-fit:contain}.choice-grid.species .choice-img{height:180px}.detail{text-align:center}.detail-img{max-width:100%;max-height:200px;object-fit:contain}.evo{display:flex;align-items:center;justify-content:center;gap:20px;margin:10px 0 20px}.evo-img{max-height:280px;max-width:40%;object-fit:contain}.evo-img.next{filter:drop-shadow(0 0 30px rgba(244,213,141,.55))}.evo-arrow{font-size:34px;color:var(--gold)}html[dir=rtl] .evo-arrow{transform:scaleX(-1)}.modal-back{position:fixed;inset:0;z-index:30;background:#05030fbf;display:grid;place-items:center;padding:16px;overflow-y:auto}.modal{width:100%;max-width:560px;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius);padding:22px;display:flex;flex-direction:column;gap:12px;max-height:calc(100vh - 32px);overflow-y:auto}.modal h2{margin:0;font-size:20px}.pillar-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.pillar-tabs .choice{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;font-size:14px}.tab-icon{width:22px;height:22px}.subject-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}.badge{color:var(--gold);font-size:12px}.subject-head,.goal-head{display:flex;gap:14px;align-items:center;margin-bottom:10px}.goal-meta{display:flex;gap:14px;flex-wrap:wrap;color:var(--muted)}.goal-meta b{color:var(--text)}.ladder{padding-inline-start:0;list-style:none;display:flex;flex-direction:column;gap:10px;margin:12px 0 18px}.ladder>li{border:1px solid var(--line);border-radius:12px;padding:10px 14px;display:flex;flex-direction:column;gap:4px}.ladder ul{margin:6px 0 0;padding-inline-start:18px;color:var(--muted)}.ladder.pick>li{padding:0;border:0}.ladder.pick button{width:100%;text-align:start}.ladder.pick button.done{opacity:.4}.tasks{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.tasks li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:12px}.tasks li.done{opacity:.75}.quiz ol{padding-inline-start:20px;display:flex;flex-direction:column;gap:14px}.quiz .q p{margin:0 0 8px;font-weight:500}.opts{display:grid;gap:6px}.opt{display:flex;gap:10px;align-items:center;padding:8px 12px;border:1px solid var(--line);border-radius:10px;cursor:pointer}.opt.on{border-color:var(--accent);background:#b48cff1f}.opt input{width:auto;accent-color:var(--accent)}.timer{text-align:end;color:var(--muted)}.reward{display:flex;flex-direction:column;gap:4px}.lvlup{color:var(--gold);font-family:Cinzel,serif;font-size:18px}.result h2{margin:0}@media (max-width: 620px){.hero-card{flex-direction:column;text-align:center}.hero-card .chips{justify-content:center}.avatar{width:120px;height:150px}.today-grid,.mode-grid{grid-template-columns:1fr}.pillars,.choice-grid,.choice-grid.species{grid-template-columns:repeat(2,1fr)}}.world{width:100%;max-width:820px;display:flex;flex-direction:column;gap:16px}.world .card{max-width:none}.zone{position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--panel)}.zone.locked{opacity:.55}.zone-bg{position:absolute;inset:0}.zone-bg img{width:100%;height:100%;object-fit:cover;opacity:.28}.zone-body{position:relative;padding:18px 20px}.zone-body h2{font-family:var(--display);margin:0 0 10px;font-size:22px}.nodes{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.node{display:flex;gap:12px;align-items:center;padding:10px 12px;border-radius:12px;background:#0b0820b8;border:1px solid var(--line)}.node.locked{opacity:.5}.node.cleared{border-color:#7ef0c159}.node.type-boss{border-color:#f4b45a99}.node-icon{width:40px;height:40px;flex:none}.node-info{flex:1;min-width:0;display:flex;flex-direction:column}.node-foes{display:flex;gap:4px;margin-top:4px}.node-foes img{width:34px;height:34px;object-fit:contain}.node-actions{display:flex;flex-direction:column;gap:6px}.towers{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.tower{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px;border-radius:12px;background:#0b0820b8;border:1px solid var(--line);text-transform:capitalize}.battle{width:100%;max-width:1180px;display:flex;flex-direction:column;gap:8px;margin-top:-8px}.battle-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.timeline{display:flex;gap:6px;direction:ltr}.tl{width:40px;height:40px;border-radius:10px;overflow:hidden;border:2px solid rgba(111,214,255,.5);background:#0b0820cc;display:grid;place-items:center}.tl.e{border-color:#ff7a9a99}.tl.now{transform:scale(1.18);box-shadow:0 0 12px var(--gold);border-color:var(--gold)}.tl img{width:100%;height:100%;object-fit:cover;object-position:top}.tl-dot{width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 0 10px #b48cff}.field{position:relative;width:100%;aspect-ratio:16 / 9;max-height:68vh;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:#07051a;direction:ltr}.field canvas{position:absolute;inset:0}.hud{position:absolute;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center;gap:2px;width:120px;z-index:2;pointer-events:none}.hud.targetable{pointer-events:auto;cursor:crosshair}.hud.targetable .hud-name{color:var(--gold);text-shadow:0 0 8px var(--gold)}.hud-name{font-size:12px;text-shadow:0 1px 3px #000;white-space:nowrap}.hp,.mp,.brk{position:relative;width:100%;height:7px;border-radius:4px;background:#0000008c;overflow:hidden}.hp>span{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,#ff5a7a,#ff9a6b);transition:width .3s}.hud.p .hp>span{background:linear-gradient(90deg,#2fae7f,#7ef0c1)}.hp>i{position:absolute;inset:0 auto 0 0;background:#a0dcff8c}.mp{height:4px}.mp>span{position:absolute;inset:0 auto 0 0;background:#6fa8ff}.brk{height:4px}.brk>span{position:absolute;inset:0 auto 0 0;background:var(--gold)}.sts{display:flex;gap:2px;min-height:18px}.sts img{width:18px;height:18px}.intent{display:flex;align-items:center;gap:4px;padding:2px 6px;border-radius:99px;background:#0b0820cc;border:1px solid rgba(255,122,154,.5);font-size:11px;white-space:nowrap}.intent img{width:20px;height:20px}.intent.ultimate{border-color:var(--gold);box-shadow:0 0 10px #f4d58d99}.intent b{color:var(--gold);font-size:14px}.skill-banner{position:absolute;top:10px;left:50%;transform:translate(-50%);padding:6px 16px;border-radius:99px;background:#0b0820d9;border:1px solid var(--line);font-family:var(--display);z-index:3}.pick-hint{position:absolute;bottom:10px;left:50%;transform:translate(-50%);padding:6px 14px;border-radius:99px;background:#f4d58d26;border:1px solid var(--gold);z-index:3}.skillbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center}.sk{position:relative;width:64px;height:64px;padding:0;border-radius:14px;overflow:hidden;border:2px solid var(--line);background:#0b0820cc}.sk img{width:100%;height:100%;object-fit:cover}.sk b{position:absolute;top:2px;inset-inline-start:5px;font-size:12px;text-shadow:0 1px 3px #000}.sk small{position:absolute;bottom:2px;inset-inline-end:5px;font-size:11px;color:#9ec8ff;text-shadow:0 1px 3px #000}.sk em{position:absolute;inset:0;display:grid;place-items:center;font-style:normal;font-size:22px;font-weight:700;background:#0009}.sk.on{border-color:var(--gold);box-shadow:0 0 14px #f4d58d99}.sk:not(:disabled):hover{border-color:var(--accent)}.sk.empty{display:grid;place-items:center;color:var(--muted);width:64px;height:64px;border-radius:14px;border:1px dashed var(--line)}.battle-result{text-align:center;padding:18px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line);display:flex;flex-direction:column;gap:10px;align-items:center}.battle-result h2{font-family:var(--display);font-size:34px;margin:0}.loadout{margin-top:20px}.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin-bottom:12px}.slot{display:flex;align-items:center;gap:8px;padding:8px;border:1px solid var(--line);border-radius:12px}.slot.locked{opacity:.5}.slot-key{width:22px;text-align:center;color:var(--gold)}.slot-icon{width:40px;height:40px;border-radius:8px;flex:none}.slot select{padding:6px 8px;font-size:13px}.statgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:6px;margin:0}.statgrid div{display:flex;justify-content:space-between;padding:6px 10px;border:1px solid var(--line);border-radius:8px}.statgrid dt{color:var(--muted);text-transform:uppercase;font-size:12px}.statgrid dd{margin:0}@media (max-width: 620px){.towers{grid-template-columns:repeat(2,1fr)}.hud{width:78px}.hud-name,.intent small{display:none}.sk,.sk.empty{width:52px;height:52px}.tl{width:28px;height:28px}.node{flex-wrap:wrap}.battle-top>span:first-child{display:none}.battle-top{justify-content:center}}