.login-container{align-items:center;background:linear-gradient(135deg,#ff6b6b,#feca57);display:flex;justify-content:center;min-height:100vh;padding:20px}.login-card{animation:slideInUp .6s ease-out;background:#fff;border-radius:25px;box-shadow:0 20px 40px #0000001a;max-width:450px;padding:40px;width:100%}.login-header{margin-bottom:30px;text-align:center}.login-header h1{color:#ff6b6b;font-size:28px}.login-header h1,.login-header h2{font-weight:700;margin-bottom:10px}.login-header h2{color:#333;font-size:24px}.login-header p{color:#666;font-size:16px}.login-form{margin-bottom:30px}.form-group input:focus{border-color:#ff6b6b;box-shadow:0 0 0 3px #ff6b6b1a}.login-button{align-items:center;background:linear-gradient(135deg,#ff6b6b,#feca57);border:none;border-radius:12px;color:#fff;cursor:pointer;display:flex;font-size:18px;font-weight:700;justify-content:center;margin-top:10px;padding:18px;transition:all .3s ease;width:100%}.login-button:hover:not(:disabled){box-shadow:0 8px 20px #ff6b6b4d;transform:translateY(-2px)}.login-button:active:not(:disabled){transform:translateY(0)}.login-button:disabled{cursor:not-allowed;opacity:.7}.login-footer{border-top:2px solid #f0f0f0;padding-top:20px;text-align:center}.login-footer p{color:#666;font-size:14px;margin-bottom:10px}.signup-link{color:#ff6b6b;font-weight:700;text-decoration:none;transition:color .3s ease}.signup-link:hover{color:#feca57;text-decoration:underline}.demo-info{color:#888;font-size:12px;font-style:italic}@media (max-width:768px){.login-container{padding:10px}.login-card{border-radius:20px;padding:30px 20px}.login-header h1{font-size:24px}.login-header h2{font-size:20px}.form-group input{font-size:14px;padding:12px}.login-button{font-size:16px;padding:15px}}@media (max-width:480px){.login-card{padding:25px 15px}.login-header h1{font-size:20px}.login-header h2{font-size:18px}.login-header p{font-size:14px}}.signup-container{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;justify-content:center;min-height:100vh;padding:20px}.signup-card{animation:slideInUp .6s ease-out;background:#fff;border-radius:25px;box-shadow:0 20px 40px #0000001a;max-width:500px;padding:40px;width:100%}@keyframes slideInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.signup-header{margin-bottom:30px;text-align:center}.signup-header h1{color:#667eea;font-size:28px;font-weight:700;margin-bottom:10px}.signup-header h2{color:#333;font-size:24px;font-weight:700;margin-bottom:10px}.signup-header p{color:#666;font-size:16px}.signup-form{margin-bottom:30px}.error-message{animation:shake .5s ease-in-out;background:#ffebee;border:2px solid #ffcdd2;border-radius:12px;color:#c62828;font-size:14px;margin-bottom:20px;padding:15px;text-align:center}@keyframes shake{0%,to{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}.form-row{grid-gap:15px;display:grid;gap:15px;grid-template-columns:1fr 1fr}.form-group,.form-row{margin-bottom:20px}.form-group label{color:#555;display:block;font-size:14px;font-weight:700;margin-bottom:8px}.form-group input{background:#fafafa;border:3px solid #e0e0e0;border-radius:12px;font-size:16px;padding:15px;transition:all .3s ease;width:100%}.form-group input:focus{background:#fff;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a;outline:none}.form-group input.error{background:#ffebee;border-color:#f44336}.form-group input::placeholder{color:#aaa}.error-text{color:#f44336;display:block;font-size:12px;margin-top:5px}.signup-button{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;color:#fff;cursor:pointer;display:flex;font-size:18px;font-weight:700;justify-content:center;margin-top:10px;padding:18px;transition:all .3s ease;width:100%}.signup-button:hover:not(:disabled){box-shadow:0 8px 20px #667eea4d;transform:translateY(-2px)}.signup-button:active:not(:disabled){transform:translateY(0)}.signup-button:disabled{cursor:not-allowed;opacity:.7}.signup-footer{border-top:2px solid #f0f0f0;padding-top:20px;text-align:center}.signup-footer p{color:#666;font-size:14px;margin-bottom:10px}.login-link{color:#667eea;font-weight:700;text-decoration:none;transition:color .3s ease}.login-link:hover{color:#764ba2;text-decoration:underline}@media (max-width:768px){.signup-container{padding:10px}.signup-card{border-radius:20px;padding:30px 20px}.signup-header h1{font-size:24px}.signup-header h2{font-size:20px}.form-row{gap:0;grid-template-columns:1fr}.form-group input{font-size:14px;padding:12px}.signup-button{font-size:16px;padding:15px}}@media (max-width:480px){.signup-card{padding:25px 15px}.signup-header h1{font-size:20px}.signup-header h2{font-size:18px}.signup-header p{font-size:14px}}.tab-navigation{background:#fff;border-radius:15px;box-shadow:0 5px 15px #0000001a;margin-bottom:30px;padding:10px}.tab-button,.tab-container{display:flex;gap:10px}.tab-button{align-items:center;background:#0000;border:2px solid #e0e0e0;border-radius:12px;color:#666;cursor:pointer;flex:1 1;font-size:16px;font-weight:600;justify-content:center;padding:15px 20px;transition:all .3s ease}.tab-button:hover{background:#f5f5f5;border-color:#ddd}.tab-button.active{background:linear-gradient(135deg,#667eea,#764ba2);border-color:#667eea;box-shadow:0 5px 15px #667eea4d;color:#fff}.tab-icon{font-size:18px;font-weight:700}.tab-label{font-size:14px}@media (max-width:768px){.tab-navigation{margin-bottom:20px;padding:8px}.tab-button{font-size:14px;padding:12px 15px}.tab-icon{font-size:16px}.tab-label{font-size:12px}}@media (max-width:480px){.tab-container{gap:5px}.tab-button{flex-direction:column;font-size:12px;gap:5px;padding:10px 8px}.tab-icon{font-size:14px}.tab-label{font-size:10px}}.dashboard-container{background:linear-gradient(135deg,#a8edea,#fed6e3);min-height:100vh;padding:20px}.dashboard-header{animation:slideInDown .6s ease-out;background:#fff;border-radius:20px;box-shadow:0 10px 30px #0000001a;margin-bottom:30px;padding:30px}.header-content{align-items:center;display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between}.user-info h1{color:#333;font-size:32px;font-weight:700;margin-bottom:8px}.user-info p{color:#666;font-size:18px}.header-actions{align-items:center;display:flex;gap:20px}.progress-badge{background:linear-gradient(135deg,#4caf50,#8bc34a);border-radius:15px;box-shadow:0 5px 15px #4caf504d;color:#fff;padding:15px 25px;text-align:center}.progress-number{display:block;font-size:28px;font-weight:700;margin-bottom:5px}.progress-label{font-size:14px;opacity:.9}.logout-button{background:linear-gradient(135deg,#ff6b6b,#feca57);border:none;border-radius:12px;color:#fff;cursor:pointer;font-size:14px;font-weight:700;padding:12px 20px;transition:all .3s ease}.logout-button:hover:not(:disabled){box-shadow:0 5px 15px #ff6b6b4d;transform:translateY(-2px)}.logout-button:disabled{cursor:not-allowed;opacity:.7}.dashboard-main{margin:0 auto;max-width:1200px}.stats-section{margin-bottom:40px}.stats-grid{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.stat-card{align-items:center;animation:fadeInUp .6s ease-out backwards;background:#fff;border-radius:20px;box-shadow:0 10px 30px #0000001a;display:flex;gap:20px;padding:25px;transition:all .3s ease}.stat-card:first-child{animation-delay:.1s}.stat-card:nth-child(2){animation-delay:.2s}.stat-card:nth-child(3){animation-delay:.3s}.stat-card:nth-child(4){animation-delay:.4s}.stat-card:hover{box-shadow:0 15px 40px #00000026;transform:translateY(-5px)}.stat-icon{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:15px;display:flex;font-size:40px;height:60px;justify-content:center;width:60px}.stat-content h3{color:#333;font-size:24px;font-weight:700;margin-bottom:5px}.stat-content p{color:#666;font-size:14px}.alphabet-section{margin-bottom:40px}.section-header{margin-bottom:30px;text-align:center}.section-header h2{color:#333;font-size:28px;font-weight:700;margin-bottom:10px}.section-header p{color:#666;font-size:16px}.alphabet-grid{grid-gap:15px;display:grid;gap:15px;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));margin:0 auto;max-width:900px}.alphabet-card{animation:bounceIn .6s ease-out backwards;background:#fff;border-radius:15px;box-shadow:0 5px 15px #0000001a;color:inherit;overflow:hidden;padding:20px;position:relative;text-decoration:none;transition:all .3s ease}.alphabet-card:before{background:linear-gradient(135deg,#ffffff1a,#fff0);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}@keyframes bounceIn{0%{opacity:0;transform:scale(.3)}50%{transform:scale(1.05)}70%{transform:scale(.9)}to{opacity:1;transform:scale(1)}}.alphabet-card:hover{box-shadow:0 15px 30px #0003;transform:translateY(-8px) scale(1.05)}.card-content{position:relative;text-align:center;z-index:1}.letter-emoji{font-size:24px}.letter-display,.letter-emoji{margin-bottom:10px}.letter{display:block;font-size:28px}.letter-stats{color:#666;font-size:12px}.accuracy{display:block;margin-bottom:2px}.attempts{opacity:.8}.not-attempted{color:#999;font-style:italic}.quick-actions{text-align:center}.button-icon{font-size:20px}.button-text{font-size:16px}@media (max-width:768px){.dashboard-container{padding:15px}.dashboard-header{padding:20px}.header-content{flex-direction:column;text-align:center}.user-info h1{font-size:24px}.user-info p{font-size:16px}.stats-grid{gap:15px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.stat-card{padding:20px}.stat-icon{font-size:30px;height:50px;width:50px}.stat-content h3{font-size:20px}.section-header h2{font-size:24px}.alphabet-grid{gap:10px;grid-template-columns:repeat(auto-fit,minmax(100px,1fr))}.alphabet-card{padding:15px}.letter{font-size:24px}.action-buttons{align-items:center;flex-direction:column}.action-button{justify-content:center;max-width:300px;width:100%}}@media (max-width:480px){.dashboard-container{padding:10px}.dashboard-header{padding:15px}.user-info h1{font-size:20px}.stats-grid{grid-template-columns:1fr}.stat-card{flex-direction:column;text-align:center}.alphabet-grid{grid-template-columns:repeat(auto-fit,minmax(80px,1fr))}.alphabet-card{padding:10px}.letter,.letter-emoji{font-size:20px}}.reference-box{background:#fff;border-left:5px solid #2196f3;border-radius:20px;box-shadow:0 10px 30px #0000001a;margin-bottom:20px;padding:25px}.reference-header{margin-bottom:20px;text-align:center}.reference-header h3{color:#333;font-size:20px;font-weight:700;margin:0}.reference-content{align-items:center;display:flex;gap:30px}.character-display{flex-shrink:0}.character-large{align-items:center;background:linear-gradient(135deg,#e3f2fd,#f5f5f5);border:3px solid #2196f3;border-radius:15px;box-shadow:0 5px 15px #2196f333;color:#2196f3;display:flex;font-size:72px;font-weight:700;height:100px;justify-content:center;text-align:center;width:100px}.example-display{align-items:center;display:flex;flex:1 1;gap:20px}.image-container{flex-shrink:0}.emoji-image{align-items:center;background:linear-gradient(135deg,#fff3e0,#fff8e1);border:2px solid #ff9800;border-radius:15px;box-shadow:0 3px 10px #ff980033;display:flex;font-size:48px;height:80px;justify-content:center;width:80px}.text-content{flex:1 1}.example-word{color:#333;font-size:18px;font-weight:700;margin-bottom:8px}.description{color:#666;font-size:14px;font-style:italic}@media (max-width:768px){.reference-box{margin-bottom:15px;padding:20px}.reference-content{flex-direction:column;gap:20px;text-align:center}.character-large{font-size:60px;height:80px;width:80px}.example-display{flex-direction:column;gap:15px}.emoji-image{font-size:36px;height:60px;width:60px}.example-word{font-size:16px}.description{font-size:12px}}@media (max-width:480px){.reference-box{padding:15px}.character-large{font-size:48px;height:70px;width:70px}.emoji-image{font-size:28px;height:50px;width:50px}.example-word{font-size:14px}.description{font-size:11px}}.practice-container{background:linear-gradient(135deg,#ffecd2,#fcb69f);min-height:100vh;padding:20px}.practice-header{animation:slideInDown .6s ease-out;background:#fff;border-radius:20px;box-shadow:0 10px 30px #0000001a;margin-bottom:30px;padding:30px}.practice-main{margin:0 auto;max-width:800px}.practice-content{grid-gap:30px;display:grid;gap:30px;grid-template-columns:1fr 1fr;margin-bottom:30px}.canvas-section{animation:fadeInLeft .6s ease-out;background:#fff;border-radius:20px;box-shadow:0 10px 30px #0000001a;padding:30px}@keyframes fadeInLeft{0%{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:translateX(0)}}.canvas-container{border-radius:15px;box-shadow:0 5px 15px #0000001a;margin-bottom:20px;overflow:hidden;position:relative}.drawing-canvas{background:#fff;border:3px solid #e0e0e0;border-radius:15px;cursor:crosshair;display:block;height:auto;touch-action:none;width:100%}.canvas-guide{animation:pulse 2s infinite;left:50%;pointer-events:none;position:absolute;text-align:center;top:50%;transform:translate(-50%,-50%)}@keyframes pulse{0%,to{opacity:.6}50%{opacity:1}}.canvas-guide p{background:#ffffffe6;border-radius:10px;box-shadow:0 2px 10px #0000001a;color:#666;font-size:14px;font-weight:700;padding:10px 20px}.canvas-controls{display:flex;gap:15px;justify-content:center}.control-button{align-items:center;background:linear-gradient(135deg,#ff6b6b,#feca57);border:none;border-radius:12px;color:#fff;cursor:pointer;display:flex;font-size:14px;font-weight:700;gap:8px;padding:12px 20px;transition:all .3s ease}.control-button:hover{box-shadow:0 5px 15px #ff6b6b4d;transform:translateY(-2px)}.control-button.secondary{background:linear-gradient(135deg,#667eea,#764ba2)}.feedback-section{animation:fadeInRight .6s ease-out}@keyframes fadeInRight{0%{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}.feedback-card{animation:slideInUp .5s ease-out;background:#fff;border-left:5px solid;border-radius:20px;box-shadow:0 10px 30px #0000001a;margin-bottom:20px;padding:30px}.feedback-card.success{background:linear-gradient(135deg,#e8f5e8,#f1f8e9);border-left-color:#4caf50}.feedback-card.warning{background:linear-gradient(135deg,#fff3e0,#fff8e1);border-left-color:#ff9800}.feedback-card.error{background:linear-gradient(135deg,#ffebee,#fef5e7);border-left-color:#f44336}.feedback-icon{font-size:48px;margin-bottom:20px;text-align:center}.feedback-content h3{color:#333;font-size:24px;font-weight:700;margin-bottom:10px;text-align:center}.result-indicator{align-items:center;display:flex;flex-wrap:wrap;gap:15px;justify-content:center;margin-bottom:20px}.result-badge{border-radius:20px;box-shadow:0 3px 10px #0003;font-size:14px;font-weight:700;letter-spacing:1px;padding:8px 16px;text-transform:uppercase}.result-badge.correct{background:linear-gradient(135deg,#4caf50,#8bc34a);border:2px solid #4caf50;color:#fff}.result-badge.incorrect{background:linear-gradient(135deg,#f44336,#e91e63);border:2px solid #f44336;color:#fff}.confidence-badge{background:linear-gradient(135deg,#2196f3,#03a9f4);border:2px solid #2196f3;border-radius:20px;box-shadow:0 3px 10px #2196f34d;color:#fff;font-size:14px;font-weight:700;padding:8px 16px}.feedback-content p{color:#666;font-size:16px;margin-bottom:10px;text-align:center}.confidence{color:#333;font-size:18px;font-weight:700}.redirect-info{animation:pulse 1.5s infinite;color:#4caf50;font-weight:700}.tips-card{background:#fff;border-left:5px solid #2196f3;border-radius:20px;box-shadow:0 10px 30px #0000001a;padding:30px}.tips-card h3{color:#333;font-size:20px;font-weight:700;margin-bottom:15px}.tips-card ul{list-style:none;padding:0}.tips-card li{color:#666;font-size:16px;margin-bottom:10px;padding-left:25px;position:relative}.tips-card li:before{content:"✨";left:0;position:absolute;top:0}.submit-section{animation:fadeInUp .6s ease-out;text-align:center}.submit-button{align-items:center;background:linear-gradient(135deg,#4caf50,#8bc34a);border:none;border-radius:15px;box-shadow:0 10px 30px #4caf504d;color:#fff;cursor:pointer;display:inline-flex;font-size:18px;font-weight:700;gap:10px;justify-content:center;padding:18px 40px;transition:all .3s ease}.submit-button:hover:not(:disabled){box-shadow:0 15px 40px #4caf5066;transform:translateY(-3px)}.submit-button:active:not(:disabled){transform:translateY(-1px)}.submit-button:disabled{cursor:not-allowed;opacity:.6;transform:none}@media (max-width:768px){.practice-container{padding:15px}.practice-header{padding:20px}.header-content h1{font-size:24px}.header-content p{font-size:16px}.practice-content{gap:20px;grid-template-columns:1fr}.canvas-section,.feedback-section{padding:20px}.canvas-controls{flex-direction:column}.control-button{justify-content:center;width:100%}.feedback-card,.tips-card{padding:20px}.feedback-icon{font-size:36px}.feedback-content h3{font-size:20px}.feedback-content p{font-size:14px}.submit-button{font-size:16px;padding:15px 30px;width:100%}}@media (max-width:480px){.practice-container{padding:10px}.practice-header{padding:15px}.header-content h1{font-size:20px}.canvas-section,.feedback-section{padding:15px}.feedback-icon{font-size:30px}.feedback-content h3,.tips-card h3{font-size:18px}.tips-card li{font-size:14px}}.progress-container{background:linear-gradient(135deg,#f093fb,#f5576c);min-height:100vh;padding:20px}.progress-header{animation:slideInDown .6s ease-out;background:#fff;border-radius:20px;box-shadow:0 10px 30px #0000001a;margin-bottom:30px;padding:30px}@keyframes slideInDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}.header-content{text-align:center}.back-button{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:10px;color:#fff;cursor:pointer;display:inline-flex;font-size:14px;font-weight:700;gap:8px;margin-bottom:20px;padding:10px 20px;transition:all .3s ease}.back-button:hover{box-shadow:0 5px 15px #667eea4d;transform:translateX(-5px)}.header-content h1{color:#333;font-size:32px;font-weight:700;margin-bottom:10px}.header-content p{color:#666;font-size:18px}.progress-main{margin:0 auto;max-width:1200px}.overview-section{margin-bottom:40px}.overview-cards{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.overview-card{align-items:center;animation:fadeInUp .6s ease-out backwards;background:#fff;border-radius:20px;box-shadow:0 10px 30px #0000001a;display:flex;gap:20px;padding:25px;transition:all .3s ease}.overview-card:first-child{animation-delay:.1s}.overview-card:nth-child(2){animation-delay:.2s}.overview-card:nth-child(3){animation-delay:.3s}.overview-card:nth-child(4){animation-delay:.4s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.overview-card.primary{border-left:5px solid #2196f3}.overview-card.success{border-left:5px solid #4caf50}.overview-card.warning{border-left:5px solid #ff9800}.overview-card.info{border-left:5px solid #9c27b0}.overview-card:hover{box-shadow:0 15px 40px #00000026;transform:translateY(-5px)}.card-icon{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:15px;display:flex;font-size:40px;height:60px;justify-content:center;width:60px}.card-content h3{color:#333;font-size:28px;font-weight:700;margin-bottom:5px}.card-content p{color:#666;font-size:14px}.charts-section{margin-bottom:40px}.chart-controls{display:flex;justify-content:center;margin-bottom:30px}.view-toggle{background:#fff;border-radius:15px;box-shadow:0 5px 15px #0000001a;display:flex;overflow:hidden}.toggle-button{background:#0000;border:none;color:#666;cursor:pointer;font-size:14px;font-weight:700;padding:15px 25px;transition:all .3s ease}.toggle-button.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.toggle-button:hover:not(.active){background:#f5f5f5}.charts-grid{grid-gap:30px;display:grid;gap:30px;grid-template-columns:2fr 1fr}.chart-container{animation:fadeInUp .8s ease-out;background:#fff;border-radius:20px;box-shadow:0 10px 30px #0000001a;padding:30px}.chart-container h3{color:#333;font-size:20px;font-weight:700;margin-bottom:20px;text-align:center}.chart-wrapper{height:300px;position:relative}.details-section{margin-bottom:40px}.details-grid{grid-gap:30px;display:grid;gap:30px;grid-template-columns:1fr 1fr}.detail-card{animation:fadeInUp 1s ease-out;background:#fff;border-radius:20px;box-shadow:0 10px 30px #0000001a;padding:30px}.detail-card h3{color:#333;font-size:20px;font-weight:700;margin-bottom:20px}.letter-list{display:flex;flex-direction:column;gap:10px}.letter-item{align-items:center;border-radius:12px;color:inherit;display:flex;justify-content:space-between;padding:15px;text-decoration:none;transition:all .3s ease}.letter-item.weak{background:linear-gradient(135deg,#fff3e0,#ffebee);border-left:4px solid #ff9800}.letter-item.mastered{background:linear-gradient(135deg,#e8f5e8,#f1f8e9);border-left:4px solid #4caf50}.letter-item:hover.weak{box-shadow:0 5px 15px #ff980033;transform:translateX(5px)}.letter-item:hover.mastered{box-shadow:0 5px 15px #4caf5033;transform:translateX(5px)}.letter{color:#333;font-size:24px;font-weight:700}.letter-stats{align-items:flex-end;display:flex;flex-direction:column;gap:2px}.accuracy{color:#333;font-size:14px;font-weight:700}.attempts{color:#666;font-size:12px}.no-data{color:#666;font-style:italic;padding:20px}.action-section,.no-data{text-align:center}.action-buttons{display:flex;flex-wrap:wrap;gap:20px;justify-content:center}.action-button{align-items:center;border:none;border-radius:15px;cursor:pointer;display:inline-flex;font-size:16px;font-weight:700;gap:10px;padding:15px 30px;text-decoration:none;transition:all .3s ease}.action-button.primary{background:linear-gradient(135deg,#4caf50,#8bc34a);box-shadow:0 5px 15px #4caf504d;color:#fff}.action-button.secondary{background:linear-gradient(135deg,#ff9800,#ffc107);box-shadow:0 5px 15px #ff98004d;color:#fff}.action-button:hover{box-shadow:0 8px 25px #0003;transform:translateY(-3px)}@media (max-width:768px){.progress-container{padding:15px}.progress-header{padding:20px}.header-content h1{font-size:24px}.header-content p{font-size:16px}.overview-cards{gap:15px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.overview-card{padding:20px}.card-icon{font-size:30px;height:50px;width:50px}.card-content h3{font-size:24px}.charts-grid{gap:20px;grid-template-columns:1fr}.chart-container{padding:20px}.chart-wrapper{height:250px}.details-grid{gap:20px;grid-template-columns:1fr}.detail-card{padding:20px}.action-buttons{align-items:center;flex-direction:column}.action-button{justify-content:center;max-width:300px;width:100%}}@media (max-width:480px){.progress-container{padding:10px}.progress-header{padding:15px}.header-content h1{font-size:20px}.overview-cards{grid-template-columns:1fr}.overview-card{flex-direction:column;text-align:center}.view-toggle{flex-direction:column;width:100%}.toggle-button{font-size:12px;padding:12px}.chart-container{padding:15px}.chart-wrapper{height:200px}.letter-item{padding:12px}.letter{font-size:20px}.accuracy{font-size:12px}.attempts{font-size:10px}}*{box-sizing:border-box;margin:0;padding:0}body{background:linear-gradient(135deg,#667eea,#764ba2);color:#333;font-family:Comic Sans MS,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;min-height:100vh}.App,.app-loading{display:flex;flex-direction:column;min-height:100vh}.app-loading{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;justify-content:center}.spinner{animation:spin 1s linear infinite;border:5px solid #ffffff4d;border-radius:50%;border-top-color:#fff;height:50px;margin-bottom:20px;width:50px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.button-spinner{animation:spin 1s linear infinite;border:2px solid #ffffff4d;border-radius:50%;border-top-color:#fff;display:inline-block;height:20px;margin-right:10px;width:20px}.loading-spinner{align-items:center;color:#666;display:flex;flex-direction:column;justify-content:center;min-height:60vh}.loading-spinner .spinner{border-color:#666 #6666664d #6666664d}.loading-spinner p{font-size:18px;font-weight:700;margin-top:20px}@media (max-width:768px){body{font-size:14px}.app-loading{padding:20px}}@media (max-width:480px){body{font-size:12px}.spinner{height:40px;width:40px}}
/*# sourceMappingURL=main.65195c03.css.map*/