:root{--primary-color: #10b981;--primary-hover: #059669;--secondary-color: #06b6d4;--secondary-hover: #0891b2;--bg-gradient: linear-gradient(135deg, #022c22 0%, #064e3b 50%, #0f766e 100%);--card-bg: #ffffff;--text-main: #1e293b;--text-muted: #64748b;--correct-color: #10b981;--wrong-color: #ef4444;--shadow-sm: 0 4px 6px rgba(0, 0, 0, .05);--shadow-lg: 0 20px 40px rgba(0, 0, 0, .3);--radius-lg: 30px;--radius-md: 20px}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-gradient);color:#f8fafc;min-height:100vh;overflow-x:hidden}.bg-decorations{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;overflow:hidden}.bg-item{position:absolute;font-size:2.5rem;opacity:.12;animation:floatAround 12s infinite ease-in-out}.item-1{top:12%;left:8%;animation-delay:0s}.item-2{top:22%;right:10%;animation-delay:2s}.item-3{bottom:18%;left:12%;animation-delay:4s}.item-4{bottom:12%;right:8%;animation-delay:6s}.item-5{top:48%;left:4%;animation-delay:8s}.item-6{top:58%;right:6%;animation-delay:10s}@keyframes floatAround{0%,to{transform:translateY(0) rotate(0) scale(1)}50%{transform:translateY(-20px) rotate(15deg) scale(1.1)}}.app-container{display:flex;flex-direction:column;min-height:100vh;max-width:600px;margin:0 auto;padding:0 16px;position:relative;z-index:1}.app-header{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-bottom:2px dashed rgba(248,250,252,.2)}.logo{display:flex;align-items:center;gap:8px;font-size:1.1rem;font-weight:800;color:#34d399;cursor:pointer}.logo-icon{color:#34d399;fill:#34d39933}.header-actions{display:flex;gap:10px}.icon-btn{background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#f8fafc;transition:all .2s}.icon-btn:hover{background:#fff3;transform:scale(1.05)}.handbook-btn{background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:20px;padding:0 16px;display:flex;align-items:center;gap:6px;font-weight:600;color:#f8fafc;cursor:pointer;transition:all .2s}.handbook-btn:hover{background:#fff3;border-color:var(--secondary-color);color:#22d3ee}.main-content{flex:1;display:flex;align-items:center;justify-content:center;padding:20px 0;position:relative}.loader-container{display:flex;align-items:center;justify-content:center;width:100%;height:300px}.loader-box{text-align:center;background:var(--card-bg);padding:32px;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);border:3px solid #34d399;display:flex;flex-direction:column;align-items:center;gap:16px}.spinner{color:var(--primary-color);animation:spin 1s linear infinite}.loader-tip{font-size:1rem;font-weight:700;color:var(--text-main);margin:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.card{background:var(--card-bg);border-radius:var(--radius-lg);padding:32px 24px;box-shadow:var(--shadow-lg);width:100%;box-sizing:border-box;border:3px solid rgba(255,255,255,.1);position:relative;overflow:hidden;color:var(--text-main)}.welcome-card{text-align:center}.welcome-hero{position:relative;height:120px;display:flex;justify-content:center;align-items:center;margin-bottom:16px}.gold-trophy{width:90px;height:90px;color:#fbbf24}.sparkle-icon{position:absolute;top:15px;right:35%;color:#fbbf24}.title{font-size:1.8rem;font-weight:900;color:var(--text-main);margin-bottom:12px}.subtitle{font-size:1rem;color:var(--text-muted);line-height:1.6;margin-bottom:24px}.rules-brief{display:flex;justify-content:space-around;background:#f1f5f9;padding:12px;border-radius:var(--radius-md);margin-bottom:28px;border:1px dashed #cbd5e0}.rule-item{font-size:.9rem;font-weight:700;color:#334155}.action-area{display:flex;flex-direction:column;align-items:center;gap:8px}.shortcut-tip{display:flex;align-items:center;gap:4px;font-size:.8rem;color:var(--text-muted);margin-top:8px}.shortcut-tip strong{background:#e2e8f0;padding:2px 6px;border-radius:4px;border:1px solid #cbd5e0}.btn{border:none;border-radius:40px;font-weight:800;cursor:pointer;transition:all .2s;display:inline-flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 4px 10px #0000001a}.btn-primary{background:var(--primary-color);color:#fff;padding:14px 36px;font-size:1.1rem}.btn-primary:hover{background:var(--primary-hover)}.btn-secondary{background:var(--secondary-color);color:#fff;padding:12px 28px;font-size:1rem}.btn-secondary:hover{background:var(--secondary-hover)}.quiz-container{width:100%}.progress-wrapper{margin-bottom:16px}.progress-text{display:flex;justify-content:space-between;font-weight:700;font-size:.95rem;color:#e2e8f0;margin-bottom:8px}.score-badge{background:#fef3c7;color:#d97706;padding:2px 12px;border-radius:12px;font-weight:800}.progress-bar-bg{background:#ffffff1a;height:12px;border-radius:6px;overflow:hidden}.progress-bar-fill{background:var(--primary-color);height:100%;border-radius:6px}.question-card{text-align:center}.question-emoji{font-size:3.8rem;margin-bottom:12px}.question-text{font-size:1.3rem;font-weight:800;line-height:1.5;margin-bottom:24px}.options-grid{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:16px}.option-btn{background:#fff;border:2px solid #e2e8f0;border-radius:var(--radius-md);padding:16px 20px;font-size:1.05rem;font-weight:700;text-align:left;cursor:pointer;display:flex;align-items:center;position:relative;color:var(--text-main);transition:all .2s}.option-btn:hover:not(:disabled){border-color:var(--primary-color);background:#f0fdf4}.option-letter{background:#f1f5f9;color:var(--text-muted);width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-right:12px;font-size:.9rem;font-weight:800}.option-btn.correct{background:#ecfdf5;border-color:var(--correct-color);color:#065f46}.option-btn.correct .option-letter{background:var(--correct-color);color:#fff}.option-btn.wrong{background:#fef2f2;border-color:var(--wrong-color);color:#991b1b}.option-btn.wrong .option-letter{background:var(--wrong-color);color:#fff}.option-btn.disabled{opacity:.6;cursor:not-allowed}.status-icon{position:absolute;right:20px}.fact-box{background:#f8fafc;border-left:5px solid var(--secondary-color);border-radius:12px;padding:16px;margin-top:16px;text-align:left}.fact-header{display:flex;align-items:center;gap:6px;margin-bottom:6px}.fact-header h3{margin:0;font-size:1rem;color:var(--secondary-color);font-weight:800}.fact-icon{color:#fbbf24}.fact-content{font-size:.95rem;line-height:1.5;color:#334155;margin:0 0 14px}.next-action-wrapper{display:flex;justify-content:flex-end}.btn-next{background:var(--secondary-color);color:#fff;border:none;padding:10px 20px;border-radius:20px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:4px}.kitchen-subtitle{font-size:.9rem;color:#cbd5e0;margin:0}.kitchen-card{display:flex;flex-direction:column;gap:24px}.pot-area{position:relative;background:#f8fafc;border-radius:var(--radius-md);padding:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;border:2px dashed #cbd5e0}.cooking-pot{position:relative;width:140px;height:120px}.pot-lid{width:100px;height:16px;background:#64748b;border-radius:8px 8px 0 0;margin:0 auto;position:relative}.pot-lid:after{content:"";position:absolute;top:-8px;left:50%;transform:translate(-50%);width:24px;height:8px;background:#475569;border-radius:4px}.pot-body{width:140px;height:100px;background:#475569;border-radius:0 0 50px 50px;position:relative;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 -10px 20px #0003}.pot-logo{font-size:2rem;opacity:.8}.pot-ingredients{position:absolute;top:-20px;display:flex;gap:8px;justify-content:center;width:100%}.bubble-ingredient{font-size:1.5rem;background:#ffffffe6;padding:4px;border-radius:50%;box-shadow:var(--shadow-sm)}.fire-glow{position:absolute;bottom:-20px;left:50%;transform:translate(-50%);color:#f97316;width:40px;height:40px;animation:flicker .2s infinite alternate}@keyframes flicker{0%{transform:translate(-50%) scale(.9);opacity:.8}to{transform:translate(-50%) scale(1.1);opacity:1}}.cooking-result-box{position:absolute;top:0;left:0;width:100%;height:100%;background:#fffffff2;border-radius:var(--radius-md);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;box-sizing:border-box;text-align:center;z-index:10}.cooking-result-box.success{border:3px solid var(--correct-color)}.cooking-result-box.fail{border:3px solid var(--wrong-color)}.result-dish-emoji{font-size:3rem;margin-bottom:8px}.cooking-result-box h4{margin:0 0 8px;font-size:1.2rem;color:var(--text-main)}.cooking-result-box p{margin:0 0 12px;font-size:.9rem;color:var(--text-muted)}.bonus-points{font-size:1.1rem;font-weight:800;color:#d97706;background:#fef3c7;padding:4px 12px;border-radius:12px;margin-bottom:12px}.btn-retry-cook{background:#f1f5f9;border:1px solid #cbd5e0;padding:6px 16px;border-radius:20px;font-weight:700;cursor:pointer;color:#475569}.ingredients-selector h3{margin:0 0 12px;font-size:1rem;color:var(--text-main)}.ingredients-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.ingredient-chip{background:#f1f5f9;border:2px solid transparent;border-radius:var(--radius-md);padding:10px 4px;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;transition:all .2s}.ingredient-chip:hover:not(:disabled){background:#e2e8f0}.ingredient-chip.active{background:#ecfdf5;border-color:var(--primary-color)}.ing-emoji{font-size:1.8rem}.ing-name{font-size:.8rem;font-weight:700;color:#475569}.kitchen-actions{display:flex;flex-direction:column;gap:12px;margin-top:10px}.btn-cook,.btn-next-stage{width:100%}.flip-game-card{display:flex;flex-direction:column;align-items:center;gap:16px}.flip-stats{display:flex;justify-content:space-between;font-size:.9rem;color:#cbd5e0;margin-top:4px}.flip-stats strong{color:#34d399}.flip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;width:100%;max-width:440px;margin:0 auto}.flip-card-outer{aspect-ratio:1;perspective:1000px;cursor:pointer}.flip-card-inner{position:relative;width:100%;height:100%;text-align:center;transition:transform .6s;transform-style:preserve-3d;border-radius:var(--radius-md)}.flip-card-outer.flipped .flip-card-inner{transform:rotateY(180deg)}.flip-card-front,.flip-card-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center}.flip-card-back{background:linear-gradient(135deg,#34d399,#10b981);border:2px solid #6ee7b7}.back-pattern{font-size:1.8rem;color:#fff}.flip-card-front{background:#f0fdf4;border:2px solid #34d399;transform:rotateY(180deg)}.front-emoji{font-size:2.2rem}.flip-footer{display:flex;justify-content:center;width:100%;margin-top:12px}.btn-restart-game{background:#f1f5f9;color:#334155;border:1px solid #cbd5e0;padding:8px 16px;border-radius:20px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:6px}.result-card{text-align:center}.result-header{margin-bottom:20px}.result-award-icon{width:60px;height:60px;color:var(--primary-color)}.final-score{margin-top:10px}.score-num{font-size:3.5rem;font-weight:900;color:var(--primary-color)}.score-unit{font-size:1.2rem;font-weight:700;color:var(--text-muted)}.badge-unlock-section{background:#f8fafc;border-radius:var(--radius-md);padding:20px;margin-bottom:24px;border:2px dashed #cbd5e0}.badge-unlock-section h3{margin-top:0;font-size:1rem;color:var(--text-muted)}.earned-badge-card{display:flex;flex-direction:column;align-items:center;gap:8px}.badge-emoji-large{font-size:4rem}.earned-badge-card h4{margin:0;font-size:1.3rem;font-weight:800;color:var(--text-main)}.earned-badge-card p{margin:0;font-size:.95rem;color:var(--text-muted)}.result-actions{display:flex;justify-content:center;gap:16px}.handbook-card{max-height:80vh;overflow-y:auto}.handbook-header{text-align:center;margin-bottom:24px}.handbook-title-icon{width:48px;height:48px;color:var(--secondary-color)}.handbook-header h2{margin:10px 0 6px}.handbook-header p{margin:0;color:var(--text-muted);font-size:.95rem}.handbook-section{margin-bottom:28px}.handbook-section h3{font-size:1.1rem;color:var(--text-main);border-left:4px solid var(--primary-color);padding-left:8px;margin-bottom:14px}.badge-list{display:flex;flex-direction:column;gap:12px}.badge-item{display:flex;align-items:center;gap:16px;padding:14px;border-radius:var(--radius-md);border:2px solid #e2e8f0}.badge-item.unlocked{background:#f0fdf4;border-color:#a7f3d0}.badge-item.locked{background:#f8fafc;opacity:.7}.badge-icon-wrapper{position:relative;width:50px;height:50px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm)}.badge-emoji{font-size:2.2rem}.lock-overlay{position:absolute;font-size:1rem;background:#fffc;width:100%;height:100%;border-radius:50%;display:flex;align-items:center;justify-content:center}.badge-info h4{margin:0 0 4px;font-size:1rem;font-weight:800}.badge-info p{margin:0 0 4px;font-size:.85rem;color:var(--text-muted)}.badge-condition{font-size:.75rem;font-weight:700;color:#d97706;background:#fef3c7;padding:2px 6px;border-radius:4px}.recipe-list{display:flex;flex-direction:column;gap:12px}.recipe-item-card{display:flex;gap:16px;padding:14px;border-radius:var(--radius-md);border:2px solid #e2e8f0}.recipe-item-card.unlocked{background:#f0fdf4;border-color:#a7f3d0}.recipe-item-card.locked{background:#f8fafc;opacity:.7}.recipe-emoji{font-size:2.5rem;display:flex;align-items:center}.recipe-details h4{margin:0 0 4px;font-size:1rem}.recipe-details p{margin:0 0 8px;font-size:.85rem;color:var(--text-muted)}.recipe-ing-tags{display:flex;gap:6px;flex-wrap:wrap}.ing-tag{font-size:.75rem;background:#e2e8f0;color:#475569;padding:2px 8px;border-radius:10px;font-weight:700}.handbook-actions{display:flex;justify-content:center}.app-footer{text-align:center;padding:20px 0;color:#cbd5e0;font-size:.85rem;font-weight:600}
