@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fredoka:wght@400;500;600;700&display=swap";:root{color-scheme:light;--ink: #24304a;--muted: #74809a;--line: rgba(36, 48, 74, .1);--paper: #fffdf9;--white: #ffffff;--cream: #fff7ed;--violet: #8059dc;--violet-dark: #5d3db0;--violet-soft: #f0eaff;--orange: #f59a45;--orange-dark: #c97022;--orange-soft: #fff0dc;--green: #45b887;--green-dark: #247d5b;--green-soft: #e7f8ef;--blue: #54a8d7;--blue-soft: #e6f4fc;--pink: #e87ba5;--pink-soft: #ffebf2;--gold: #eab83e;--shadow: 0 22px 55px rgba(52, 53, 97, .11);--shadow-small: 0 8px 24px rgba(52, 53, 97, .08);--radius-xl: 32px;--radius-lg: 24px;--radius-md: 18px;--radius-sm: 13px;--display: "Fredoka", "DM Sans", sans-serif;--body: "DM Sans", system-ui, sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;color:var(--ink);font-family:var(--body);background:radial-gradient(circle at 8% 5%,rgba(245,154,69,.16),transparent 25%),radial-gradient(circle at 92% 8%,rgba(128,89,220,.11),transparent 25%),linear-gradient(135deg,#fffaf4,#f7f7ff 55%,#f7fffb);line-height:1.5;-webkit-font-smoothing:antialiased}button,input{font:inherit}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;cursor:pointer;color:inherit}button:disabled{cursor:not-allowed;opacity:.6}button:focus-visible,input:focus-visible{outline:3px solid rgba(128,89,220,.28);outline-offset:3px}a{color:inherit}.app-shell{min-height:100vh;padding-bottom:92px}.app-main{width:min(1160px,calc(100% - 36px));margin:0 auto;padding:28px 0 42px}.page-stack{display:grid;gap:24px;animation:rise .35s ease both}.card{background:#ffffffe0;border:1px solid rgba(255,255,255,.85);box-shadow:var(--shadow);border-radius:var(--radius-xl);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.topbar{width:min(1160px,calc(100% - 36px));margin:18px auto 0;display:flex;align-items:center;justify-content:space-between;gap:20px}.topbar-app{position:sticky;top:14px;z-index:30;padding:10px 13px;background:#ffffffd6;border:1px solid rgba(255,255,255,.85);box-shadow:var(--shadow-small);border-radius:22px;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.brand{display:inline-flex;align-items:center;gap:11px;text-align:left;padding:0;background:transparent}.brand-mark{display:grid;place-items:center;width:43px;height:43px;border-radius:15px;color:var(--white);background:linear-gradient(145deg,var(--orange),#f47c5d);box-shadow:0 8px 18px #f59a4540;font-family:var(--display);font-size:1.3rem;font-weight:700}.brand-copy strong,.brand>span:last-child strong{display:block;font-family:var(--display);font-size:1.18rem;line-height:1;letter-spacing:-.03em}.brand-copy small,.brand>span:last-child small{display:block;margin-top:4px;color:var(--muted);font-size:.72rem;font-weight:600}.brand-large{align-self:flex-start}.brand-large .brand-mark{width:52px;height:52px;font-size:1.55rem;border-radius:18px}.brand-large>span:last-child strong{font-size:1.45rem}.topbar-actions{display:flex;align-items:center;gap:10px}.level-pill{display:flex;align-items:center;gap:7px;padding:9px 12px;border-radius:999px;background:var(--orange-soft);color:var(--orange-dark);font-size:.82rem;font-weight:700}.level-mini-bar{width:52px;height:7px;overflow:hidden;background:#f59a4538;border-radius:999px}.level-mini-bar i,.progress-track i,.big-progress-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--orange),#f8c064);transition:width .4s ease}.profile-chip{display:inline-flex;align-items:center;gap:7px;min-height:41px;padding:4px 10px 4px 5px;border-radius:999px;background:var(--white);box-shadow:var(--shadow-small);font-size:.82rem}.profile-chip span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--violet-soft);font-size:1.1rem}.profile-chip strong{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.icon-button{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:var(--white);color:var(--muted);box-shadow:var(--shadow-small);transition:.2s ease}.icon-button:hover{color:var(--violet-dark);transform:translateY(-2px)}.bottom-nav{position:fixed;z-index:40;bottom:16px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:4px;width:min(520px,calc(100% - 28px));padding:8px;border:1px solid rgba(255,255,255,.9);border-radius:24px;background:#ffffffe6;box-shadow:0 18px 45px #3435612e;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.bottom-nav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 4px;border-radius:17px;color:var(--muted);font-size:.68rem;font-weight:700;transition:.2s ease}.bottom-nav button:hover{color:var(--violet);background:var(--violet-soft)}.bottom-nav button.active{color:var(--violet-dark);background:var(--violet-soft)}.eyebrow{display:inline-flex;align-items:center;gap:6px;color:var(--violet-dark);font-size:.69rem;line-height:1;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.eyebrow:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}.eyebrow-violet{color:var(--violet-dark)}.eyebrow-orange{color:var(--orange-dark)}.eyebrow-green{color:var(--green-dark)}.mini-label{display:block;margin-bottom:5px;color:var(--muted);font-size:.68rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.page-title{position:relative;padding:8px 4px 0}.page-title h1{max-width:700px;margin:9px 0 5px;font:600 clamp(2.3rem,5vw,4rem)/.98 var(--display);letter-spacing:-.04em}.page-title p{max-width:630px;margin:0;color:var(--muted);font-size:1.03rem}.page-title .back-link{margin-bottom:16px}.section-header{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:16px}.section-header h2{margin:8px 0 4px;font:600 clamp(1.55rem,3vw,2rem)/1 var(--display);letter-spacing:-.03em}.section-header p{max-width:620px;margin:0;color:var(--muted);font-size:.92rem}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:11px 17px;border-radius:15px;font-weight:800;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.button:hover:not(:disabled){transform:translateY(-2px)}.button-primary{color:var(--white);background:linear-gradient(135deg,var(--violet),#9c76ed);box-shadow:0 13px 24px #8059dc40}.button-primary:hover:not(:disabled){box-shadow:0 17px 30px #8059dc4f}.button-light{color:var(--ink);background:var(--white);box-shadow:var(--shadow-small)}.button-light:hover:not(:disabled){background:#fffaf6}.button-ghost{color:var(--muted);background:transparent}.button-ghost:hover:not(:disabled){color:var(--violet-dark);background:#fff9}.button-wide{width:100%}.back-link{display:inline-flex;align-items:center;gap:7px;padding:0;background:transparent;color:var(--muted);font-size:.84rem;font-weight:800}.back-link:hover{color:var(--violet-dark)}.welcome-hero{display:grid;grid-template-columns:1.18fr .82fr;min-height:350px;overflow:hidden;background:linear-gradient(118deg,#fff0dc,#fffaf1 54%,#f3edff)}.hero-copy{padding:50px 38px 42px}.hero-copy h1{max-width:11ch;margin:17px 0 14px;font:600 clamp(2.8rem,6vw,5.1rem)/.92 var(--display);letter-spacing:-.055em}.hero-copy h1 span{display:inline-block;font-family:var(--body);font-size:.6em;transform:rotate(-8deg)}.hero-copy p{max-width:430px;margin:0;color:var(--muted);font-size:1.05rem}.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:27px}.hero-art{position:relative;min-height:350px;overflow:hidden;background:linear-gradient(145deg,#8059dc1f,#ffffff52)}.sun-shape{position:absolute;top:42px;right:50px;width:215px;height:215px;border-radius:50%;background:radial-gradient(circle,#ffcf79,#f8a556 64%,#f59a4514 65%)}.mascot{position:absolute;right:76px;bottom:69px;display:grid;place-items:center;width:165px;height:165px;border-radius:50%;background:#9a76e7;border:10px solid rgba(255,255,255,.66);box-shadow:0 17px 26px #8059dc47;font-size:7.3rem;transform:rotate(3deg)}.floating-star{position:absolute;color:var(--white);font-size:2.1rem;text-shadow:0 5px 15px rgba(128,89,220,.26);animation:float 3s ease-in-out infinite}.star-one{top:61px;left:74px;color:#f1bd47}.star-two{right:39px;bottom:164px;color:#fff;font-size:1.4rem;animation-delay:.7s}.hero-note{position:absolute;left:32px;bottom:27px;display:inline-flex;align-items:center;gap:7px;padding:9px 13px;color:var(--violet-dark);border-radius:999px;background:#fffc;font-size:.76rem;font-weight:800;box-shadow:var(--shadow-small)}.quick-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.quick-stat{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;padding:16px;border-radius:20px;background:#ffffffbf;border:1px solid rgba(255,255,255,.9);box-shadow:var(--shadow-small)}.quick-stat>span{grid-row:1 / 3;display:grid;place-items:center;width:42px;height:42px;border-radius:14px;font-size:1.28rem}.quick-stat strong{font:700 1.32rem/1 var(--display)}.quick-stat small{margin-top:4px;color:var(--muted);font-size:.72rem;font-weight:700}.quick-gold>span{background:#fff4d6}.quick-violet>span{background:var(--violet-soft)}.quick-orange>span{background:var(--orange-soft)}.quick-green>span{background:var(--green-soft)}.subject-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.subject-island{position:relative;min-height:260px;overflow:hidden;padding:27px;border-radius:27px;color:var(--white);text-align:left;box-shadow:var(--shadow);transition:transform .22s ease,box-shadow .22s ease}.subject-island:hover{transform:translateY(-4px);box-shadow:0 28px 45px #3435612e}.island-violet{background:linear-gradient(135deg,#7954d3,#9b7ae9)}.island-orange{background:linear-gradient(135deg,#ee913c,#f8bd5b)}.island-glow{position:absolute;top:-72px;right:-42px;width:220px;height:220px;border:38px solid rgba(255,255,255,.12);border-radius:50%}.island-icon{position:relative;display:grid;place-items:center;width:58px;height:58px;margin-bottom:22px;border-radius:18px;background:#ffffff2e;font-size:2rem}.island-subtitle{position:relative;display:block;margin-bottom:4px;color:#ffffffc4;font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.subject-island strong{position:relative;display:block;font:600 2rem/1 var(--display)}.subject-island p{position:relative;max-width:400px;margin:10px 0 22px;color:#ffffffdb;font-size:.9rem}.island-footer{position:relative;display:flex;justify-content:space-between;align-items:center;gap:12px}.island-footer small{color:#ffffffd1;font-weight:700}.island-footer span{display:inline-flex;align-items:center;gap:5px;padding:8px 11px;color:var(--ink);border-radius:999px;background:var(--white);font-size:.77rem;font-weight:800}.mission-card{display:flex;align-items:center;gap:17px;padding:20px 24px;background:linear-gradient(90deg,#fff7e9,#fff)}.mission-card>div:nth-child(2){flex:1}.mission-icon{display:grid;place-items:center;width:55px;height:55px;border-radius:17px;background:var(--orange-soft);font-size:1.75rem}.mission-card h2{margin:2px 0 3px;font:600 1.36rem/1 var(--display)}.mission-card p{margin:0;color:var(--muted);font-size:.84rem}.subject-progress{display:grid;grid-template-columns:auto minmax(120px,1fr) auto;align-items:center;gap:20px;padding:21px 25px}.subject-progress strong{display:block;font:600 1.6rem/1 var(--display)}.subject-progress strong small{color:var(--muted);font:700 .78rem var(--body)}.progress-track{height:12px;overflow:hidden;border-radius:999px;background:#eeeaf8}.progress-track i{background:linear-gradient(90deg,var(--violet),#b39af4)}.progress-message{color:var(--muted);font-size:.78rem;font-weight:700}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.feature-card{display:flex;flex-direction:column;align-items:flex-start;min-height:235px;padding:22px;border-radius:24px;text-align:left;transition:transform .2s ease,box-shadow .2s ease}.feature-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.feature-violet{color:var(--violet-dark);background:var(--violet-soft)}.feature-green{color:var(--green-dark);background:var(--green-soft)}.feature-orange{color:var(--orange-dark);background:var(--orange-soft)}.feature-icon{display:grid;place-items:center;width:54px;height:54px;margin-bottom:17px;border-radius:17px;background:#ffffffb3;font-size:1.8rem}.feature-tag{margin-bottom:6px;font-size:.62rem;font-weight:800;letter-spacing:.11em;opacity:.72}.feature-card strong{font:600 1.45rem/1 var(--display)}.feature-card p{flex:1;margin:9px 0 13px;color:#24304ab8;font-size:.82rem}.feature-action{display:inline-flex;align-items:center;gap:6px;font-size:.79rem;font-weight:800}.letter-preview{padding:24px}.letter-row{display:flex;flex-wrap:wrap;gap:8px}.letter-chip{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;color:var(--muted);background:#f7f6fb;font:600 1.15rem var(--display);transition:.2s ease}.letter-chip:hover,.letter-chip.seen{color:var(--white);background:var(--violet);transform:translateY(-2px)}.letter-chip.more{width:auto;padding:0 13px;color:var(--violet-dark);background:var(--violet-soft);font:800 .78rem var(--body)}.alphabet-layout{display:grid;grid-template-columns:1.25fr .75fr;align-items:start;gap:18px}.alphabet-board{padding:24px}.board-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.board-top strong{font:600 1.6rem/1 var(--display)}.chip{display:inline-flex;align-items:center;padding:8px 11px;border-radius:999px;font-size:.74rem;font-weight:800}.chip-soft{color:var(--violet-dark);background:var(--violet-soft)}.alphabet-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.alphabet-letter{position:relative;aspect-ratio:1;display:grid;place-items:center;border:2px solid #efecf8;border-radius:16px;color:var(--muted);background:#fff;font:600 clamp(1.2rem,3vw,1.8rem) var(--display);transition:.2s ease}.alphabet-letter:hover{border-color:#c5b4ef;color:var(--violet-dark);transform:translateY(-2px)}.alphabet-letter.selected{border-color:var(--violet);color:var(--white);background:var(--violet);box-shadow:0 10px 20px #8059dc38}.alphabet-letter.seen:not(.selected){color:var(--green-dark);border-color:#bdebd1;background:var(--green-soft)}.alphabet-letter>svg{position:absolute;top:5px;right:5px;color:var(--green)}.letter-detail{position:sticky;top:100px;padding:28px;text-align:center;background:linear-gradient(150deg,#f6f0ff,#fff)}.letter-big{display:flex;align-items:baseline;justify-content:center;gap:12px;margin:18px 0 8px;color:var(--violet-dark);font:600 7.2rem/.8 var(--display);letter-spacing:-.1em}.letter-big small{color:#b09be7;font-size:3.6rem}.letter-word-art{display:flex;align-items:center;justify-content:center;gap:10px;margin:24px 0 7px}.letter-word-art span{font-size:3.2rem}.letter-word-art strong{font:600 1.5rem var(--display)}.letter-detail>p{margin:0 0 19px;color:var(--muted);font-size:.86rem}.detail-divider{height:1px;margin:23px 0;background:var(--line)}.muted-copy{color:var(--muted)!important}.muted-copy strong{color:var(--ink)}.letter-detail .button-light{margin-top:10px}.category-tabs,.leaderboard-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:3px}.category-tabs button,.leaderboard-tabs button{flex:0 0 auto;padding:10px 14px;border-radius:999px;color:var(--muted);background:#ffffffbf;font-size:.78rem;font-weight:800;box-shadow:var(--shadow-small)}.category-tabs button.active,.leaderboard-tabs button.active{color:var(--white);background:var(--violet)}.discovery-layout{display:grid;grid-template-columns:1fr 280px;align-items:start;gap:18px}.discovery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.discovery-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:17px;min-height:155px;text-align:left;border:2px solid transparent;border-radius:20px;background:#ffffffd4;box-shadow:var(--shadow-small);transition:.2s ease}.discovery-card:hover,.discovery-card.selected{border-color:#b9a6e9;transform:translateY(-3px)}.discovery-card>span{align-self:center;margin:2px 0 12px;font-size:3.2rem}.discovery-card strong{font:600 1.12rem var(--display)}.discovery-card small{margin-top:3px;color:var(--muted);font-size:.67rem;font-weight:700}.discovery-card i{position:absolute;right:12px;bottom:13px;display:grid;place-items:center;width:27px;height:27px;border-radius:50%;color:var(--green-dark);background:var(--green-soft)}.discovery-aside{position:sticky;top:100px;min-height:340px;padding:24px;text-align:center}.aside-emoji,.aside-empty{display:grid;place-items:center;width:125px;height:125px;margin:25px auto 16px;border-radius:35px;background:var(--green-soft);font-size:5rem}.aside-empty{color:var(--violet);background:var(--violet-soft);font-size:3rem}.discovery-aside h2{margin:0 0 8px;font:600 1.75rem var(--display)}.discovery-aside p{margin:0 0 20px;color:var(--muted);font-size:.85rem}.game-page{display:grid;gap:17px;max-width:820px;margin:0 auto}.game-progress{display:flex;align-items:center;gap:13px;color:var(--muted);font-size:.74rem;font-weight:800}.game-progress>div{display:flex;flex:1;gap:5px}.game-progress i{flex:1;height:8px;border-radius:999px;background:#e9e7f1}.game-progress-violet i.done,.game-progress-violet i.current{background:var(--violet)}.game-progress-orange i.done,.game-progress-orange i.current{background:var(--orange)}.game-progress strong{color:var(--ink)}.game-card{min-height:470px;padding:31px}.game-instruction{display:flex;align-items:center;gap:13px}.game-number{display:grid;place-items:center;flex:none;width:39px;height:39px;border-radius:13px;color:var(--white);background:var(--violet);font-weight:800}.game-instruction h2{margin:3px 0 0;font:600 1.7rem var(--display)}.audio-bubble{display:grid;place-items:center;width:54px;height:54px;margin-left:auto;border-radius:50%;color:var(--white);background:var(--violet);box-shadow:0 10px 18px #8059dc38;transition:.2s ease}.audio-bubble:hover{transform:scale(1.05)}.listen-prompt{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:140px;margin:22px 0 17px;color:var(--violet);border-radius:22px;background:var(--violet-soft)}.listen-prompt p{margin:8px 0 0;color:var(--muted);font-size:.82rem;font-weight:700}.answer-grid{display:grid;gap:12px}.answer-grid-images{grid-template-columns:repeat(3,1fr)}.image-answer{position:relative;display:flex;flex-direction:column;align-items:center;padding:20px 10px 14px;border:2px solid #eeedf4;border-radius:20px;background:#fff;transition:.2s ease}.image-answer:hover{border-color:#c4b5ea;transform:translateY(-2px)}.image-answer>span{font-size:3.5rem}.image-answer strong{margin-top:10px;font:600 1.15rem var(--display)}.image-answer small{display:inline-flex;align-items:center;gap:4px;margin-top:7px;color:var(--muted);font-size:.68rem;font-weight:700}.image-answer.correct,.number-answer.correct{border-color:var(--green);background:var(--green-soft)}.image-answer.wrong,.number-answer.wrong{border-color:#e98c94;background:#fff0f0}.feedback-message{display:flex;align-items:center;gap:12px;margin-top:18px;padding:14px;border-radius:17px;background:var(--green-soft)}.feedback-message.is-wrong{background:#fff3ef}.feedback-message>span{font-size:1.7rem}.feedback-message>div{flex:1}.feedback-message strong,.feedback-message small{display:block}.feedback-message strong{font-size:.9rem}.feedback-message small{margin-top:2px;color:var(--muted);font-size:.72rem}.feedback-message .button{min-height:38px;padding:8px 11px;font-size:.74rem}.math-question-card{text-align:center}.math-prompt{display:flex;align-items:center;justify-content:center;gap:11px}.math-prompt h2{margin:0;font:600 1.8rem var(--display)}.math-prompt .game-number{background:var(--orange)}.math-visual{min-height:105px;display:grid;place-items:center;margin:24px 0 12px;padding:15px;border-radius:20px;background:var(--orange-soft);font-size:2.4rem;letter-spacing:5px}.math-expression{margin:26px 0 18px;font:600 3.1rem/1 var(--display);letter-spacing:.03em}.answer-grid-numbers{grid-template-columns:repeat(4,1fr);max-width:530px;margin:0 auto}.number-answer{min-height:75px;border:2px solid #f0e4d5;border-radius:18px;color:var(--orange-dark);background:#fff;font:600 2rem var(--display);transition:.2s ease}.number-answer:hover{border-color:var(--orange);transform:translateY(-2px)}.round-result{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:405px;text-align:center}.round-confetti{font-size:4.2rem}.round-result h2{margin:13px 0 7px;font:600 2.4rem var(--display)}.round-result h2 strong{color:var(--orange-dark)}.round-result p{margin:0;color:var(--muted)}.stars-row{display:flex;gap:7px;margin:17px 0 25px;color:var(--gold)}.math-summary{display:flex;align-items:center;gap:17px;padding:23px;background:linear-gradient(120deg,#fff2dd,#fffdf7)}.math-summary-icon{display:grid;place-items:center;width:64px;height:64px;border-radius:20px;background:var(--orange-soft);font-size:2.1rem}.math-summary h2{margin:0 0 2px;font:600 1.55rem var(--display)}.math-summary p{margin:0;color:var(--muted);font-size:.82rem}.math-summary-score{margin-left:auto;text-align:center}.math-summary-score strong,.math-summary-score small{display:block}.math-summary-score strong{font:600 2rem var(--display)}.math-summary-score small{color:var(--muted);font-size:.7rem;font-weight:800}.math-module-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.math-module{position:relative;min-height:185px;padding:21px;border-radius:22px;text-align:left;overflow:hidden;transition:.2s ease}.math-module:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.math-module>span{display:block;margin-bottom:10px;font-size:2rem}.math-module>small{display:block;margin-bottom:4px;font-size:.62rem;font-weight:800;letter-spacing:.1em;opacity:.7}.math-module strong{display:block;font:600 1.5rem var(--display)}.math-module p{max-width:310px;margin:7px 0 17px;color:#24304ab3;font-size:.81rem}.math-module i{display:inline-flex;align-items:center;gap:6px;font-size:.75rem;font-weight:800;font-style:normal}.module-orange{color:var(--orange-dark);background:var(--orange-soft)}.module-green{color:var(--green-dark);background:var(--green-soft)}.module-pink{color:#b7547c;background:var(--pink-soft)}.module-sky{color:#347fa9;background:var(--blue-soft)}.tip-card{display:flex;gap:10px;align-items:center;padding:15px 18px;border:1px dashed #e6c98e;border-radius:17px;background:#fffaf0;color:var(--orange-dark)}.tip-card span{font-size:1.35rem}.tip-card p{margin:0;font-size:.82rem}.tip-card strong{font-weight:800}.progress-hero{display:flex;align-items:center;gap:23px;padding:27px;background:linear-gradient(125deg,#f2ebff,#fff)}.progress-mascot{display:grid;place-items:center;width:110px;height:110px;border-radius:32px;background:var(--violet);font-size:4.8rem}.progress-hero-copy{flex:1}.progress-hero-copy h2{margin:9px 0 13px;font:600 2.3rem var(--display)}.big-progress-track{height:13px;overflow:hidden;border-radius:999px;background:#e7defa}.big-progress-track i{background:linear-gradient(90deg,var(--violet),#b197ef)}.progress-hero-copy p{margin:8px 0 0;color:var(--muted);font-size:.8rem}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.stat-card{display:flex;flex-direction:column;align-items:flex-start;gap:5px;padding:18px}.stat-card>span{font-size:1.45rem}.stat-card strong{font:600 1.8rem/1 var(--display)}.stat-card small{color:var(--muted);font-size:.73rem;font-weight:700}.progress-details{padding:24px}.grade-list{display:grid;gap:8px}.grade-list>div{display:grid;grid-template-columns:28px 45px 1fr auto;align-items:center;gap:10px;padding:11px 13px;border-radius:14px;background:#fbfafc}.grade-list span{display:grid;place-items:center;width:27px;height:27px;border-radius:9px;color:var(--muted);background:#f0eef6;font-size:.73rem;font-weight:800}.grade-list strong{color:var(--violet-dark);font:600 1.3rem var(--display)}.grade-list small{color:var(--muted);font-size:.76rem}.grade-list svg{color:var(--gold)}.reward-banner{display:flex;align-items:center;justify-content:space-between;padding:24px 30px;background:linear-gradient(120deg,#fff0dc,#fffaf3)}.reward-banner h2{margin:10px 0 4px;font:600 1.8rem var(--display)}.reward-banner p{margin:0;color:var(--muted)}.reward-banner>div:last-child{font-size:5rem}.reward-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.reward-card{min-height:185px;padding:20px}.reward-card>span{display:grid;place-items:center;width:55px;height:55px;margin-bottom:12px;border-radius:17px;background:var(--violet-soft);font-size:1.8rem}.reward-card strong{display:block;font:600 1.18rem var(--display)}.reward-card p{margin:5px 0 12px;color:var(--muted);font-size:.78rem}.reward-card small{display:inline-flex;align-items:center;gap:3px;color:var(--green-dark);font-size:.7rem;font-weight:800}.reward-card.locked{filter:grayscale(.75);opacity:.62}.reward-card.locked>span{background:#f1f1f4}.leaderboard-tabs{max-width:510px}.leaderboard-tabs button{flex:1;min-width:160px}.podium{display:flex;justify-content:center;align-items:flex-end;gap:22px;min-height:260px;padding:25px 20px 0;background:linear-gradient(135deg,#fff9ed,#f7f2ff)}.podium-place{display:flex;flex-direction:column;align-items:center;text-align:center}.podium-place>span{font-size:2rem}.podium-place strong{margin-top:5px;font:600 1.05rem var(--display)}.podium-place small{color:var(--muted);font-size:.68rem;font-weight:700}.podium-place>div{display:grid;place-items:center;width:92px;margin-top:11px;border-radius:18px 18px 0 0;font-size:2.4rem;background:#f5d681}.place-1>div{height:105px;background:#f4c451}.place-2>div{height:75px;background:#dfe4ed}.place-3>div{height:53px;background:#eab587}.leaderboard-list{display:grid;gap:5px;padding:12px}.leaderboard-list>div{display:grid;grid-template-columns:28px 36px 1fr auto;align-items:center;gap:10px;padding:10px;border-radius:14px}.leaderboard-list>div.is-current{background:var(--violet-soft)}.rank{color:var(--muted);font-weight:800;text-align:center}.leader-avatar{display:grid;place-items:center;width:35px;height:35px;border-radius:50%;background:#f5f1ff}.leaderboard-list strong{font-size:.86rem}.leaderboard-list strong small{margin-left:7px;color:var(--violet);font-size:.66rem}.leaderboard-list>div>span:last-child{color:var(--muted);font-size:.72rem;font-weight:700}.profile-card{display:flex;align-items:center;gap:18px;padding:28px;background:linear-gradient(125deg,#f2ebff,#fff)}.profile-avatar{display:grid;place-items:center;width:95px;height:95px;border-radius:28px;background:var(--violet);font-size:4rem}.profile-card h2{margin:10px 0 2px;font:600 2rem var(--display)}.profile-card p{margin:0;color:var(--muted)}.profile-list{display:grid;gap:1px;padding:7px}.profile-list>div{display:grid;grid-template-columns:25px 1fr auto;align-items:center;gap:10px;padding:15px;color:var(--muted);border-bottom:1px solid var(--line);font-size:.84rem}.profile-list>div:last-child{border-bottom:0}.profile-list svg{color:var(--violet)}.profile-list strong{color:var(--ink)}.profile-ok{display:inline-flex;align-items:center;gap:3px;color:var(--green-dark);font-size:.7rem;font-weight:800}.danger-button{color:#b85661;justify-self:start}.empty-state{display:flex;flex-direction:column;align-items:center;padding:35px 10px;text-align:center}.empty-state>span{font-size:2rem}.empty-state strong{margin-top:7px;font:600 1.25rem var(--display)}.empty-state p{max-width:320px;margin:5px 0 0;color:var(--muted);font-size:.8rem}.toast{position:fixed;right:24px;bottom:96px;z-index:70;display:flex;align-items:center;gap:9px;max-width:min(390px,calc(100% - 32px));padding:13px 16px;border-radius:15px;color:var(--green-dark);background:var(--green-soft);box-shadow:0 15px 34px #247d5b2e;font-size:.8rem;font-weight:700;animation:toast-in .25s ease both}.toast-error{color:#a84f59;background:#fff0f0}.toast-info{color:var(--violet-dark);background:var(--violet-soft)}.auth-shell{position:relative;display:grid;grid-template-columns:.95fr 1.05fr;align-items:center;gap:clamp(30px,8vw,110px);width:min(1120px,calc(100% - 48px));min-height:100vh;margin:0 auto;padding:45px 0;overflow:hidden}.auth-shell:before{content:"";position:absolute;z-index:-1;top:4%;right:10%;bottom:4%;left:10%;border-radius:55px;background:#ffffff57}.auth-orb{position:fixed;z-index:-2;border-radius:50%;filter:blur(1px)}.auth-orb-one{top:-120px;left:-100px;width:360px;height:360px;background:#ffe7c8}.auth-orb-two{right:-100px;bottom:-120px;width:430px;height:430px;background:#e5dcff}.auth-intro{padding:28px}.auth-mascot{display:grid;place-items:center;width:135px;height:135px;margin:72px 0 24px;border-radius:42px;background:linear-gradient(145deg,var(--violet),#b095ec);box-shadow:0 24px 44px #8059dc38;font-size:6rem;transform:rotate(-5deg)}.auth-intro h1{max-width:10ch;margin:18px 0 15px;font:600 clamp(2.8rem,5vw,4.8rem)/.92 var(--display);letter-spacing:-.06em}.auth-intro p{max-width:420px;margin:0;color:var(--muted);font-size:1rem}.auth-points{display:grid;gap:7px;margin-top:26px;color:var(--violet-dark);font-size:.78rem;font-weight:800}.auth-card{align-self:center;max-width:480px;width:100%;padding:38px}.auth-card h2{margin:15px 0 5px;font:600 2.25rem/1 var(--display);letter-spacing:-.04em}.auth-copy{margin:0;color:var(--muted);font-size:.88rem}.auth-actions{display:grid;gap:10px;margin-top:27px}.demo-link{display:block;margin:23px auto 0;padding:4px;color:var(--muted);background:transparent;font-size:.76rem;font-weight:700;text-decoration:underline;text-underline-offset:3px}.auth-form{display:grid;gap:15px;margin-top:24px}.field{display:grid;gap:7px;color:var(--ink);font-size:.76rem;font-weight:800}.field input{width:100%;min-height:49px;padding:12px 14px;border:1px solid #e8e5ed;border-radius:14px;color:var(--ink);background:#ffffffde;transition:.2s ease}.field input::placeholder{color:#afb4c1}.field input:focus{border-color:#b9a6e9;box-shadow:0 0 0 4px #8059dc1a;outline:none}.password-wrap{position:relative}.password-wrap input{padding-right:45px}.password-wrap button{position:absolute;top:50%;right:7px;display:grid;place-items:center;width:34px;height:34px;transform:translateY(-50%);color:var(--muted);border-radius:9px;background:transparent}.password-wrap button:hover{color:var(--violet);background:var(--violet-soft)}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.form-hint{margin:-2px 0 3px;color:var(--muted);font-size:.7rem}.form-error{padding:11px 13px;border-radius:12px;color:#a84f59;background:#fff0f0;font-size:.77rem;font-weight:700}.spin{animation:spin 1s linear infinite}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes toast-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(8deg)}}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 900px){.welcome-hero{grid-template-columns:1fr}.hero-copy{padding-bottom:30px}.hero-art{min-height:240px}.sun-shape{top:24px;right:25%;width:170px;height:170px}.mascot{right:31%;bottom:32px;width:130px;height:130px;font-size:5.5rem}.hero-note{left:22px;bottom:18px}.alphabet-layout,.discovery-layout{grid-template-columns:1fr}.letter-detail,.discovery-aside{position:static}.discovery-aside{min-height:auto}.discovery-grid{grid-template-columns:repeat(3,1fr)}.feature-grid{grid-template-columns:repeat(2,1fr)}.feature-card:last-child{grid-column:1 / -1}}@media (max-width: 700px){.app-main{width:min(100% - 24px,560px);padding-top:20px}.topbar{width:calc(100% - 24px);margin-top:10px}.topbar-app{padding:8px 9px;border-radius:18px}.brand-copy small{display:none}.level-pill{padding:8px}.level-pill span{display:none}.level-mini-bar{width:42px}.profile-chip strong{display:none}.profile-chip{padding-right:5px}.quick-strip{grid-template-columns:repeat(2,1fr)}.subject-grid,.math-module-grid,.reward-grid{grid-template-columns:1fr}.subject-island{min-height:240px}.mission-card{align-items:flex-start;flex-wrap:wrap}.mission-card>div:nth-child(2){min-width:calc(100% - 75px)}.mission-card>.button{margin-left:72px}.subject-progress{grid-template-columns:1fr auto;gap:8px 15px}.subject-progress .progress-track{grid-column:1 / -1;grid-row:2}.progress-message{grid-column:1 / -1}.feature-grid{grid-template-columns:1fr}.feature-card:last-child{grid-column:auto}.alphabet-grid{grid-template-columns:repeat(5,1fr);gap:7px}.alphabet-letter{border-radius:13px}.letter-detail{padding:23px}.discovery-grid{grid-template-columns:repeat(2,1fr)}.discovery-card{min-height:145px}.game-card{padding:20px 15px}.game-instruction h2{font-size:1.35rem}.answer-grid-images{grid-template-columns:repeat(3,1fr);gap:7px}.image-answer{padding:12px 5px 10px;border-radius:15px}.image-answer>span{font-size:2.4rem}.image-answer strong{font-size:.83rem}.image-answer small{font-size:.58rem}.feedback-message{flex-wrap:wrap}.feedback-message .button{margin-left:auto}.math-expression{font-size:2.4rem}.number-answer{min-height:62px}.progress-hero{align-items:flex-start;padding:20px}.progress-mascot{width:76px;height:76px;border-radius:23px;font-size:3.4rem}.progress-hero-copy h2{font-size:1.7rem}.stats-grid{grid-template-columns:repeat(2,1fr)}.stat-card{padding:15px}.podium{gap:9px;padding-left:7px;padding-right:7px}.podium-place>div{width:78px}.leaderboard-list>div{grid-template-columns:23px 33px 1fr auto;gap:7px}.profile-card{padding:21px}.profile-avatar{width:75px;height:75px;border-radius:22px;font-size:3.2rem}.profile-card h2{font-size:1.55rem}.bottom-nav{bottom:9px;width:calc(100% - 16px)}.bottom-nav button{font-size:.6rem}.bottom-nav button svg{width:18px;height:18px}.toast{right:12px;bottom:76px}.auth-shell{display:block;width:min(100% - 24px,500px);padding:22px 0 35px}.auth-shell:before{top:3%;right:0;bottom:3%;left:0}.auth-intro{padding:10px 12px 25px}.auth-mascot{width:88px;height:88px;margin:31px 0 18px;border-radius:28px;font-size:4rem}.auth-intro h1{max-width:12ch;margin:14px 0 10px;font-size:2.85rem}.auth-intro p{font-size:.9rem}.auth-points{display:flex;flex-wrap:wrap;gap:5px 13px;font-size:.69rem}.auth-card{padding:25px 20px}.auth-card h2{font-size:2rem}.brand-large>span:last-child strong{font-size:1.25rem}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;transition-duration:.001ms!important}}.topbar-app{border-radius:26px;background:#fffffff0;box-shadow:0 12px 30px #4369971f}.brand-mark{color:#fff;background:linear-gradient(145deg,#1646a0,#3e9ddd);box-shadow:0 8px 18px #205baa3b}.brand-copy strong{color:#143c85;font-size:1.35rem}.back-button{min-height:46px;padding:9px 15px 9px 11px;border-radius:17px;color:#14519c;background:#e4f4ff;box-shadow:0 8px 18px #3789cb24;transition:transform .2s ease,background .2s ease,box-shadow .2s ease}.back-button:hover{color:#0b3472;background:#d2edff;box-shadow:0 11px 22px #3789cb33;transform:translate(-2px)}.back-button span{font-size:.8rem}.auth-mascot{overflow:hidden;background:linear-gradient(145deg,#bfeaff,#e8f7ff)}.auth-mascot img{width:145%;height:145%;object-fit:contain;filter:drop-shadow(0 16px 13px rgba(38,76,124,.2))}.hero-art{background:linear-gradient(145deg,#c9efff,#eafaff 48%,#f9f2ff)}.mascot{overflow:visible;width:220px;height:220px;border:0;background:transparent;box-shadow:none;font-size:0}.mascot img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 20px 15px rgba(38,76,124,.22))}.progress-mascot{overflow:hidden;background:linear-gradient(145deg,#c7efff,#eaf8ff)}.progress-mascot img{width:125%;height:125%;object-fit:contain;filter:drop-shadow(0 12px 10px rgba(38,76,124,.16))}.math-module-grid-first{margin-top:-4px}.math-module{min-height:205px;border:3px solid rgba(255,255,255,.75);box-shadow:0 12px 25px #46587814}.math-module strong{color:#123b82}.math-module p{color:#60708d}.game-page .page-title{padding-top:0}.game-page .game-card{margin-top:0}.leaderboard-empty{min-height:260px;display:grid;place-items:center}@media (max-width: 700px){.brand-copy strong{font-size:1.12rem}.back-button{min-height:42px;padding:8px 12px 8px 9px}.back-button span{display:none}.mascot{right:20%;bottom:28px;width:165px;height:165px}.math-module{min-height:175px}}