/* Home only: leave the lesson and game layouts under their existing styles. */
.home-brand{display:none}
body.pre-start{position:relative;inset:auto;height:auto;min-height:100dvh;overflow:auto;touch-action:pan-y;background:#f6f7ef;color:#143f35}
html:has(body.pre-start){height:auto;overflow:auto;touch-action:pan-y}
body.pre-start .home-brand{position:absolute;top:24px;right:max(24px,calc((100vw - 1120px)/2));display:flex;align-items:center;gap:10px;z-index:8}
.home-brand-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:15px;background:#145846;color:#e4ed92;font-size:30px;transform:rotate(-7deg)}
.home-brand strong{font-size:27px;line-height:1.25}.home-brand strong span{color:#6c9162}.home-brand small{display:block;font-size:11px;color:#6c7b70}
body.pre-start .subscription-entry{position:absolute;top:27px;left:max(24px,calc((100vw - 1120px)/2));z-index:8;min-width:0;padding:11px 17px;border:1px solid #d4ddcd;border-radius:14px;background:transparent;box-shadow:none}
body.pre-start .subscription-entry-icon,body.pre-start .subscription-entry-copy small{display:none}
body.pre-start .subscription-entry-copy strong{font-size:14px;font-weight:700}
body.pre-start .shell{display:block;width:100%;min-height:0;padding:112px 24px 32px;margin:0}
body.pre-start .stage{width:min(1120px,100%);height:auto;min-height:0;margin:auto;overflow:visible;border:0;border-radius:0;box-shadow:none;background:transparent;aspect-ratio:auto}
body.pre-start #gameCanvas{display:none}
body.pre-start .start-overlay{position:relative;display:block;padding:0;background:none;backdrop-filter:none;overflow:visible}
body.pre-start .start-overlay::before,body.pre-start .start-overlay::after,body.pre-start .start-panel::before{display:none}
body.pre-start .start-panel{width:100%;min-height:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:0 60px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;overflow:visible;text-align:right;color:#143f35}
.home-copy{grid-column:1;grid-row:1;align-self:center;padding:26px 0}
.home-eyebrow{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#4d7057}
.home-eyebrow i{width:7px;height:7px;border-radius:50%;background:#6a9d56;box-shadow:0 0 0 4px #e5ecd9}
body.pre-start .start-panel h1{display:block;font-size:clamp(48px,5.7vw,76px);line-height:1.28;margin:20px 0 15px;letter-spacing:-2px;text-shadow:none}
body.pre-start .start-panel h1>span{display:block;color:#163f34}
body.pre-start .start-panel h1>span.home-title-accent{color:#65904d}
body.pre-start .start-panel p.home-description{width:100%;max-width:none;margin:0;padding:0;border:0;border-radius:0;background:none;backdrop-filter:none;color:#647168;font-size:17px;line-height:1.9;font-weight:500}
.home-subjects{display:flex;flex-wrap:wrap;gap:8px;margin:19px 0 24px;font-size:12px;color:#53664f}
.home-subjects span{padding:6px 11px;border:1px solid #d9e2d3;border-radius:8px;background:#eef2e7}
body.pre-start .start-panel .start-route-actions{justify-content:flex-start;width:100%;gap:10px}
body.pre-start .start-panel button.start-route-account{width:100%;max-width:360px;min-width:0;min-height:68px;margin:0;padding:12px 20px;justify-content:flex-end;flex-direction:row-reverse;gap:18px;border-radius:16px;background:#175743;color:#fffdf0;box-shadow:0 8px 20px #1757431a;animation:none;font-size:20px}
body.pre-start .start-panel button.start-route-account:hover{background:#21694f;transform:translateY(-2px)}
body.pre-start .start-panel .start-account-icon{width:32px;height:32px;min-width:32px;background:#ffffff12;color:#e7efa2;border-radius:50%;font-size:21px;box-shadow:none}
body.pre-start .start-panel .start-account-copy{flex:1;line-height:1.5}
body.pre-start .start-panel .start-account-copy small{font-size:12px;color:#d5e4ca;opacity:1}
.home-steps{display:flex;gap:16px;flex-wrap:wrap;margin-top:24px;color:#657362;font-size:12px}
.home-steps span{display:flex;align-items:center;gap:6px}.home-steps b{display:grid;place-items:center;width:21px;height:21px;border-radius:50%;background:#e5ebdc;color:#547447;font-size:11px}
.home-illustration{position:relative;isolation:isolate;grid-column:2;grid-row:1;align-self:center;width:100%;height:530px;overflow:hidden;border-radius:36px;background:radial-gradient(ellipse at 50% 42%,#458e66,transparent 66%),#154e3f;color:#f7f4d9;border:1px solid #164f3c;box-shadow:0 20px 40px #183d3510}
.home-illustration::before{content:"";position:absolute;inset:0;opacity:.10;background-image:linear-gradient(#dae8b0 1px,transparent 1px),linear-gradient(90deg,#dae8b0 1px,transparent 1px);background-size:40px 40px;mask-image:linear-gradient(transparent,#000,transparent)}
.home-illustration::after{content:"";position:absolute;width:320px;height:320px;border:1px solid #d4e9af30;border-radius:50%;top:100px;left:calc(50% - 160px);z-index:-1;box-shadow:0 0 0 37px #d4e9af07,0 0 0 74px #d4e9af04}
.home-visual-label{position:absolute;top:28px;right:28px;font-size:13px;color:#d9e9c8}
body.pre-start .start-science-sky{inset:70px 28px auto;color:#cae29455;font-size:23px}
body.pre-start .start-hero{position:absolute;width:280px;height:180px;top:190px;left:calc(50% - 140px);border:0;border-radius:0;background:none;box-shadow:none}
body.pre-start .start-ant{--start-ant-scale:1.03}
body.pre-start .start-leaf-a{width:95%;height:64%;left:0;bottom:0;background:linear-gradient(135deg,#c6e681,#5aa66a);box-shadow:0 25px 40px #052b3840}
body.pre-start .start-leaf-b{background:#c2dc72;opacity:.45;right:0;top:-20px}
.home-concept{position:absolute;z-index:2;border:1px solid #ffffff60;box-shadow:0 16px 26px #002b2833}
.home-concept-math{top:93px;right:28px;width:205px;padding:16px 18px;border-radius:18px;background:#fbf7df;color:#234f40;transform:rotate(5deg)}
.home-concept-math span{display:block;font-size:11px;color:#657351}.home-concept-math strong{display:block;font-size:23px;margin-top:4px;text-align:left;letter-spacing:1px}.home-concept-math i{position:absolute;left:15px;top:11px;font-style:normal;font-size:20px;color:#92a868}
.home-concept-science{display:flex;align-items:center;gap:10px;bottom:87px;left:24px;padding:13px 18px;border-radius:16px;background:#e1eccb;color:#254f3c;transform:rotate(-5deg)}
.home-concept-science strong{display:block;font-size:15px}.home-concept-science div span{display:block;margin-top:3px;font-size:11px;color:#657957}.home-concept-icon{font-size:32px}
.home-visual-caption{position:absolute;bottom:27px;width:100%;text-align:center;font-size:12px;color:#d5e3c6}.home-visual-caption span{color:#e0d787;margin-left:5px}
body.pre-start .start-panel>.site-contact{grid-column:1/-1;width:100%;margin:34px 0 0;padding:20px 0 0;border:0;border-top:1px solid #dce3d4;border-radius:0;background:none;box-shadow:none;color:#71806c;font-size:12px;font-weight:500}
body.pre-start .start-panel>.site-contact b{color:#526e54;font-weight:600}
body.pre-start button:focus-visible,body.pre-start a:focus-visible{outline:3px solid #bc8b32;outline-offset:5px}
@media(max-width:760px){
 body.pre-start .shell{padding:92px 20px 24px}
 body.pre-start .home-brand{top:20px;right:22px}.home-brand strong{font-size:23px}.home-brand-mark{width:38px;height:38px;font-size:26px}.home-brand small{font-size:10px}
 body.pre-start .subscription-entry{top:24px;left:20px;padding:10px 12px}
 body.pre-start .start-panel{grid-template-columns:1fr;gap:0}
 .home-copy{grid-column:1;grid-row:1;width:100%;padding:10px 0 25px;text-align:center}
 .home-eyebrow{justify-content:center;font-size:12px}
 body.pre-start .start-panel h1{margin:15px 0 10px;font-size:46px;line-height:1.35;letter-spacing:-1.5px}
 body.pre-start .start-panel h1>span{display:inline}body.pre-start .start-panel h1>span+span::before{content:" "}
 body.pre-start .start-panel p.home-description{font-size:15px;line-height:1.8}
 .home-subjects{justify-content:center;margin:15px 0 18px;font-size:11px}
 body.pre-start .start-panel .start-route-actions{justify-content:center}
 body.pre-start .start-panel button.start-route-account{max-width:100%;min-height:64px;font-size:19px}
 .home-steps{justify-content:center;gap:13px;margin-top:17px;font-size:11px}
 .home-illustration{grid-column:1;grid-row:2;height:310px;border-radius:26px}
 .home-visual-label{top:18px;right:20px;font-size:11px}
 .home-illustration::after{width:210px;height:210px;top:56px;left:calc(50% - 105px)}
 body.pre-start .start-hero{top:96px;left:calc(50% - 115px);width:230px;height:140px}body.pre-start .start-ant{--start-ant-scale:.85}
 .home-concept-math{top:48px;right:20px;width:164px;padding:10px 13px;border-radius:13px}.home-concept-math strong{font-size:20px}.home-concept-math span{font-size:10px}.home-concept-math i{top:6px}
 .home-concept-science{bottom:48px;left:17px;padding:9px 13px;gap:8px}.home-concept-science strong{font-size:12px}.home-concept-science div span{font-size:10px}.home-concept-icon{font-size:25px}
 .home-visual-caption{bottom:16px;font-size:11px}
 body.pre-start .start-panel>.site-contact{grid-row:3;margin-top:22px;padding-top:16px;font-size:11px}
}
@media(max-width:360px){body.pre-start .start-panel h1{font-size:39px}.home-steps{gap:8px}}
@media(prefers-reduced-motion:reduce){body.pre-start .start-ant{animation:none}body.pre-start *{scroll-behavior:auto;transition:none}}
/* Keep the Arabic lettering and primary action legible at every breakpoint. */
body.pre-start,body.pre-start button,body.pre-start .site-contact{font-family:Arial,Tahoma,sans-serif}
.home-copy{width:100%;min-width:0}
body.pre-start .start-panel .start-account-copy strong{font-size:19px;font-weight:700}
body.pre-start .start-panel .start-account-icon{font-size:0;flex-basis:32px}
body.pre-start .start-panel .start-account-icon::before{content:"←";font-size:22px}
body.pre-start .start-panel h1{letter-spacing:0}
/* Compact mobile landing: short copy, one primary action, optional details. */
body.pre-start .start-panel .start-account-copy small{display:none}
.home-more>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:center;gap:10px;color:#526e54;font-size:13px;font-weight:700;list-style:none}
.home-more>summary::-webkit-details-marker{display:none}
.home-more>summary::after{content:"+";font-size:18px}
.home-more[open]>summary::after{content:"−"}
body.pre-start .seo-home{padding:0 20px 20px;background:#f6f7ef}
body.pre-start .seo-home-links{margin-top:6px;justify-content:center;gap:20px;font-size:11px}
body.pre-start .seo-home-links a{min-height:44px;display:flex;align-items:center;font-weight:500;color:#647660}
@media(max-width:760px){
 body.pre-start .shell{padding:80px 18px 8px}
 body.pre-start .home-brand{top:20px;right:20px}
 .home-copy{padding:8px 0 20px}
 body.pre-start .start-panel h1{font-size:clamp(34px,10vw,42px);margin:12px 0 6px;line-height:1.35}
 body.pre-start .start-panel p.home-description{font-size:14px;line-height:1.6}
 .home-subjects{margin:12px 0 16px;gap:6px}.home-subjects span{padding:4px 12px}
 body.pre-start .start-panel button.start-route-account{min-height:56px;padding:10px 18px;border-radius:14px}
 body.pre-start .start-panel .start-account-copy strong{font-size:18px}
 .home-illustration{height:clamp(205px,31dvh,270px);border-radius:24px}
 body.pre-start .start-hero{top:70px;width:210px;height:120px;left:calc(50% - 105px)}
 body.pre-start .start-ant{--start-ant-scale:.78}
 .home-concept-math{top:21px;right:20px;width:158px;padding:12px 14px}
 .home-concept-math strong{margin:0;font-size:20px}
 .home-concept-math i{display:none}
 .home-concept-science{bottom:17px;left:17px;padding:8px 12px}
 body.pre-start .start-science-sky{inset:25px 24px auto;font-size:20px}
 body.pre-start .start-panel>.site-contact{margin-top:14px;padding-top:10px;min-height:38px}
}

/* Let visitors reach the curriculum before choosing to create an account. */
body.pre-start .start-panel .start-route-actions{flex-direction:column;align-items:flex-start}
body.pre-start .start-panel button.guest-entry-primary{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:360px;min-height:72px;padding:14px 20px;border:0;border-radius:16px;background:#175743;color:#fffdf0;font-size:22px;font-weight:800;box-shadow:0 8px 20px #1757431a}
body.pre-start .start-panel button.guest-entry-primary span{color:#d5e4ca;font-size:13px;font-weight:500}
body.pre-start .start-panel button.guest-entry-primary:hover{background:#21694f}
body.pre-start .start-panel button.start-route-account{min-height:48px;background:transparent;color:#175743;box-shadow:none;border:1px solid #d4ddcd;font-size:16px}
body.pre-start .start-panel button.start-route-account:hover{background:#eef2e7}
body.pre-start .start-panel .start-account-copy small{color:#647168}
body.pre-start .start-panel .start-account-icon{color:#175743;background:#e5ebdc}
@media(max-width:760px){body.pre-start .start-panel button.guest-entry-primary{max-width:100%;font-size:20px}body.pre-start .start-panel button.start-route-account .start-account-copy strong{font-size:16px}}