:root{font-family:Inter,Segoe UI,Arial,sans-serif;color:#24243b;background:#f7f8fc;font-synthesis:none;font-weight:400;--purple:#7455eb;--purple-dark:#5539bc;--mint:#bdf4dc;--orange:#ffb88b;--ink:#24243b;--muted:#77788c;--border:#e9e8f0;--shadow:0 15px 45px #35305b08}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button:disabled{cursor:default;opacity:.48}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #a697ef;outline-offset:4px}h1,h2,h3,p{margin:0}button{touch-action:manipulation}#app{min-height:100vh}.app-shell{position:relative;isolation:isolate;overflow:clip;min-height:100vh}.app-header,.app-footer,.page-container{width:min(1160px,calc(100% - 64px));margin-inline:auto}.app-header{height:100px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--border)}.brand{display:flex;align-items:center;gap:10px;font-size:28px;font-weight:850;letter-spacing:-1.5px}.brand-dot{color:var(--purple)}.brand-mark{width:38px;height:38px;display:grid;place-content:center;position:relative;border-radius:12px;background:var(--purple);color:#fff;font-size:29px;letter-spacing:-5px;padding-right:6px;transform:rotate(-7deg)}.brand-mark span{position:absolute;right:5px;top:-3px;color:var(--mint)}.header-caption{font-size:13px;color:var(--muted)}.language-pill{display:flex;gap:9px;align-items:center;font-size:12px;font-weight:750;background:#fff;padding:11px 16px;border:1px solid var(--border);border-radius:99px}.live-dot{height:7px;width:7px;border-radius:50%;background:#35af7c}.muted{color:var(--muted)}.ambient{position:absolute;z-index:-1;pointer-events:none;filter:blur(65px);border-radius:50%;opacity:.32}.ambient-one{height:350px;width:350px;top:20px;right:-200px;background:#dfd1ff}.ambient-two{height:300px;width:300px;top:500px;left:-210px;background:#c8f5e8}.page-container{padding-block:36px 60px;min-height:calc(100vh - 180px)}.app-footer{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--border);padding-block:24px;font-size:12px;color:var(--muted)}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--purple-dark);font-size:11px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase}.eyebrow:before{content:"";width:20px;height:2px;background:currentColor}.page-title{font-size:clamp(30px,4.3vw,48px);line-height:1.13;letter-spacing:-1.9px;font-weight:800}.description{color:var(--muted);font-size:14px;line-height:1.8;max-width:520px}.heading-row{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:26px}.heading-row .page-title{margin-block:12px}.tag{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:8px 12px;border-radius:99px;background:#f0ecff;color:var(--purple-dark)}.tag.mint{background:#e2f9ef;color:#277453}.tag.white{background:#ffffff26;color:#fff}.section-label{font-size:11px;color:var(--muted);font-weight:750;letter-spacing:1.2px;text-transform:uppercase}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:13px 19px;border-radius:13px;border:1px solid transparent;font-size:13px;font-weight:700;transition:transform .2s,background .2s,box-shadow .2s}.button:hover:not(:disabled){transform:translateY(-2px)}.button.primary{background:var(--purple);color:#fff;box-shadow:0 6px 15px #7455eb20}.button.secondary{background:#fff;border-color:var(--border);color:var(--ink)}.button.soft{background:#eee9ff;color:var(--purple-dark)}.button.green{background:#d3f5e4;color:#246b4c;border-color:#c2ebd7}.button.white{background:#fff;color:var(--purple-dark)}.back-link{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin-bottom:26px}.back-link:hover{color:var(--purple)}.grid{display:grid;gap:20px}.state{background:#fff;border:1px solid var(--border);border-radius:24px;text-align:center;padding:60px 24px;display:grid;justify-items:center;gap:18px;color:var(--muted)}.state h2{font-size:22px;color:var(--ink)}.spinner{width:30px;height:30px;border:3px solid #ece7ff;border-top-color:var(--purple);border-radius:50%;animation:spin .8s linear infinite}.skeleton-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.skeleton{height:220px;border-radius:24px;background:linear-gradient(100deg,#eeedf4 20%,#f9f9fc,#eeedf4 80%);background-size:200% 100%;animation:shimmer 1.8s infinite}.book-grid{grid-template-columns:repeat(3,1fr)}.book-card{--accent:#7455eb;--tint:#eee9ff;position:relative;overflow:hidden;background:#fff;border:1px solid var(--border);border-radius:24px;padding:24px;box-shadow:var(--shadow);transition:transform .25s,box-shadow .25s,border-color .25s;animation:rise-in .5s both;animation-delay:var(--delay,0ms)}.book-card:hover{transform:translateY(-6px);border-color:var(--accent);box-shadow:0 16px 35px #35305b12}.book-art{height:150px;border-radius:17px;background:var(--tint);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;margin-bottom:22px}.mini-book{width:83px;height:112px;border-radius:4px 13px 13px 4px;background:var(--accent);color:#fff;position:relative;box-shadow:9px 10px #ffffffa6,14px 18px 26px #25234418;transform:rotate(-9deg);transition:transform .35s;display:flex;flex-direction:column;justify-content:space-between;padding:12px}.mini-book:before{content:"";position:absolute;inset:0 auto 0 7px;width:1px;background:#fff5}.mini-book small{font-size:6px;letter-spacing:.5px;padding-left:5px;line-height:1.5}.mini-book strong{font-size:41px;line-height:1;padding-left:5px}.mini-book span{font-size:6px;padding-left:5px;letter-spacing:1px}.book-card:hover .mini-book{transform:rotate(0) translateY(-5px)}.art-circle{position:absolute;height:90px;width:90px;border:1px solid var(--accent);border-radius:50%;opacity:.15;left:22px;top:30px}.art-dots{position:absolute;right:23px;bottom:25px;color:var(--accent);font-size:21px;letter-spacing:4px;opacity:.5}.book-card h2{font-size:20px;letter-spacing:-.5px;margin-bottom:7px}.book-card .description{font-size:12px;line-height:1.6}.card-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:20px;gap:10px}.arrow-circle{display:grid;place-content:center;width:34px;height:34px;border-radius:50%;background:var(--tint);color:var(--accent);transition:transform .2s}.book-card:hover .arrow-circle{transform:translate(3px)}.hero{border-radius:28px;background:#eae5ff;position:relative;overflow:hidden;padding:38px 40px;display:grid;grid-template-columns:1.3fr 1fr;gap:24px;margin-bottom:42px;min-height:280px}.hero h1{margin-block:15px 16px}.hero h1 em{font-style:normal;color:var(--purple)}.hero .description{max-width:410px}.hero-art{position:relative;min-height:210px;display:grid;place-items:center}.hero-orbit{position:absolute;width:230px;height:230px;border-radius:50%;border:1px dashed #b8a5ef;animation:spin 50s linear infinite}.hero-orbit:after{content:"";height:12px;width:12px;background:var(--orange);border-radius:50%;position:absolute;left:25px;top:22px}.hero-book{height:165px;width:122px;background:var(--purple);border-radius:6px 20px 20px 6px;color:#fff;padding:22px;transform:rotate(-12deg);box-shadow:12px 14px #c5b8ef;animation:float 6s ease-in-out infinite;position:relative}.hero-book:before{content:"";position:absolute;left:9px;top:0;bottom:0;width:1px;background:#fff4}.hero-book small{font-size:8px;letter-spacing:1px}.hero-book strong{display:block;font-size:43px;letter-spacing:-3px;margin-block:12px 2px}.hero-book span{font-size:9px;line-height:1.4;display:block}.floating-label{position:absolute;z-index:2;padding:10px 14px;background:#fff;border-radius:13px;box-shadow:0 10px 24px #4431780d;font-size:12px;font-weight:700;animation:float 5s ease-in-out infinite}.floating-label.one{left:0;top:22px;transform:rotate(-5deg)}.floating-label.two{right:0;bottom:21px;animation-delay:-2s;background:var(--mint);color:#286547}.hero-star{position:absolute;right:35px;top:10px;font-size:36px;color:#ef9b69}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.section-heading h2{font-size:22px;letter-spacing:-.7px}.section-heading span{font-size:12px;color:var(--muted)}.tip-banner{display:flex;align-items:center;gap:15px;padding:19px 24px;margin-top:26px;border-radius:18px;background:#fff3df;color:#795e32;font-size:13px;line-height:1.7}.tip-icon{font-size:22px}.unit-grid{grid-template-columns:repeat(3,1fr)}.unit-card{background:#fff;border:1px solid var(--border);border-radius:22px;padding:24px;box-shadow:var(--shadow);animation:rise-in .4s both;animation-delay:var(--delay,0ms)}.unit-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.unit-number{height:44px;width:44px;display:grid;place-content:center;border-radius:13px;background:#eee9ff;color:var(--purple);font-size:17px;font-weight:800}.unit-card h2{font-size:19px;letter-spacing:-.5px;margin-bottom:9px}.unit-meta{font-size:12px;color:var(--muted);line-height:1.6}.unit-actions{display:flex;gap:9px;margin-top:22px}.unit-actions .button{flex:1;padding:11px 10px;min-height:42px;font-size:12px}.compact-page{max-width:820px}.study-top{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.study-top .back-link{margin:0}.study-progress{background:#fff;padding:21px 24px;border:1px solid var(--border);border-radius:19px;margin:24px 0 20px}.progress-caption{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:12px;margin-bottom:12px}.progress-track{height:7px;border-radius:20px;background:#efedf6;overflow:hidden}.progress-fill{height:100%;border-radius:inherit;background:var(--purple);transition:width .4s ease}.progress-fill.green{background:#4cb88a}.flashcard{background:#fff;border:1px solid var(--border);box-shadow:var(--shadow);border-radius:28px;padding:28px;text-align:center;position:relative;overflow:hidden}.flashcard.marked{border-color:#81d1aa}.flashcard-top{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted);gap:12px}.word-stage{padding:45px 10px 35px;position:relative}.word-stage:before{content:"";position:absolute;height:130px;width:130px;border:1px solid #efeafb;border-radius:50%;top:15px;left:calc(50% - 65px);pointer-events:none}.word-stage h2{position:relative;font-size:clamp(39px,7vw,65px);letter-spacing:-2px;line-height:1.2;overflow-wrap:anywhere}.word-stage .section-label{display:block;margin-bottom:15px;position:relative}.word-stage .pronunciation{color:var(--muted);font-size:16px;margin-top:10px}.word-details{text-align:left;margin-top:26px;padding-top:26px;border-top:1px solid var(--border)}.word-details h3{color:var(--purple-dark);font-size:23px;line-height:1.5;margin:9px 0 24px}.word-details p{font-size:14px;line-height:1.8;margin-top:8px}.example-box{margin-top:22px;border-radius:17px;padding:20px;background:#f7f5fe;border-left:3px solid #c9baf4}.learn-button{margin-top:24px;width:100%}.study-navigation{display:flex;justify-content:space-between;gap:12px;margin-top:20px}.study-navigation .button{min-width:135px}.storage-note{text-align:center;font-size:11px;color:var(--muted);line-height:1.8;margin-top:20px}.error-note{padding:14px;border-radius:12px;background:#fff0ed;color:#a13d3d;font-size:13px;margin-top:16px}.success-note{padding:22px;border-radius:20px;background:#dff7eb;color:#256e4d;line-height:1.7;margin-top:20px;font-size:14px}.success-note h3{font-size:17px;margin-bottom:5px}.word-swap-enter-active{transition:opacity .18s,transform .18s}.word-swap-enter-from{opacity:0;transform:translateY(6px)}.quiz-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:18px 20px;background:#fff;border:1px solid var(--border);border-radius:19px;margin:25px 0 20px}.quiz-toolbar label{font-size:12px;font-weight:700}.quiz-toolbar select{padding:10px 35px 10px 12px;border:1px solid var(--border);border-radius:10px;background:#f8f7fc;color:var(--ink);max-width:100%;font-size:13px}.quiz-toolbar .muted{font-size:11px;margin-left:auto}.quiz-card{background:#fff;padding:30px;border:1px solid var(--border);border-radius:26px;box-shadow:var(--shadow)}.quiz-card h2{font-size:25px;line-height:1.5;letter-spacing:-.7px;margin:26px 0}.quiz-options{border:0;padding:0;margin:0;min-width:0;display:grid;gap:12px}.quiz-option{display:flex;align-items:center;gap:13px;border:1px solid var(--border);border-radius:15px;padding:16px;position:relative;cursor:pointer;transition:background .2s,border-color .2s}.quiz-option input{position:absolute;opacity:0;width:1px;height:1px}.quiz-option:has(input:focus-visible){outline:3px solid #a697ef;outline-offset:3px}.quiz-option.selected{border-color:var(--purple);background:#f4f0ff}.option-letter{display:grid;place-content:center;flex-shrink:0;width:30px;height:30px;background:#f4f4f8;border-radius:9px;font-size:12px;font-weight:700;color:var(--muted)}.selected .option-letter{background:var(--purple);color:#fff}.option-text{font-size:14px;line-height:1.6;overflow-wrap:anywhere}.answer-label{display:grid;gap:12px;font-size:12px;font-weight:700}.answer-input{width:100%;padding:18px;border:1px solid var(--border);border-radius:14px;background:#faf9fd;font-size:18px;color:var(--ink)}.check-button{width:100%;margin-top:24px}.feedback{padding:20px;border-radius:15px;margin-top:22px;font-size:14px;line-height:1.8}.feedback.correct{background:#e2f8ec;color:#246b4c}.feedback.incorrect{background:#fff0e8;color:#9a5230}.feedback p{margin-top:5px}.result-card{text-align:center;padding:45px 30px;background:#fff;border:1px solid var(--border);border-radius:28px}.result-ring{--score:0;display:grid;place-items:center;width:155px;height:155px;margin:0 auto 25px;border-radius:50%;background:conic-gradient(var(--purple) calc(var(--score)*1%),#eee9fa 0);position:relative}.result-ring:before{content:"";position:absolute;inset:9px;background:#fff;border-radius:50%}.result-ring strong{position:relative;font-size:39px;letter-spacing:-2px}.result-card h2{font-size:28px;margin-bottom:14px}.result-stats{display:flex;justify-content:center;gap:35px;margin-block:28px}.result-stats strong{font-size:24px;display:block;margin-bottom:6px}.result-stats span{font-size:12px;color:var(--muted)}.result-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.page-enter-active,.page-leave-active{transition:opacity .18s,transform .18s}.page-enter-from{opacity:0;transform:translateY(10px)}.page-leave-to{opacity:0;transform:translateY(-5px)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{to{background-position:-200% 0}}@keyframes rise-in{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@keyframes float{0%,to{translate:0 0}50%{translate:0 -9px}}@media(min-width:1500px){.page-container{padding-top:45px}.hero{min-height:310px}.book-art{height:165px}}@media(max-width:900px){.hero{padding:30px;grid-template-columns:1.15fr 1fr}.floating-label.one{left:-10px}.floating-label.two{right:-15px}.book-grid,.unit-grid,.skeleton-grid{grid-template-columns:repeat(2,1fr)}.header-caption{display:none}.hero .page-title{font-size:36px}}@media(max-width:600px){.app-header,.app-footer,.page-container{width:calc(100% - 32px)}.app-header{height:78px}.brand{font-size:25px}.brand-mark{width:34px;height:34px}.language-pill{font-size:10px;padding:9px 12px}.page-container{padding-top:24px}.hero{padding:26px;grid-template-columns:1fr;gap:5px;margin-bottom:30px;border-radius:23px}.hero .page-title{font-size:37px;max-width:360px}.hero-art{min-height:185px;margin-top:4px}.hero-book{scale:.78}.hero-orbit{width:185px;height:185px}.floating-label.one{left:5px;top:35px;font-size:10px}.floating-label.two{right:0;bottom:27px;font-size:10px}.hero-star{right:25px;top:12px}.description{font-size:13px}.section-heading h2{font-size:19px}.book-grid,.unit-grid{gap:13px}.book-card{padding:14px;border-radius:19px}.book-art{height:125px;margin-bottom:16px;border-radius:13px}.mini-book{scale:.8}.art-dots{right:9px;bottom:12px}.art-circle{left:0;width:75px;height:75px}.book-card h2{font-size:18px}.book-card .description{font-size:11px}.card-bottom{margin-top:15px}.card-bottom .tag{font-size:9px;padding:6px 8px}.arrow-circle{width:27px;height:27px}.unit-grid{grid-template-columns:1fr}.unit-card{padding:22px}.unit-actions .button{font-size:13px}.heading-row{align-items:start;flex-direction:column;gap:12px}.heading-row .page-title{font-size:32px}.tip-banner{padding:17px;font-size:12px}.app-footer{flex-direction:column;gap:8px;font-size:11px}.study-top .button{font-size:11px;padding:10px 12px;min-height:40px}.study-progress{padding:17px}.flashcard{padding:21px 18px}.word-stage{padding-block:38px 30px}.study-navigation .button{min-width:0;flex:1;padding:13px 10px;font-size:12px}.quiz-toolbar{gap:10px;padding:15px}.quiz-toolbar .muted{margin-left:0;width:100%}.quiz-card{padding:22px 18px}.quiz-card h2{font-size:21px}.quiz-option{padding:13px}.quiz-toolbar select{flex:1;min-width:0}.result-card{padding:32px 20px}.result-actions .button{width:100%}.section-heading span{font-size:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}.language-picker{gap:7px;padding:8px 10px}.language-picker select{max-width:170px;min-width:90px;border:0;background:transparent;color:#5d478f;font:inherit;cursor:pointer;padding:3px}.language-picker select:focus-visible{outline:2px solid #8a6ae4;outline-offset:4px;border-radius:5px}.language-notice,.preview-banner,.preview-panel{max-width:1160px;margin:16px auto;padding:18px 22px;border-radius:20px;background:#fff6df;border:1px solid #ebdcb7;line-height:1.6}.preview-banner{display:flex;align-items:center;justify-content:space-between;gap:18px}.preview-banner p{margin:4px 0 0;font-size:13px;color:#7b6748}.preview-panel summary{cursor:pointer;font-weight:700}.preview-form{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.preview-form input{min-width:160px;flex:1;border:1px solid #d7c8a4;border-radius:12px;padding:12px;font:inherit;background:#fff}html:lang(hi),html:lang(zh-Hans){letter-spacing:normal}html:lang(hi) body{font-family:Nirmala UI,Noto Sans Devanagari,Mangal,sans-serif}html:lang(zh-Hans) body{font-family:Microsoft YaHei,PingFang SC,Noto Sans CJK SC,sans-serif}html:lang(hi) .page-title,html:lang(hi) h1,html:lang(zh-Hans) .page-title,html:lang(zh-Hans) h1{letter-spacing:normal;line-height:1.4}@media(max-width:600px){.app-header{gap:12px;flex-wrap:wrap;height:auto;min-height:90px;padding-block:18px}.language-picker{margin-left:auto}.language-picker select{max-width:105px;min-width:74px}.preview-banner,.preview-panel,.language-notice{margin:12px 16px}.preview-banner{align-items:flex-start;flex-direction:column}}
