@import "https://fonts.googleapis.com/css2?family=Quicksand:wght@400..700&family=Nunito:wght@400..800&family=Noto+Sans+SC:wght@300..900&display=swap";:root{--bg-app:linear-gradient(135deg, #fdfbfb 0%, #ebedee 100%);--bg-card:#ffffffd9;--bg-hover:#fff9ebe6;--color-pink:#ff9cbd;--color-pink-hover:#ff85aa;--color-pink-shadow:#e67395;--color-blue:#8bcaff;--color-blue-hover:#72beff;--color-blue-shadow:#5a9ed6;--color-mint:#9beac5;--color-mint-hover:#82e0b6;--color-mint-shadow:#6ac49b;--color-yellow:#ffec99;--color-yellow-hover:#ffe47a;--color-yellow-shadow:#e6c85c;--color-lilac:#dcc2ff;--color-lilac-hover:#cdabff;--color-lilac-shadow:#b38fe6;--color-orange:#ffc494;--color-orange-hover:#ffb175;--color-orange-shadow:#e6985c;--text-dark:#2d3748;--text-medium:#718096;--text-light:#a0aec0;--text-white:#fff;--border-color:#ffffff80;--border-radius-bubble:32px;--border-radius-card:28px;--border-radius-button:24px;--border-radius-badge:16px;--shadow-card:0 8px 32px #1f268712, inset 0 0 0 1px #fffc;--shadow-card-hover:0 12px 40px #1f26871a, inset 0 0 0 1px #fff;--shadow-bubble:0 4px 12px #0000000d, inset 0 0 0 1px #fff9;--transition-bounce:all .4s cubic-bezier(.175, .885, .32, 1.275);--transition-smooth:all .25s ease-in-out;--font-kids:"Quicksand", "Nunito", "Noto Sans SC", system-ui, -apple-system, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-kids);background-color:var(--bg-app);color:var(--text-dark);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;overflow-x:hidden}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bg-app);border-radius:10px}::-webkit-scrollbar-thumb{background:var(--color-blue);border:3px solid var(--bg-app);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--color-blue-hover)}.app-container{flex-direction:column;max-width:1200px;min-height:100vh;margin:0 auto;padding:20px;display:flex;position:relative}.app-header{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--border-radius-bubble);border:2px solid var(--border-color);box-shadow:var(--shadow-bubble);background:#ffffffb3;justify-content:space-between;align-items:center;margin-bottom:24px;padding:10px 16px;display:flex}.logo{color:var(--color-pink);cursor:pointer;transition:var(--transition-bounce);align-items:center;gap:10px;font-size:24px;font-weight:700;text-decoration:none;display:flex}.logo:hover{transform:scale(1.05)rotate(-2deg)}.header-actions{align-items:center;gap:16px;display:flex}.stat-badge{background:var(--bg-card);border:2px solid var(--border-color);border-radius:var(--border-radius-badge);color:var(--text-dark);box-shadow:0 4px 0 var(--border-color);align-items:center;gap:8px;padding:8px 16px;font-size:16px;font-weight:700;display:flex}.stat-badge.gold{border-color:var(--color-yellow);color:var(--color-orange-hover);box-shadow:0 4px 0 var(--color-yellow-shadow);background:#fffdf0}.main-content{flex-direction:column;flex:1;display:flex}.btn-bubble{font-family:var(--font-kids);border-radius:var(--border-radius-button);cursor:pointer;-webkit-user-select:none;user-select:none;transition:var(--transition-bounce);border:2px solid #ffffff80;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-size:18px;font-weight:700;text-decoration:none;display:inline-flex;position:relative;top:0}.btn-bubble:active{transform:translateY(4px)}.btn-pink{background-color:var(--color-pink);color:var(--text-white);box-shadow:0 6px 0 var(--color-pink-shadow), 0 8px 15px #ff8fb133;border-color:#ffeef2}.btn-pink:hover{background-color:var(--color-pink-hover);box-shadow:0 8px 0 var(--color-pink-shadow), 0 10px 20px #ff8fb14d;transform:translateY(-2px)}.btn-pink:active{box-shadow:0 2px 0 var(--color-pink-shadow);transform:translateY(4px)}.btn-blue{background-color:var(--color-blue);color:var(--text-white);box-shadow:0 6px 0 var(--color-blue-shadow), 0 8px 15px #7dc4ff33;border-color:#ebf6ff}.btn-blue:hover{background-color:var(--color-blue-hover);box-shadow:0 8px 0 var(--color-blue-shadow), 0 10px 20px #7dc4ff4d;transform:translateY(-2px)}.btn-blue:active{box-shadow:0 2px 0 var(--color-blue-shadow);transform:translateY(4px)}.btn-mint{background-color:var(--color-mint);color:var(--text-white);box-shadow:0 6px 0 var(--color-mint-shadow), 0 8px 15px #8ce7bb33;border-color:#f0fdf4}.btn-mint:hover{background-color:var(--color-mint-hover);box-shadow:0 8px 0 var(--color-mint-shadow), 0 10px 20px #8ce7bb4d;transform:translateY(-2px)}.btn-mint:active{box-shadow:0 2px 0 var(--color-mint-shadow);transform:translateY(4px)}.btn-yellow{background-color:var(--color-yellow);color:var(--text-dark);box-shadow:0 6px 0 var(--color-yellow-shadow), 0 8px 15px #ffe48333;border-color:#fffbeb}.btn-yellow:hover{background-color:var(--color-yellow-hover);box-shadow:0 8px 0 var(--color-yellow-shadow), 0 10px 20px #ffe4834d;transform:translateY(-2px)}.btn-yellow:active{box-shadow:0 2px 0 var(--color-yellow-shadow);transform:translateY(4px)}.btn-lilac{background-color:var(--color-lilac);color:var(--text-white);box-shadow:0 6px 0 var(--color-lilac-shadow), 0 8px 15px #d3b3ff33;border-color:#faf5ff}.btn-lilac:hover{background-color:var(--color-lilac-hover);box-shadow:0 8px 0 var(--color-lilac-shadow), 0 10px 20px #d3b3ff4d;transform:translateY(-2px)}.btn-lilac:active{box-shadow:0 2px 0 var(--color-lilac-shadow);transform:translateY(4px)}.btn-secondary{background-color:var(--bg-card);color:var(--text-medium);border-color:var(--border-color);box-shadow:0 6px 0 var(--border-color), 0 8px 15px #00000005}.btn-secondary:hover{background-color:var(--bg-hover);color:var(--text-dark);box-shadow:0 8px 0 var(--border-color), 0 10px 20px #0000000a;transform:translateY(-2px)}.btn-secondary:active{box-shadow:0 2px 0 var(--border-color);transform:translateY(4px)}.bubble-card{background:var(--bg-card);-webkit-backdrop-filter:blur(20px);border-radius:var(--border-radius-card);border:2px solid var(--border-color);box-shadow:var(--shadow-card);transition:var(--transition-bounce);padding:24px}.bubble-card:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-4px)}@keyframes pop-sparkle{0%{opacity:0;transform:scale(0)}50%{opacity:1;transform:scale(1.2)}to{opacity:0;transform:scale(1)}}.sparkle{pointer-events:none;animation:.6s ease-out forwards pop-sparkle;position:absolute}@keyframes float-ambient{0%{transform:translateY(0)rotate(0)}50%{transform:translateY(-20px)rotate(5deg)}to{transform:translateY(0)rotate(0)}}.ambient-shape{z-index:-1;opacity:.6;pointer-events:none;animation:6s ease-in-out infinite float-ambient;position:fixed}.shape-1{font-size:40px;animation-duration:8s;animation-delay:0s;top:10%;left:5%}.shape-2{font-size:50px;animation-duration:7s;animation-delay:1s;top:15%;right:8%}.shape-3{font-size:35px;animation-duration:9s;animation-delay:2s;bottom:20%;left:10%}.shape-4{font-size:60px;animation-duration:10s;animation-delay:3s;bottom:10%;right:15%}.word-clickable{cursor:pointer;transition:var(--transition-smooth);border-radius:8px;margin:0 1px;padding:2px 4px;display:inline-block}.word-clickable:hover{background:var(--color-yellow);color:var(--text-dark);transform:scale(1.08)translateY(-1px)}.word-reading-active{background:var(--color-blue);box-shadow:0 4px 0 var(--color-blue-shadow);transform:scale(1.05);color:var(--text-white)!important}.sentence-highlight{background:#7dc4ff26;border-radius:12px;padding:4px 8px}