@import "https://fonts.googleapis.com/css2?family=Kiwi+Maru:wght@400;500;700&family=Nunito:wght@600;700;800;900&display=swap";:root{color:#293c59;font-synthesis:none;background:#eff8ff;font-family:Kiwi Maru,Hiragino Maru Gothic ProN,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button{font:inherit;cursor:pointer;border:0}button:focus-visible{outline-offset:3px;outline:3px solid #366be7}.app-shell{background:radial-gradient(circle at 78% 0,#d8f1ff 0,#0000 25%),#f6fbff;min-height:100vh;display:flex}.sidebar{background:#fff;border-right:1px solid #e8f0f7;flex-direction:column;width:234px;padding:30px 16px 18px;display:flex}.brand{color:#3151a5;align-items:center;gap:9px;padding:4px 12px 35px;font-family:Nunito,sans-serif;font-size:20px;font-weight:900;line-height:1.05;display:flex}.brand-star{color:#ffbd3e;text-shadow:0 3px #f49b35;font-size:29px}nav{gap:8px;display:grid}.nav-button{text-align:left;color:#69809e;background:0 0;border-radius:15px;align-items:center;gap:16px;padding:13px 16px;font-size:14px;font-weight:700;display:flex}.nav-button span{text-align:center;width:22px;font-family:Nunito;font-size:22px}.nav-button.active{color:#3770ce;background:#e8f6ff}.side-bottom{background:#f5f9fd;border-radius:18px;align-items:center;gap:10px;margin-top:auto;padding:12px;display:flex}.mini-avatar{background:#ffdc82;border-radius:50%;place-items:center;width:34px;height:34px;display:grid}.side-bottom strong,.side-bottom small{font-size:12px;display:block}.side-bottom small{color:#7890ac;margin-top:2px}.content{width:min(1180px,100vw - 234px);margin:0 auto;padding:30px 42px 45px}.topbar{justify-content:space-between;align-items:center;margin-bottom:25px;display:flex}.topbar h1{letter-spacing:.02em;margin:2px 0 0;font-size:27px}.eyeline{color:#7890ac;margin:0;font-size:12px}.top-actions{align-items:center;gap:12px;display:flex}.grade-picker{color:#536d8c;background:#fff;border-radius:12px;padding:11px 14px;font-size:13px;box-shadow:0 5px 15px #c3d4e344}.points{color:#f19b2d;background:#fff5d9;border-radius:12px;padding:10px 16px;font-family:Nunito;font-weight:900}.points span{color:#f9ba3a;margin-right:6px;font-size:17px}.welcome-card{color:#fff;background:linear-gradient(105deg,#7666e8,#6b9cea 68%,#7cc5f0);border-radius:30px;min-height:272px;padding:40px 46px;position:relative;overflow:hidden;box-shadow:0 18px 33px #7597d642}.welcome-card p{opacity:.9;margin:0 0 5px;font-size:14px}.welcome-card h2{margin:0 0 22px;font-size:31px;line-height:1.45}.primary{color:#664219;background:#ffbd3e;border-radius:14px;padding:14px 19px;font-weight:800;box-shadow:0 5px #df9132}.primary span{padding-left:10px;font-size:20px}.hero-character{object-fit:contain;filter:drop-shadow(0 16px 9px #3554a659);width:250px;height:290px;position:absolute;bottom:-44px;right:110px}.sparkles{color:#ffe77c;font-size:28px;line-height:2;position:absolute;top:35px;right:33px}.dash-grid{grid-template-columns:1.35fr .8fr;gap:18px;margin:20px 0;display:grid}.daily-card,.bonus-card,.friends-preview,.streak-card{background:#fff;border-radius:23px;box-shadow:0 7px 24px #bad1e933}.daily-card{padding:21px 24px}.section-head{justify-content:space-between;align-items:center;display:flex}.section-head h2{margin:0;font-size:17px}.sky-label{color:#4f9fd0;background:#e7f6ff;border-radius:9px;padding:5px 9px;font-size:11px;font-weight:700}.progress-row{align-items:center;gap:16px;margin-top:18px;display:flex}.ring{text-align:center;color:#3770ce;border:8px solid #e8f3ff;border-radius:50%;place-content:center;width:68px;height:68px;display:grid}.ring strong{font-family:Nunito;font-size:21px;line-height:.9}.ring small{color:#7890ac;font-size:10px}.progress-row strong{font-size:14px}.progress-row p{color:#7890ac;margin:3px 0 9px;font-size:11px}.bar{background:#e9f2fa;border-radius:10px;min-width:150px;height:8px;overflow:hidden}.bar i{border-radius:inherit;background:linear-gradient(90deg,#69c8ef,#7374e9);width:0;height:100%;display:block}.bonus-card{background:#fffdf2;align-items:center;gap:15px;padding:20px;display:flex}.bonus-icon{color:#f9bc45;font-size:38px}.bonus-card p{color:#778aa1;margin:0;font-size:11px}.bonus-card h2{color:#e99328;margin:2px 0;font-family:Nunito;font-size:25px}.bonus-card h2 small{font-family:Kiwi Maru;font-size:11px}.bonus-card button{color:#d28325;background:#fff0c9;border-radius:8px;padding:7px 9px;font-size:11px;font-weight:700}.lower-grid{grid-template-columns:1fr 220px;gap:18px;display:grid}.friends-preview{padding:21px 24px}.text-button{color:#4b8ad9;background:0 0;font-size:12px;font-weight:700}.friend-strip{justify-content:space-between;margin-top:13px;display:flex}.friend-mini{text-align:center;font-size:12px}.friend-mini>div{border-radius:17px;width:76px;height:68px;margin:auto;overflow:hidden}.friend-mini img{object-fit:contain;width:100%;height:100%;transform:translateY(7px)scale(1.15)}.friend-mini strong,.friend-mini small{display:block}.friend-mini small{color:#7890ac;margin-top:2px;font-size:9px}.streak-card{text-align:center;color:#804d32;background:linear-gradient(135deg,#ffdf7d,#ffbe8a);padding:20px}.streak-card p{margin:0;font-size:12px}.streak-card strong{font-family:Nunito;font-size:52px;line-height:1}.streak-card strong span{font-family:Kiwi Maru;font-size:13px}.streak-card div{letter-spacing:4px;margin:4px 0;font-size:12px}.streak-card small{font-size:9px}.challenge-layout{grid-template-columns:minmax(0,1fr) 245px;gap:20px;display:grid}.question-pane{background:#fff;border-radius:28px;padding:25px 34px;box-shadow:0 7px 24px #bad1e933}.challenge-progress{color:#6e88a5;align-items:center;gap:13px;font-size:12px;display:flex}.challenge-progress .bar{flex:1}.question-card{text-align:center;padding:42px 0 15px;position:relative}.question-card>img{object-fit:contain;width:130px;height:130px;position:absolute;top:-7px;left:3%}.speech{color:#516a88;background:#f3f7ff;border-radius:14px;max-width:180px;padding:9px 13px;font-size:11px;position:absolute;top:15px;left:15%}.unit{color:#599fd7;background:#e6f6ff;border-radius:30px;padding:5px 13px;font-size:12px;display:inline-block}.question-card h2{color:#354b72;margin:13px 0 30px;font-family:Nunito;font-size:57px}.answer-grid{grid-template-columns:repeat(3,1fr);gap:14px;max-width:470px;margin:auto;display:grid}.answer-grid button{color:#425d85;background:#f5f9fd;border-radius:17px;padding:16px 8px;font-family:Nunito;font-size:28px;font-weight:900;box-shadow:0 5px #d6e5f1}.answer-grid button:hover{background:#e3f5ff}.answer-grid button.correct{color:#216e37;background:#91dc9c;box-shadow:0 5px #62b970}.answer-grid button.wrong{color:#9e3f3f;background:#ffb6af;box-shadow:0 5px #df837a}.next-button{color:#fff;background:#607be0;border-radius:12px;margin-top:23px;padding:12px 20px;font-weight:700}.challenge-side{gap:18px;display:grid}.challenge-side>div{background:#fff;border-radius:22px;padding:22px;box-shadow:0 7px 24px #bad1e933}.egg{float:right;font-size:38px}.challenge-side h3{margin:8px 0;font-size:15px}.challenge-side p{color:#748aa4;font-size:11px}.hint{background:#fff9e9!important}.hint span{font-size:26px}.hint button{color:#976826;background:#ffe49c;border-radius:9px;padding:8px 11px;font-size:11px;font-weight:700}.result-card,.collection,.shop,.settings{background:#fff;border-radius:28px;padding:34px;box-shadow:0 7px 24px #bad1e933}.result-card{text-align:center;max-width:650px;margin:30px auto}.result-card>span{font-size:50px}.result-card p{color:#7088a3}.result-card h2{font-size:34px}.result-score{justify-content:center;gap:36px;margin:27px 0;display:flex}.result-score div{display:grid}.result-score strong{color:#526cd2;font-family:Nunito;font-size:26px}.result-score small{color:#8497ad;font-size:10px}.collection-intro{border-bottom:1px solid #edf2f6;justify-content:space-between;align-items:center;gap:15px;padding-bottom:24px;display:flex}.collection-intro h2{margin:0;font-size:22px}.collection-intro p{color:#7389a4;font-size:12px}.collection-grid{grid-template-columns:repeat(5,1fr);gap:14px;margin-top:25px;display:grid}.character-card{text-align:center;border:1px solid #e4eef6;border-radius:17px;padding:12px}.character-card>div{border-radius:13px;height:125px;overflow:hidden}.character-card img{object-fit:contain;width:100%;height:100%;transform:translateY(11px)scale(1.15)}.character-card h3{margin:10px 0 2px}.character-card p{color:#8193a8;margin:0 0 10px;font-size:10px}.character-card .bar{min-width:0;height:6px}.locked img{filter:brightness(0)opacity(.24)}.locked>div{background:#ecf1f5!important}.shop-banner{color:#73462f;background:linear-gradient(105deg,#ffb766,#ffcb7c);border-radius:20px;justify-content:space-between;align-items:center;padding:25px 32px;display:flex}.shop-banner p{margin:0;font-size:12px}.shop-banner h2{margin:3px 0 0;font-size:26px}.shop-banner span{filter:drop-shadow(0 5px #e99a60);font-size:65px}.shop-grid{grid-template-columns:repeat(3,1fr);gap:17px;margin:23px 0;display:grid}.shop-item{border:1px solid #e5eef6;border-radius:18px;grid-template-columns:105px 1fr;align-items:center;gap:11px;padding:12px;display:grid}.shop-item>div:first-child{border-radius:14px;height:110px;overflow:hidden}.shop-item img{object-fit:contain;width:100%;height:100%;transform:translateY(10px)scale(1.15)}.shop-item p{color:#df8e32;margin:0;font-size:10px}.shop-item h2{margin:2px 0 10px;font-size:18px}.shop-item button{color:#a97022;background:#fff0c9;border-radius:8px;padding:8px;font-size:10px;font-weight:700}.shop-item button:disabled{color:#8da0b1;background:#edf2f6}.shop-points{text-align:right;color:#7088a3;font-size:13px}.shop-points strong{color:#e3932f}.settings{max-width:600px}.settings h2{margin-top:0}.settings>div{border-bottom:1px solid #edf2f6;padding:17px 0}.settings p{font-size:13px;font-weight:700}.settings button{color:#3472c6;background:#e9f5ff;border-radius:9px;padding:10px 12px;font-size:12px}.settings label{color:#677f9c;font-size:12px}.modal-backdrop{z-index:5;background:#243d6199;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal{text-align:center;background:#fff;border-radius:25px;width:min(430px,100%);padding:35px;position:relative;box-shadow:0 15px 45px #20334f66}.close{color:#8295a7;background:0 0;font-size:24px;position:absolute;top:10px;right:13px}.modal h2{font-size:21px}.modal p{color:#69809c;font-size:13px;line-height:1.8}.modal-star{color:#ffc347;font-size:45px}.grade-options{grid-template-columns:repeat(3,1fr);gap:9px;margin-top:18px;display:grid}.grade-options button{color:#4d79b3;background:#f0f8ff;border-radius:10px;padding:10px 5px;font-size:12px}.grade-options button:hover{background:#d6efff}@media (width<=900px){.sidebar{width:76px;padding:20px 9px}.brand{padding:3px 12px 30px;font-size:0}.brand-star{font-size:30px}.nav-button{justify-content:center;padding:13px}.nav-button:not(.active){font-size:0}.nav-button span{font-size:23px}.nav-button.active{font-size:0}.side-bottom{justify-content:center;padding:8px}.side-bottom div+div{display:none}.content{width:calc(100vw - 76px);padding:25px}.collection-grid{grid-template-columns:repeat(3,1fr)}.shop-grid{grid-template-columns:1fr 1fr}}@media (width<=650px){.app-shell{display:block}.sidebar{z-index:4;border-top:1px solid #e2edf5;border-right:0;width:100%;height:68px;padding:7px 6px;display:block;position:fixed;bottom:0}.brand,.side-bottom{display:none}nav{justify-content:space-around;display:flex}.nav-button,.nav-button.active{background:0 0;padding:7px 8px;font-size:0}.nav-button.active span{color:#3770ce}.content{width:100%;padding:19px 16px 88px}.topbar{margin-bottom:18px}.topbar h1{font-size:21px}.top-actions{gap:7px}.grade-picker{padding:9px;font-size:11px}.points{padding:9px 10px;font-size:13px}.welcome-card{min-height:250px;padding:28px}.welcome-card h2{font-size:25px}.hero-character{width:205px;right:-13px}.dash-grid,.lower-grid,.challenge-layout{grid-template-columns:1fr}.bonus-card{padding:16px}.friend-mini>div{width:58px;height:57px}.streak-card{display:none}.question-pane{padding:18px}.question-card>img{width:100px;left:-10px}.speech{padding:7px;font-size:9px;top:10px;left:17%}.question-card h2{margin-top:25px;font-size:43px}.challenge-side{grid-template-columns:1fr 1fr}.challenge-side>div{padding:15px}.collection,.shop,.settings{padding:21px}.collection-intro{display:block}.collection-intro .primary{margin-top:10px}.collection-grid{grid-template-columns:repeat(2,1fr)}.shop-grid{grid-template-columns:1fr}.shop-item{grid-template-columns:90px 1fr}.result-score{gap:13px}.result-score strong{font-size:20px}}
