@import"https://fonts.googleapis.com/css2?family=Caveat:wght@500;700&family=Quicksand:wght@400;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{background:#fff8e1;font-family:Quicksand,system-ui,sans-serif;color:#5d4954;min-height:100vh;display:flex;justify-content:center;padding:12px}#root{width:100%;max-width:480px}.app-container{position:relative;padding:16px 12px 80px;min-height:100vh}.cloud-badge{position:absolute;top:8px;right:8px;font-size:11px;color:#8b7783;background:#ffffffb3;padding:2px 10px;border-radius:30px 12px;box-shadow:0 2px 8px #ff6b9d1a;letter-spacing:.3px}.cloud-loading{display:flex;align-items:center;gap:8px;justify-content:center;padding:40px 0;font-size:15px;color:#8b7783}.cloud-spinner{width:20px;height:20px;border:3px solid #FFD3E0;border-top-color:#ff6b9d;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.toast{position:fixed;top:16px;left:50%;transform:translate(-50%);background:#ffd3e0;color:#5d4954;padding:10px 24px;border-radius:30px 12px;box-shadow:0 6px 20px #ff6b9d33;font-weight:600;font-size:14px;z-index:999;white-space:nowrap}.header{text-align:center;margin-bottom:20px}.title{font-family:Caveat,cursive;font-size:30px;color:#5d4954;transform:rotate(-1deg);margin-bottom:12px}.nav-tabs{display:flex;gap:8px;justify-content:center}.nav-tab{background:transparent;border:none;padding:8px 20px;font-size:15px;font-weight:600;color:#8b7783;cursor:pointer;border-radius:30px 12px;transition:all .2s;font-family:Quicksand,sans-serif}.nav-tab.active{background:#ffd3e0;color:#5d4954;box-shadow:0 4px 12px #ff6b9d26}.nav-tab:hover{background:#ffe8ee}.ai-banner{text-align:center;padding:10px 16px;background:#c5f1d7;border-radius:30px 12px;font-size:14px;font-weight:600;color:#3a6b4f;margin-bottom:16px;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.progress-bar-bg{width:100%;height:8px;background:#f5e6d3;border-radius:20px;overflow:hidden;margin-bottom:6px}.progress-bar-fill{height:100%;background:linear-gradient(90deg,#ffd3e0,#ff6b9d);border-radius:20px;transition:width .4s ease}.progress-text{text-align:center;font-size:13px;color:#8b7783;margin-bottom:16px;font-weight:600}.word-card{position:relative;background:#fff;border-radius:30px 12px;padding:32px 20px 28px;box-shadow:0 4px 16px #ff6b9d1f;margin-bottom:20px;overflow:hidden;transform:rotate(.5deg);transition:transform .3s ease}.word-card:hover{transform:rotate(0)}.card-deco{position:absolute;top:-10px;right:-10px;width:100px;height:100px;pointer-events:none}.tape{position:absolute;top:-4px;left:50%;transform:translate(-50%) rotate(-2deg);width:60px;height:14px;background:linear-gradient(90deg,#ffd3e0b3,#c5f1d7b3);border-radius:2px;opacity:.7}.word-main{font-size:32px;font-weight:700;color:#5d4954;text-align:center;letter-spacing:1px;margin-bottom:8px}.word-meaning{font-size:20px;font-weight:600;color:#ff6b9d;text-align:center;margin-bottom:12px}.word-example{font-size:14px;color:#8b7783;text-align:center;font-style:italic;line-height:1.5;padding:0 4px}.btn-group{display:flex;gap:12px;justify-content:center;margin-bottom:16px}.btn{display:inline-flex;align-items:center;gap:6px;border:none;padding:12px 28px;font-size:16px;font-weight:700;font-family:Quicksand,sans-serif;cursor:pointer;border-radius:30px 12px;transition:all .2s;box-shadow:0 4px 12px #0000000f}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-known{background:linear-gradient(135deg,#c5f1d7,#a8e6c0);color:#2d5a3e}.btn-known:hover:not(:disabled){box-shadow:0 6px 20px #c5f1d780;transform:translateY(-1px)}.btn-unknown{background:linear-gradient(135deg,#ffd3e0,#ffb8cb);color:#7a3a4a}.btn-unknown:hover:not(:disabled){box-shadow:0 6px 20px #ffd3e080;transform:translateY(-1px)}.btn-refresh{background:#d6e8fa;color:#3a5a7a;display:block;margin:0 auto;padding:10px 24px;font-size:14px}.btn-refresh:hover:not(:disabled){box-shadow:0 6px 20px #d6e8fa80}.btn.small{padding:8px 18px;font-size:13px}.btn-danger{background:#ffe0e0;color:#b34a4a}.btn-danger:hover{background:#ffd0d0}.finish-card{text-align:center;background:#fff;border-radius:30px 12px;padding:40px 20px;box-shadow:0 4px 16px #ff6b9d1f;transform:rotate(-.5deg)}.finish-icon{margin-bottom:12px}.finish-card h2{font-size:22px;color:#5d4954;margin-bottom:12px;font-family:Caveat,cursive}.finish-stats{font-size:16px;color:#8b7783;margin-bottom:8px}.finish-stats strong{color:#5d4954}.finish-tip{font-size:14px;color:#ff6b9d;margin-bottom:20px}.wordbook-page{padding-bottom:20px}.wordbook-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.wordbook-header h2{font-family:Caveat,cursive;font-size:24px;color:#5d4954}.wordbook-count{font-size:16px;color:#8b7783;font-family:Quicksand,sans-serif}.wordbook-list{display:flex;flex-direction:column;gap:10px}.wordbook-item{background:#fff;border-radius:20px 8px;padding:14px 16px;box-shadow:0 2px 8px #ff6b9d14;transform:rotate(.3deg);transition:transform .2s}.wordbook-item:hover{transform:rotate(0)}.wordbook-word{font-size:18px;font-weight:700;color:#5d4954}.wordbook-meaning{font-size:14px;color:#ff6b9d;font-weight:600;margin:2px 0 4px}.wordbook-example{font-size:12px;color:#8b7783;font-style:italic}.empty-state{text-align:center;padding:60px 0}.empty-state svg{margin-bottom:12px}.empty-text{font-size:15px;color:#8b7783;font-weight:600}.footer{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;display:flex;justify-content:space-between;align-items:center;padding:12px 16px 14px;background:#fff8e1eb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-top:1px solid rgba(255,211,224,.3);font-size:12px;color:#8b7783}.footer-cloud{opacity:.7}@media (max-width: 400px){.word-main{font-size:26px}.btn{padding:10px 20px;font-size:14px}.title{font-size:26px}}