:root{--bg:#030611;--panel:rgba(9,18,40,.78);--panel2:#0b1732;--text:#f4f8ff;--muted:#91a2c2;--line:rgba(129,183,255,.18);--cyan:#00eaff;--purple:#9a62ff;--gold:#ffd226;--pink:#ff52b8;--green:#36e6a0;--orange:#ff9a20;--shadow:rgba(0,0,0,.38)}
[data-theme=light]{--bg:#eaf5ff;--panel:rgba(255,255,255,.78);--panel2:#fff;--text:#07172b;--muted:#567087;--line:rgba(29,102,154,.16);--cyan:#008fae;--purple:#7040ca;--gold:#bd8300;--pink:#c82d82;--green:#07835c;--orange:#c76700;--shadow:rgba(29,65,105,.16)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font-family:"Segoe UI",Tahoma,Arial,sans-serif;overflow-x:hidden;transition:background .35s,color .35s}button,input,textarea,select{font:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}.shell{width:min(1180px,calc(100% - 32px));margin:auto}#stars{position:fixed;inset:0;z-index:-3}.nebula{position:fixed;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(circle at 12% 20%,rgba(0,234,255,.14),transparent 28%),radial-gradient(circle at 88% 12%,rgba(154,98,255,.18),transparent 31%),radial-gradient(circle at 62% 90%,rgba(255,82,184,.09),transparent 28%)}.space-grid{position:fixed;z-index:-1;left:-25%;right:-25%;bottom:-31vh;height:68vh;opacity:.14;background-image:linear-gradient(var(--cyan) 1px,transparent 1px),linear-gradient(90deg,var(--cyan) 1px,transparent 1px);background-size:56px 56px;transform:perspective(430px) rotateX(64deg);mask-image:linear-gradient(transparent,#000)}
.site-header{position:sticky;top:0;z-index:30;padding-top:max(9px,env(safe-area-inset-top));background:linear-gradient(var(--bg),transparent)}.nav{height:64px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid var(--line);border-radius:18px;background:var(--panel);backdrop-filter:blur(19px);box-shadow:0 14px 38px var(--shadow)}.brand{display:flex;align-items:center;gap:9px;direction:ltr}.logo{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--cyan);border-radius:50%;color:var(--gold);font-size:24px}.brand b{display:block;font-size:19px}.brand small{display:block;color:var(--cyan);font-size:8px;letter-spacing:.2em}.navlinks{display:flex;gap:22px;color:var(--muted);font-size:14px;font-weight:700}.navlinks a:hover{color:var(--cyan)}.tools{display:flex;gap:7px;direction:ltr}.tools select,.tools button{height:39px;border:1px solid var(--line);border-radius:11px;background:rgba(72,116,170,.1);color:var(--text);padding:0 10px}.tools button{width:40px;padding:0}.tools option{background:#071223;color:#fff}#menuToggle{display:none}.view{display:none;min-height:70vh}.view.active{display:block}
.hero{min-height:630px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:30px;padding:42px 0}.eyebrow{color:var(--cyan);font-size:12px;font-weight:900;letter-spacing:.15em}.hero h1{font-size:clamp(48px,7vw,86px);line-height:1.03;margin:15px 0}.hero h1 strong{display:block;color:transparent;background:linear-gradient(90deg,var(--cyan),#8fa2ff,var(--purple));background-clip:text;-webkit-background-clip:text}.hero-copy>p{max-width:660px;color:var(--muted);font-size:18px;line-height:1.9}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}.primary-btn,.ghost-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:11px 20px;border:0;border-radius:14px;font-weight:900}.primary-btn{background:linear-gradient(90deg,var(--cyan),#8592ff);color:#04131e;box-shadow:0 0 28px rgba(0,234,255,.2)}.ghost-btn{border:1px solid var(--line);background:var(--panel);color:var(--text)}.trust{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:13px}.trust span{color:var(--green)}.trust b{color:var(--muted)}.reactor{position:relative;width:min(43vw,460px);aspect-ratio:1;margin:auto;display:grid;place-items:center}.core{width:37%;aspect-ratio:1;display:grid;place-items:center;border-radius:42%;font-size:72px;color:var(--gold);background:linear-gradient(145deg,#123b59,#071526);border:1px solid rgba(0,234,255,.35);box-shadow:0 0 60px rgba(0,234,255,.18);animation:float 5s ease-in-out infinite}.orbit{position:absolute;inset:9%;border:1px solid rgba(0,234,255,.28);border-radius:50%;animation:spin 17s linear infinite}.orbit i{position:absolute;top:-13px;left:50%;font-style:normal;color:var(--cyan);font-size:25px}.orbit.o2{inset:20%;border-style:dashed;animation-duration:13s;animation-direction:reverse}.orbit.o3{inset:31%;animation-duration:9s}.value{padding:35px 0 70px}.section-title{text-align:center;margin-bottom:24px}.section-title span{color:var(--cyan);font-size:11px;font-weight:900;letter-spacing:.2em}.section-title h2{font-size:clamp(28px,4vw,43px);margin:7px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.steps article,.glass,.seo-copy{border:1px solid var(--line);border-radius:24px;background:var(--panel);backdrop-filter:blur(16px);box-shadow:0 18px 45px var(--shadow)}.steps article{padding:22px}.steps b{color:var(--cyan);font-size:12px}.steps h3{font-size:22px;margin:17px 0 5px}.steps p,.seo-copy p{color:var(--muted);line-height:1.8}.seo-copy{padding:25px;margin-bottom:70px}.seo-copy h2{margin-top:0}
.page-head{text-align:center;padding:55px 0 25px}.page-head h1,.text-page h1{font-size:clamp(36px,6vw,60px);margin:8px}.page-head p{color:var(--muted);font-size:17px}.lesson-menu{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-bottom:75px}.lesson-card{--a:var(--cyan);position:relative;min-height:255px;padding:21px;text-align:start;border:1px solid var(--line);border-radius:25px;background:linear-gradient(145deg,var(--panel),color-mix(in srgb,var(--a) 5%,transparent));color:var(--text);box-shadow:0 18px 45px var(--shadow);overflow:hidden;transition:.28s}.lesson-card:hover{transform:translateY(-7px);border-color:var(--a)}.lesson-card>b{position:absolute;inset-inline-end:20px;top:18px;color:var(--muted);font-size:11px}.lesson-card.gold{--a:var(--gold)}.lesson-card.purple{--a:var(--purple)}.lesson-card.orange{--a:var(--orange)}.lesson-card.pink{--a:var(--pink)}.lesson-card.green{--a:var(--green)}.glyphs{display:block;color:var(--a);font-size:35px;font-weight:900;margin:20px 0}.lesson-card h2{font-size:21px;margin:0 0 8px}.lesson-card p{color:var(--muted);line-height:1.7;font-size:14px}.lesson-card em{position:absolute;bottom:18px;inset-inline-start:21px;color:var(--a);font-style:normal;font-size:13px;font-weight:900}
.game-view{padding:35px 0 70px}.game-shell{padding:22px;border:1px solid var(--line);border-radius:30px;background:var(--panel);backdrop-filter:blur(18px);box-shadow:0 22px 60px var(--shadow)}.back-btn{border:0;background:transparent;color:var(--cyan);font-weight:800}.game-top{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:14px;margin-top:12px}.game-top h1{font-size:32px;margin:4px 0}.mission{color:var(--cyan);font-size:11px;font-weight:900;letter-spacing:.17em}.score-pill,.progress{padding:8px 14px;border-radius:22px;font-weight:900}.score-pill{background:linear-gradient(90deg,var(--orange),var(--gold));color:#201400}.progress{background:rgba(111,132,208,.13)}.instruction{text-align:center;color:var(--muted);font-size:16px}.speaker-btn{display:block;width:86px;height:86px;margin:12px auto 20px;border:0;border-radius:50%;background:linear-gradient(145deg,#1b237d,#080d45);color:var(--gold);font-size:42px;box-shadow:0 8px 18px #0005}.answer-area{min-height:82px;display:flex;justify-content:center;align-items:center;gap:12px;direction:ltr}.answer-box{width:72px;height:72px;display:grid;place-items:center;border:2px solid var(--line);border-radius:20px;background:var(--panel2);color:var(--text);font-size:42px;font-weight:900;box-shadow:0 7px 14px var(--shadow)}.answer-box.filled{border-color:var(--orange)}.letters-grid{display:grid;grid-template-columns:repeat(11,1fr);gap:9px;direction:ltr}.letters-grid.compact{display:flex;justify-content:center;flex-wrap:wrap;max-width:780px;margin:auto}.letters-grid.compact .letter-card{flex:0 0 78px;width:78px;height:78px;aspect-ratio:auto}.letter-card{min-width:0;aspect-ratio:1;border:2px solid var(--line);border-radius:17px;background:linear-gradient(145deg,var(--panel2),rgba(133,154,220,.08));color:var(--text);font-size:clamp(23px,3vw,38px);font-weight:900;box-shadow:0 7px 12px var(--shadow);transition:.16s}.letter-card:hover{border-color:var(--orange);transform:translateY(-3px)}.letter-card.correct{background:#104d3c;border-color:var(--green)}.letter-card.wrong{background:#5a1830;border-color:var(--pink)}.letter-card.vanish{opacity:0;transform:scale(.2);pointer-events:none}.letter-card.selected{border-color:var(--orange);color:var(--gold)}.feedback{min-height:40px;margin-top:14px;text-align:center;font-size:17px;font-weight:900}.feedback.ok{color:var(--green)}.feedback.err{color:var(--pink)}.controls{display:flex;justify-content:center;gap:9px;flex-wrap:wrap}.control{min-height:44px;padding:9px 16px;border:0;border-radius:13px;font-weight:900}.control.primary{background:linear-gradient(90deg,var(--orange),var(--gold));color:#201400}.control.secondary{background:rgba(99,120,185,.16);color:var(--text)}.control.reset{background:#272987;color:#fff}
.text-page{padding:55px 0 80px}.narrow{width:min(850px,calc(100% - 30px))}.article{padding:clamp(21px,4vw,40px)}.article h2,.article h3{color:var(--cyan)}.article p,.article li{color:var(--muted);font-size:16px;line-height:1.9}.article h3{margin-top:28px}form{display:grid;gap:15px}label span{display:block;margin-bottom:6px;font-weight:800}input,textarea{width:100%;border:1px solid var(--line);border-radius:13px;background:rgba(90,119,170,.09);color:var(--text);padding:12px;outline:none}input:focus,textarea:focus{border-color:var(--cyan)}form small{color:var(--muted);line-height:1.6}footer{border-top:1px solid var(--line);padding:28px 0 calc(30px + env(safe-area-inset-bottom));background:rgba(2,5,14,.3)}.footer-grid{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center}.footer-grid p{color:var(--muted);margin:5px 0}.footer-links{display:flex;gap:15px;flex-wrap:wrap;color:var(--muted);font-size:13px}.teacher{grid-column:1/-1;direction:ltr;color:var(--muted);font-size:11px}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes float{50%{transform:translateY(-10px) rotate(2deg)}}@media(max-width:860px){.navlinks{display:none;position:absolute;top:76px;inset-inline:16px;padding:16px;flex-direction:column;border:1px solid var(--line);border-radius:16px;background:var(--panel2)}.navlinks.open{display:flex}#menuToggle{display:block}.hero{grid-template-columns:1fr .8fr}.lesson-menu{grid-template-columns:repeat(2,1fr)}.letters-grid{grid-template-columns:repeat(7,1fr)}}@media(max-width:620px){.shell{width:min(100% - 20px,1180px)}.nav{height:59px}.brand b{font-size:16px}.brand small{display:none}.tools select{width:45px;color:transparent}.tools option{color:#fff}.hero{display:flex;flex-direction:column-reverse;text-align:center;min-height:auto;padding:30px 0}.reactor{width:min(86vw,360px)}.hero h1{font-size:45px}.hero-copy>p{font-size:16px}.hero-actions,.trust{justify-content:center}.steps,.lesson-menu{grid-template-columns:1fr}.steps article{padding:18px}.lesson-card{min-height:225px}.game-shell{padding:15px 10px}.game-top{grid-template-columns:1fr auto}.game-top .progress{grid-column:2}.game-top .score-pill{display:none}.game-top h1{font-size:25px}.letters-grid{grid-template-columns:repeat(5,1fr);gap:7px}.letters-grid.compact{display:grid;grid-template-columns:repeat(5,1fr);max-width:none}.letters-grid.compact .letter-card{width:auto;height:auto;aspect-ratio:1;min-width:0}.letter-card{font-size:30px;border-radius:14px}.control{flex:1 1 42%}.footer-grid{grid-template-columns:1fr}.footer-links{flex-direction:column}.teacher{grid-column:auto}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.lesson-card.coming-soon{cursor:not-allowed;opacity:.62}.lesson-card.coming-soon:hover{transform:none;border-color:var(--line)}