*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,system-ui,-apple-system,sans-serif;background:#0b0f1a;color:#e0e6f0}.app-container{min-height:100vh;position:relative;overflow-x:hidden}.canvas-bg{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none}.app-header{position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:12px 24px;background:#0f141ecc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.05)}.header-title{display:flex;align-items:center;gap:8px;font-size:1.3rem;font-weight:600;color:#fff}.sync-badge{font-size:.75rem;padding:4px 10px;border-radius:12px;background:#a855f733;color:#a78bfa}.sync-saving{background:#fbbf2433;color:#fbbf24}.sync-success{background:#34d39933;color:#34d399}.sync-error{background:#ef444433;color:#ef4444}.header-nav{display:flex;gap:8px}.nav-btn{background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:#ccc;padding:6px 14px;border-radius:8px;cursor:pointer;font-size:.85rem;transition:.2s}.nav-btn:hover{background:#a855f733;border-color:#a78bfa;color:#fff}.welcome-screen{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;min-height:80vh}.welcome-card{background:#141c32b3;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:24px;padding:40px;max-width:500px;width:90%;text-align:center;border:1px solid rgba(168,85,247,.2)}.welcome-icon{color:#a78bfa;margin-bottom:16px}.welcome-card h2{font-size:1.6rem;margin-bottom:12px}.welcome-card p{color:#94a3b8;margin-bottom:24px;line-height:1.6}.welcome-actions{display:flex;flex-direction:column;gap:16px;align-items:center}.sync-input-group{display:flex;gap:8px}.sync-input-group input{background:#ffffff14;border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:8px 12px;color:#fff;font-size:.9rem;width:200px}.primary-btn{background:linear-gradient(135deg,#a78bfa,#7c3aed);border:none;color:#fff;font-weight:600;padding:12px 28px;border-radius:12px;cursor:pointer;transition:.2s;font-size:1rem}.primary-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #7c3aed66}.secondary-btn{background:#ffffff14;border:1px solid rgba(255,255,255,.15);color:#ccc;padding:10px 24px;border-radius:10px;cursor:pointer;transition:.2s}.secondary-btn:hover{background:#ffffff1f}.dashboard-screen{position:relative;z-index:1;padding:20px;max-width:1200px;margin:0 auto}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}.dashboard-card{background:#141c3299;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:16px;padding:20px;border:1px solid rgba(255,255,255,.06)}.profile-card h3{display:flex;align-items:center;gap:10px;margin-bottom:12px}.icon-btn{background:none;border:none;color:#a78bfa;cursor:pointer;font-size:.85rem;display:flex;align-items:center;gap:4px}.profile-stats{display:flex;flex-wrap:wrap;gap:10px;font-size:.9rem;color:#94a3b8;margin-bottom:12px}.exp-bar{width:100%;height:8px;background:#ffffff1a;border-radius:4px;overflow:hidden}.exp-fill{height:100%;background:linear-gradient(90deg,#a78bfa,#f472b6);border-radius:4px;transition:.4s}.account-switch h4,.difficulty-select h4,.type-select h4,.sync-card h4{margin-bottom:10px}.account-list{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}.account-btn{background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:#ccc;padding:6px 14px;border-radius:8px;cursor:pointer;font-size:.85rem}.account-btn.active{border-color:#a78bfa;color:#a78bfa;background:#a855f726}.level-badge{margin-left:4px;color:#fbbf24}.create-account{display:flex;gap:8px}.create-account input{flex:1;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:6px 10px;color:#fff}.small-btn{background:#a78bfa;border:none;color:#fff;padding:6px 14px;border-radius:8px;cursor:pointer}.diff-buttons,.type-buttons{display:flex;gap:6px}.diff-btn,.type-btn{flex:1;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:#ccc;padding:8px 0;border-radius:8px;cursor:pointer;text-align:center}.diff-btn.active,.type-btn.active{border-color:#a78bfa;color:#fff;background:#a855f733}.quick-actions{display:flex;flex-wrap:wrap;gap:8px}.action-btn{flex:1;min-width:120px;background:#a855f71a;border:1px solid rgba(168,85,247,.2);color:#a78bfa;padding:10px;border-radius:10px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;transition:.2s}.action-btn:hover{background:#a855f733}.sync-card code{color:#fbbf24;background:#fbbf241a;padding:2px 8px;border-radius:4px;font-size:1rem}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;z-index:100;display:flex;align-items:center;justify-content:center}.modal-content{background:#141c32f2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:20px;padding:30px;max-width:500px;width:90%;max-height:80vh;overflow-y:auto;border:1px solid rgba(168,85,247,.2)}.modal-content h3{margin-bottom:16px}.history-list{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}.history-item{padding:8px 12px;border-radius:8px;font-size:.9rem}.history-correct{background:#34d3991a;color:#34d399}.history-wrong{background:#ef44441a;color:#ef4444}.close-btn{background:#ffffff14;border:1px solid rgba(255,255,255,.1);color:#ccc;padding:8px 20px;border-radius:8px;cursor:pointer}.tutor-screen{position:relative;z-index:1;display:flex;justify-content:center;padding:40px}.tutor-card{background:#141c32b3;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:24px;padding:30px;max-width:500px;width:100%;text-align:center;border:1px solid rgba(168,85,247,.2)}.tutor-card h2{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:12px}.tutor-card p{color:#94a3b8;margin-bottom:20px}.tutor-topics{display:flex;gap:12px;justify-content:center;margin-bottom:20px}.topic-btn{background:#a855f71a;border:1px solid rgba(168,85,247,.2);color:#a78bfa;padding:10px 20px;border-radius:12px;cursor:pointer;transition:.2s}.topic-btn:hover{background:#a855f733}.tutor-ai{display:flex;gap:8px;margin-bottom:12px}.tutor-input{flex:1;background:#ffffff14;border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:8px 12px;color:#fff;font-size:.9rem}.tutor-answer{background:#1e143c66;border-radius:12px;padding:14px;line-height:1.5;border:1px solid rgba(168,85,247,.15);margin:10px 0;text-align:left}.back-btn{background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:#ccc;padding:8px 20px;border-radius:8px;cursor:pointer;font-size:.85rem}.quiz-screen{position:relative;z-index:1;display:flex;justify-content:center;padding:30px}.quiz-loading{display:flex;align-items:center;gap:12px;font-size:1.2rem;color:#a78bfa}.spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.quiz-card{background:#141c32b3;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:24px;padding:30px;max-width:600px;width:100%;border:1px solid rgba(168,85,247,.2)}.quiz-header{display:flex;justify-content:space-between;margin-bottom:20px}.quiz-type-badge{background:#a855f733;color:#a78bfa;padding:4px 12px;border-radius:8px;font-size:.85rem}.quiz-lives{color:#ef4444;font-weight:600}.quiz-question{font-size:1.2rem;margin-bottom:20px;line-height:1.6}.quiz-options{display:flex;flex-direction:column;gap:10px}.option-btn{background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:#e0e6f0;padding:12px 16px;border-radius:10px;cursor:pointer;text-align:left;transition:.2s;font-size:1rem}.option-btn:hover:not(:disabled){background:#a855f726;border-color:#a78bfa}.option-btn.selected{border-color:#a78bfa;background:#a855f733}.option-btn.correct{border-color:#34d399;background:#34d39926}.option-btn.wrong{border-color:#ef4444;background:#ef444426}.check-btn{margin-top:16px;background:linear-gradient(135deg,#a78bfa,#7c3aed);border:none;color:#fff;width:100%;padding:12px;border-radius:10px;cursor:pointer;font-weight:600;font-size:1rem}.quiz-feedback{margin-top:12px;padding:12px;border-radius:10px;text-align:center;font-size:1.1rem;font-weight:600}.feedback-correct{background:#34d3991a;color:#34d399}.feedback-wrong{background:#ef44441a;color:#ef4444}.quiz-actions{display:flex;gap:10px;margin-top:16px}.next-btn{flex:1;background:#a855f733;border:1px solid #a78bfa;color:#a78bfa;padding:10px;border-radius:10px;cursor:pointer;font-weight:600}.quiz-hint{margin-top:12px;padding:10px 14px;background:#fbbf241a;border-left:4px solid #fbbf24;border-radius:8px;color:#fbbf24;font-size:.9rem}.quiz-empty{text-align:center;padding:40px}.calc-screen{position:relative;z-index:1;display:flex;justify-content:center;padding:20px}.calc-card{background:#141c32b3;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:24px;padding:24px;max-width:400px;width:100%;border:1px solid rgba(255,255,255,.06)}.calc-display{background:#0006;border-radius:12px;padding:16px;margin-bottom:16px;text-align:right}.calc-expression{font-size:.85rem;color:#94a3b8;min-height:20px}.calc-value{font-size:2rem;font-weight:600;color:#fff}.calc-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.calc-btn{padding:16px;border:none;border-radius:12px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:.1s}.calc-btn.num{background:#ffffff0f;color:#e0e6f0}.calc-btn.num:hover{background:#ffffff1a}.calc-btn.func{background:#fbbf2426;color:#fbbf24}.calc-btn.func:hover{background:#fbbf2440}.calc-btn.op{background:#a855f733;color:#a78bfa}.calc-btn.op:hover{background:#a855f74d}.calc-btn.zero{grid-column:span 2}.calc-history{margin-top:16px}.calc-history h4{font-size:.85rem;margin-bottom:8px;color:#94a3b8}.calc-history-item{font-size:.8rem;color:#64748b;padding:4px 0;border-bottom:1px solid rgba(255,255,255,.04)}.gameover-screen{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;min-height:80vh}.gameover-card{background:#141c32b3;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-radius:24px;padding:40px;max-width:450px;width:90%;text-align:center;border:1px solid rgba(168,85,247,.2)}.gameover-trophy{color:#fbbf24;margin-bottom:16px}.gameover-card h2{font-size:1.6rem;margin-bottom:12px}.gameover-card p{color:#94a3b8;margin-bottom:6px}.gameover-actions{display:flex;gap:12px;justify-content:center;margin-top:24px}@media (max-width:640px){.app-header{flex-direction:column;gap:10px}.header-nav{flex-wrap:wrap;justify-content:center}.dashboard-grid{grid-template-columns:1fr}.welcome-card{padding:24px}}
