:root{--dark-bg: #0a0e27;--dark-card: #1a1f3a;--dark-input: #252d47;--accent-purple: #7c3aed;--accent-blue: #0ea5e9;--accent-cyan: #06b6d4;--text-primary: #e0e7ff;--text-secondary: #9ca3af;--border-color: rgba(124, 58, 237, .2)}.login-container{min-height:100vh;display:flex;justify-content:center;align-items:center;background:linear-gradient(135deg,#0a0e27,#1a1f3a,#0f1629);padding:20px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;position:relative;overflow:hidden}.login-container:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 50%,rgba(7,165,229,.1) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(124,58,237,.1) 0%,transparent 50%);pointer-events:none;z-index:1}.login-container:after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(90deg,transparent 0%,rgba(6,182,212,.03) 50%,transparent 100%),linear-gradient(0deg,rgba(124,58,237,.05) 0%,transparent 100%);pointer-events:none;z-index:0;animation:drift 8s ease-in-out infinite}@keyframes drift{0%,to{transform:translateY(0)}50%{transform:translateY(20px)}}.login-card{background:linear-gradient(135deg,#1a1f3acc,#14192dcc);padding:40px;border-radius:20px;box-shadow:0 8px 32px #0006,0 0 40px #7c3aed26,inset 0 1px 1px #ffffff1a;max-width:420px;width:100%;text-align:center;border:1px solid var(--border-color);animation:slideUp .8s ease-out;position:relative;z-index:2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}@keyframes slideUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.login-card h1{margin:0 0 16px;color:#e0e7ff;font-size:2.2em;font-weight:700;letter-spacing:-.5px;background:linear-gradient(135deg,#06b6d4,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.login-card h2{color:#e0e7ff;font-size:1.5em;margin:24px 0 12px;font-weight:600}.login-card h3{color:#cbd5e1;font-size:1.1em;margin:20px 0 12px;font-weight:600;color:var(--accent-cyan)}.login-card p{color:var(--text-secondary);margin-bottom:16px;line-height:1.6;font-size:.95em}.login-card ul,.login-card ol{text-align:left;color:var(--text-secondary);margin:12px 0 16px;padding-left:24px;line-height:1.8}.login-card li{margin-bottom:8px}.welcome-content{max-height:60vh;overflow-y:auto;padding-right:8px;margin-bottom:20px}.welcome-content::-webkit-scrollbar{width:6px}.welcome-content::-webkit-scrollbar-track{background:#7c3aed0d;border-radius:10px}.welcome-content::-webkit-scrollbar-thumb{background:#7c3aed4d;border-radius:10px}.welcome-content::-webkit-scrollbar-thumb:hover{background:#7c3aed80}.error-message{background:linear-gradient(135deg,#dc26261a,#ef44441a);color:#fca5a5;padding:12px 16px;border-radius:12px;margin-bottom:20px;border-left:4px solid #ef4444;border:1px solid rgba(239,68,68,.3);font-size:14px;font-weight:500;animation:shake .3s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.auth-form{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}.auth-form input{padding:12px 16px;border:1px solid var(--border-color);border-radius:12px;font-size:15px;transition:all .3s ease;background:var(--dark-input);color:var(--text-primary);font-family:inherit}.auth-form input::placeholder{color:var(--text-secondary)}.auth-form input:focus{outline:none;border-color:var(--accent-cyan);background:#06b6d40d;box-shadow:0 0 0 3px #06b6d41a}.auth-form input:disabled{background:#0003;cursor:not-allowed;opacity:.5}.primary-btn{padding:12px 24px;background:linear-gradient(135deg,var(--accent-purple) 0%,var(--accent-blue) 100%);color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #7c3aed66,0 0 20px #0ea5e933;border:1px solid rgba(255,255,255,.1)}.primary-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #7c3aed99,0 0 30px #0ea5e94d}.primary-btn:active:not(:disabled){transform:translateY(0)}.primary-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.divider{display:flex;align-items:center;text-align:center;margin:20px 0;color:var(--text-secondary);font-size:14px}.divider:before,.divider:after{content:"";flex:1;border-bottom:1px solid var(--border-color)}.divider span{padding:0 12px;font-weight:500;color:var(--text-secondary)}.google-signin-btn{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:12px 24px;background:linear-gradient(135deg,#06b6d41a,#0ea5e91a);border:1px solid var(--border-color);border-radius:12px;font-size:16px;font-weight:500;cursor:pointer;transition:all .3s ease;color:var(--text-primary);box-shadow:0 2px 8px #0003}.google-signin-btn:hover:not(:disabled){border-color:var(--accent-cyan);box-shadow:0 6px 20px #06b6d433,0 0 20px #06b6d41a;transform:translateY(-2px);background:linear-gradient(135deg,#06b6d426,#0ea5e926)}.google-signin-btn:active:not(:disabled){transform:translateY(0)}.google-signin-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.google-icon{width:20px;height:20px}.guest-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px 24px;background:linear-gradient(135deg,#7c3aed26,#8b5cf626);border:1px solid rgba(139,92,246,.3);border-radius:12px;font-size:15px;font-weight:500;cursor:pointer;transition:all .3s ease;color:#c4b5fd;margin-top:12px;box-shadow:0 2px 8px #0003}.guest-btn:hover:not(:disabled){border-color:var(--accent-purple);box-shadow:0 6px 20px #7c3aed4d,0 0 20px #7c3aed1a;transform:translateY(-2px);background:linear-gradient(135deg,#7c3aed40,#8b5cf640);color:#e9d5ff}.guest-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.guest-warning{font-size:12px;color:var(--accent-cyan);margin-top:8px;line-height:1.5;padding:8px;background:#06b6d41a;border-radius:8px;border-left:2px solid var(--accent-cyan)}.toggle-mode{margin:20px 0;text-align:center}.link-btn{background:none;border:none;color:var(--accent-cyan);cursor:pointer;font-size:14px;text-decoration:none;transition:all .3s ease;font-weight:500}.link-btn:hover{color:var(--accent-purple);text-decoration:underline}.features{display:flex;justify-content:space-around;margin-top:40px;padding-top:30px;border-top:1px solid var(--border-color)}.feature{display:flex;flex-direction:column;gap:8px;font-size:13px;color:var(--text-secondary);padding:12px;border-radius:12px;transition:all .3s ease}.feature:hover{background:#7c3aed1a;color:var(--text-primary)}.feature-icon{font-size:28px}@media (max-width: 768px){.login-container{padding:16px}.login-card{padding:32px 20px;border-radius:16px;max-width:100%}.login-card h1{font-size:1.8em;margin-bottom:12px}.login-card h2{font-size:1.2em;margin:20px 0 10px}.login-card h3{font-size:.95em;margin:16px 0 10px}.login-card p{font-size:.9em;margin-bottom:12px}.welcome-content{max-height:55vh;margin-bottom:16px}.auth-form{gap:10px;margin-bottom:16px}.auth-form input{padding:10px 14px;font-size:14px;border-radius:10px}.primary-btn,.google-signin-btn,.guest-btn{padding:10px 20px;font-size:14px;border-radius:10px}.google-icon{width:18px;height:18px}.guest-warning{font-size:11px;padding:6px;margin-top:6px}.features{gap:12px;margin-top:30px;padding-top:20px}.feature{padding:8px;font-size:12px}.feature-icon{font-size:24px}.divider{margin:16px 0;font-size:12px}.toggle-mode{margin:16px 0}.link-btn{font-size:12px}}@media (max-width: 480px){.login-container{padding:12px}.login-card{padding:24px 16px;border-radius:14px;box-shadow:0 4px 24px #0006,0 0 30px #7c3aed1a}.login-card h1{font-size:1.5em;margin-bottom:10px}.login-card h2{font-size:1.1em;margin:16px 0 8px}.login-card h3{font-size:.9em;margin:14px 0 8px}.login-card p{font-size:.85em;margin-bottom:10px}.login-card ul,.login-card ol{font-size:.85em;margin:10px 0 14px;padding-left:20px}.login-card li{margin-bottom:6px}.welcome-content{max-height:50vh;margin-bottom:14px;padding-right:4px}.error-message{padding:10px 12px;margin-bottom:16px;font-size:12px;border-radius:8px}.auth-form{gap:8px;margin-bottom:14px}.auth-form input{padding:9px 12px;font-size:14px;border-radius:8px}.auth-form input::placeholder{font-size:13px}.primary-btn,.google-signin-btn,.guest-btn{padding:9px 16px;font-size:13px;border-radius:8px}.primary-btn{margin-top:4px}.google-signin-btn{gap:10px}.google-icon{width:16px;height:16px}.guest-btn{gap:6px;margin-top:8px;font-size:13px}.guest-warning{font-size:10px;padding:5px 6px;margin-top:4px}.divider{margin:12px 0;font-size:11px}.divider span{padding:0 8px;font-size:11px}.features{flex-direction:column;gap:10px;margin-top:24px;padding-top:16px}.feature{padding:6px 8px;font-size:11px;gap:6px}.feature-icon{font-size:20px}.toggle-mode{margin:12px 0}.link-btn{font-size:11px}}@media (max-height: 600px) and (max-width: 480px){.welcome-content{max-height:40vh}.features{margin-top:16px;padding-top:12px;gap:8px}.feature{padding:4px 6px;font-size:10px}.feature-icon{font-size:18px}}.class-card{background:linear-gradient(135deg,#14192d99,#1a1f3a99);border-radius:0;box-shadow:0 4px 20px #0000004d,0 0 30px #7c3aed14;overflow:hidden;flex:1;display:flex;flex-direction:column;height:100%;gap:0;border-left:1px solid rgba(124,58,237,.2)}.class-card-content{flex:1;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;background:linear-gradient(180deg,#0a0e274d,#1a1f3a4d);min-height:0;order:3}.class-header{padding:8px 16px;background:transparent;color:#ffffffb3;display:flex;justify-content:space-between;align-items:center;flex-shrink:0;order:1;box-shadow:none}.class-header h2{margin:0;font-size:.9em;font-weight:400;letter-spacing:-.3px}.overall-grade{display:flex;flex-direction:column;align-items:flex-end}.class-actions{display:flex;align-items:center;gap:16px}.recalc-btn{padding:8px 14px;border:none;border-radius:8px;background:#ffffff26;color:#fff;font-weight:600;cursor:pointer;transition:all .3s;box-shadow:0 2px 8px #0003}.recalc-btn:hover{background:#ffffff40;box-shadow:0 4px 12px #0000004d}.grade-number{font-size:1.8em;font-weight:700;line-height:1;text-shadow:0 2px 8px rgba(0,0,0,.3)}.letter-grade{font-size:.9em;opacity:.95}.categories-tabs{display:flex;gap:8px;padding:16px;border-bottom:1px solid rgba(124,58,237,.2);overflow-x:auto;background:linear-gradient(90deg,#14192dcc,#1a1f3acc);flex-shrink:0;order:2}.weight-warning{padding:10px 16px;background:linear-gradient(135deg,#f59e0b26,#d9770626);color:#fbbf24;font-weight:600;font-size:.9em;border-bottom:1px solid rgba(245,158,11,.2);flex-shrink:0}.tab{padding:10px 16px;border:1px solid rgba(124,58,237,.2);background:linear-gradient(135deg,#1a1f3a80,#14192d80);border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;transition:all .3s;white-space:nowrap;display:flex;flex-direction:column;align-items:center;gap:4px;color:#cbd5e1}.tab:hover{background:linear-gradient(135deg,#06b6d426,#7c3aed26);border-color:#06b6d466;color:#e0e7ff}.tab.active{background:linear-gradient(135deg,#06b6d4,#7c3aed);color:#fff;border-color:transparent;box-shadow:0 4px 15px #06b6d44d}.tab .weight{font-size:12px;opacity:.8}.add-tab{background:transparent;border:2px dashed rgba(124,58,237,.4);color:#9ca3af}.add-tab:hover{border-color:#7c3aed;color:#e0e7ff;background:#7c3aed1a}.add-form{padding:16px;background:#1a1f3a80;border-bottom:1px solid rgba(124,58,237,.2);display:flex;gap:12px;flex-wrap:wrap}.add-form input{flex:1;min-width:150px;padding:10px 12px;border:1px solid #555;border-radius:6px;font-size:14px;background:#2a2a2a;color:#e0e0e0}.category-content{padding:24px;background:#2a2a2a;flex:1;overflow-y:auto;overflow-x:hidden}.category-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.category-title{display:flex;align-items:center;gap:12px}.category-actions{display:flex;gap:8px}.icon-btn{width:28px;height:28px;border-radius:50%;border:none;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center}.category-actions .edit-btn{background:#e8ebff;color:#5568d3}.category-actions .edit-btn:hover{background:#dfe4ff}.category-actions .delete-btn{background:#ffe7e7;color:#c62828}.category-actions .delete-btn:hover{background:#ffd6d6}.category-header h3{margin:0;color:#e0e0e0}.category-grade{font-size:1.2em;font-weight:700;color:#7c3aed;display:flex;flex-direction:column;align-items:flex-end;gap:6px}.category-grade .contribution{font-size:.9em;font-weight:500;color:#888}.assignments-section{margin-bottom:24px}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:12px}.section-header h4{margin:0;color:#999;font-size:1em;text-transform:uppercase;letter-spacing:.5px}.assignment-buttons{display:flex;gap:8px;flex-wrap:wrap}.add-btn-small{padding:6px 12px;background:#7c3aed;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:13px;transition:background .3s}.add-btn-small:hover{background:#6d28d9}.add-test-btn{background:linear-gradient(135deg,#f093fb,#f5576c)}.add-test-btn:hover{filter:brightness(.95)}.assignments-list{display:flex;flex-direction:column;gap:12px}.assignment-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#333;border-radius:8px;transition:background .3s;gap:12px}.assignment-item:hover{background:#3a3a3a}.assignment-item.test-assignment{background:#fff0f6;border:1px solid #ffd6e7}.assignment-item.test-assignment:hover{background:#ffe6f2}.test-badge{margin-left:8px;padding:2px 6px;border-radius:10px;background:#ff7eb3;color:#fff;font-size:11px;font-weight:600}.assignment-info{display:flex;flex-direction:column;flex:1;gap:8px}.assignment-name-row{display:flex;align-items:center;gap:8px}.assignment-name{font-weight:500;color:#e0e7ff;flex:1}.assignment-details{display:flex;align-items:center;gap:12px}.assignment-grade{min-width:60px;font-weight:600;color:#7c3aed}.assignment-flag-select{padding:6px 10px;border:1px solid #555;border-radius:4px;background:#2a2a2a;color:#e0e7ff;font-size:.85em;cursor:pointer;transition:all .3s;flex:1;max-width:180px}.assignment-flag-select:hover{border-color:#7c3aed}.assignment-flag-select:focus{outline:none;border-color:#7c3aed;box-shadow:0 0 8px #7c3aed4d}.assignment-flag-select.flag-missing{border-color:#ef4444;color:#ef4444}.assignment-flag-select.flag-late{border-color:#f59e0b;color:#f59e0b}.assignment-flag-select.flag-exempt{border-color:#8b5cf6;color:#8b5cf6}.assignment-flag-select.flag-dropped{border-color:#06b6d4;color:#06b6d4}.assignment-flag-select.flag-incomplete{border-color:#ec4899;color:#ec4899}.assignment-flag-select.flag-unscored{border-color:#6366f1;color:#6366f1}.assignment-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.edit-btn-small{width:28px;height:28px;border-radius:50%;background:#667eea1f;border:none;color:#5568d3;font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s}.edit-btn-small:hover{background:#667eea38}.assignment-name{color:#e0e0e0;font-weight:500}.assignment-grade{color:#7c3aed;font-weight:700;font-size:1.1em}.delete-btn-small{width:28px;height:28px;border-radius:50%;background:#f443361a;border:none;color:#f44336;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s}.delete-btn-small:hover{background:#f4433633}.what-if-section{margin-top:32px;padding-top:24px;border-top:2px solid #444}.what-if-toggle{width:100%;padding:12px 16px;background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:transform .3s}.what-if-toggle:hover{transform:translateY(-2px)}.what-if-content{margin-top:16px;padding:20px;background:#333;border-radius:8px}.what-if-content p{margin:0 0 12px;color:#999;font-weight:500}.what-if-content input{width:100%;padding:12px;border:2px solid #555;border-radius:8px;font-size:16px;margin-bottom:16px;background:#2a2a2a;color:#e0e0e0}.what-if-result{text-align:center;padding:20px;background:#333;border-radius:8px;box-shadow:0 2px 8px #0000004d}.result-grade{margin:16px 0;display:flex;flex-direction:column;align-items:center;gap:8px}.result-grade .grade-number{font-size:3em;font-weight:700;color:#7c3aed}.result-grade .letter-grade{font-size:1.5em;color:#9f7aea}.grade-change{font-size:1.2em;font-weight:700;margin-top:12px}.hint{text-align:center;color:#999;font-size:.9em;margin-top:12px}@media (max-width: 768px){.class-header{flex-direction:column;align-items:flex-start;gap:16px}.categories-tabs{flex-wrap:nowrap;overflow-x:auto}.add-form{flex-direction:column}.add-form input{width:100%}.assignment-info{flex-direction:column;align-items:flex-start;gap:8px}}.class-card-redesign{background:transparent;display:flex;flex-direction:column;height:100%;overflow:hidden}.hero-header{position:sticky;top:0;z-index:100;background:#14192dcc;padding:16px 24px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 8px #0003;border-bottom:1px solid rgba(124,58,237,.1)}.header-left{display:flex;align-items:center;gap:12px;flex:1}.back-to-class-btn{padding:8px 12px;background:#7c3aed33;border:1px solid rgba(124,58,237,.3);border-radius:6px;color:#a78bfa;cursor:pointer;font-size:.9em;transition:all .2s ease;white-space:nowrap}.back-to-class-btn:hover{background:#7c3aed4d;border-color:#7c3aed80}.header-left .class-name{margin:0;font-size:1.4em;font-weight:600;color:#ffffffe6;text-shadow:none}.header-right{display:flex;align-items:center;gap:16px}.overall-grade-large{display:flex;align-items:baseline;gap:6px;text-align:right}.grade-number-large{font-size:2.2em;font-weight:800;color:#fff;text-shadow:0 3px 12px rgba(0,0,0,.4);line-height:1}.letter-grade-large{font-size:1.4em;font-weight:600;color:#ffffffe6;text-shadow:0 2px 6px rgba(0,0,0,.3)}.import-btn-header{padding:10px 16px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s;font-size:.95em;box-shadow:0 2px 8px #10b9814d}.import-btn-header:hover{background:linear-gradient(135deg,#059669,#047857);transform:translateY(-1px);box-shadow:0 4px 12px #10b98180}.categories-tabs-integrated{display:flex;gap:4px;padding:12px 24px;background:#14192de6;border-bottom:2px solid rgba(124,58,237,.3);overflow-x:auto;flex-shrink:0}.tab-integrated{padding:10px 16px;background:#ffffff0d;border:1px solid rgba(124,58,237,.2);border-radius:8px;color:#ffffffb3;font-weight:600;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:100px}.tab-integrated:hover{background:#ffffff1a;border-color:#7c3aed66}.tab-integrated.active{background:linear-gradient(135deg,#06b6d44d,#7c3aed4d);border-color:#7c3aed;color:#fff;box-shadow:0 0 20px #7c3aed66}.tab-name{font-size:.95em}.tab-weight{font-size:.8em;opacity:.7}.tab-grade{font-size:1.1em;font-weight:700;color:#06b6d4}.tab-integrated.add-tab{background:#7c3aed33;border-color:#7c3aed66;color:#a78bfa;min-width:auto}.weight-warning-bar{padding:12px 24px;background:linear-gradient(135deg,#f59e0b33,#d9770633);color:#fbbf24;font-weight:600;text-align:center;border-bottom:1px solid rgba(245,158,11,.3)}.inline-form{padding:16px 24px;background:#14192d99;display:flex;gap:12px;align-items:center;border-bottom:1px solid rgba(124,58,237,.2)}.inline-form input{padding:10px 14px;background:#ffffff0d;border:1px solid rgba(124,58,237,.3);border-radius:8px;color:#fff;font-size:.95em}.inline-form input[type=number]{width:100px}.assignments-container{flex:1;overflow-y:auto;padding:0;background:#0a0e2766}.assignments-table-header{display:grid;grid-template-columns:1fr 200px 180px 100px;gap:16px;padding:16px 24px;background:#14192dcc;border-bottom:2px solid rgba(124,58,237,.3);font-weight:700;font-size:.85em;text-transform:uppercase;letter-spacing:.5px;color:#fff9;position:sticky;top:0;z-index:10}.col-name{display:flex;align-items:center}.col-score{display:flex;align-items:center;justify-content:center}.col-flags{display:flex;align-items:center;justify-content:center;gap:6px}.col-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}.assignment-row{display:grid;grid-template-columns:1fr 200px 180px 100px;gap:16px;padding:14px 24px;background:#1a1f3a66;border-bottom:1px solid rgba(124,58,237,.1);transition:all .2s;align-items:center}.assignment-row:hover{background:#1a1f3a99;border-color:#7c3aed33}.assignment-row.test-assignment{background:#7c3aed26}.assignment-name-text{font-size:1em;font-weight:500;color:#fff}.test-badge-small{display:inline-block;padding:2px 8px;background:#7c3aed4d;color:#a78bfa;border-radius:4px;font-size:.7em;font-weight:700;margin-left:8px;text-transform:uppercase}.score-display{font-size:1.1em;font-weight:700;color:#06b6d4}.score-percent{font-size:.9em;color:#ffffff80;margin-left:8px}.flag-icon{width:32px;height:32px;border-radius:50%;border:2px solid rgba(255,255,255,.2);background:#ffffff0d;color:#fff6;font-weight:700;font-size:.85em;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.flag-icon:hover{border-color:#fff6;background:#ffffff1a;transform:scale(1.1)}.flag-icon.active{background:linear-gradient(135deg,#ef4444,#dc2626);border-color:#ef4444;color:#fff;box-shadow:0 0 12px #ef444480}.flag-icon.active:nth-child(2){background:linear-gradient(135deg,#6b7280,#4b5563);border-color:#6b7280;box-shadow:0 0 12px #6b728080}.flag-icon.active:nth-child(3){background:linear-gradient(135deg,#f59e0b,#d97706);border-color:#f59e0b;box-shadow:0 0 12px #f59e0b80}.flag-icon.active:nth-child(4){background:linear-gradient(135deg,#8b5cf6,#7c3aed);border-color:#8b5cf6;box-shadow:0 0 12px #8b5cf680}.icon-btn{width:32px;height:32px;border-radius:6px;border:none;background:#ffffff1a;color:#ffffffb3;font-size:1.1em;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.icon-btn:hover{background:#fff3;color:#fff;transform:scale(1.1)}.icon-btn.delete:hover{background:#ef44444d;color:#ef4444}.icon-btn.save{background:#10b9814d;color:#10b981}.icon-btn.save:hover{background:#10b98180}.icon-btn.cancel{background:#ef44444d;color:#ef4444}.icon-btn-header{width:28px;height:28px;border-radius:6px;border:none;background:#ffffff1a;color:#fff9;font-size:1em;cursor:pointer;transition:all .2s}.icon-btn-header:hover{background:#fff3;color:#fff}.icon-btn-header.delete:hover{background:#ef44444d;color:#ef4444}.ghost-row{padding:20px 24px;text-align:center;color:#fff6;font-style:italic;cursor:pointer;transition:all .2s;background:#1a1f3a33;border-bottom:1px solid rgba(124,58,237,.1)}.ghost-row:hover{background:#1a1f3a66;color:#fff9}.assignment-row.add-row{background:#7c3aed1a;border-color:#7c3aed4d}.row-input{width:100%;padding:8px 12px;background:#ffffff0d;border:1px solid rgba(124,58,237,.3);border-radius:6px;color:#fff;font-size:.95em}.row-input:focus{outline:none;border-color:#7c3aed;box-shadow:0 0 12px #7c3aed4d}.score-input{width:120px}.empty-state-row{padding:60px 24px;text-align:center;color:#fff6;font-size:1.1em}@media (max-width: 768px){.class-card{border-left:none}.class-header{padding:12px;flex-wrap:wrap;gap:12px}.class-header h2{font-size:.85em}.overall-grade{gap:4px}.grade-number{font-size:1.5em}.letter-grade{font-size:.85em}.class-actions{gap:8px}.recalc-btn{padding:6px 10px;font-size:.85em}.categories-tabs{padding:12px 8px;gap:6px}.tab{padding:8px 12px;font-size:13px;min-width:70px}.add-form{padding:12px;gap:8px}.add-form input{min-width:100px;padding:8px 10px;font-size:13px}.category-content{padding:16px}.category-header{margin-bottom:16px}.category-title{gap:8px}.category-grade{font-size:1em}.section-header{flex-wrap:wrap;gap:8px;margin-bottom:12px}.section-header h4{font-size:.9em}.add-btn-small{padding:5px 10px;font-size:12px}.assignments-list{gap:8px}.assignment-item{flex-direction:column;align-items:flex-start;padding:12px;gap:8px}.assignment-info,.assignment-name-row{width:100%}.assignment-details{width:100%;flex-wrap:wrap}.assignment-grade{min-width:auto}.assignment-flag-select{flex:1;min-width:150px;max-width:none}.assignment-actions{width:100%;justify-content:flex-start;gap:6px}.edit-btn-small,.delete-btn-small{width:24px;height:24px;font-size:12px}.what-if-toggle{padding:10px 12px;font-size:14px}.what-if-content{margin-top:12px;padding:16px}.what-if-content input{padding:10px;font-size:14px;margin-bottom:12px}.result-grade .grade-number{font-size:2em}.result-grade .letter-grade{font-size:1.2em}.hero-header{flex-direction:column;align-items:flex-start;gap:12px;padding:12px}.header-left{width:100%;gap:8px}.back-to-class-btn{padding:6px 10px;font-size:.85em}.header-left .class-name{font-size:1.2em}.header-right{width:100%;justify-content:space-between;gap:12px;flex-wrap:wrap}.grade-number-large{font-size:2em}.letter-grade-large{font-size:1.2em}.import-btn-header{padding:8px 12px;font-size:.85em;flex:1;min-width:120px}.categories-tabs-integrated{padding:8px 12px;gap:4px}.tab-integrated{min-width:75px;padding:8px 12px;font-size:.9em}.tab-name{font-size:.85em}.tab-weight{font-size:.7em}.tab-grade{font-size:.95em}.weight-warning-bar{padding:10px 12px;font-size:.85em}.inline-form{padding:12px;gap:8px;flex-wrap:wrap}.inline-form input{padding:8px 10px;font-size:.9em}.inline-form input[type=number]{width:80px}.assignments-table-header,.assignment-row{grid-template-columns:1fr 100px 100px 70px;gap:8px;padding:10px 12px}.assignments-table-header{font-size:.75em;padding:10px 12px}.assignment-name-text{font-size:.95em}.test-badge-small{font-size:.65em;padding:2px 6px;margin-left:6px}.score-display{font-size:.95em}.score-percent{font-size:.8em}.flag-icon{width:28px;height:28px;font-size:.8em}.icon-btn{width:28px;height:28px;font-size:.95em}.ghost-row{padding:16px 12px;font-size:.95em}.empty-state-row{padding:40px 12px;font-size:.95em}}@media (max-width: 480px){.class-card{border-radius:0}.class-header{padding:10px 8px;flex-direction:column;gap:8px}.class-header h2{font-size:.8em}.overall-grade{gap:3px}.grade-number{font-size:1.3em}.letter-grade{font-size:.8em}.class-actions{gap:6px;width:100%}.recalc-btn{padding:5px 8px;font-size:.75em;flex:1}.categories-tabs{padding:8px 6px;gap:4px;overflow-x:auto;-webkit-overflow-scrolling:touch}.tab{padding:6px 10px;font-size:12px;min-width:65px}.weight-warning{padding:8px 10px;font-size:.8em}.add-form{padding:10px;gap:6px;flex-direction:column}.add-form input{width:100%;min-width:auto;padding:8px 10px;font-size:12px}.category-content{padding:12px}.category-header{margin-bottom:12px;flex-wrap:wrap;gap:10px}.category-title{gap:6px}.category-title h3{font-size:.95em}.category-actions{gap:4px;width:100%;justify-content:flex-start}.icon-btn{width:24px;height:24px}.category-grade{font-size:.9em;align-items:flex-start}.assignments-section{margin-bottom:16px}.section-header{gap:6px;margin-bottom:10px}.section-header h4{font-size:.85em}.add-btn-small{padding:4px 8px;font-size:11px}.assignments-list{gap:6px}.assignment-item{padding:10px;gap:6px;border-radius:6px}.assignment-name,.assignment-grade{font-size:.9em}.assignment-flag-select{max-width:none;flex:1;padding:6px 8px;font-size:.8em}.assignment-actions{gap:4px}.edit-btn-small,.delete-btn-small{width:20px;height:20px;font-size:11px}.what-if-toggle{padding:8px 10px;font-size:13px}.what-if-content{margin-top:10px;padding:12px}.what-if-content p{font-size:.85em;margin-bottom:10px}.what-if-content input{padding:8px;font-size:13px;margin-bottom:10px}.what-if-result{padding:16px}.result-grade{margin:12px 0}.result-grade .grade-number{font-size:1.8em}.result-grade .letter-grade{font-size:1em}.grade-change{font-size:1em;margin-top:10px}.hint{font-size:.8em;margin-top:10px}.hero-header{padding:10px 8px;gap:8px}.header-left{width:100%;gap:6px}.back-to-class-btn{padding:5px 8px;font-size:.8em}.header-left .class-name{font-size:1.05em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}.header-right{width:100%;gap:8px}.overall-grade-large{gap:4px}.grade-number-large{font-size:1.6em}.letter-grade-large{font-size:1em}.import-btn-header{padding:6px 10px;font-size:.75em;flex:1}.categories-tabs-integrated{padding:6px 8px;gap:3px}.tab-integrated{min-width:65px;padding:6px 8px;font-size:.8em}.tab-name{font-size:.75em}.tab-weight{font-size:.65em}.tab-grade{font-size:.85em}.weight-warning-bar{padding:8px;font-size:.75em}.inline-form{padding:10px;gap:6px}.inline-form input{padding:6px 8px;font-size:.85em}.inline-form input[type=number]{width:70px}.assignments-table-header,.assignment-row{grid-template-columns:1fr 80px 80px 60px;gap:6px;padding:8px}.assignments-table-header{font-size:.7em}.col-name,.col-score,.col-flags,.col-actions{font-size:.65em}.assignment-name-text{font-size:.85em}.test-badge-small{font-size:.6em;padding:1px 4px;margin-left:4px}.score-display{font-size:.85em}.score-percent{font-size:.7em;margin-left:4px}.flag-icon{width:24px;height:24px;border-width:1px;font-size:.7em}.icon-btn{width:24px;height:24px;font-size:.9em}.icon-btn-header{width:24px;height:24px}.ghost-row{padding:12px 8px;font-size:.85em}.empty-state-row{padding:30px 8px;font-size:.85em}}@media (max-width: 320px){.hero-header{padding:8px 6px}.header-left .class-name{font-size:.95em;max-width:140px}.grade-number-large{font-size:1.4em}.import-btn-header{padding:5px 8px;font-size:.7em}.assignments-table-header,.assignment-row{grid-template-columns:1.2fr 70px 60px 50px;padding:6px}.tab-integrated{min-width:55px;padding:5px 6px}}.add-assignment-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:4000;padding:20px}.modal-content-add{background:linear-gradient(135deg,#1a1a2e,#16213e);border-radius:20px;padding:24px;max-width:480px;width:100%;max-height:85vh;overflow-y:auto;box-shadow:0 20px 60px #0009,0 0 40px #667eea26;border:1px solid rgba(102,126,234,.3)}.modal-content-add h3{margin:0 0 18px;font-size:1.4em;color:#fff;text-align:center;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.5px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:18px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{color:#aaa;font-size:.8em;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.form-group input,.form-group select,.form-group textarea{padding:10px 12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:10px;color:#fff;font-size:1em;transition:all .3s ease;font-family:inherit}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;background:#ffffff14;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-group input:disabled{opacity:.5;cursor:not-allowed}.form-group textarea{resize:vertical;min-height:80px;line-height:1.5}.form-group select{cursor:pointer}@media (max-width: 768px){.form-grid{grid-template-columns:1fr}.modal-content-add{padding:25px}.modal-content-add h3{font-size:1.4em}}@media (max-width: 480px){.add-assignment-modal{padding:10px}.modal-content-add{padding:20px}.modal-content-add h3{font-size:1.2em;margin-bottom:20px}.form-grid{gap:15px;margin-bottom:20px}.form-group input,.form-group select,.form-group textarea{padding:10px 12px;font-size:.95em}}.modal-choice{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;min-height:auto}.modal-choice h3{font-size:1.7em;margin:0;text-align:center;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.5px}.choice-buttons{display:grid;grid-template-columns:1fr;gap:18px;width:100%;margin-bottom:25px}.choice-btn{padding:32px 28px!important;background:linear-gradient(135deg,#2a3a7a,#1f2f5a)!important;border:2px solid #667eea!important;border-radius:18px!important;cursor:pointer!important;transition:all .3s ease!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:16px!important;color:#fff!important;font-weight:600!important;text-align:center!important;box-shadow:0 8px 24px #667eea66,inset 0 1px #ffffff1a!important;position:relative!important;overflow:hidden!important;appearance:none!important;-webkit-appearance:none!important;-moz-appearance:none!important;font-family:inherit!important;font-size:1em!important}.choice-btn:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(102,126,234,.15) 0%,transparent 100%);pointer-events:none}.choice-btn:hover{background:linear-gradient(135deg,#3a4a8a,#2f3f6a)!important;border-color:#8b9dff!important;transform:translateY(-4px)!important;box-shadow:0 14px 36px #667eea99,inset 0 1px #ffffff26!important}.choice-btn:active{transform:translateY(-2px)!important}.choice-icon{font-size:3.2em;display:block;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}.choice-title{font-size:1.25em;font-weight:700;letter-spacing:.6px;color:#fff}.choice-desc{font-size:.95em;color:#fffc;font-weight:400;line-height:1.5}.quick-form{grid-template-columns:1fr}.help-text{display:block;font-size:.8em;color:#888;margin-top:5px;font-style:italic}.back-to-choice-btn{position:absolute;top:15px;left:15px;width:40px;height:40px;border-radius:50%;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;font-size:1.5em;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;font-weight:600}.back-to-choice-btn:hover{background:#ffffff26;border-color:#fff6;transform:scale(1.1)}.modal-content-add{position:relative}@media (max-width: 600px){.choice-buttons{grid-template-columns:1fr;gap:16px}.choice-btn{padding:24px 20px;gap:12px}.choice-icon{font-size:2.5em}.choice-title{font-size:1.1em}.choice-desc{font-size:.85em}}@media (max-width: 480px){.choice-btn{padding:20px;gap:10px}.choice-icon{font-size:2em}.choice-title{font-size:1em}.choice-desc{font-size:.8em}.back-to-choice-btn{width:35px;height:35px;font-size:1.3em}}.grades-view{display:flex;flex-direction:column;height:100%;background:#1a1a1a;width:100%}.grades-header{background:#222;padding:24px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 4px #0000004d}.grades-header-actions{display:flex;align-items:center;gap:16px}.info-header-btn{padding:10px 14px;border:2px solid #444;border-radius:8px;background:#2a2a2a;color:#e0e0e0;font-weight:600;cursor:pointer;transition:all .2s}.info-header-btn:hover{border-color:#7c3aed;color:#7c3aed;background:#7c3aed14}.semester-gpa-group{display:flex;gap:12px}.add-class-header-btn{padding:10px 16px;border:2px dashed #7c3aed;border-radius:8px;background:transparent;color:#7c3aed;font-weight:700;cursor:pointer;transition:all .2s}.add-class-header-btn:hover{background:#7c3aed14;border-color:#7c3aed}.grades-header h1{margin:0;font-size:2em;color:#e0e0e0}.gpa-display{display:flex;flex-direction:column;align-items:center;background:linear-gradient(135deg,#7c3aed,#6d28d9);color:#fff;padding:16px 32px;border-radius:12px;min-width:120px}.gpa-value{font-size:2.5em;font-weight:700;line-height:1}.gpa-label{font-size:.9em;margin-top:4px;opacity:.9}.quarters-selector{display:flex;gap:12px;padding:16px 24px;background:#222;border-bottom:1px solid #333;flex-wrap:wrap;align-items:center}.default-quarter{display:flex;align-items:center;gap:8px;margin-left:8px;padding:6px 10px;background:#333;border-radius:8px;border:1px solid #444}.default-quarter span{font-size:.85em;color:#999;font-weight:600}.default-quarter select{border:none;background:transparent;font-weight:600;color:#b0b0b0;cursor:pointer}.quarter-btn{padding:8px 16px;border:2px solid #444;background:#333;border-radius:8px;cursor:pointer;font-weight:500;font-size:.95em;transition:all .3s;color:#b0b0b0}.quarter-btn:hover{border-color:#7c3aed;color:#7c3aed}.quarter-btn.active{background:#7c3aed;color:#fff;border-color:#7c3aed}.add-class-quick-btn{padding:8px 16px;background:transparent;border:2px dashed #ddd;border-radius:8px;cursor:pointer;font-weight:600;color:#667eea;transition:all .3s;margin-left:auto}.add-class-quick-btn:hover{border-color:#667eea;background:#667eea0d}.add-class-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.info-title{font-weight:700;margin:16px 0 8px;color:#7c3aed}.info-support,.info-features,.info-title,.info-note{word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;width:100%;max-width:100%}.modal-content{background:#222;border-radius:12px;padding:32px;min-width:400px;box-shadow:0 8px 24px #00000080}.modal-content h3{margin:0 0 20px;font-size:1.5em;color:#e0e0e0}.modal-content input,.quarter-select{width:100%;padding:12px;margin-bottom:12px;border:2px solid #444;border-radius:8px;font-size:1em;transition:border-color .3s;background:#333;color:#e0e0e0}.import-textarea{width:100%;padding:12px;margin-bottom:12px;border:2px solid #444;border-radius:8px;font-size:.95em;transition:border-color .3s;background:#333;color:#e0e0e0;resize:vertical}.import-textarea:focus{outline:none;border-color:#7c3aed}.modal-content input:focus,.quarter-select:focus{outline:none;border-color:#7c3aed}.modal-actions{display:flex;gap:12px;margin-top:20px}.save-btn,.cancel-btn{flex:1;padding:12px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .3s}.save-btn{background:#7c3aed;color:#fff}.save-btn:hover{background:#6d28d9}.cancel-btn{background:#444;color:#e0e0e0}.cancel-btn:hover{background:#555}.classes-grid{padding:24px;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;overflow-y:auto;flex:1}.quarter-view{flex:1;display:flex;flex-direction:column;gap:16px;padding:16px 24px 24px;overflow-y:auto}.quarter-gpa{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-radius:10px;background:#2a2a2a;box-shadow:0 2px 6px #0000004d;font-weight:700;color:#999}.quarter-class-tabs{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}.quarter-class-card{position:relative;background:#2a2a2a;border-radius:10px;box-shadow:0 1px 4px #0000004d;overflow:visible;padding:16px 14px;cursor:pointer;transition:all .2s}.quarter-class-card:hover{transform:translateY(-2px);box-shadow:0 6px 14px #00000059}.quarter-class-name{font-weight:700;color:#7c3aed}.quarter-class-grade{font-size:1.1em;font-weight:700;color:#7c3aed}.terms-grid{padding:0 24px 24px;display:flex;flex-direction:column;gap:8px;overflow-y:auto;flex:1}.terms-grid-header,.terms-grid-row{display:grid;grid-template-columns:2.5fr repeat(4,.9fr) 1fr 1fr;gap:0;background:#2a2a2a;border-radius:8px;overflow:visible;box-shadow:0 1px 3px #0000004d}.canvas-mode-grid .terms-grid-header,.canvas-mode-grid .terms-grid-row{grid-template-columns:2.5fr 1.5fr 1.5fr 1fr 1fr}.grid-semester-1,.grid-semester-2{background:#7c3aed1a;border:1px solid rgba(124,58,237,.3);font-weight:600}.grid-semester-2{background:#06b6d41a;border:1px solid rgba(6,182,212,.3)}.terms-grid-header{background:#333;font-weight:700;color:#999}.terms-grid-row{transition:box-shadow .2s,transform .2s;position:relative;z-index:0}.terms-grid-row:hover{box-shadow:0 6px 14px #0000001f;transform:translateY(-1px)}.terms-grid-row.settings-open{z-index:2000}.terms-grid.settings-open .terms-grid-row:not(.settings-open) .settings-btn{visibility:hidden}.grid-col{padding:14px 16px;border-right:1px solid #444;display:flex;align-items:center;justify-content:center;text-align:center;font-weight:600;color:#999}.grid-col:last-child{border-right:none}.grid-col:last-child .semester-col{background:#7c3aed26;font-weight:700;color:#9f7aea!important}.class-col{justify-content:space-between;text-align:left;gap:12px;position:relative;pointer-events:none}.row-title{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;gap:12px;font-weight:700;color:#7c3aed}.quarter-grades{padding:12px 16px;border-top:1px solid #333;border-bottom:1px solid #333}.section-title{font-weight:700;margin-bottom:8px;color:#999}.active-quarters{padding:12px 16px;border-top:1px solid #333;border-bottom:1px solid #333}.active-quarter-options{display:flex;gap:12px;flex-wrap:wrap}.active-quarter-options label{display:flex;align-items:center;gap:6px;font-size:.85em;font-weight:600;color:#555}.term-grades{padding:12px 16px;border-top:1px solid #333;border-bottom:1px solid #333}.term-grade-row{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:10px}.term-save-actions{display:flex;gap:8px;padding:0 16px 12px}.term-grade-field{display:flex;flex-direction:column;gap:6px}.term-grade-field label{font-size:.75em;font-weight:600;color:#666}.exclude-toggle{display:flex;align-items:center;gap:6px;font-size:.75em;color:#777}.quarter-grades-title{font-weight:700;margin-bottom:8px;color:#444}.quarter-grades-help{margin:0 0 8px;font-size:.8em;color:#777}.quarter-grade-column{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}.quarter-grade-override-row{display:grid;grid-template-columns:1fr 120px;align-items:center;gap:10px}.quarter-override-checkbox{display:flex;align-items:center;gap:8px;font-size:.85em;color:#555;font-weight:600}.quarter-override-input{padding:6px 8px;border:1px solid #ddd;border-radius:6px;font-size:.85em}.class-card-grid{background:#2a2a2a;border-radius:12px;box-shadow:0 2px 8px #0000004d;overflow:visible;transition:all .3s;display:flex;flex-direction:column}.class-card-grid:hover{box-shadow:0 8px 16px #00000026;transform:translateY(-2px)}.class-card-header{padding:16px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;position:relative}.class-card-title{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.class-card-title h3{margin:0;font-size:1.2em;word-break:break-word;flex:1}.settings-btn{background:#fff3;border:none;color:#fff;font-size:1.2em;padding:4px 8px;border-radius:6px;cursor:pointer;transition:background .3s;flex-shrink:0;pointer-events:auto;z-index:100;position:relative}.settings-btn:hover{background:#ffffff4d}.settings-menu{position:absolute;top:40px;left:0;background:#2a2a2a;color:#e0e0e0;border-radius:8px;border:1px solid #444;box-shadow:0 8px 24px #0009;z-index:2001;min-width:280px;max-width:320px;overflow:visible;pointer-events:auto}.class-type-section{padding:12px 16px;border-bottom:1px solid #333}.class-type-select{width:100%;padding:8px 10px;border-radius:6px;border:1px solid #444;background:#333;color:#e0e0e0;margin-top:6px}.class-type-select:focus{outline:none;border-color:#7c3aed}.settings-hint{margin:6px 0 0;font-size:.85em;color:#9aa0a6}.semester-mode-section{padding:12px 16px;border-bottom:1px solid #333}.semester-mode-toggle{display:flex;align-items:center;gap:8px;cursor:pointer;margin-top:6px}.semester-mode-toggle input[type=checkbox]{cursor:pointer}.semester-mode-toggle span{font-size:.95em;color:#e0e0e0}.setting-item{display:flex;align-items:center;gap:10px;padding:12px 16px;cursor:pointer;border-bottom:1px solid #333;font-size:.95em}.setting-item:hover{background:#333}.setting-item input[type=checkbox]{cursor:pointer;width:18px;height:18px}.custom-grade-input{display:flex;gap:8px;padding:12px 16px;border-bottom:1px solid #333}.custom-grade-input input{flex:1;padding:8px;border:2px solid #444;border-radius:6px;font-size:.9em;background:#333;color:#e0e0e0}.custom-grade-input input:focus{outline:none;border-color:#7c3aed}.set-btn{padding:8px 12px;background:#7c3aed;color:#fff;border:none;border-radius:6px;cursor:pointer;font-weight:600;font-size:.85em;white-space:nowrap}.set-btn:hover{background:#6d28d9}.delete-class-btn{width:100%;padding:12px 16px;background:#c53030;color:#fff;border:none;cursor:pointer;font-weight:600;font-size:.95em;transition:background .3s}.delete-class-btn:hover{background:#a02a2a}.delete-class-btn:hover{background:#ff5252}.class-card-content{padding:32px 16px;text-align:center;background:#2a2a2a;border:none;cursor:pointer;flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;transition:background .3s}.class-card-content:hover{background:#333}.class-grade-large{font-size:2.5em;font-weight:700;color:#7c3aed}.class-grade-letter{font-size:1.1em;color:#666;margin-top:8px}.custom-badge{font-size:.75em;background:#fff3cd;color:#856404;padding:4px 8px;border-radius:4px;margin-top:8px;font-weight:600;border:1px solid #ffeaa7}.empty-state{grid-column:1 / -1;text-align:center;padding:60px 20px;color:#999}.empty-state p{margin:0 0 20px;font-size:1.2em}.add-btn-main{padding:12px 24px;background:#7c3aed;color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:background .3s}.add-btn-main:hover{background:#6d28d9}.grades-view-detail{height:100%;display:flex;flex-direction:column;background:#1a1a1a;width:100%}.back-btn{padding:12px 24px;background:#333;border:none;color:#7c3aed;border-bottom:2px solid #444;cursor:pointer;font-weight:600;transition:background .3s;align-self:flex-start}.back-btn:hover{background:#3a3a3a}@media (max-width: 768px){.grades-header{padding:16px 12px;flex-direction:column;align-items:flex-start;gap:12px}.grades-header h1{font-size:1.4em}.grades-header-actions{width:100%;flex-wrap:wrap;gap:8px}.semester-gpa-group{flex:1}.gpa-display{padding:12px 20px;min-width:100px}.gpa-value{font-size:1.8em}.gpa-label{font-size:.8em}.info-header-btn,.add-class-header-btn{flex:1;min-width:100px;padding:8px 10px;font-size:.8em}.quarters-selector{padding:12px 8px;gap:6px}.default-quarter{gap:4px;padding:4px 8px;margin-left:0}.default-quarter span{font-size:.75em}.quarter-btn{padding:6px 10px;font-size:.8em}.add-class-quick-btn{padding:6px 10px;font-size:.8em;margin-left:auto}.classes-grid{padding:12px;grid-template-columns:1fr;gap:12px}.quarter-view{padding:12px 8px;gap:12px}.quarter-gpa{padding:10px 12px;font-size:.9em}.quarter-class-tabs{grid-template-columns:1fr;gap:8px}.quarter-class-card{padding:12px 10px}.quarter-class-name,.quarter-class-grade{font-size:.95em}.terms-grid{padding:0 8px 12px;gap:6px}.terms-grid-header,.terms-grid-row{grid-template-columns:1.5fr repeat(2,.8fr) .7fr;gap:0}.canvas-mode-grid .terms-grid-header,.canvas-mode-grid .terms-grid-row{grid-template-columns:1.5fr 1fr 1fr .7fr}.grid-col{padding:10px 8px;font-size:.8em;border-right:1px solid #444}.grid-col:nth-child(n+5){display:none}.modal-content{min-width:auto;width:90vw;max-width:400px;padding:20px}.modal-content h3{font-size:1.2em;margin-bottom:16px}.modal-content input,.quarter-select,.import-textarea{padding:10px;font-size:16px}.info-modal-content{padding:18px;max-width:90vw;width:90vw;box-sizing:border-box!important;word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;overflow-x:hidden!important;-webkit-hyphens:auto;hyphens:auto}.info-modal-content p,.info-modal-content h3,.info-modal-content li,.info-features,.info-features ul,.info-features ul li,.info-support{word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;max-width:100%!important;-webkit-hyphens:auto;hyphens:auto}.info-modal-header h3{font-size:1.2em}.class-card-grid{margin-bottom:12px}.class-card-header{padding:12px}.class-card-title h3{font-size:1em}.settings-btn{font-size:1em;padding:4px 6px}.settings-menu{min-width:240px;max-width:90vw}.class-card-content{padding:20px 12px}.class-grade-large{font-size:2em}.empty-state{padding:40px 16px}.empty-state p{font-size:1em}.add-btn-main{padding:10px 16px;font-size:.95em}.back-btn{padding:10px 16px;font-size:.9em}}@media (max-width: 480px){.grades-header{padding:12px 8px}.grades-header h1{font-size:1.1em}.grades-header-actions{gap:4px}.info-header-btn{padding:6px 8px;font-size:.75em;flex-shrink:0;background:#06b6d426;border:1px solid rgba(6,182,212,.3);color:#06b6d4}.semester-gpa-group{width:100%}.gpa-display{padding:10px 16px;min-width:auto;width:100%}.gpa-value{font-size:1.6em}.add-class-header-btn{width:100%;font-size:.75em;padding:6px 8px}.quarters-selector{padding:8px 6px;gap:4px;overflow-x:auto;-webkit-overflow-scrolling:touch}.quarter-btn,.add-class-quick-btn{padding:5px 8px;font-size:.7em;flex-shrink:0}.add-class-quick-btn{margin-left:4px}.classes-grid{padding:8px}.quarter-view{padding:8px 4px}.quarter-gpa{padding:8px 10px;font-size:.85em}.quarter-class-tabs{gap:6px}.quarter-class-card{padding:10px 8px}.terms-grid{padding:0 4px 8px;gap:4px}.terms-grid-header,.terms-grid-row{grid-template-columns:2fr .8fr .8fr}.canvas-mode-grid .terms-grid-header,.canvas-mode-grid .terms-grid-row{grid-template-columns:2fr 1fr 1fr}.grid-col{padding:8px 4px;font-size:.7em}.grid-col:nth-child(n+4){display:none}.modal-content{width:95vw;max-width:none;padding:16px}.modal-content h3{font-size:1.1em}.modal-content input,.quarter-select,.import-textarea{padding:8px;margin-bottom:10px;font-size:16px}.modal-actions{flex-direction:column}.save-btn,.cancel-btn{padding:10px;font-size:.9em}.info-modal-content{padding:12px;width:95vw!important;max-width:calc(100vw - 16px)!important;box-sizing:border-box;word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;overflow-x:hidden!important;-webkit-hyphens:auto;hyphens:auto}.info-modal-content p,.info-modal-content h3,.info-modal-content li,.info-features,.info-features ul,.info-features ul li,.info-support{word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;max-width:100%!important;-webkit-hyphens:auto;hyphens:auto}.info-modal-header h3{font-size:1.1em}.class-card-header{padding:10px}.class-card-title h3{font-size:.95em}.settings-menu{min-width:200px}.class-card-content{padding:16px 10px}.class-grade-large{font-size:1.6em}.class-grade-letter{font-size:.9em}.custom-badge{font-size:.7em;padding:3px 6px}.empty-state{padding:30px 12px}.add-btn-main{padding:8px 12px;font-size:.85em}.back-btn{padding:8px 12px;font-size:.8em}}.quick-calculator{width:100%;max-width:100%;height:100%;padding:24px;animation:fadeIn .3s ease-in;overflow-y:auto;display:flex;flex-direction:column}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.qc-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:32px;padding-bottom:20px;border-bottom:2px solid rgba(124,58,237,.2)}.qc-title-section h1{margin:0 0 8px;font-size:2.2em;background:linear-gradient(135deg,#06b6d4,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.qc-subtitle{margin:0;font-size:1.1em;color:#ffffffb3}.qc-help-btn{padding:10px 20px;background:#7c3aed33;border:1px solid rgba(124,58,237,.4);border-radius:8px;color:#a78bfa;cursor:pointer;font-size:.95em;transition:all .2s ease}.qc-help-btn:hover{background:#7c3aed4d;border-color:#7c3aed99;transform:translateY(-2px)}.qc-card{background:linear-gradient(135deg,#14192dcc,#1a1f3acc);border-radius:16px;padding:32px;box-shadow:0 8px 32px #0006;border:1px solid rgba(124,58,237,.2)}.qc-form{display:flex;flex-direction:column;gap:24px}.qc-field{display:flex;flex-direction:column;gap:8px}.qc-field label{display:flex;align-items:center;gap:8px;font-weight:600;color:#ffffffe6;font-size:1.05em}.qc-label-icon{font-size:1.2em}.qc-select,.qc-input{padding:14px 16px;background:#0f172a99;border:2px solid rgba(124,58,237,.3);border-radius:10px;color:#fff;font-size:1em;transition:all .2s ease}.qc-select:focus,.qc-input:focus{outline:none;border-color:#7c3aed;box-shadow:0 0 0 3px #7c3aed33}.qc-select:disabled{opacity:.5;cursor:not-allowed}.qc-input-hint{font-size:.85em;color:#ffffff80;font-style:italic}.qc-calculate-btn{margin-top:16px;padding:16px 32px;background:linear-gradient(135deg,#06b6d4,#7c3aed);border:none;border-radius:12px;color:#fff;font-size:1.15em;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 16px #7c3aed66}.qc-calculate-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 24px #7c3aed99}.qc-calculate-btn:active:not(:disabled){transform:translateY(0)}.qc-calculate-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.qc-result{margin-top:32px;padding:28px;background:linear-gradient(135deg,#06b6d41a,#7c3aed1a);border-radius:12px;border:2px solid rgba(124,58,237,.3);animation:slideIn .4s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.qc-result-header{display:flex;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid rgba(124,58,237,.2)}.qc-result-icon{font-size:2em}.qc-result-header h3{margin:0;font-size:1.5em;color:#fffffff2}.qc-result-content{text-align:center}.qc-result-success{display:flex;flex-direction:column;gap:16px}.result-big-number{font-size:4em;font-weight:700;background:linear-gradient(135deg,#06b6d4,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1;margin:16px 0}.result-points{font-size:1.3em;color:#fffc;margin-bottom:8px}.result-message{font-size:1.1em;line-height:1.6;color:#ffffffd9;padding:16px;background:#0003;border-radius:8px}.result-warning{margin-top:12px;padding:12px 16px;background:#fbbf2426;border:1px solid rgba(251,191,36,.3);border-radius:8px;color:#fbbf24;font-size:.95em}.qc-result-impossible,.qc-result-already{display:flex;flex-direction:column;gap:12px;align-items:center}.impossible-icon,.already-icon{font-size:4em;margin:8px 0}.qc-result-impossible h4,.qc-result-already h4{margin:0;font-size:1.8em;color:#fffffff2}.qc-result-impossible p,.qc-result-already p{margin:8px 0;font-size:1.1em;line-height:1.6;color:#fffc}.impossible-note,.already-note{padding:12px 20px;background:#0003;border-radius:8px;font-size:1em!important;margin-top:8px!important}.qc-tutorial-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px;animation:fadeIn .3s ease-in}.qc-tutorial-card{background:linear-gradient(135deg,#14192dfa,#1a1f3afa);border-radius:20px;max-width:600px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #0009;border:2px solid rgba(124,58,237,.4);position:relative;animation:slideIn .4s ease-out}.qc-tutorial-close{position:absolute;top:16px;right:16px;background:#ffffff1a;border:none;color:#fff;font-size:1.5em;width:36px;height:36px;border-radius:50%;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.qc-tutorial-close:hover{background:#fff3;transform:rotate(90deg)}.qc-tutorial-header{text-align:center;padding:32px 32px 24px;border-bottom:2px solid rgba(124,58,237,.2)}.qc-tutorial-icon{font-size:4em;margin-bottom:16px}.qc-tutorial-header h2{margin:0;font-size:2em;background:linear-gradient(135deg,#06b6d4,#7c3aed);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.qc-tutorial-content{padding:32px}.qc-tutorial-step{display:flex;gap:20px;margin-bottom:28px;align-items:flex-start}.step-number{flex-shrink:0;width:40px;height:40px;background:linear-gradient(135deg,#06b6d4,#7c3aed);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2em;color:#fff}.step-text h3{margin:0 0 8px;font-size:1.2em;color:#fffffff2}.step-text p{margin:0;color:#ffffffb3;line-height:1.5}.qc-tutorial-example{margin-top:28px;padding:20px;background:#06b6d41a;border-left:4px solid #06b6d4;border-radius:8px;color:#ffffffd9;line-height:1.6}.qc-tutorial-footer{display:flex;justify-content:space-between;align-items:center;padding:0 32px 32px;gap:16px}.qc-dont-show-again{display:flex;align-items:center;gap:8px;cursor:pointer;-webkit-user-select:none;user-select:none}.qc-dont-show-again input{width:18px;height:18px;cursor:pointer;accent-color:#06b6d4}.qc-dont-show-again span{font-size:.95em;color:#ffffffb3}.qc-tutorial-got-it{padding:12px 24px;background:linear-gradient(135deg,#06b6d4,#7c3aed);border:none;border-radius:8px;color:#fff;font-size:1em;font-weight:600;cursor:pointer;transition:all .3s ease;white-space:nowrap}.qc-tutorial-got-it:hover{transform:translateY(-2px);box-shadow:0 6px 24px #7c3aed99}@media (max-width: 768px){.quick-calculator{padding:16px;margin:0}.qc-header{flex-direction:column;gap:12px;margin-bottom:24px;padding-bottom:16px}.qc-title-section h1{font-size:1.8em}.qc-subtitle{font-size:1em}.qc-help-btn{padding:8px 16px;font-size:.9em;width:fit-content}.qc-card{padding:24px;border-radius:12px}.qc-form{gap:20px}.qc-field label{font-size:1em}.qc-select,.qc-input{padding:12px 14px;font-size:16px;border-radius:8px}.qc-calculate-btn{padding:14px 28px;font-size:1.05em;border-radius:10px}.qc-result{padding:24px;border-radius:10px;margin-top:24px}.result-big-number{font-size:2.8em}.result-points{font-size:1.2em}.qc-tutorial-card{max-width:90vw;max-height:85vh;border-radius:16px}.qc-tutorial-close{top:12px;right:12px;width:32px;height:32px;font-size:1.3em}.qc-tutorial-header{padding:24px 20px 16px}.qc-tutorial-icon{font-size:3em;margin-bottom:12px}.qc-tutorial-header h2{font-size:1.6em}.qc-tutorial-content{padding:20px}.qc-tutorial-step{gap:12px;margin-bottom:20px}.step-number{width:36px;height:36px;font-size:1em}.step-text h3{font-size:1.05em}.step-text p{font-size:.95em}.qc-tutorial-example{margin-top:16px;padding:16px;font-size:.9em}.qc-tutorial-footer{padding:0 20px 20px;gap:12px;flex-wrap:wrap}.qc-dont-show-again span{font-size:.9em}.qc-tutorial-got-it{padding:10px 20px;font-size:.95em}}@media (max-width: 600px){.quick-calculator{padding:10px;width:100%;max-width:100%}.qc-card{padding:14px;width:100%;max-width:100%}.qc-header{gap:8px}.qc-title-section h1{font-size:1.3em}.qc-subtitle{font-size:.85em}.qc-help-btn{padding:5px 10px;font-size:.75em}.qc-field label{font-size:.95em}.qc-select,.qc-input{padding:10px 12px;font-size:14px}.qc-calculate-btn{padding:12px 20px;font-size:.95em}.result-big-number{font-size:2.2em;margin:12px 0}.result-points{font-size:1.1em}.result-message{font-size:1em;padding:12px}.qc-result{padding:16px;margin-top:20px}.qc-result-header{gap:10px;margin-bottom:16px}.qc-result-icon{font-size:1.5em}.qc-result-header h3{font-size:1.2em}.qc-tutorial-overlay{padding:12px}.qc-tutorial-card{max-height:80vh;border-radius:14px}.qc-tutorial-close{width:28px;height:28px;font-size:1.2em}.qc-tutorial-header{padding:16px 14px 12px}.qc-tutorial-icon{font-size:2.5em}.qc-tutorial-header h2{font-size:1.4em}.qc-tutorial-content{padding:14px}.qc-tutorial-step{gap:10px;margin-bottom:16px}.step-number{width:32px;height:32px;font-size:.9em;flex-shrink:0}.step-text h3{font-size:1em;margin-bottom:4px}.step-text p{font-size:.9em}.qc-tutorial-example{margin-top:12px;padding:12px;font-size:.85em}.qc-tutorial-footer{padding:0 14px 14px;flex-direction:column}.qc-dont-show-again{width:100%;gap:6px}.qc-dont-show-again input{width:16px;height:16px}.qc-dont-show-again span{font-size:.85em}.qc-tutorial-got-it{width:100%;padding:10px;font-size:.9em}}@media (max-width: 480px){.quick-calculator{padding:8px;width:100%;max-width:100%}.qc-card{padding:12px;width:100%;max-width:100%;border-radius:8px}.qc-form{gap:14px}.qc-title-section h1{font-size:1.15em}.qc-subtitle{font-size:.8em}.qc-help-btn{padding:4px 8px;font-size:.7em}.qc-field label{font-size:.9em;gap:6px}.qc-label-icon{font-size:1em}.qc-select,.qc-input{padding:10px;font-size:13px}.qc-input-hint{font-size:.8em}.qc-calculate-btn{margin-top:12px;padding:11px 16px;font-size:.9em;border-radius:8px}.result-big-number{font-size:2em;margin:10px 0}.result-points{font-size:1em}.result-message{font-size:.95em;padding:10px}.result-warning{font-size:.9em;padding:10px 12px}.qc-result{padding:12px;border-radius:8px;margin-top:16px}.qc-result-header{gap:8px;margin-bottom:12px}.qc-result-icon{font-size:1.3em}.qc-result-header h3{font-size:1.1em}.qc-result-impossible h4,.qc-result-already h4{font-size:1.4em}.qc-result-impossible p,.qc-result-already p{font-size:1em}.impossible-icon,.already-icon{font-size:3em}.qc-tutorial-overlay{padding:8px}.qc-tutorial-card{max-height:75vh;border-radius:12px}.qc-tutorial-header{padding:14px 12px 10px}.qc-tutorial-icon{font-size:2.2em;margin-bottom:10px}.qc-tutorial-header h2{font-size:1.3em}.qc-tutorial-content{padding:12px;max-height:calc(75vh - 150px);overflow-y:auto}.qc-tutorial-step{gap:8px;margin-bottom:14px}.step-number{width:28px;height:28px;font-size:.8em}.step-text h3{font-size:.95em;margin-bottom:3px}.step-text p{font-size:.85em}.qc-tutorial-example{margin-top:10px;padding:10px;font-size:.8em;line-height:1.4}.qc-tutorial-footer{padding:0 12px 12px;gap:8px}.qc-dont-show-again input{width:14px;height:14px}.qc-dont-show-again span{font-size:.8em}.qc-tutorial-got-it{padding:9px;font-size:.85em}}.tutorial-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:3000}.tutorial-modal{background:linear-gradient(135deg,#1a1f3a,#242b47);border:2px solid #7c3aed;border-radius:16px;padding:32px;max-width:700px;max-height:80vh;overflow-y:auto;box-shadow:0 20px 60px #7c3aed4d;position:relative}.tutorial-close{position:absolute;top:16px;right:16px;background:none;border:none;color:#999;font-size:24px;cursor:pointer;transition:color .3s}.tutorial-close:hover{color:#7c3aed}.tutorial-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid #444}.tutorial-header h2{margin:0;font-size:1.8em;color:#e0e7ff;flex:1}.tutorial-progress{background:#7c3aed;color:#fff;padding:6px 12px;border-radius:20px;font-size:.9em;font-weight:600;white-space:nowrap}.tutorial-content{margin-bottom:32px}.tutorial-description{font-size:1.1em;color:#b0b9d1;margin:0 0 20px;line-height:1.6}.tutorial-details{list-style:none;padding:0;margin:20px 0}.tutorial-details li{color:#c4c9d8;line-height:1.6;border-left:3px solid #7c3aed;padding:12px 0 12px 16px}.tutorial-example{background:#7c3aed1a;border:1px solid #7c3aed;border-radius:8px;padding:16px;margin-top:20px;overflow-x:hidden;word-wrap:break-word;overflow-wrap:break-word}.tutorial-example strong{color:#7c3aed}.tutorial-example pre{margin:12px 0 0;color:#b0b9d1;font-size:.9em;line-height:1.5;font-family:Courier New,monospace;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;word-break:break-word;overflow-x:hidden}.tutorial-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-top:16px;border-top:1px solid #444}.tutorial-btn{padding:10px 20px;border:2px solid #7c3aed;background:transparent;color:#7c3aed;border-radius:8px;cursor:pointer;font-weight:600;transition:all .3s}.tutorial-btn:hover:not(:disabled){background:#7c3aed;color:#fff}.tutorial-btn:disabled{opacity:.3;cursor:not-allowed}.tutorial-btn.primary{background:#7c3aed;color:#fff;border-color:#7c3aed}.tutorial-btn.primary:hover{background:#6d28d9;border-color:#6d28d9}.tutorial-dots{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;flex:1}.tutorial-dots .dot{width:12px;height:12px;border-radius:50%;background:#444;border:none;cursor:pointer;transition:all .3s}.tutorial-dots .dot.active{background:#7c3aed;transform:scale(1.3)}.tutorial-dots .dot:hover{background:#7c3aed}.tutorial-modal::-webkit-scrollbar{width:8px}.tutorial-modal::-webkit-scrollbar-track{background:#1a1f3a;border-radius:10px}.tutorial-modal::-webkit-scrollbar-thumb{background:#7c3aed;border-radius:10px}.tutorial-modal::-webkit-scrollbar-thumb:hover{background:#6d28d9}@media (max-width: 768px){.tutorial-overlay{padding:16px}.tutorial-modal{padding:24px 16px;max-width:100%;max-height:85vh;border-radius:12px}.tutorial-close{top:12px;right:12px;font-size:20px}.tutorial-header{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:16px;padding-bottom:12px}.tutorial-header h2{font-size:1.4em}.tutorial-progress{padding:5px 10px;font-size:.85em}.tutorial-content{margin-bottom:20px}.tutorial-description{font-size:1em;margin-bottom:16px}.tutorial-details li{padding:10px 0 10px 12px;font-size:.95em}.tutorial-example{padding:12px;margin-top:16px;overflow-x:hidden}.tutorial-example pre{font-size:.85em;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;word-break:break-word}.tutorial-footer{flex-wrap:wrap;gap:8px;padding-top:12px}.tutorial-btn{padding:8px 16px;font-size:.9em}.tutorial-dots{gap:6px}.tutorial-dots .dot{width:10px;height:10px}}@media (max-width: 480px){.tutorial-overlay{padding:12px}.tutorial-modal{padding:16px 12px;border-radius:10px;max-height:80vh}.tutorial-close{top:10px;right:10px;font-size:18px;width:28px;height:28px;display:flex;align-items:center;justify-content:center}.tutorial-header{gap:10px;margin-bottom:12px;padding-bottom:10px}.tutorial-header h2{font-size:1.2em;margin:0}.tutorial-progress{padding:4px 8px;font-size:.8em;border-radius:16px}.tutorial-content{margin-bottom:16px}.tutorial-description{font-size:.9em;margin-bottom:12px;line-height:1.5}.tutorial-details{margin:12px 0}.tutorial-details li{padding:8px 0 8px 10px;font-size:.9em;border-left-width:2px}.tutorial-example{padding:10px;margin-top:12px;border-radius:6px;overflow-x:hidden;max-width:100%}.tutorial-example strong{display:block;margin-bottom:6px}.tutorial-example pre{margin:8px 0 0;font-size:.75em;line-height:1.4;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;word-break:break-word;max-width:100%}.tutorial-footer{flex-direction:column-reverse;gap:8px;padding-top:12px}.tutorial-btn{width:100%;padding:10px 12px;font-size:.9em;border-radius:6px}.tutorial-dots{gap:4px;margin:8px 0}.tutorial-dots .dot{width:8px;height:8px}}@media (max-width: 320px){.tutorial-modal{padding:12px 10px}.tutorial-header h2{font-size:1.1em}.tutorial-description{font-size:.85em}.tutorial-details li{font-size:.85em;padding:6px 0}.tutorial-btn{padding:8px 10px;font-size:.8em}}.calendar-picker{background:linear-gradient(135deg,#1e3c72,#2a5298);border:2px solid rgba(255,255,255,.2);border-radius:12px;padding:16px;box-shadow:0 8px 32px #0000004d;min-width:320px}.calendar-picker-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.calendar-picker-header h3{margin:0;color:#fffffff2;font-size:1.1rem;font-weight:600;min-width:150px;text-align:center}.nav-btn{background:#ffffff26;border:1px solid rgba(255,255,255,.3);color:#ffffffe6;width:36px;height:36px;border-radius:8px;cursor:pointer;font-size:1.2rem;transition:all .2s ease}.nav-btn:hover{background:#ffffff40;border-color:#ffffff80;transform:scale(1.05)}.nav-btn:active{transform:scale(.95)}.calendar-picker-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:8px}.weekday{text-align:center;color:#ffffffb3;font-size:.85rem;font-weight:600;padding:8px 0}.calendar-picker-days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.day{aspect-ratio:1;background:#ffffff1a;border:1px solid rgba(255,255,255,.15);color:#fffc;border-radius:8px;cursor:pointer;font-size:.95rem;font-weight:500;transition:all .2s ease;padding:0}.day:hover:not(.empty):not(:disabled){background:#fff3;border-color:#fff6;transform:translateY(-2px)}.day:active:not(.empty):not(:disabled){transform:translateY(0)}.day.empty{background:transparent;border:none;cursor:default;pointer-events:none}.day.today{border:2px solid #4a9eff;background:#4a9eff26;color:#4a9eff;font-weight:700}.day.selected{background:linear-gradient(135deg,#00d4ff,#09c);border-color:#00d4ff;color:#fff;box-shadow:0 4px 12px #00d4ff4d;font-weight:700}.day.selected:hover{box-shadow:0 6px 16px #00d4ff66}.day:disabled{cursor:not-allowed;opacity:.3}.calendar-view{padding:20px;max-width:1200px;margin:0 auto}.calendar-loading{display:flex;align-items:center;justify-content:center;min-height:400px;font-size:1.2em;color:#888}.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;flex-wrap:wrap;gap:15px}.calendar-header h1{font-size:2em;margin:0;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.study-preferences{background:#ffffff0a;border:1px solid rgba(102,126,234,.2);border-radius:16px;padding:20px;margin-bottom:25px}.study-preferences-title{font-size:1.1em;font-weight:700;color:#ffffffe6;margin-bottom:14px}.study-preferences-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.pref-group label{display:block;font-weight:600;color:#ffffffe6;margin-bottom:8px}.time-range{display:flex;align-items:center;gap:10px}.time-range input[type=time]{padding:10px 12px;background:#ffffff14;border:1px solid rgba(102,126,234,.3);border-radius:10px;color:#fff;font-family:inherit}.time-separator{color:#fff9;font-weight:600}.toggle-row{display:flex;align-items:center;gap:10px;font-weight:500;color:#fffc}.pref-hint{margin-top:6px;font-size:.85em;color:#fff9}.calendar-view-toggle{display:flex;gap:10px;background:#ffffff0d;padding:5px;border-radius:12px}.view-btn{padding:10px 20px;border:none;background:transparent;color:#aaa;border-radius:8px;cursor:pointer;font-size:1em;transition:all .2s ease;font-weight:500}.view-btn:hover{background:#ffffff0d;color:#fff}.view-btn.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 12px #667eea4d}.assignments-timeline{display:flex;flex-direction:column;gap:20px}.empty-calendar{text-align:center;padding:60px 20px;color:#888}.empty-calendar p{font-size:1.2em;margin:10px 0}.empty-calendar .hint{font-size:.9em;color:#666}.assignment-card{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:20px;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.assignment-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#667eea,#764ba2);opacity:0;transition:opacity .3s ease}.assignment-card:hover{background:#ffffff0d;border-color:#fff3;transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.assignment-card:hover:before{opacity:1}.assignment-card.high-priority{border-left:4px solid #ff4757}.assignment-card.medium-priority{border-left:4px solid #ffa502}.assignment-card.low-priority{border-left:4px solid #1e90ff}.assignment-card.overdue{border-left:4px solid #ff0000;background:#ff00000d}.assignment-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:15px;gap:15px}.assignment-title{flex:1}.assignment-title h3{margin:5px 0 0;font-size:1.3em;color:#fff}.assignment-type-badge{display:inline-block;padding:4px 12px;background:#667eea33;color:#667eea;border-radius:12px;font-size:.75em;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.priority-badge{padding:6px 14px;border-radius:20px;font-size:.75em;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.priority-badge.high{background:#ff475733;color:#ff4757;border:1px solid rgba(255,71,87,.3)}.priority-badge.medium{background:#ffa50233;color:#ffa502;border:1px solid rgba(255,165,2,.3)}.priority-badge.low{background:#1e90ff33;color:#1e90ff;border:1px solid rgba(30,144,255,.3)}.assignment-card-details{display:flex;flex-direction:column;gap:8px;margin-bottom:15px}.detail-row{display:flex;align-items:center;gap:10px;font-size:.95em}.detail-label{color:#888;min-width:120px;font-weight:500}.detail-value{color:#ddd;flex:1}.time-until{color:#667eea;font-weight:600}.quick-recommendation{background:#667eea1a;border:1px solid rgba(102,126,234,.2);border-radius:12px;padding:12px 16px;margin-top:10px}.study-time-info{color:#ddd;font-size:.95em;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.duration{color:#667eea;font-weight:600}.study-total{margin-top:6px;font-size:.85em;color:#ffffffb3}.assignment-detail-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:3000;padding:20px;overflow-y:auto}.assignment-detail-modal .modal-content{background:#1a1a2e;border-radius:20px;max-width:700px;width:100%;max-height:90vh;overflow-y:auto;position:relative;box-shadow:0 20px 60px #00000080;border:1px solid rgba(255,255,255,.1)}.close-btn{position:absolute;top:20px;right:20px;background:#ffffff1a;border:none;color:#fff;font-size:1.5em;width:40px;height:40px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.close-btn:hover{background:#fff3;transform:rotate(90deg)}.modal-header{padding:40px 40px 20px;border-bottom:1px solid rgba(255,255,255,.1)}.assignment-type-badge-large{display:inline-block;padding:6px 16px;background:#667eea33;color:#667eea;border-radius:16px;font-size:.85em;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px}.modal-header h2{margin:10px 0;font-size:1.8em;color:#fff}.assignment-class{color:#888;font-size:1em;margin:5px 0 0}.modal-body{padding:30px 40px}.info-section{margin-bottom:25px}.info-section h3{font-size:1.2em;margin-bottom:10px;color:#fff;display:flex;align-items:center;gap:8px}.info-section h4{font-size:1em;margin:15px 0 10px;color:#ddd}.due-info{font-size:1.1em;color:#ddd;margin:5px 0}.time-remaining{color:#667eea;font-weight:600;font-size:1em;margin-top:5px}.assignment-notes{background:#ffffff0d;border-left:3px solid #667eea;padding:15px;border-radius:8px;color:#ddd;line-height:1.6;margin:10px 0}.recommendation-section{background:#667eea0d;border:1px solid rgba(102,126,234,.2);border-radius:16px;padding:20px}.study-schedule{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin-bottom:20px}.schedule-item{background:#ffffff0d;padding:15px;border-radius:12px}.schedule-item strong{display:block;color:#888;font-size:.85em;text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px}.schedule-item p{margin:5px 0 0;color:#fff;font-size:1.05em}.study-sessions{margin-top:16px}.study-sessions h4{margin:0 0 8px;font-size:1em;color:#ffffffe6}.study-sessions ul{margin:0;padding-left:18px;color:#ffffffbf;line-height:1.6}.tips-section ul,.resources-section ul{list-style:none;padding:0;margin:10px 0}.tips-section li,.resources-section li{padding:10px 15px;background:#ffffff08;border-left:3px solid #667eea;border-radius:6px;margin-bottom:8px;color:#ddd;line-height:1.5}.modal-footer{padding:20px 40px 40px;display:flex;justify-content:flex-end;gap:10px}.btn-primary{padding:12px 30px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:1em;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #667eea4d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}.btn-secondary{padding:12px 22px;background:#ffffff0f;color:#e0e0e0;border:1px solid rgba(255,255,255,.2);border-radius:12px;font-size:.95em;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-secondary:hover{border-color:#ffffff59;transform:translateY(-1px)}.btn-danger{padding:12px 22px;background:#ef444426;color:#ef4444;border:1px solid rgba(239,68,68,.4);border-radius:12px;font-size:.95em;font-weight:700;cursor:pointer;transition:all .2s ease}.btn-danger:hover{background:#ef444440;border-color:#ef444499;transform:translateY(-1px)}.calendar-grid-container{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:30px 20px;margin-bottom:20px}.calendar-grid-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;padding-bottom:20px;border-bottom:2px solid rgba(102,126,234,.3)}.calendar-grid-header h2{font-size:1.8em;margin:0;color:#fffffff2;min-width:200px;text-align:center}.month-nav-btn{background:#667eea26;border:1px solid rgba(102,126,234,.3);color:#667eea;padding:10px 16px;border-radius:8px;cursor:pointer;font-weight:600;transition:all .2s ease}.month-nav-btn:hover{background:#667eea40;border-color:#667eea;transform:translateY(-2px)}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;min-height:500px}.calendar-weekday{text-align:center;font-weight:700;color:#667eea;padding:12px 0;font-size:.95em;grid-column:auto}.calendar-cell{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:12px 8px;min-height:120px;display:flex;flex-direction:column;transition:all .2s ease;cursor:default}.calendar-cell.empty{background:transparent;border:none}.calendar-cell.today{background:#4a9eff1a;border:2px solid #4a9eff;box-shadow:0 0 12px #4a9eff33}.calendar-cell.has-assignments{border-color:#667eea99;background:#667eea14}.cell-date{font-weight:700;color:#ffffffe6;font-size:1.1em;margin-bottom:8px}.cell-assignments{display:flex;flex-direction:column;gap:6px;flex-wrap:wrap}.cell-assignment-dot{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px;padding:4px 6px;font-size:.75em;color:#fff;font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;justify-content:center;height:24px;width:100%}.cell-assignment-dot:hover{transform:scale(1.05);box-shadow:0 4px 12px #667eea66}.cell-assignment-dot.test{background:linear-gradient(135deg,#4facfe,#00f2fe)}.cell-assignment-dot.quiz{background:linear-gradient(135deg,#fa709a,#fee140)}.cell-assignment-dot.homework{background:linear-gradient(135deg,#30cfd0,#330867)}.cell-assignment-dot.project{background:linear-gradient(135deg,#a8edea,#fed6e3)}.cell-assignment-dot.essay{background:linear-gradient(135deg,#ff9a56,#ff6a88)}.cell-assignment-dot.lab{background:linear-gradient(135deg,#2e2e78,#662d91)}.cell-assignment-dot.assignment{background:linear-gradient(135deg,#667eea,#764ba2)}.dot-label{font-size:.8em;font-weight:700}.more-assignments{font-size:.75em;color:#ffffffb3;font-weight:600;padding:2px 4px}@media (max-width: 768px){.calendar-header{flex-direction:column;align-items:flex-start}.calendar-header h1{font-size:1.6em}.calendar-view-toggle{width:100%}.study-preferences-grid{grid-template-columns:1fr}.view-btn{flex:1;padding:10px 15px;font-size:.9em}.assignment-card{padding:15px}.assignment-card-header{flex-direction:column;gap:10px}.assignment-title h3{font-size:1.1em}.detail-label{min-width:100px;font-size:.9em}.modal-header,.modal-body,.modal-footer{padding:20px}.modal-header h2{font-size:1.4em}.study-schedule{grid-template-columns:1fr}}@media (max-width: 480px){.calendar-view{padding:15px}.calendar-header h1{font-size:1.4em}.view-btn{padding:8px 12px;font-size:.85em}.assignment-card{padding:12px}.assignment-title h3{font-size:1em}.detail-row{flex-direction:column;align-items:flex-start;gap:4px}.detail-label{min-width:auto}.modal-header,.modal-body,.modal-footer{padding:15px}}.calendar-header-controls{display:flex;gap:15px;align-items:center;flex-wrap:wrap}.add-assignment-btn{padding:10px 20px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:1em;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #667eea4d;white-space:nowrap}.add-assignment-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}.add-assignment-btn:active{transform:translateY(0)}@media (max-width: 768px){.calendar-header-controls{flex-direction:column;width:100%;gap:10px}.add-assignment-btn,.calendar-view-toggle{width:100%}.view-btn{flex:1}}@media (max-width: 480px){.add-assignment-btn{padding:8px 16px;font-size:.9em}}.add-assignment-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:4000;padding:20px;overflow-y:auto;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content-add{background:linear-gradient(135deg,#1a1a2e,#0f3460);border-radius:24px;max-width:600px;width:100%;padding:40px;position:relative;box-shadow:0 25px 60px #0009;border:1px solid rgba(102,126,234,.2)}.modal-content-add h3{font-size:1.8em;margin:0 0 30px;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;display:flex;align-items:center;gap:10px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:25px}.form-group{display:flex;flex-direction:column}.form-group.full-width{grid-column:1 / -1}.form-group label{font-size:.95em;font-weight:600;color:#fff;margin-bottom:8px;display:flex;align-items:center;gap:5px}.form-group label:after{content:attr(data-required);color:#ff4757;margin-left:2px}.form-group input,.form-group select,.form-group textarea{padding:12px 16px;background:#ffffff14;border:2px solid rgba(102,126,234,.3);border-radius:12px;color:#fff;font-family:inherit;font-size:1em;transition:all .3s ease;resize:vertical}.form-group input::placeholder,.form-group select option,.form-group textarea::placeholder{color:#888}.form-group select option{background:#0f3460;color:#fff}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{background:#667eea1a;border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea1a}.form-group input:invalid:not(:placeholder-shown),.form-group textarea:invalid:not(:placeholder-shown){border-color:#ff4757;background:#ff475714}.form-group textarea{resize:vertical;min-height:100px;font-family:inherit}.date-picker-wrapper{position:relative;display:flex;flex-direction:column}.date-picker-btn{padding:12px 16px;background:#ffffff14;border:2px solid rgba(102,126,234,.3);border-radius:12px;color:#fff;font-family:inherit;font-size:1em;cursor:pointer;transition:all .3s ease;text-align:left;display:flex;align-items:center;gap:8px;justify-content:center}.date-picker-btn:hover{background:#667eea1a;border-color:#667eea}.date-picker-btn:focus{outline:none;background:#667eea1a;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.calendar-picker-dropdown{position:absolute;top:calc(100% + 8px);left:0;z-index:1001;background:#0f3460f2;border-radius:12px;padding:0}.help-text{font-size:.85em;color:#888;margin-top:6px;font-style:italic;line-height:1.4}.modal-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:30px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1)}.save-btn{padding:12px 28px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:1em;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #667eea4d}.save-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}.save-btn:active{transform:translateY(0)}.cancel-btn{padding:12px 28px;background:#ffffff1a;color:#aaa;border:1px solid rgba(255,255,255,.2);border-radius:12px;font-size:1em;font-weight:600;cursor:pointer;transition:all .3s ease}.cancel-btn:hover{background:#ffffff26;color:#fff;border-color:#ffffff4d}.upcoming-badge{display:inline-block;padding:4px 10px;background:linear-gradient(135deg,#1e90ff,#06f);color:#fff;border-radius:8px;font-size:.75em;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin:0 6px;box-shadow:0 2px 8px #1e90ff4d}.assignment-card.from-calendar{border:2px solid rgba(30,144,255,.4);background:linear-gradient(135deg,#1e90ff14,#0066ff0d);box-shadow:inset 0 0 20px #1e90ff1a}.assignment-card.from-calendar:hover{border-color:#1e90ff99;background:linear-gradient(135deg,#1e90ff1f,#0066ff14);box-shadow:0 8px 24px #1e90ff33,inset 0 0 20px #1e90ff1a}@media (max-width: 768px){.modal-content-add{padding:30px;max-width:90vw}.modal-content-add h3{font-size:1.5em;margin-bottom:25px}.form-grid{grid-template-columns:1fr;gap:18px}.form-group{margin-bottom:5px}.form-group input,.form-group select,.form-group textarea{padding:11px 14px;font-size:16px}.modal-actions{flex-direction:column;gap:10px}.save-btn,.cancel-btn{width:100%;padding:14px 24px}}@media (max-width: 480px){.add-assignment-modal{padding:15px}.modal-content-add{padding:20px;border-radius:16px}.modal-content-add h3{font-size:1.3em;margin-bottom:20px}.form-grid{grid-template-columns:1fr;gap:15px}.form-group label{font-size:.9em}.form-group input,.form-group select,.form-group textarea{padding:10px 12px;font-size:16px;border-radius:8px}.help-text{font-size:.8em}.modal-actions{gap:8px}.save-btn,.cancel-btn{padding:12px 20px;font-size:.95em}.upcoming-badge{padding:3px 8px;font-size:.7em;margin:0 4px}}@media (max-width: 320px){.modal-content-add{padding:15px}.modal-content-add h3{font-size:1.1em;margin-bottom:15px}.form-grid{gap:12px}.form-group input,.form-group select,.form-group textarea{padding:9px 10px;font-size:15px}}.main-layout{display:flex;flex-direction:column;height:100vh;background:#1a1a1a}.main-header{background:#222;padding:12px 16px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 8px #0000004d;border-bottom:1px solid #333;flex-wrap:wrap;gap:8px}.header-left{display:flex;align-items:center;min-width:0;flex:1}.app-title{margin:0;font-size:1.5em;color:#e0e0e0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.header-right{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;justify-content:flex-end;overflow:hidden}.help-btn{padding:8px 12px;border-radius:6px;background:#7c3aed33;color:#a78bfa;border:1px solid rgba(124,58,237,.4);font-size:.85em;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap;flex-shrink:0;order:-1}.help-btn:hover{border-color:#7c3aed99;transform:translateY(-2px)}.info-btn{padding:8px 12px;border-radius:6px;background:#06b6d433;color:#06b6d4;border:1px solid rgba(6,182,212,.4);font-size:.85em;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap;flex-shrink:0;order:-1}.info-btn:hover{border-color:#06b6d499;transform:translateY(-2px)}.settings-icon-btn{padding:8px 12px;border-radius:6px;background:#9ca3af33;color:#9ca3af;border:1px solid rgba(156,163,175,.4);font-size:1.1em;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap;flex-shrink:0;order:-1}.settings-icon-btn:hover{border-color:#9ca3af99;transform:translateY(-2px) rotate(90deg)}.profile-pic{width:32px;height:32px;border-radius:50%;object-fit:cover;flex-shrink:0}.user-email{color:#999;font-size:.85em;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sign-out-btn{padding:6px 12px;background:#ff6b6b;color:#fff;border:none;border-radius:6px;cursor:pointer;font-weight:600;transition:background .3s;font-size:.85em;white-space:nowrap}.sign-out-btn:hover{background:#ff5252}.main-nav{background:#222;padding:0 12px;display:flex;gap:12px;border-bottom:2px solid #333;overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}.main-nav::-webkit-scrollbar{height:2px}.main-nav::-webkit-scrollbar-track{background:transparent}.main-nav::-webkit-scrollbar-thumb{background:#7c3aed;border-radius:2px}.nav-tab{padding:12px 8px;background:none;border:none;border-bottom:3px solid transparent;cursor:pointer;font-weight:600;font-size:.85em;color:#999;transition:all .3s;white-space:nowrap;flex-shrink:0}.nav-tab:hover{color:#7c3aed}.nav-tab.active{color:#7c3aed;border-bottom-color:#7c3aed}.main-content{flex:1;display:flex;overflow-y:auto;overflow-x:hidden;width:100%}.placeholder-view{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#999;padding:20px}.placeholder-view h2{margin:0 0 16px;font-size:1.5em;color:#666}.placeholder-view p{margin:0;font-size:1em}@media (max-width: 768px){.main-header{padding:10px 12px;gap:6px}.app-title{font-size:1.2em}.help-btn,.info-btn{padding:6px 10px;font-size:.75em;flex-shrink:0}.profile-pic{width:28px;height:28px;flex-shrink:0}.user-email{display:none}.sign-out-btn{padding:5px 10px;font-size:.75em}.main-nav{padding:0 8px;gap:8px}.nav-tab{padding:10px 6px;font-size:.75em}.placeholder-view h2{font-size:1.2em}.placeholder-view p{font-size:.9em}}.info-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:2200;overflow:hidden;padding:8px}.info-modal-content{background:#222;border-radius:12px;padding:20px;width:100%;max-width:calc(100vw - 32px);max-height:85vh;overflow-y:auto;overflow-x:hidden!important;box-shadow:0 12px 32px #0009;border:1px solid #333;color:#e0e0e0;word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;box-sizing:border-box!important;-webkit-hyphens:auto;hyphens:auto}.info-modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.info-modal .close-btn{background:none;border:none;color:#999;font-size:22px;cursor:pointer;transition:color .2s}.info-modal .close-btn:hover{color:#7c3aed}.info-modal-header h3{margin:0;font-size:1.4em}.info-title{font-weight:700;margin:16px 0 8px;color:#7c3aed;word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;width:100%;max-width:100%}.info-features ul{margin:0 0 8px 18px;padding:0;line-height:1.6;word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;width:100%;box-sizing:border-box}.info-features ul li{word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;display:list-item!important;width:100%;max-width:100%;-webkit-hyphens:auto;hyphens:auto}.info-modal-content p{word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;margin:12px 0;width:100%;max-width:100%;-webkit-hyphens:auto;hyphens:auto}.info-support,.info-features{word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;width:100%;max-width:100%}.info-note{margin-top:16px;font-size:.95em;color:#b6b6b6;background:#2c2c2c;border:1px solid #333;padding:10px 12px;border-radius:8px;word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;width:100%;max-width:100%}@media (max-width: 768px){.info-modal-content{padding:18px;max-width:90vw;width:90vw;box-sizing:border-box!important;word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;overflow-x:hidden!important;-webkit-hyphens:auto;hyphens:auto}.info-modal-content p,.info-modal-content h3,.info-modal-content li,.info-features,.info-features ul,.info-features ul li,.info-support{word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;max-width:100%!important;-webkit-hyphens:auto;hyphens:auto}.info-modal-header h3{font-size:1.2em}}@media (max-width: 480px){.info-modal-content{padding:12px;width:95vw!important;max-width:calc(100vw - 16px)!important;box-sizing:border-box;word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;overflow-x:hidden!important;-webkit-hyphens:auto;hyphens:auto}.info-modal-content p,.info-modal-content h3,.info-modal-content li,.info-features,.info-features ul,.info-features ul li,.info-support{word-wrap:break-word!important;overflow-wrap:break-word!important;word-break:break-word!important;white-space:normal!important;max-width:100%!important;-webkit-hyphens:auto;hyphens:auto}.info-modal-header h3{font-size:1.1em}.info-modal .close-btn{font-size:20px}}@media (max-width: 480px){.main-header{padding:8px 10px}.app-title{font-size:1.1em}.header-right{gap:4px;flex-wrap:nowrap}.help-btn{padding:6px 8px;font-size:.75em;flex-shrink:0;background:#7c3aed4d;border:1px solid rgba(124,58,237,.5)}.info-btn{padding:6px 8px;font-size:.75em;flex-shrink:0;background:#06b6d44d;border:1px solid rgba(6,182,212,.5)}.settings-icon-btn{padding:6px 8px;font-size:1em;flex-shrink:0;background:#9ca3af4d;border:1px solid rgba(156,163,175,.5)}.sign-out-btn{padding:6px 10px;font-size:.75em;flex-shrink:0;min-width:fit-content}.main-nav{padding:0 6px;gap:6px}.nav-tab{padding:8px 5px;font-size:.7em}}.settings-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:2300;overflow:hidden;padding:8px}.settings-modal-content{background:#222;border-radius:12px;padding:24px;width:100%;max-width:500px;max-height:85vh;overflow-y:auto;overflow-x:hidden;box-shadow:0 12px 32px #0009;border:1px solid #333;color:#e0e0e0;box-sizing:border-box}.settings-modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid #444}.settings-modal-header h3{margin:0;font-size:1.5em;color:#e0e0e0}.settings-modal .close-btn{background:none;border:none;color:#999;font-size:22px;cursor:pointer;transition:color .2s}.settings-modal .close-btn:hover{color:#7c3aed}.settings-section{margin-bottom:24px;padding-bottom:20px;border-bottom:1px solid #333}.settings-section:last-child{border-bottom:none;margin-bottom:0}.settings-section-title{font-size:1.1em;font-weight:700;color:#7c3aed;margin-bottom:12px}.mode-toggle-container{display:flex;flex-direction:column;gap:12px;margin-bottom:12px}.mode-option{display:flex;align-items:flex-start;gap:12px;padding:12px;background:#2a2a2a;border:2px solid #444;border-radius:8px;cursor:pointer;transition:all .2s}.mode-option:hover{border-color:#7c3aed;background:#7c3aed0d}.mode-option input[type=radio]{margin-top:2px;cursor:pointer;flex-shrink:0}.mode-option input[type=radio]:checked+.mode-label{color:#7c3aed}.mode-label{display:flex;flex-direction:column;gap:4px}.mode-label strong{font-size:1em;color:#e0e0e0}.mode-label small{font-size:.85em;color:#9aa0a6}.mode-note{font-size:.9em;color:#9aa0a6;margin:0;padding:12px;background:#2a2a2a;border-radius:6px}.reset-data-btn{width:100%;padding:12px 16px;background:#ef444433;color:#ef4444;border:1px solid rgba(239,68,68,.4);border-radius:8px;font-size:.95em;font-weight:600;cursor:pointer;transition:all .2s}.reset-data-btn:hover{background:#ef44444d;border-color:#ef444499}.reset-hint{margin:8px 0 0;font-size:.85em;color:#9aa0a6}.account-info{padding:12px;background:#2a2a2a;border-radius:6px;color:#e0e0e0;margin-bottom:12px;word-wrap:break-word}.sign-out-settings-btn{width:100%;padding:12px 16px;background:#ff6b6b;color:#fff;border:none;border-radius:8px;font-size:.95em;font-weight:600;cursor:pointer;transition:background .2s}.sign-out-settings-btn:hover{background:#ff5252}.preference-item{margin-bottom:16px;padding:12px;background:#2a2a2a;border-radius:8px}.preference-label{display:block;margin-bottom:8px}.preference-label strong{display:block;color:#e0e0e0;margin-bottom:4px}.preference-label small{color:#9aa0a6;font-size:.85em}.checkbox-label{display:flex;align-items:center;gap:8px;cursor:pointer;margin-top:8px;color:#e0e0e0}.checkbox-label input[type=checkbox]{cursor:pointer;width:18px;height:18px}.time-range-container{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-top:8px}.time-input-label{display:flex;flex-direction:column;gap:4px;color:#9aa0a6;font-size:.9em}.time-input{padding:8px 10px;background:#1a1a1a;border:1px solid #444;border-radius:6px;color:#e0e0e0;font-size:1em;transition:border-color .2s}.time-input:focus{outline:none;border-color:#7c3aed;box-shadow:0 0 0 2px #7c3aed1a}@media (max-width: 768px){.settings-modal-content{padding:20px;max-width:90vw}.settings-modal-header h3{font-size:1.3em}.time-range-container{flex-direction:column}.time-input-label{width:100%}}@media (max-width: 480px){.settings-modal-content{padding:16px;width:95vw;max-width:calc(100vw - 16px)}.settings-modal-header h3{font-size:1.2em}.mode-label strong{font-size:.95em}.mode-label small{font-size:.8em}}.particle-background{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1;opacity:1}*{box-sizing:border-box}html{width:100%;height:100%}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#0a0e27,#1a1f3a,#0f1629);color:#e0e7ff;min-height:100vh;width:100%}#root{width:100%;height:100%}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 50%,rgba(124,58,237,.08) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(102,126,234,.08) 0%,transparent 50%);pointer-events:none;z-index:0}.loading-screen{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh;background:linear-gradient(135deg,#0a0e27,#1a1f3a,#0f1629);color:#fff;position:relative;overflow:hidden}.loading-screen:before{content:"";position:absolute;width:100%;height:100%;background:radial-gradient(circle at 20% 50%,rgba(7,165,229,.15) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(124,58,237,.15) 0%,transparent 50%);pointer-events:none;z-index:0}.loading-screen>*{position:relative;z-index:1}.spinner{width:50px;height:50px;border:4px solid rgba(6,182,212,.3);border-top-color:#06b6d4;border-radius:50%;animation:spin 1.5s linear infinite;margin-bottom:20px;box-shadow:0 0 20px #06b6d44d}@keyframes spin{to{transform:rotate(360deg)}}.loading-screen p{font-size:1.2em;margin:0;color:#cbd5e1;text-shadow:0 0 20px rgba(6,182,212,.2)}@media (max-width: 768px){body{font-size:14px}.loading-screen p{font-size:1em}.spinner{width:40px;height:40px;border-width:3px}}