:root{color-scheme:dark;--bg:#070d1b;--panel:#0e1a2c;--line:rgba(162,212,241,.15);--ink:#eff9ff;--sub:#8cabc1;--soft:#68859d;--aqua:#69efe0;--blue:#6cafff;--purple:#b5a0ff;--rose:#f5a3c3;--radius:21px;--shadow:0 25px 65px #0106144d;font-family:Inter,ui-sans-serif,'Segoe UI',-apple-system,BlinkMacSystemFont,Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-size:14px;line-height:1.55;min-height:100dvh}body:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:-2;background:radial-gradient(ellipse at 76% 0%,#17416155,transparent 40%),radial-gradient(ellipse at 5% 80%,#251b583b,transparent 50%),#070d1b}body:after{content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.13;background-image:linear-gradient(#88e8ef22 1px,transparent 1px),linear-gradient(90deg,#88e8ef22 1px,transparent 1px);background-size:65px 65px}button,input,select,textarea{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.5;cursor:not-allowed}a{color:var(--aqua)}.app-frame{display:flex;min-height:100vh}.rail{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;width:242px;flex:0 0 242px;padding:30px 17px 20px;background:linear-gradient(170deg,#0a1425ee,#0a0e20ee);border-right:1px solid var(--line);z-index:4}.brand{display:flex;align-items:center;gap:12px;margin:0 4px 43px}.brand-mark{display:grid;place-items:center;width:43px;height:43px;border-radius:14px;background:radial-gradient(circle at 25% 10%,#b8ffef,#3698bc 42%,#18375c 80%);box-shadow:0 0 28px #6cf2e73d;color:#eff;font-size:27px}.brand-text{font-size:12px;font-weight:500;letter-spacing:1.9px;line-height:1.2}.brand-text b{color:#a8fff0}.brand-text small{display:block;color:#63869e;font-size:7px;font-weight:700;letter-spacing:1.9px;margin-top:7px}.rail-caption{font-size:9px;color:#5a7791;font-weight:800;letter-spacing:2.2px;margin:0 15px 12px}.rail-nav{display:grid;gap:6px}.rail-nav button{border:1px solid transparent;border-radius:12px;background:transparent;color:#92abc3;text-align:left;padding:13px 14px;display:flex;align-items:center;gap:15px;font-size:13px;transition:.18s}.rail-nav button span{font-size:22px;line-height:.8;width:22px;text-align:center}.rail-nav button:hover{background:#88daec12;color:#eaffff}.rail-nav .nav-active{border-color:#7affdf22;color:#eaffff;background:linear-gradient(90deg,#4ae6ce24,#6172dc0d);box-shadow:inset 2px 0 var(--aqua)}.rail-bottom{margin-top:auto;display:flex;align-items:center;gap:11px;border:1px solid var(--line);background:#10283a66;border-radius:14px;padding:13px}.rail-bottom b{font-size:11px}.rail-bottom small{display:block;font-size:10px;color:var(--soft)}.connect-orb{width:10px;height:10px;border-radius:100%;background:#76edc0;box-shadow:0 0 13px #64f8ad}.workspace{min-width:0;flex:1;display:flex;flex-direction:column}.topbar{min-height:75px;display:flex;align-items:center;justify-content:space-between;padding:0 36px;gap:12px;border-bottom:1px solid var(--line);background:#08132788;backdrop-filter:blur(20px)}.topbar-title{display:flex;align-items:center;gap:12px;font-size:10px;font-weight:800;letter-spacing:2px;color:#c4e0ef}.topbar-dot{width:7px;height:7px;background:var(--aqua);border-radius:50%;box-shadow:0 0 14px var(--aqua)}.topbar-actions{display:flex;gap:14px;align-items:center}.mini-stat{border:1px solid #8cc8ef20;background:#10253a77;color:#a5e8e8;border-radius:9px;padding:7px 11px;font-weight:800;font-size:11px}.icon-btn{border:1px solid var(--line);color:var(--aqua);background:#14243777;height:35px;width:35px;border-radius:11px;font-size:19px}.content{width:100%;max-width:1460px;margin:0 auto;flex:1;padding:34px 38px 65px;min-width:0}.desktop-foot{border-top:1px solid var(--line);padding:15px 37px;display:flex;justify-content:space-between;gap:10px;color:#637e97;font-size:9px;letter-spacing:1.3px}.bottom-nav{display:none}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2.1px;color:var(--aqua);display:flex;align-items:center;gap:9px;text-transform:uppercase}.eyebrow:before{content:'';width:19px;height:1px;background:var(--aqua)}h1{font-weight:560;letter-spacing:-1.8px;font-size:clamp(32px,3.3vw,47px);line-height:1.12;margin:14px 0 14px}h2{font-size:22px;letter-spacing:-.65px;margin:0;font-weight:660}h3{font-size:16px;margin:0;letter-spacing:-.25px}p{margin:0}.gradient-text{background:linear-gradient(95deg,#b5fff4,#79c9fb 60%,#c4b6ff);background-clip:text;-webkit-text-fill-color:transparent}.sub{color:var(--sub);line-height:1.8}.quiet{color:var(--soft);font-size:12px}.tiny{font-size:10px;color:var(--soft)}.space-xl{height:27px}.space-md{height:17px}.page-head{margin-bottom:25px}.page-head p{max-width:680px;color:var(--sub);font-size:13px;line-height:1.8}.panel{background:linear-gradient(140deg,#112238d6,#0d1a2db8);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:23px;min-width:0}.panel + .panel{margin-top:15px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:19px}.panel-heading small{display:block;font-size:12px;color:var(--sub);margin-top:3px}.tag{border:1px solid #68c6ce33;background:#52c9cb12;color:#b5f7f0;font-size:9px;font-weight:800;border-radius:7px;padding:5px 8px;letter-spacing:1.1px;white-space:nowrap}.button{border:1px solid var(--line);background:#132941;color:#d7f3ff;border-radius:12px;padding:12px 16px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:700;font-size:12px;min-height:42px;transition:transform .17s,background .17s}.button:hover{transform:translateY(-1px);background:#214361}.button.primary{color:#04242d;border-color:#8cffe99c;background:linear-gradient(115deg,#83f7e4,#7cc9fb);box-shadow:0 6px 25px #5de7d52a}.button.soft{background:#7bccfb18;color:#c8eeff}.button.ghost{background:#b3d7eb09}.button.compact{padding:8px 11px;min-height:35px}.button:focus-visible,.choice:focus-visible,input:focus-visible,textarea:focus-visible,.rail button:focus-visible,.bottom-nav button:focus-visible{outline:2px solid #75f5ee;outline-offset:2px}.button-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.hero{min-height:325px;overflow:hidden;border:1px solid #9cdde823;border-radius:25px;position:relative;background:radial-gradient(ellipse at 76% 48%,#30607d3c,transparent 37%),linear-gradient(115deg,#132b44,#0c1930 66%,#131735);display:grid;grid-template-columns:1.12fr .88fr;box-shadow:var(--shadow)}.hero-content{padding:43px 38px;z-index:1;position:relative}.hero-content h1{font-size:clamp(33px,3.7vw,51px);max-width:600px}.hero-content p{max-width:510px;color:#a7c4d8;line-height:1.8;margin-bottom:23px}.soul-wrap{position:relative;display:grid;place-items:center;min-height:255px}.soul-wrap:before{content:'';position:absolute;width:80%;aspect-ratio:1;border-radius:50%;background:#6beddd17;filter:blur(44px)}.soul-canvas{width:100%;max-width:365px;height:300px;position:relative}.soul-label{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);font-size:9px;letter-spacing:2px;color:#79b9d1;white-space:nowrap}.grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.metric{padding:17px 19px;box-shadow:none}.metric-label{font-size:11px;color:#9fb8cc}.metric-value{font-size:29px;font-weight:670;letter-spacing:-1.2px;margin-top:8px}.metric-foot{font-size:10px;color:#618fa9}.section-title{display:flex;justify-content:space-between;align-items:center;margin:31px 0 15px;gap:8px}.section-title h2{font-size:21px}.text-link{border:0;background:transparent;color:var(--aqua);font-weight:700;font-size:12px}.word-card{border:1px solid #81dfe825;border-radius:16px;background:linear-gradient(135deg,#1a3444d2,#12233d);padding:19px;text-align:left;color:inherit;min-width:0;transition:.2s}.word-card:hover,.track-card:hover,.challenge-card:hover{transform:translateY(-2px);border-color:#88e7ed77}.word-card b{display:block;font-size:21px;letter-spacing:-.55px;margin:9px 0 7px}.word-card small{display:block;color:#95adbf;font-size:11px;line-height:1.55}.word-card .number{font-size:10px;color:#80d6d9;letter-spacing:2px;font-weight:800}.word-card .end{display:flex;justify-content:space-between;align-items:center;color:var(--aqua);font-size:11px;margin-top:15px}.track-card{padding:22px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(140deg,#14283eb8,#102039b8);color:inherit;text-align:left;transition:.2s;min-width:0}.track-icon{width:39px;height:39px;display:grid;place-items:center;border-radius:12px;border:1px solid #a7b7ff33;background:#787afd22;font-size:22px;color:#b4dcff;margin-bottom:16px}.track-card h3{margin-bottom:6px}.track-card p{font-size:12px;color:var(--sub);min-height:40px}.track-progress{margin-top:17px;display:flex;gap:11px;align-items:center;color:var(--soft);font-size:10px}.progress-line{height:5px;border-radius:99px;background:#38536666;flex:1;overflow:hidden}.progress-line span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--aqua),var(--blue));transition:width .25s}.challenge-card{border:1px solid var(--line);background:#12283cb0;border-radius:16px;padding:20px;color:inherit;text-align:left;transition:.2s}.challenge-card .challenge-icon{font-size:27px;color:#82e5de}.challenge-card h3{margin:12px 0 5px}.challenge-card p{color:var(--sub);font-size:11px;line-height:1.6}.label{color:#8bd9da;font-size:10px;font-weight:800;letter-spacing:1.7px;margin-bottom:9px;display:block}.input,.textarea,.select{width:100%;background:#071728bb;border:1px solid #91bfdf37;color:#f4fcff;border-radius:13px;padding:13px 15px;outline:none;min-width:0}.input:focus,.textarea:focus,.select:focus{border-color:#69eedcc4;box-shadow:0 0 0 3px #4eebd014}.textarea{resize:vertical;line-height:1.65;min-height:120px}.search-bar{display:flex;gap:9px}.search-bar .input{flex:1}.results-list{display:grid;gap:6px;margin-top:10px}.suggestion{border:1px solid #7ba2be1d;background:#0b1b2cdd;color:#d7f5ff;text-align:left;padding:10px 13px;border-radius:10px}.suggestion:hover{background:#193c52}.word-title{font-size:40px;margin:0 0 3px;letter-spacing:-1.8px}.phonetic{font-size:13px;color:#83d3e8}.meaning{border-top:1px solid var(--line);margin-top:18px;padding-top:16px}.part{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:#87e2e4;margin-bottom:8px;font-weight:800}.meaning p{font-size:14px;color:#e4edf5;margin:5px 0}.example{border-left:2px solid #67e4dd8c;padding-left:11px;margin-top:11px;color:#a5bdcf;font-size:12px;font-style:italic}.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{border:1px solid #8db8d93d;background:#56c1d313;border-radius:99px;color:#c7effc;padding:7px 12px;font-size:11px}.chip:hover{background:#5dddc029}.detail-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);gap:16px}.stack{display:grid;gap:16px;align-content:start}.empty{color:var(--sub);text-align:center;padding:35px 15px}.empty .empty-symbol{display:block;font-size:35px;color:#78ced0;margin-bottom:13px}.question{font-weight:680;font-size:18px;line-height:1.5;margin:17px 0}.choices{display:grid;gap:9px}.choice{border:1px solid #93c0da38;background:#101e32;color:#e3f1fb;padding:14px 16px;text-align:left;border-radius:12px;display:flex;align-items:center;gap:13px}.choice:hover{border-color:#7acfe7aa;background:#17354a}.choice .choice-letter{width:27px;height:27px;display:grid;place-items:center;border:1px solid #8bb6cb40;border-radius:8px;color:#78dcd7;flex:0 0 auto}.choice.correct{border-color:#66ebbc;background:#1f5d4b6b}.choice.incorrect{border-color:#ff9393;background:#69323e6b}.choice:disabled{opacity:1;cursor:default}.feedback{background:#173d4988;border:1px solid #6bcec652;border-radius:12px;padding:12px 14px;color:#cee8ea;margin-top:16px}.quiz-meta{display:flex;justify-content:space-between;color:var(--sub);font-size:11px;gap:10px}.bar{height:6px;background:#29425999;border-radius:12px;overflow:hidden;margin:13px 0 17px}.bar span{display:block;height:100%;background:linear-gradient(90deg,#61efcc,#8bb4ff);transition:width .25s}.lesson-step{padding:12px 16px;border:1px solid var(--line);border-radius:13px;display:flex;align-items:center;gap:13px;width:100%;text-align:left;color:var(--ink);background:#10273b96;margin-top:8px}.lesson-step b{display:block;font-size:12px}.lesson-step small{display:block;color:var(--sub);font-size:10px}.step-circle{display:grid;place-items:center;width:31px;height:31px;border-radius:50%;border:1px solid #6fdcdd55;background:#5fdce720;color:var(--aqua);flex:0 0 31px}.lesson-text{font-size:15px;color:#d5e9f4;line-height:1.95}.practice-callout{border-left:2px solid #9fe9df;padding:12px 18px;background:#2c6d7224;border-radius:0 14px 14px 0;margin:16px 0}.practice-callout b{display:block;font-size:11px;color:#88eeec;margin-bottom:5px}.practice-callout p{color:#c2d8e8;font-size:12px}.scene-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.scene{background:#10263c;border:1px solid var(--line);border-radius:14px;text-align:left;color:var(--ink);padding:15px}.scene.active{border-color:#66eed3;background:#15414b}.scene small{display:block;color:#7abeca;font-size:10px;margin-bottom:6px}.scene b{font-size:12px}.practice-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:14px}.practice-summary div{background:#07192d;border:1px solid var(--line);border-radius:12px;text-align:center;padding:12px 5px}.practice-summary b{font-size:20px;display:block}.practice-summary small{font-size:9px;color:var(--soft)}.review-card{background:radial-gradient(circle at 50% 10%,#2d5a7066,#0d1f38);border:1px solid #88cbdf55;border-radius:23px;text-align:center;padding:55px 20px;margin:16px 0}.review-card .big{font-size:35px;font-weight:700}.review-card .meaning-text{color:#b4cfdd;font-size:14px;margin-top:12px}.timeline-row{display:flex;gap:12px;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:14px 1px}.timeline-row b{font-size:13px}.timeline-row small{display:block;font-size:10px;color:var(--sub)}.timeline-row:last-child{border-bottom:0}.settings-section{display:grid;gap:10px}.radio-card{border:1px solid var(--line);padding:13px 15px;border-radius:12px;background:#0f253a;display:flex;align-items:center;justify-content:space-between;gap:8px}.radio-card input{accent-color:var(--aqua)}.toast{position:fixed;left:50%;transform:translate(-50%,20px);bottom:90px;max-width:min(90vw,480px);background:#16415a;border:1px solid #9cf3f08a;color:#e9ffff;border-radius:13px;box-shadow:0 12px 35px #0008;padding:12px 17px;z-index:100;opacity:0;transition:.2s;pointer-events:none;text-align:center;font-size:12px}.toast.visible{opacity:1;transform:translate(-50%,0)}.word-stars{min-height:230px;position:relative;border-radius:16px;overflow:hidden;background:radial-gradient(circle at 50% 50%,#34657d33,transparent 58%),#071625;border:1px solid var(--line)}.center-orb{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid #86f6ea;border-radius:50%;padding:12px 15px;background:#123e52;color:#d9fff9;box-shadow:0 0 26px #71ded150;font-size:12px;font-weight:700}.star-word{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);background:#19364ed9;border:1px solid #8bcbda66;border-radius:100px;color:#c2f9f7;font-size:10px;padding:6px 9px;max-width:110px;overflow:hidden;text-overflow:ellipsis}.footnote{font-size:10px;color:var(--soft);margin-top:15px;line-height:1.65}.stat-note{font-size:12px;color:var(--sub);margin-top:12px}.install-alert{margin-top:14px;border:1px solid #7df3d42e;border-radius:12px;background:#48d9c016;padding:13px 15px;color:#abdae0;font-size:11px}.review-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.review-actions .button{padding:10px 6px;font-size:11px}.mobile-only{display:none}.loading-view{color:var(--sub);padding:70px;text-align:center}.select{appearance:auto}.callout{border:1px solid #7ce5d02c;border-radius:15px;background:#51d3c311;padding:15px 18px;color:#b9e8e2}.callout b{display:block;color:#c8f5f0;margin-bottom:5px}.result-box{border:1px solid var(--line);border-radius:14px;background:#0c2134;padding:16px;margin-top:15px}.result-box strong{color:#a1ebef}.result-box p{color:#b8d4e4;font-size:12px;margin-top:8px}.hidden{display:none!important}
@media(max-width:1120px){.rail{width:212px;flex-basis:212px}.content{padding:26px}.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-content{padding:35px 27px}}
@media(max-width:720px){.rail,.desktop-foot{display:none}.app-frame{display:block}.workspace{min-height:100dvh}.topbar{min-height:58px;padding:env(safe-area-inset-top,0px) 19px 0;box-sizing:content-box}.content{padding:22px 16px calc(100px + env(safe-area-inset-bottom,0px));}.bottom-nav{position:fixed;z-index:20;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(5,1fr);height:calc(69px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);border-top:1px solid #99dfde32;background:#0a1829e8;backdrop-filter:blur(22px);box-shadow:0 -15px 40px #0109157a}.bottom-nav button{border:0;border-top:2px solid transparent;background:transparent;color:#7e9eb4;font-size:9px;font-weight:700;display:grid;align-content:center;justify-items:center;gap:3px;padding:7px 2px;min-width:0}.bottom-nav button span{font-size:23px;line-height:1}.bottom-nav button.nav-active{color:#9cfbef;border-top-color:#7df8e9;background:linear-gradient(#5ee8d815,transparent)}.mini-stat{font-size:10px}.hero{display:block;min-height:0}.hero-content{padding:27px 23px 7px}.hero-content h1{font-size:35px}.hero-content p{font-size:12px}.soul-wrap{height:190px;min-height:190px}.soul-canvas{height:190px;max-width:280px}.soul-label{bottom:12px}.page-head{margin-bottom:18px}h1{font-size:32px}.panel{padding:18px;border-radius:18px}.grid-3,.grid-2,.detail-grid{grid-template-columns:1fr}.grid-4{gap:9px}.metric{padding:12px 13px}.metric-value{font-size:23px}.word-card{padding:16px}.grid-3.word-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.word-card b{font-size:19px}.scene-list{grid-template-columns:1fr 1fr;gap:8px}.scene{padding:13px}.review-actions{gap:5px}.review-actions .button{font-size:10px}.mobile-only{display:block}.section-title{margin:24px 0 13px}.section-title h2{font-size:19px}.panel-heading{align-items:start}.tag{font-size:8px}.search-bar{flex-wrap:wrap}.search-bar .button{width:100%}.toast{bottom:calc(82px + env(safe-area-inset-bottom,0px))}}
@media(max-width:385px){.content{padding-left:12px;padding-right:12px}.hero-content h1{font-size:31px}.grid-3.word-grid{grid-template-columns:1fr 1fr}.word-card b{font-size:17px}.topbar-title{font-size:9px;letter-spacing:1px}.button{padding:10px 13px}.hero-content{padding:25px 18px 5px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
