@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&family=Inter:wght@300;400;500;600&display=swap";:root{--honda-hue:356;--honda-red:hsl(var(--honda-hue), 85%, 50%);--honda-red-hover:hsl(var(--honda-hue), 85%, 42%);--honda-red-glow:hsla(var(--honda-hue), 85%, 50%, .2);--bg-primary:#0a0b10;--bg-secondary:#12131a;--card-bg:#161825b3;--card-border:#ffffff0d;--card-hover-border:rgba(var(--honda-hue), 85%, 50%, .2);--text-main:#f3f4f6;--text-muted:#9ca3af;--text-dark:#1f2937;--eco-green:#10b981;--eco-green-glow:#10b98126;--game-blue:#3b82f6;--game-blue-glow:#3b82f626;--form-purple:#8b5cf6;--form-purple-glow:#8b5cf626;--sans-font:"Outfit", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--transition-smooth:all .3s cubic-bezier(.4, 0, .2, 1);--shadow-premium:0 10px 30px -10px #000000b3;--shadow-glow:0 0 20px 0 #e3120b26}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--sans-font);background-color:var(--bg-primary);color:var(--text-main);min-height:100vh;-webkit-font-smoothing:antialiased;min-height:-webkit-fill-available;line-height:1.5;overflow-x:hidden}#root{flex-direction:column;min-height:100vh;display:flex}.app-container{background-color:var(--bg-secondary);width:100%;max-width:600px;min-height:100vh;box-shadow:var(--shadow-premium);flex-direction:column;margin:0 auto;display:flex;position:relative}.main-header{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--card-border);z-index:100;background:#12131ad9;justify-content:space-between;align-items:center;padding:16px 20px;display:flex;position:sticky;top:0}.header-brand{align-items:center;gap:8px;display:flex}.brand-badge{background-color:var(--honda-red);color:#fff;text-transform:uppercase;letter-spacing:.5px;border-radius:4px;padding:2px 6px;font-size:11px;font-weight:700}.brand-title{color:var(--text-main);font-size:18px;font-weight:600}.user-profile-header{align-items:center;gap:10px;display:flex}.user-avatar{background:linear-gradient(135deg, var(--honda-red), #ff4d4d);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:14px;font-weight:600;display:flex}.user-info-text{text-align:left;flex-direction:column;display:flex}.user-name{color:var(--text-main);white-space:nowrap;text-overflow:ellipsis;max-width:100px;font-size:13px;font-weight:600;overflow:hidden}.user-matricula{color:var(--text-muted);font-size:11px}.btn-logout{color:var(--text-muted);cursor:pointer;transition:var(--transition-smooth);background:0 0;border:none;align-items:center;padding:4px;display:flex}.btn-logout:hover{color:var(--honda-red);transform:translate(2px)}.btn-back{color:var(--text-muted);transition:var(--transition-smooth);justify-content:center;align-items:center;padding:4px;display:flex}.btn-back:hover{color:var(--text-main);transform:translate(-3px)}.user-score-badge{border:1px solid var(--card-border);background:#ffffff0d;border-radius:20px;padding:4px 10px;font-size:13px;font-weight:500}.dashboard-content,.game-content,.form-content{flex-direction:column;flex:1;gap:20px;padding:20px;display:flex}.welcome-banner{text-align:left;background:linear-gradient(135deg,#e3120b1a 0%,#e3120b05 100%);border:1px solid #e3120b33;border-radius:16px;padding:20px}.welcome-banner h1{background:linear-gradient(90deg,#fff,#e3120b);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:8px;font-size:26px;font-weight:700}.welcome-banner p{color:var(--text-muted);font-family:Inter,sans-serif;font-size:14px}.stats-grid{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.stat-card{background:var(--card-bg);border:1px solid var(--card-border);text-align:center;transition:var(--transition-smooth);border-radius:12px;flex-direction:column;align-items:center;gap:8px;padding:12px;display:flex}.stat-card:hover{border-color:#ffffff1a;transform:translateY(-2px)}.stat-icon-wrapper{border-radius:10px;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.stat-icon-wrapper.eco-color{background:var(--eco-green-glow);color:var(--eco-green)}.stat-icon-wrapper.games-color{background:var(--game-blue-glow);color:var(--game-blue)}.stat-icon-wrapper.forms-color{background:var(--form-purple-glow);color:var(--form-purple)}.stat-info{flex-direction:column;display:flex}.stat-label{color:var(--text-muted);font-size:11px}.stat-value{font-size:15px;font-weight:700}.modules-section{text-align:left;flex-direction:column;gap:14px;display:flex}.section-title{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:16px;font-weight:600}.modules-grid{flex-direction:column;gap:16px;display:flex}.module-card{background:var(--card-bg);border:1px solid var(--card-border);color:var(--text-main);transition:var(--transition-smooth);border-radius:16px;flex-direction:column;text-decoration:none;display:flex;position:relative;overflow:hidden}.module-card-bg{opacity:0;width:100%;height:100%;transition:var(--transition-smooth);position:absolute;top:0;left:0}.card-games:hover .module-card-bg{opacity:1;background:radial-gradient(circle at 10% 10%,#3b82f614 0%,#0000 50%)}.card-forms:hover .module-card-bg{opacity:1;background:radial-gradient(circle at 10% 10%,#8b5cf614 0%,#0000 50%)}.module-card:hover{transform:translateY(-3px);box-shadow:0 12px 20px -8px #00000080}.card-games:hover{border-color:#3b82f64d}.card-forms:hover{border-color:#8b5cf64d}.module-card-content{z-index:1;flex-direction:column;gap:10px;padding:20px;display:flex}.module-icon{border-radius:12px;justify-content:center;align-items:center;width:48px;height:48px;display:flex}.card-games .module-icon{background:var(--game-blue-glow);color:var(--game-blue)}.card-forms .module-icon{background:var(--form-purple-glow);color:var(--form-purple)}.module-card-content h3{font-size:18px;font-weight:600}.module-card-content p{color:var(--text-muted);font-family:Inter,sans-serif;font-size:13px}.module-action{align-items:center;gap:6px;margin-top:6px;font-size:13px;font-weight:600;display:flex}.card-games .module-action{color:var(--game-blue)}.card-forms .module-action{color:var(--form-purple)}.module-action svg{transition:var(--transition-smooth)}.module-card:hover .module-action svg{transform:translate(4px)}.loading-container{background-color:var(--bg-secondary);flex-direction:column;justify-content:center;align-items:center;gap:16px;height:100vh;display:flex}.spinner{border:3px solid #ffffff0d;border-top-color:var(--honda-red);border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}.loading-container p{color:var(--text-muted);font-size:14px}@keyframes spin{to{transform:rotate(360deg)}}.error-page-container{background-color:var(--bg-secondary);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.error-card{background:var(--card-bg);text-align:center;border:1px solid #e3120b33;border-radius:20px;width:100%;max-width:420px;padding:30px 24px;box-shadow:0 10px 40px -15px #e3120b1a}.error-icon-wrapper{width:72px;height:72px;color:var(--honda-red);background:#e3120b1a;border-radius:50%;justify-content:center;align-items:center;margin:0 auto 20px;display:flex}.error-lock-icon{animation:1.5s ease-in-out infinite shake}.error-title{margin-bottom:12px;font-size:24px;font-weight:700}.error-message{color:var(--text-muted);margin-bottom:20px;font-family:Inter,sans-serif;font-size:14px}.error-details{text-align:left;border:1px solid var(--card-border);background:#0003;border-radius:10px;margin-bottom:24px;padding:12px 16px}.error-details-title{color:var(--text-main);margin-bottom:6px;font-size:12px;font-weight:600}.error-details-list{color:var(--text-muted);flex-direction:column;gap:4px;font-size:11px;list-style-position:inside;display:flex}.game-card,.form-card{background:var(--card-bg);border:1px solid var(--card-border);text-align:left;border-radius:20px;flex-direction:column;gap:16px;padding:24px;display:flex}.game-start-card{text-align:center;align-items:center;padding:36px 24px}.game-badge{background:var(--honda-red-glow);color:var(--honda-red);border:1px solid #e3120b33;border-radius:12px;padding:4px 10px;font-size:11px;font-weight:600}.game-banner-icon{color:var(--honda-red);margin:20px 0}.game-progress-bar{background:#ffffff0d;border-radius:3px;width:100%;height:6px;overflow:hidden}.progress-fill{background:linear-gradient(to right, var(--honda-red), var(--eco-green));height:100%;transition:width .3s}.game-question-header{color:var(--text-muted);justify-content:space-between;font-size:12px;font-weight:500;display:flex}.question-text{color:var(--text-main);font-size:18px;font-weight:600;line-height:1.4}.options-list{flex-direction:column;gap:10px;display:flex}.option-btn{border:1px solid var(--card-border);color:var(--text-main);text-align:left;cursor:pointer;transition:var(--transition-smooth);width:100%;font-family:var(--sans-font);background:#ffffff05;border-radius:12px;align-items:center;gap:12px;padding:14px 16px;font-size:14px;display:flex}.option-btn:hover:not(:disabled){background:#ffffff0d;border-color:#ffffff26;transform:translate(3px)}.option-letter{background:#ffffff14;border-radius:6px;justify-content:center;align-items:center;width:24px;height:24px;font-size:12px;font-weight:700;display:flex}.option-correct{border-color:var(--eco-green)!important;background:#10b9811a!important}.option-correct .option-letter{background:var(--eco-green)!important;color:#fff!important}.option-wrong{border-color:var(--honda-red)!important;background:#e3120b1a!important}.option-wrong .option-letter{background:var(--honda-red)!important;color:#fff!important}.option-disabled{opacity:.5;cursor:not-allowed}.fact-box{background:#10b9810d;border:1px solid #10b98133;border-radius:12px;flex-direction:column;gap:8px;padding:14px;display:flex}.fact-box h4{color:var(--eco-green);font-size:13px;font-weight:700}.fact-box p{color:var(--text-muted);font-family:Inter,sans-serif;font-size:12px}.btn-next{align-self:flex-end;margin-top:6px}.game-result-card{text-align:center;align-items:center;padding:36px 24px}.result-trophy{color:var(--eco-green);margin-bottom:12px}.score-summary{color:var(--text-muted);font-size:15px}.score-points-banner{background:linear-gradient(135deg,#10b98126 0%,#10b98108 100%);border:1px solid #10b9814d;border-radius:14px;flex-direction:column;align-items:center;width:100%;margin:10px 0;padding:16px 24px;display:flex}.points-amount{color:var(--eco-green);font-size:32px;font-weight:800;line-height:1}.points-label{color:var(--text-muted);margin-top:4px;font-size:12px}.db-saving-status{color:var(--text-muted);font-size:12px}.db-saving-status.success{color:var(--eco-green)}.db-saving-status.error{color:var(--honda-red)}.result-actions{gap:12px;width:100%;margin-top:10px;display:flex}.result-actions .btn,.result-actions a{flex:1}.form-intro{margin-bottom:6px}.form-intro h2{margin-bottom:6px;font-size:20px;font-weight:700}.form-intro p{color:var(--text-muted);font-family:Inter,sans-serif;font-size:13px}.premium-form{flex-direction:column;gap:16px;display:flex}.form-group{flex-direction:column;gap:6px;display:flex}.form-group label{color:var(--text-main);font-size:13px;font-weight:500}.form-group select,.form-group textarea{border:1px solid var(--card-border);color:var(--text-main);font-family:var(--sans-font);transition:var(--transition-smooth);background:#0003;border-radius:10px;width:100%;padding:10px 12px;font-size:13px}.form-group select:focus,.form-group textarea:focus{border-color:var(--honda-red);box-shadow:var(--honda-red-glow) 0 0 0 3px;outline:none}.form-error-alert{color:var(--honda-red);background:#e3120b1a;border:1px solid #e3120b4d;border-radius:8px;padding:10px 14px;font-size:12px}.form-success-card{text-align:center;align-items:center;padding:36px 24px}.success-icon-wrapper{color:var(--eco-green);background:var(--eco-green-glow);border-radius:50%;justify-content:center;align-items:center;width:72px;height:72px;margin-bottom:12px;display:flex}.success-leaf-icon{animation:2s infinite bounce}.success-feedback-points{color:var(--eco-green);background:#10b9811a;border:1px solid #10b98133;border-radius:20px;margin:10px 0;padding:4px 14px;font-size:13px;font-weight:600}.success-actions{gap:12px;width:100%;margin-top:10px;display:flex}.success-actions .btn,.success-actions a{flex:1}.btn{font-family:var(--sans-font);cursor:pointer;transition:var(--transition-smooth);text-align:center;background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;padding:10px 16px;font-size:13px;font-weight:600;text-decoration:none;display:inline-flex}.btn-primary{background:var(--honda-red);color:#fff}.btn-primary:hover:not(:disabled){background:var(--honda-red-hover);box-shadow:var(--shadow-glow)}.btn-primary:disabled{background:var(--text-muted);opacity:.5;cursor:not-allowed}.btn-secondary{border:1px solid var(--card-border);color:var(--text-main);background:#ffffff0d}.btn-secondary:hover{background:#ffffff1a;border-color:#fff3}.btn-large{padding:14px 24px;font-size:14px}.animate-fade-in{animation:.4s ease-out forwards fadeIn}.animate-slide-up{animation:.4s cubic-bezier(.16,1,.3,1) forwards slideUp}.animate-scale-in{animation:.35s cubic-bezier(.34,1.56,.64,1) forwards scaleIn}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes shake{0%,to{transform:rotate(0)}25%{transform:rotate(-5deg)}75%{transform:rotate(5deg)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5deg)}}.pulse-icon{animation:2.5s infinite pulse}@keyframes pulse{0%,to{opacity:.9;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}.bounce-icon{animation:2s infinite bounce}@media (width<=600px){.app-container{box-shadow:none}}