@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');
:root{--bg:#101b2b;--panel:#19273b;--line:#34465d;--text:#f1f5fa;--muted:#b5c4d8;--lime:#d4f578;--cyan:#81d8e9;--coral:#ffa18a;--ink:#172331}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:'IBM Plex Sans Arabic',Tahoma,sans-serif;font-size:17px;line-height:1.7}body:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 10% 15%,#28455755,transparent 45%),linear-gradient(#ffffff03 1px,transparent 1px),linear-gradient(90deg,#ffffff03 1px,transparent 1px);background-size:auto,52px 52px,52px 52px}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.6}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--cyan);outline-offset:5px}.skip{position:fixed;top:-80px;background:var(--lime);color:var(--ink);padding:12px;z-index:99}.skip:focus{top:0}header{max-width:1320px;padding:26px 40px;display:flex;align-items:center;gap:40px;margin:auto;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;font-weight:700;font-size:22px;line-height:1.3}.brand small{display:block;font-size:12px;letter-spacing:1px;color:var(--muted);font-weight:400;margin-top:5px}.brand-icon{border:1px solid var(--lime);color:var(--lime);border-radius:12px;font-size:32px;display:grid;place-items:center;width:48px;height:48px}nav{display:flex;gap:26px;margin-inline-start:auto;font-size:15px}nav a{padding:8px 0}nav a:hover{color:var(--lime)}.score{background:#27352e;border:1px solid #657f42;color:var(--lime);border-radius:30px;padding:6px 18px;direction:ltr;font-weight:600;white-space:nowrap}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--lime);margin-right:6px}main{max-width:1240px;margin:0 auto;padding:50px 40px 70px;min-height:75vh}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(36px,4.8vw,66px);line-height:1.35;margin-bottom:20px;letter-spacing:-1px}h2{font-size:30px;line-height:1.5}h3{font-size:21px;margin-bottom:8px}.eyebrow{font-size:13px;letter-spacing:1px;color:var(--cyan);display:flex;align-items:center;gap:10px;margin-bottom:22px}.eyebrow:before{content:'';width:26px;height:2px;background:var(--cyan)}.hero{display:grid;grid-template-columns:1.12fr 1fr;align-items:center;gap:55px;padding:15px 0 45px}.hero p{color:var(--muted);max-width:540px;font-size:18px}.highlight{color:var(--lime)}.actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:26px}.btn{border:1px solid var(--line);border-radius:10px;padding:11px 22px;min-height:48px;background:var(--panel);color:var(--text);display:inline-flex;justify-content:center;align-items:center;gap:10px;font-weight:600;transition:transform .18s,background .18s}.btn:hover{background:#2b3b52;transform:translateY(-2px)}.btn.primary{background:var(--lime);color:var(--ink);border-color:var(--lime)}.btn.primary:hover{background:#e1ff99}.btn.small{font-size:14px;padding:8px 16px;min-height:44px}.meta{display:flex;gap:22px;margin-top:24px;color:var(--muted);font-size:13px}.scene{position:relative;min-height:345px;display:flex;align-items:center;justify-content:center;isolation:isolate}.orbit{position:absolute;border:1px solid #526a5a;border-radius:50%;width:310px;height:310px;transform:rotateX(26deg) rotateZ(-20deg)}.orbit:after{content:'';position:absolute;inset:26px;border:1px dashed #59715d;border-radius:50%}.hub{position:relative;background:linear-gradient(145deg,#c7ee7d,#9bc949);color:var(--ink);width:145px;height:145px;border-radius:34px;box-shadow:12px 18px 0 #638533,0 30px 65px #0006;transform:rotate(-8deg);display:grid;place-content:center;text-align:center;font-size:42px;font-weight:700}.hub small{display:block;font-size:13px}.packet{position:absolute;background:#23334b;border:1px solid #5d748d;border-radius:12px;padding:13px 18px;box-shadow:0 16px 32px #0004;font-family:monospace;direction:ltr;font-size:14px}.p1{right:0;top:20px;transform:rotate(6deg)}.p2{left:0;bottom:35px;transform:rotate(-6deg);color:var(--cyan)}.scene-label{position:absolute;left:20px;top:68px;font-size:11px;letter-spacing:2px;color:var(--muted);writing-mode:vertical-rl}.section-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:10px 0 22px}.section-head h2{margin:0}.section-head p{margin:0;color:var(--muted);font-size:14px}.progress{height:5px;background:#304057;border-radius:9px;overflow:hidden;margin:12px 0 28px}.progress span{display:block;height:100%;background:var(--lime);transition:width .25s}.map{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.mission{position:relative;border:1px solid var(--line);border-radius:16px;background:linear-gradient(150deg,#24344b,#18263a);padding:24px;text-align:right;color:var(--text);min-height:232px;transition:transform .2s,border .2s;display:flex;flex-direction:column}.mission:hover{transform:translateY(-5px);border-color:var(--cyan)}.mission.complete{border-color:#809c4d}.mission .num{font-size:13px;color:var(--muted);direction:ltr;align-self:flex-start}.mission .symbol{font-family:monospace;color:var(--accent);font-size:32px;margin:10px 0}.mission h3{margin:0 0 6px}.mission p{font-size:14px;color:var(--muted);margin-bottom:20px}.mission .bottom{margin-top:auto;display:flex;justify-content:space-between;font-size:12px;color:var(--accent)}.note{border-inline-start:3px solid var(--cyan);padding:12px 18px;background:#1a3041;color:var(--muted);border-radius:4px;margin-top:22px}.lesson-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:28px}.lesson-heading{max-width:800px;margin-bottom:28px}.lesson-heading h1{font-size:38px;margin-bottom:12px}.lesson-heading p{color:var(--muted)}.badge{color:var(--lime);font-size:13px;border:1px solid #627448;border-radius:20px;padding:4px 12px}.workspace{display:grid;grid-template-columns:1fr 1fr;gap:24px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px;min-width:0}.panel-label{font-size:12px;color:var(--cyan);letter-spacing:1px;margin-bottom:15px}.panel p{color:var(--muted)}pre,code{font-family:Consolas,monospace;direction:ltr;text-align:left;unicode-bidi:plaintext}pre{font-size:16px;background:#101a29;padding:20px;border-radius:10px;white-space:pre-wrap;overflow-wrap:anywhere;border:1px solid #304157;line-height:1.8}code{display:inline-block;color:var(--cyan);overflow-wrap:anywhere;max-width:100%}label{display:block;margin:15px 0 6px;font-size:15px}select,input[type=text]{width:100%;color:var(--text);background:#111d2e;border:1px solid #64758b;border-radius:9px;padding:12px;min-height:48px}select{cursor:pointer}input[type=checkbox]{width:22px;height:22px;accent-color:var(--lime)}.checkline{display:flex;align-items:center;gap:12px;background:#22334a;padding:12px 15px;border-radius:9px;margin:12px 0;cursor:pointer}.checkline code{margin-inline-start:auto;font-size:13px}.output{min-height:95px;background:#101e27;border:1px dashed #69865b;padding:20px;border-radius:12px;color:var(--lime);font-family:Consolas,monospace;direction:ltr;text-align:left;overflow-wrap:anywhere;white-space:pre-wrap}.feedback{margin-top:22px;padding:17px 20px;border-radius:10px;border:1px solid var(--line);background:#203044}.feedback.good{border-color:#92ae5e;color:#d4f578}.feedback.bad{border-color:#b98069;color:#ffc2a7}.feedback:empty{display:none}.hint{margin-top:20px;color:var(--muted)}summary{cursor:pointer;padding:10px 0;color:var(--cyan)}.hint p{padding:10px 16px;background:#223047;border-radius:8px;font-size:15px}.choice-grid{display:grid;gap:12px}.choice{border:1px solid #5b6f87;background:#1b2c42;color:var(--text);padding:16px;border-radius:10px;text-align:right;min-height:54px}.choice:hover{border-color:var(--lime);background:#293e50}.choice[aria-pressed=true]{border-color:var(--lime);background:#35472e}.case-counter{font-size:13px;color:var(--cyan);margin-bottom:12px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:14px}th,td{padding:13px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}.result-title{font-size:32px;color:var(--lime)}.ref-list{display:grid;gap:18px}.ref-list a{text-decoration:underline;text-underline-offset:5px;color:var(--cyan)}.guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}footer{max-width:1240px;padding:26px 40px;border-top:1px solid var(--line);margin:auto;display:flex;justify-content:space-between;gap:20px;font-size:12px;color:var(--muted)}#toast{position:fixed;bottom:25px;left:25px;max-width:calc(100% - 50px);border-radius:10px;background:var(--lime);color:var(--ink);padding:12px 22px;box-shadow:0 10px 40px #0005;display:none;z-index:5}#toast.show{display:block;animation:pop .2s ease-out}.success-mark{font-size:48px;color:var(--lime)}@keyframes pop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media(max-width:800px){header{padding:20px;gap:16px;flex-wrap:wrap}.brand{font-size:19px}nav{order:3;width:100%;justify-content:center;font-size:14px;gap:25px}.score{margin-inline-start:auto}main{padding:30px 20px 50px}.hero{grid-template-columns:1fr;gap:10px;padding:0 0 30px}.hero h1{font-size:44px}.scene{min-height:290px;max-width:440px;width:100%;margin:auto}.orbit{width:260px;height:260px}.p1{top:18px}.p2{bottom:20px}.map{grid-template-columns:1fr 1fr}.workspace,.guide-grid{grid-template-columns:1fr}.lesson-heading h1{font-size:31px}.section-head{align-items:flex-start;flex-direction:column;gap:5px}.meta{flex-wrap:wrap;gap:10px 20px}footer{padding:25px 20px;flex-direction:column;gap:6px}}@media(max-width:480px){.map{grid-template-columns:1fr}.mission{min-height:195px}.panel{padding:19px}.lesson-top{align-items:flex-start}.hero h1{font-size:39px}.packet{font-size:12px;padding:12px}.scene-label{display:none}.checkline{flex-wrap:wrap}.checkline code{margin-inline-start:34px}.actions .btn{flex-grow:1}h2{font-size:25px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
main:focus{outline:none}

.creator{color:var(--lime);font-weight:600}.games-grid{margin-top:24px}.games-grid .mission{cursor:default}.games-grid .mission:hover{transform:none}.games-grid h2{font-size:23px;margin:0 0 8px}.game-card-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:auto}.game-link{margin-top:12px;font-size:13px}.game-link input{font-size:13px}.share-banner{display:flex;align-items:center;justify-content:space-between;gap:24px}.share-banner h2{font-size:23px;margin-bottom:8px}.share-banner p{margin:0}.share-banner .btn{flex-shrink:0}footer{flex-wrap:wrap}@media(max-width:800px){.share-banner{align-items:stretch;flex-direction:column}.lesson-top{flex-wrap:wrap}.lesson-top .actions{gap:8px}}

input[type=password]{width:100%;background:#111d2e;color:var(--text);border:1px solid #64758b;border-radius:9px;padding:12px;min-height:48px}.login-panel{max-width:540px;margin:35px auto}.login-panel h1{font-size:36px}.trainer-nav{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:35px;flex-wrap:wrap}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:25px 0}.stats-grid span{color:var(--muted);font-size:14px}.stats-grid strong{display:block;color:var(--lime);font-size:38px}.leaderboard .rank{font-size:22px;color:var(--lime);font-weight:700}.leaderboard details{min-width:160px}.leaderboard ul{padding-inline-start:18px;white-space:normal;min-width:240px}.leaderboard small{display:block;color:var(--muted)}.submission-panel{margin-top:28px}.submission-panel form{max-width:620px}.submission-panel .hint{font-size:14px}.empty-state{text-align:center;margin-top:25px;padding:45px 20px}#dashboard>.actions{margin-bottom:20px}@media(max-width:600px){.stats-grid{gap:8px}.stats-grid .panel{padding:12px}.stats-grid strong{font-size:28px}.stats-grid span{font-size:12px}.login-panel{margin:0}.trainer-nav>.actions{width:100%}}