:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:#f3f6ff;background:#0b1530;color-scheme:dark;--gold:#ffdb85;--aqua:#7ce0cf;--ink:#13274c}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(ellipse at 90% 0%,#263b73 0,transparent 42%),#0b1530}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}[hidden]{display:none!important}button:focus-visible,input:focus-visible{outline:3px solid #ffe39c;outline-offset:3px}button{touch-action:manipulation}
.app-frame{min-height:100vh;display:flex;flex-direction:column}.site-header{display:flex;align-items:center;gap:28px;padding:15px max(22px,calc((100vw - 1360px)/2));background:#111e40eb;border-bottom:1px solid #7594d339;position:relative;z-index:5;box-shadow:0 8px 24px #060c1e42}.brand{display:flex;align-items:center;gap:13px;background:none;color:inherit;border:0;padding:0;text-align:left}.logo-gem{font-size:40px;line-height:1;color:var(--gold);filter:drop-shadow(0 3px 9px #dfaa6c95)}.brand-copy{display:flex;flex-direction:column;gap:2px}.brand-copy strong{font-size:21px;letter-spacing:.05em}.brand-copy em{font-style:normal;color:var(--gold)}.brand-copy small{color:#afbfde;font-size:11px;letter-spacing:.065em}.topnav{display:flex;gap:8px;margin-left:auto}.nav-button{background:transparent;color:#bfcced;border:1px solid transparent;padding:10px 16px;border-radius:15px;font-weight:700;font-size:13px}.nav-button.current,.nav-button:hover:not(:disabled){background:#45629980;color:#fff;border-color:#9ab4e580}.staging-label{padding:8px 10px;border-radius:10px;color:#e7d29b;background:#6b53292b;border:1px solid #aa924f70;font-size:10px;letter-spacing:.075em;font-weight:850;white-space:nowrap}
.page{width:min(1320px,calc(100% - 40px));margin:0 auto;flex:1;padding:30px 0 48px}.hero{display:grid;grid-template-columns:1.1fr 1fr;min-height:285px;border:1px solid #93aeef62;border-radius:27px;overflow:hidden;background:radial-gradient(circle at 88% 15%,#5268b2a0,transparent 40%),linear-gradient(125deg,#273865 0%,#1b2850 53%,#313b71 100%);box-shadow:0 16px 40px #03071d5c}.hero-copy{position:relative;z-index:1;padding:37px 38px}.eyebrow{font-size:11px;font-weight:900;letter-spacing:.13em;color:#a8f2d8;margin:0 0 13px}.hero h1{font-size:clamp(30px,3.8vw,54px);max-width:600px;line-height:1.07;letter-spacing:-.045em;margin:0 0 17px}.hero h1 span{color:var(--gold)}.hero-copy>p:not(.eyebrow){font-size:15px;color:#d9e2f9;line-height:1.55;max-width:535px}.hero-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:23px}.hero-tags span{border:1px solid #b3c8f252;background:#131f46a0;border-radius:999px;padding:7px 13px;font-size:12px;font-weight:750;color:#e7eeff}.hero-art{position:relative;overflow:hidden;min-height:270px;background:radial-gradient(circle at 50% 40%,#8e9cf874,transparent 45%)}.planet{position:absolute;border-radius:50%;background:#a1cafc15;border:2px solid #a2c3f251}.planet-1{width:250px;height:250px;left:20%;top:8%}.planet-2{width:150px;height:150px;right:5%;top:35%}.gem{position:absolute;color:#ffe4ad;filter:drop-shadow(0 0 18px #ffc96d);text-shadow:0 0 30px #fff}.gem-big{font-size:110px;left:42%;top:25%;animation:hoverGem 5s ease-in-out infinite}.gem-small{font-size:42px;right:15%;top:20%}.hero-ground{position:absolute;inset:auto -10% -25% -10%;height:37%;border-radius:50%;background:#18365f}.hero-hill{position:absolute;inset:auto -15% -28% 15%;height:42%;background:#254a66;border-radius:50%}.hero-tower{position:absolute;width:26px;height:117px;right:27%;bottom:16%;background:#1b2c50;border-radius:8px 8px 0 0;box-shadow:0 -18px 0 -6px #9dabcc}.hero-tower.second{right:15%;height:80px}.session-panel{display:flex;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(110deg,#172a51,#132343);margin-top:22px;border:1px solid #8cb6e448;border-radius:20px;padding:23px 28px}.session-panel h2{margin:0 0 6px;font-size:22px}.session-panel p{margin:0;max-width:490px;color:#c8d6f3;font-size:13px;line-height:1.6}.login-form{max-width:535px;width:100%}.login-form label{display:block;color:#c3d2ef;font-weight:800;font-size:12px;margin-bottom:8px}.login-row{display:flex;gap:9px}.login-row input{width:100%;border:1px solid #8faadb8d;background:#080f25;color:#fff;border-radius:11px;padding:12px;min-width:175px}.primary{border:0;border-radius:11px;padding:10px 20px;background:linear-gradient(120deg,#ffe29c,#ebbd60);color:#253044;font-weight:900;white-space:nowrap}.primary:hover{filter:brightness(1.07)}.login-form .input-message{margin-top:8px;color:#9eafd5;font-size:11px;max-width:100%}.login-form .input-message.valid{color:var(--aqua)}.lessons{margin-top:34px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:18px}.section-heading h2{font-size:27px;margin:0;letter-spacing:-.02em}.section-heading .eyebrow{margin-bottom:7px}.availability{background:#223960;border:1px solid #7a96c66f;color:#d4e3ff;border-radius:999px;padding:8px 13px;font-size:12px}.lesson-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.lesson-card{position:relative;display:flex;min-height:225px;flex-direction:column;justify-content:space-between;text-align:left;color:#fff;border-radius:21px;border:1px solid #7192c96b;padding:19px;background:linear-gradient(158deg,#2c416d,#172749);overflow:hidden;transition:transform .18s,box-shadow .18s}.lesson-card:hover:not(:disabled){transform:translateY(-4px);box-shadow:0 15px 30px #050d21a6;border-color:#ffe59d}.lesson-card:disabled{opacity:.7}.lesson-card .art{font-size:45px;line-height:1;filter:drop-shadow(0 4px 14px #ffbd6890)}.lesson-card .number{color:#a9c4eb;font-size:10px;letter-spacing:.11em;font-weight:900}.lesson-card strong{display:block;font-size:19px;line-height:1.25;margin-top:10px}.lesson-card small{display:block;font-size:12px;color:#cedaf2;line-height:1.45;margin-top:5px}.lesson-card .cta{font-size:12px;font-weight:900;color:#ffdc8e;margin-top:15px}.lesson-card:nth-child(2){background:linear-gradient(150deg,#28546a,#142943)}.lesson-card:nth-child(3){background:linear-gradient(150deg,#625079,#202c52)}.lesson-card:nth-child(4){background:linear-gradient(150deg,#5a435e,#232744)}.feature-note{margin-top:26px;display:flex;gap:17px;border-radius:18px;padding:19px 22px;background:#1c2d529c;border:1px solid #6385bd5e}.feature-icon{font-size:35px}.feature-note strong{color:#ffdc99;font-size:16px}.feature-note p{margin:6px 0 0;color:#bed0ee;line-height:1.6;font-size:13px}.site-footer{display:flex;justify-content:space-between;gap:10px;max-width:1360px;width:calc(100% - 44px);margin:0 auto;padding:15px 0 22px;border-top:1px solid #7e9ccc40;color:#829ec5;font-size:11px}
.lesson-view{flex:1;display:flex;flex-direction:column;min-height:calc(100vh - 120px)}.lesson-bar{display:flex;align-items:center;gap:16px;padding:12px max(18px,calc((100vw - 1360px)/2));background:#1e3056;border-bottom:1px solid #90acdf5a}.back{border:1px solid #99b0d27a;border-radius:11px;color:#f3f5ff;background:#2c426d;padding:10px 16px;font-size:13px;font-weight:750}.back:hover{background:#3b578b}.lesson-bar-title{display:flex;flex-direction:column;gap:2px;flex:1}.lesson-bar-title strong{font-size:15px}.lesson-bar-title small{font-size:10px;color:#abc0df}.speaking-action{border:1px solid #f4db87;border-radius:11px;background:linear-gradient(110deg,#ffe3a2,#ffc65f);color:#203355;font-size:13px;font-weight:900;padding:11px 16px}#lessonFrame{width:100%;height:calc(100vh - 155px);min-height:600px;flex:1;border:0;background:#0d1a36}
.speaking-overlay{position:fixed;inset:0;z-index:60;background:#08152ee8;display:flex;align-items:stretch;justify-content:center;overflow:auto;padding:14px}.speaking-shell{display:flex;flex-direction:column;width:min(1260px,100%);height:100%;background:#0b1731;border:1px solid #90aee67d;border-radius:20px;overflow:hidden;box-shadow:0 20px 70px #050b20c9}.speaking-shell-bar{display:flex;justify-content:space-between;align-items:center;gap:14px;background:#1d3057;padding:13px 18px;border-bottom:1px solid #8aa6d26c}.speaking-shell-bar>div{display:flex;align-items:center;gap:14px}.speaking-shell-bar .eyebrow{font-size:10px;margin:0}.speaking-shell-bar strong{font-size:18px;color:#ffdc96}#speakingFrame{width:100%;height:100%;min-height:0;flex:1;border:0;background:#0d1a34}.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:99;max-width:min(94vw,560px);padding:12px 18px;border-radius:13px;border:1px solid #ffe5a0;background:#24365d;color:#fff;box-shadow:0 10px 30px #0007;line-height:1.5;font-size:13px;text-align:center}
@keyframes hoverGem{50%{transform:translateY(-12px) rotate(5deg)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@media(max-width:900px){.lesson-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{grid-template-columns:1.4fr 1fr}.hero-copy{padding:28px}.session-panel{align-items:stretch;flex-direction:column}.login-form{max-width:100%}.staging-label{display:none}}
@media(max-width:620px){.site-header{padding:13px 15px;gap:8px;flex-wrap:wrap}.brand-copy strong{font-size:16px}.brand-copy small{font-size:10px}.logo-gem{font-size:29px}.topnav{gap:1px}.nav-button{padding:8px 9px;font-size:11px}.page{width:calc(100% - 25px);padding:13px 0 28px}.hero{grid-template-columns:1fr;min-height:auto}.hero-copy{padding:24px 21px}.hero h1{font-size:34px}.hero-art{min-height:150px}.hero-art .gem-big{font-size:80px;top:10%}.hero-copy>p:not(.eyebrow){font-size:13px}.session-panel{padding:19px;margin-top:14px}.login-row{flex-direction:column}.lesson-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.lesson-card{min-height:205px;padding:13px}.lesson-card strong{font-size:15px}.section-heading{align-items:start;flex-direction:column}.section-heading h2{font-size:22px}.feature-note{padding:15px}.site-footer{flex-direction:column;font-size:10px}.lesson-bar{padding:9px;gap:7px;flex-wrap:wrap}.lesson-bar-title{order:3;width:100%;flex-basis:100%}.lesson-bar .back,.speaking-action{padding:10px;font-size:11px}#lessonFrame{height:calc(100vh - 170px);min-height:560px}.speaking-overlay{padding:0}.speaking-shell{height:100%;border:0;border-radius:0}.speaking-shell-bar{padding:10px}.speaking-shell-bar .eyebrow{display:none}.speaking-shell-bar strong{font-size:14px}}
