/* School AI 2.3 — one palette, warmer objects and quieter surroundings. */
:root{--blue:#0b2d80;--lime:#d8f68d;--white:#f8fbff;--muted:#cfdbf2;--gold:#f3d49e;--glass:#092360dc}
html,body{background:#081f61}
.experience{background:radial-gradient(ellipse at 79% 55%,#2355ac 0,transparent 49%),radial-gradient(ellipse at 23% 10%,#173d8b 0,transparent 44%),linear-gradient(125deg,#081f61,#0c3182 66%,#194797)}
.header{border-bottom:1px solid #d2e1ff14}
.header nav{gap:34px;margin-left:-70px}
.header nav button{color:#e7efff;font-size:14px;letter-spacing:-.01em}
.header nav button:after{height:2px;border-radius:2px;background:var(--lime)}
.login{background:linear-gradient(140deg,#f0f6ff0f,#f0f6ff03);border-color:#cedfff70;min-height:44px;box-shadow:inset 0 1px 0 #ffffff0b;transition:background .25s,border-color .25s,transform .25s}
.login:hover{background:#e4efff19;border-color:#e4efffc2;transform:translateY(-1px)}
.hero-copy{padding-top:clamp(44px,6.7vh,82px);width:47%}
.hero-eyebrow{display:flex;align-items:center;gap:11px;font-size:10px!important;line-height:1.5!important;letter-spacing:.15em!important;color:#c9d8ef!important;margin:0 0 20px!important;text-transform:uppercase}
.hero-eyebrow:before{content:"";width:22px;height:1px;background:linear-gradient(90deg,#e9d09a,#d8f68d);flex:none}
.hero-copy h1{font-size:clamp(58px,5.7vw,98px);font-weight:500;line-height:1.055;letter-spacing:-.055em;text-wrap:balance;text-shadow:0 3px 22px #061d4a22}
.headline-line{display:block;white-space:nowrap}
.headline-accent{color:#dce8ff}
@supports(background-clip:text){.headline-accent{background:linear-gradient(105deg,#f5f8ff 2%,#dce7ff 54%,#b9d4f7);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}}
.hero-copy>p:not(.hero-eyebrow){font-size:clamp(18px,1.68vw,26px);line-height:1.55;letter-spacing:-.025em;margin:24px 0 33px;color:var(--muted)}
.explore{min-height:66px;padding:0 20px 0 30px;gap:28px;font-size:17px;font-weight:550;letter-spacing:-.02em;color:#183b2a;background:linear-gradient(135deg,#e3fba6,#d0ed83);box-shadow:inset 0 1px 0 #f5ffd4,0 8px 28px #061e542b;transition:transform .3s var(--ease),box-shadow .3s,filter .3s}
.explore svg{width:40px;height:40px;padding:10px 7px;border-radius:50%;background:#2c482812;stroke-width:1.6}
.explore:hover{background:linear-gradient(135deg,#eafeb8,#dcf79b);box-shadow:inset 0 1px 0 #f7ffdf,0 12px 34px #061d594d;transform:translateY(-3px)}
.explore:hover svg{transform:translateX(2px)}
.sky-glow{background:radial-gradient(ellipse at 72% 30%,#b5b7fc13,transparent 43%),radial-gradient(ellipse at 75% 78%,#9cc8ed18,transparent 53%)}
.sky-glow:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 77% 28%,#aa94e828,transparent 43%);opacity:.12;transition:opacity 4s ease}
.hero[data-world="2"] .sky-glow:after{opacity:1}
.hero[data-world="1"] .sky-glow:after{opacity:.42}
.scene{width:min(75.5vw,calc((max(760px,100svh) - 190px)*1.5));right:-.5%;bottom:5px}
.scene:before{content:"";position:absolute;inset:6% 7% 11% 17%;border-radius:50%;background:radial-gradient(ellipse,#82a5e714,#8a99e308 45%,transparent 72%);filter:blur(25px);pointer-events:none}
.scene-inner{transition:transform 1.2s var(--ease)}
.planet{transform:translate3d(calc(var(--parallax-x,0px)*-.35),calc(var(--parallax-y,0px)*-.35),0);transition:transform 1.4s var(--ease)}
#scene-fx,.island{filter:drop-shadow(0 18px 24px #03164332)}
.clouds-back{opacity:.60;mask-image:linear-gradient(90deg,#0000,#000 8%,#000 92%,#0000),linear-gradient(#0000,#000 16%,#000 78%,#0000);mask-composite:intersect}
.clouds-front{opacity:.54;mask-image:linear-gradient(90deg,#0000,#000 8%,#000 92%,#0000),linear-gradient(#0000 40%,#000 68%,#000 80%,#0000);mask-composite:intersect}
.world-control{background:var(--glass);border-color:#d1e0ff35;color:#e6efff;min-height:44px;padding-left:15px;box-shadow:inset 0 1px 0 #ffffff07,0 4px 18px #03133712}
.world-control button{width:34px;height:34px}
.live-dot{background:#d8f68d;box-shadow:0 0 9px #d8f68d4d}
.motion-controls{position:absolute;right:3.3%;bottom:26px;display:flex;align-items:center;gap:9px;z-index:6}
.motion-controls .motion-toggle{position:static;background:var(--glass);border-color:#d1e0ff35;min-height:44px;padding:0 14px;color:#e6efff;font-size:11px}
.story-replay{display:flex;align-items:center;gap:9px;min-height:44px;padding:0 15px 0 10px;border:1px solid #d1e0ff35;border-radius:28px;background:var(--glass);backdrop-filter:blur(12px);font-size:11px;color:#e6efff;transition:background .25s,border-color .25s,transform .25s}
.story-replay>svg{width:27px;height:27px;fill:none;flex:none}
.story-ring{stroke:#e2eaff24;stroke-width:1}
.story-progress{stroke:var(--lime);stroke-width:1.4;stroke-linecap:round;stroke-dasharray:75.398;stroke-dashoffset:var(--story-offset,75.398);transform:rotate(-90deg);transform-origin:16px 16px}
.story-play{stroke:#eff5ff;stroke-width:1.2;stroke-linejoin:round;fill:#eff5ff12}
.story-replay:hover:not(:disabled){background:#153978ee;border-color:#e0edff80;transform:translateY(-1px)}
.story-replay:disabled{opacity:.42}
.motion-controls .motion-toggle:hover{background:#153978ee;border-color:#e0edff80}
.footer{flex-basis:48px;background:linear-gradient(90deg,#071c54b3,#102f73b3,#071c54b3);color:#bfcde6;border-top:1px solid #d8e5ff20;gap:23px}
.footer p{font-size:10px;letter-spacing:.23em;word-spacing:5px}
.footer p span{color:#e2ebf7}
.footer>span{background:linear-gradient(90deg,#e4d6ab00,#e4d6ab80);width:35px}
.footer>span:last-child{display:block;transform:rotate(180deg)}
dialog{background:radial-gradient(circle at 95% 0,#254d91,#0a275f 72%);border-color:#d1e0ff45;box-shadow:inset 0 1px 0 #ffffff10,0 35px 100px #010e3680}
dialog::backdrop{background:#031330b8;backdrop-filter:blur(14px)}
dialog h2{color:#f4f8ff;font-size:34px;font-weight:500}
#dialog-content{color:#cedbf3}
.dialog-action{background:linear-gradient(135deg,#e3fba6,#d0ed83);font-weight:550;min-height:48px}
.dialog-close{background:#eaf2ff0a;border:1px solid #d1e0ff1c}
.dialog-links button{border-color:#dceaff38;background:#ffffff06;min-height:48px}
@media(min-width:1800px){.hero-copy{padding-top:8vh}.scene{right:1%;bottom:0}}
@media(max-height:790px) and (min-width:1200px){.hero-copy{padding-top:43px}.hero-copy h1{font-size:clamp(58px,5.6vw,82px)}.hero-eyebrow{margin-bottom:17px!important}.hero-copy>p:not(.hero-eyebrow){margin:20px 0 28px}.scene{width:min(75.5vw,calc((max(760px,100svh) - 190px)*1.5),900px);bottom:3px}.explore{min-height:60px}}
@media(min-width:901px) and (max-width:1199px){.hero-copy{width:49%;padding-top:52px}.hero-copy h1{font-size:clamp(54px,5.65vw,66px)}.hero-eyebrow{font-size:9px!important;letter-spacing:.11em!important;margin-bottom:17px!important}.hero-copy>p:not(.hero-eyebrow){font-size:18px;margin:20px 0 27px}.scene{width:min(81vw,calc((max(760px,100svh) - 190px)*1.5));right:-1%;bottom:7px}.header nav{margin-left:0;gap:25px}.header nav button{font-size:12px}.explore{font-size:16px;min-height:59px;padding-left:26px}}
@media(max-width:900px){.header nav{margin-left:0;gap:22px}.header nav button{font-size:12px}.hero-copy{padding-top:35px;width:auto}.hero-copy h1{font-size:clamp(58px,8.4vw,76px)}.hero-eyebrow{font-size:9px!important;letter-spacing:.13em!important;margin-bottom:19px!important}.hero-copy>p:not(.hero-eyebrow){font-size:21px;margin:21px 0 27px}.scene{width:100%;right:0;bottom:21px}.motion-controls{right:6%;bottom:16px}.world-control{bottom:16px}.footer p{font-size:9px}}
@media(max-width:600px){.header{border-bottom:1px solid #d2e1ff14}.brand svg.school-logo{width:164px}.mobile-menu{width:44px;height:44px;padding:10px}.login{min-width:72px;min-height:40px;font-size:11px}.hero{min-height:730px}.hero-copy{padding:25px 6% 0}.hero-copy h1{font-size:clamp(40px,11.5vw,68px);line-height:1.075;letter-spacing:-.052em}.hero-eyebrow{font-size:8px!important;letter-spacing:.105em!important;margin-bottom:16px!important;gap:8px}.hero-eyebrow:before{width:17px}.hero-copy>p:not(.hero-eyebrow){font-size:clamp(15px,4vw,21px);margin:17px 0 23px}.explore{font-size:14px;min-height:53px;padding:0 13px 0 23px;gap:21px}.explore svg{width:35px;height:35px;padding:9px 6px}.scene{width:110%;left:-5%;right:auto;bottom:auto;margin-top:45px;margin-bottom:74px}.world-control{font-size:10px;bottom:14px;padding-left:12px;gap:8px}.motion-controls{right:6%;bottom:14px;gap:7px}.motion-controls .motion-toggle{width:42px;min-height:44px;justify-content:center;padding:0}.story-replay{width:44px;min-height:44px;padding:0;justify-content:center}.story-replay>span{display:none}.footer{gap:13px;flex-basis:46px}.footer p{font-size:8px;letter-spacing:.15em;word-spacing:3px}.footer>span{width:19px}dialog{padding:38px 27px 28px}dialog h2{font-size:29px}.planet{transform:none}}
@media(max-width:360px){.brand svg.school-logo{width:133px}.header{gap:7px}.login{min-width:69px}.hero-copy h1{font-size:clamp(37px,11.5vw,42px)}.hero-copy{padding-top:23px}.hero-eyebrow{font-size:7px!important;letter-spacing:.08em!important}.hero{min-height:680px}.scene{margin-top:45px}.world-control{font-size:9px;gap:6px}.motion-controls{gap:5px}.footer p{font-size:7px}}
@media(prefers-reduced-motion:reduce){.planet{transform:none!important}.story-progress{stroke-dashoffset:0}.sky-glow:after{transition:none}}

#sky-fx{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}