:root{--navy-900: #0a1628;--navy-800: #0f2140;--navy-700: #152d50;--navy-600: #1a3a66;--navy-500: #1e4d8c;--navy-400: #2563a8;--navy-300: #4a90c4;--navy-200: #7eb3d8;--navy-100: #b8d4ea;--navy-50: #e8f2fa;--accent-gold: #f0b429;--accent-success: #10b981;--accent-warning: #f59e0b;--accent-error: #ef4444;--neutral-900: #111827;--neutral-800: #1f2937;--neutral-700: #374151;--neutral-600: #4b5563;--neutral-500: #6b7280;--neutral-400: #9ca3af;--neutral-300: #d1d5db;--neutral-200: #e5e7eb;--neutral-100: #f3f4f6;--neutral-50: #f9fafb;--bg-primary: var(--navy-900);--bg-secondary: var(--navy-800);--bg-tertiary: var(--navy-700);--bg-card: rgba(15, 33, 64, .8);--bg-hover: rgba(30, 77, 140, .3);--text-primary: #ffffff;--text-secondary: var(--navy-100);--text-muted: var(--navy-300);--border-primary: rgba(78, 144, 196, .2);--border-active: var(--navy-400);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5);--shadow-glow: 0 0 20px rgba(37, 99, 168, .3);--font-primary: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--transition-fast: .15s ease;--transition-normal: .25s ease;--transition-slow: .35s ease;--z-dropdown: 100;--z-modal: 200;--z-toast: 300}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font-primary);background:var(--bg-primary);color:var(--text-primary);line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body:before{content:"";position:fixed;inset:0;background:radial-gradient(ellipse at 20% 20%,rgba(30,77,140,.15) 0%,transparent 50%),radial-gradient(ellipse at 80% 80%,rgba(37,99,168,.1) 0%,transparent 50%),linear-gradient(180deg,var(--navy-900) 0%,var(--navy-800) 100%);z-index:-1;pointer-events:none}#root{min-height:100vh}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.3;color:var(--text-primary)}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.25rem}p{color:var(--text-secondary)}a{color:var(--navy-300);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--navy-200)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);font-family:var(--font-primary);font-size:.875rem;font-weight:500;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.btn-primary{background:linear-gradient(135deg,var(--navy-500) 0%,var(--navy-600) 100%);color:var(--text-primary);box-shadow:var(--shadow-md),var(--shadow-glow)}.btn-primary:hover{background:linear-gradient(135deg,var(--navy-400) 0%,var(--navy-500) 100%);transform:translateY(-1px);box-shadow:var(--shadow-lg),0 0 30px #2563a866}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:var(--bg-card);color:var(--text-secondary);border:1px solid var(--border-primary);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.btn-secondary:hover{background:var(--bg-hover);border-color:var(--border-active);color:var(--text-primary)}.btn-icon{width:40px;height:40px;padding:0;border-radius:var(--radius-full)}.btn-sm{padding:var(--space-xs) var(--space-sm);font-size:.75rem}.btn-lg{padding:var(--space-md) var(--space-xl);font-size:1rem}.card{background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-lg);padding:var(--space-lg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);transition:all var(--transition-normal)}.card:hover{border-color:var(--border-active);box-shadow:var(--shadow-lg)}.glass-card{background:#0f214099;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(78,144,196,.15);border-radius:var(--radius-lg)}.input{width:100%;padding:var(--space-sm) var(--space-md);background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-primary);font-size:.875rem;transition:all var(--transition-fast)}.input:focus{outline:none;border-color:var(--navy-400);box-shadow:0 0 0 3px #2563a833}.input::placeholder{color:var(--text-muted)}textarea.input{resize:vertical;min-height:80px}.checkbox-wrapper{display:flex;align-items:center;gap:var(--space-sm);cursor:pointer}.checkbox{appearance:none;width:20px;height:20px;background:var(--bg-secondary);border:2px solid var(--border-primary);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);position:relative}.checkbox:checked{background:var(--accent-success);border-color:var(--accent-success)}.checkbox:checked:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:12px;font-weight:700}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--navy-800)}::-webkit-scrollbar-thumb{background:var(--navy-600);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--navy-500)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes checkmark{0%{transform:scale(0)}50%{transform:scale(1.2)}to{transform:scale(1)}}.animate-fadeIn{animation:fadeIn .3s ease forwards}.animate-slideIn{animation:slideIn .3s ease forwards}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.gap-lg{gap:var(--space-lg)}.w-full{width:100%}.h-full{height:100%}.mt-sm{margin-top:var(--space-sm)}.mt-md{margin-top:var(--space-md)}.mt-lg{margin-top:var(--space-lg)}.mb-sm{margin-bottom:var(--space-sm)}.mb-md{margin-bottom:var(--space-md)}.mb-lg{margin-bottom:var(--space-lg)}.p-sm{padding:var(--space-sm)}.p-md{padding:var(--space-md)}.p-lg{padding:var(--space-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}@media(max-width:768px){html{font-size:14px}.card{padding:var(--space-md)}h1{font-size:1.5rem}h2{font-size:1.25rem}}@media(hover:none){.btn:hover{transform:none}.btn:active{transform:scale(.98)}}.app{min-height:100vh;display:flex;flex-direction:column}.main-content{flex:1;padding-bottom:var(--space-xl)}.install-banner{position:fixed;bottom:0;left:0;right:0;background:var(--bg-secondary);border-top:1px solid var(--border-primary);padding:var(--space-md);display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);z-index:var(--z-toast);animation:slideUp .3s ease;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.install-content{display:flex;align-items:center;gap:var(--space-sm);color:var(--text-secondary);font-size:.875rem}.install-content svg{width:24px;height:24px;color:var(--navy-300);flex-shrink:0}.install-actions{display:flex;gap:var(--space-sm);flex-shrink:0}@media(max-width:640px){.install-banner{flex-direction:column;text-align:center}.install-actions{width:100%}.install-actions .btn{flex:1}}.loading{display:flex;align-items:center;justify-content:center;min-height:200px}.spinner{width:40px;height:40px;border:3px solid var(--border-primary);border-top-color:var(--navy-400);border-radius:50%;animation:spin 1s linear infinite}.toast{position:fixed;bottom:var(--space-lg);right:var(--space-lg);background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--radius-lg);padding:var(--space-md) var(--space-lg);box-shadow:var(--shadow-lg);z-index:var(--z-toast);animation:fadeIn .3s ease}.toast.success{border-left:4px solid var(--accent-success)}.toast.error{border-left:4px solid var(--accent-error)}.header{position:sticky;top:0;z-index:var(--z-dropdown);background:#0a1628f2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--border-primary);padding:var(--space-sm) var(--space-md)}.header-content{max-width:1400px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--space-md)}.header-brand{display:flex;align-items:center;gap:var(--space-sm)}.logo{width:36px;height:36px;background:linear-gradient(135deg,var(--navy-500) 0%,var(--navy-400) 100%);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-glow)}.logo svg{width:20px;height:20px;color:#fff}.app-title{font-size:1.25rem;font-weight:700;background:linear-gradient(135deg,var(--text-primary) 0%,var(--navy-200) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.header-nav{display:flex;gap:var(--space-xs);background:var(--bg-secondary);padding:4px;border-radius:var(--radius-lg);border:1px solid var(--border-primary)}.nav-btn{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-md);background:transparent;border:none;border-radius:var(--radius-md);color:var(--text-muted);font-family:var(--font-primary);font-size:.875rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.nav-btn svg{width:18px;height:18px}.nav-btn:hover{color:var(--text-secondary);background:var(--bg-hover)}.nav-btn.active{background:linear-gradient(135deg,var(--navy-600) 0%,var(--navy-700) 100%);color:var(--text-primary);box-shadow:var(--shadow-sm)}.header-actions{display:flex;gap:var(--space-sm);align-items:center}.action-btn{position:relative;width:40px;height:40px;background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--radius-full);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);flex-shrink:0}.action-btn svg{width:20px;height:20px}.action-btn:hover{background:var(--bg-hover);border-color:var(--border-active);color:var(--text-primary)}.action-btn.active{background:#1e4d8c4d;border-color:var(--navy-400);color:var(--navy-200)}.reports-btn:hover{background:#10b9811f;border-color:#10b98166;color:#34d399}.notif-bell-wrapper{position:relative}.notif-badge{position:absolute;top:-3px;right:-3px;min-width:18px;height:18px;background:var(--accent-error);border-radius:var(--radius-full);border:2px solid rgba(10,22,40,.95);font-size:.65rem;font-weight:700;color:#fff;display:flex;align-items:center;justify-content:center;padding:0 3px;animation:badgePop .3s cubic-bezier(.34,1.56,.64,1)}@keyframes badgePop{0%{transform:scale(0)}to{transform:scale(1)}}.notif-panel{position:absolute;top:calc(100% + 12px);right:0;width:320px;background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--radius-xl);box-shadow:0 20px 60px #00000080,0 4px 16px #0000004d;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);overflow:hidden;z-index:var(--z-modal)}.notif-panel-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--border-primary);background:#152d5080}.notif-panel-title{font-size:.9rem;font-weight:700;color:var(--text-primary)}.notif-permission-status{display:flex;align-items:center;gap:6px;font-size:.75rem;color:var(--text-muted);font-weight:500}.perm-dot{width:7px;height:7px;border-radius:50%;background:var(--perm-color);box-shadow:0 0 6px var(--perm-color)}.notif-enable-btn{display:flex;align-items:center;gap:var(--space-sm);width:100%;padding:var(--space-md) var(--space-lg);background:#2563a81f;border:none;border-bottom:1px solid var(--border-primary);color:var(--navy-200);font-family:var(--font-primary);font-size:.82rem;font-weight:500;cursor:pointer;text-align:left;transition:background var(--transition-fast)}.notif-enable-btn:hover{background:#2563a838}.notif-enable-btn svg{width:16px;height:16px;flex-shrink:0}.notif-section{padding:var(--space-sm) 0;border-bottom:1px solid var(--border-primary)}.notif-section:last-child{border-bottom:none}.notif-section-label{padding:var(--space-xs) var(--space-lg);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted);margin-bottom:2px}.notif-item{display:flex;align-items:flex-start;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);transition:background var(--transition-fast)}.notif-item:hover{background:#1e4d8c1a}.notif-item-icon{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}.notif-item-icon svg{width:14px;height:14px}.notif-event .notif-item-icon{background:#2563a833;color:var(--navy-300)}.notif-complete .notif-item-icon{background:#10b98126;color:var(--accent-success)}.notif-uncomplete .notif-item-icon{background:#ef44441f;color:var(--accent-error)}.notif-info .notif-item-icon{background:#4e90c426;color:var(--navy-300)}.notif-item-content{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.notif-item-title{font-size:.82rem;font-weight:500;color:var(--text-primary);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.notif-item-time{font-size:.72rem;color:var(--text-muted)}.notif-empty{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);padding:var(--space-lg);color:var(--text-muted);font-size:.8rem}.notif-empty svg{width:32px;height:32px;opacity:.4}@media(max-width:640px){.header{padding:var(--space-sm)}.app-title,.nav-btn span{display:none}.nav-btn{padding:var(--space-sm)}.notif-panel{width:calc(100vw - 24px);right:-44px}}.habit-tracker{padding:var(--space-md);max-width:1400px;margin:0 auto}.tracker-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-lg);flex-wrap:wrap;gap:var(--space-md)}.header-title{display:flex;align-items:baseline;gap:var(--space-md)}.header-title h2{font-size:1.5rem;font-weight:600}.task-count{color:var(--text-muted);font-size:.875rem}.add-task-btn{padding:var(--space-sm) var(--space-lg)}.add-task-btn svg{width:18px;height:18px}.tracker-grid-container{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border-primary);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);scroll-behavior:auto}.loading-dots{display:inline-flex;align-items:center;gap:3px;margin-left:8px;vertical-align:middle}.loading-dots span{width:4px;height:4px;border-radius:50%;background:var(--navy-300);animation:dotPulse 1.2s ease-in-out infinite}.loading-dots span:nth-child(2){animation-delay:.2s}.loading-dots span:nth-child(3){animation-delay:.4s}@keyframes dotPulse{0%,80%,to{opacity:.3;transform:scale(.8)}40%{opacity:1;transform:scale(1.2)}}.tracker-grid{min-width:max-content;width:max-content;display:flex;flex-direction:column}.grid-header{display:flex;min-width:max-content;position:sticky;top:0;z-index:10;background:#0f2140f2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border-primary)}.grid-cell{flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:var(--space-sm);border-right:1px solid var(--border-primary);transition:background var(--transition-fast)}.grid-cell:last-child{border-right:none}.task-header{min-width:200px;width:200px;justify-content:flex-start;font-weight:600;color:var(--text-secondary);font-size:.875rem;padding-left:var(--space-md);background:#0f2140fa;position:sticky;left:0;z-index:15;border-right:2px solid rgba(37,99,168,.3);box-shadow:4px 0 12px #0000004d}.date-header{width:70px;min-width:70px;flex-direction:column;gap:2px;padding:var(--space-sm) var(--space-xs);position:relative}.month-label{position:absolute;top:0;left:0;right:0;background:linear-gradient(135deg,var(--navy-600) 0%,var(--navy-500) 100%);color:#fff;font-size:.6rem;font-weight:700;text-align:center;padding:2px 4px;text-transform:uppercase;letter-spacing:.05em;border-radius:0 0 4px 4px}.date-header.first-of-month{border-left:2px solid rgba(37,99,168,.5);padding-top:20px}.date-header .day-name{font-size:.7rem;color:var(--text-muted);text-transform:uppercase}.date-header .day-num{font-size:1rem;font-weight:600;color:var(--text-secondary)}.date-header.today{background:linear-gradient(135deg,#1e4d8c4d,#2563a833)}.date-header.today .day-num{color:var(--navy-200)}.date-header.past{opacity:.6}.today-badge{font-size:.6rem;background:var(--navy-500);color:#fff;padding:2px 6px;border-radius:var(--radius-full);font-weight:500}.grid-body{display:flex;flex-direction:column;min-width:max-content}.grid-row{display:flex;min-width:max-content;border-bottom:1px solid var(--border-primary);transition:background var(--transition-fast)}.grid-row:last-child{border-bottom:none}.grid-row:hover{background:#1e4d8c1a}.task-cell{min-width:200px;width:200px;justify-content:flex-start;padding:var(--space-sm) var(--space-xs);background:#0f2140fa;position:sticky;left:0;z-index:10;gap:var(--space-xs);border-right:2px solid rgba(37,99,168,.3);box-shadow:4px 0 12px #0000004d}.drag-handle{display:flex;align-items:center;color:var(--text-muted);cursor:grab;opacity:.3;transition:all var(--transition-fast);flex-shrink:0}.drag-handle svg{width:18px;height:18px}.grid-row:hover .drag-handle{opacity:1}.grid-row.dragging{background:#1e4d8c80!important;box-shadow:0 10px 30px #00000080;border:1px solid var(--navy-400)}.grid-row.dragging .grid-cell{background:transparent!important}.task-info{display:flex;align-items:center;gap:var(--space-sm);overflow:hidden;flex:1;min-width:0}.task-notif-badge{flex-shrink:0;font-size:.72rem;opacity:.7;cursor:default}.task-type-badge{flex-shrink:0;width:20px;height:20px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:700}.task-type-badge.permanent{background:linear-gradient(135deg,var(--navy-500) 0%,var(--navy-600) 100%);color:#fff}.task-type-badge.daily{background:linear-gradient(135deg,var(--accent-gold) 0%,#d4a418 100%);color:var(--navy-900)}.task-name{font-size:.875rem;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.delete-btn{opacity:0;background:none;border:none;color:var(--accent-error);cursor:pointer;padding:4px;border-radius:var(--radius-sm);transition:all var(--transition-fast);margin-left:auto}.delete-btn svg{width:16px;height:16px}.grid-row:hover .delete-btn{opacity:.7}.delete-btn:hover{opacity:1!important;background:#ef44441a}.checkbox-cell{width:70px;min-width:70px;cursor:pointer;position:relative;z-index:2}.checkbox-cell:hover:not(.disabled){background:#1e4d8c33}.checkbox-cell.today{background:#1e4d8c26}.checkbox-cell.past{opacity:.6}.checkbox-cell.disabled{cursor:not-allowed;opacity:.3}.checkbox-cell.completed{background:#10b9811a}.check-mark{width:28px;height:28px;border:2px solid var(--border-primary);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);background:var(--bg-secondary)}.checkbox-cell:hover:not(.disabled) .check-mark{border-color:var(--navy-400);transform:scale(1.05)}.check-mark.checked{background:var(--accent-success);border-color:var(--accent-success);animation:checkmark .3s ease}.check-mark.checked svg{width:16px;height:16px;color:#fff}.empty-state{display:flex;flex-direction:column;align-items:center;padding:var(--space-2xl);color:var(--text-muted);text-align:center;gap:var(--space-md)}.empty-state svg{width:64px;height:64px;opacity:.5}.modal-overlay{position:fixed;inset:0;background:#0a1628d9;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);padding:var(--space-md);animation:fadeIn .2s ease}.modal{width:100%;max-width:420px;background:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg)}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-lg);border-bottom:1px solid var(--border-primary)}.close-btn{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:var(--space-xs);border-radius:var(--radius-sm)}.close-btn svg{width:20px;height:20px}.modal-body{padding:var(--space-lg)}.form-group{margin-bottom:var(--space-lg)}.form-group label{display:block;font-size:.875rem;font-weight:500;color:var(--text-secondary);margin-bottom:var(--space-sm)}.type-selector{display:flex;gap:var(--space-sm)}.type-option{flex:1;display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-md);background:var(--bg-tertiary);border:2px solid var(--border-primary);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);text-align:left;font-family:var(--font-primary)}.type-option.active{border-color:var(--navy-400);background:#1e4d8c33}.type-icon{width:36px;height:36px;background:var(--bg-secondary);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--navy-300)}.type-option.active .type-icon{background:var(--navy-500);color:#fff}.type-info{display:flex;flex-direction:column;gap:2px}.type-name{font-size:.875rem;font-weight:600;color:var(--text-primary)}.type-desc{font-size:.75rem;color:var(--text-muted)}.modal-actions{display:flex;gap:var(--space-sm);justify-content:flex-end}.optional-label{font-size:.75rem;color:var(--text-muted);font-weight:400}.notif-time-row{display:flex;align-items:center;gap:var(--space-sm)}.notif-time-icon{flex-shrink:0;width:36px;height:36px;background:#2563a826;border:1px solid var(--border-primary);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;color:var(--navy-300)}.notif-time-icon svg{width:16px;height:16px}.notif-time-input{flex:1;color-scheme:dark}.clear-time-btn{flex-shrink:0;background:none;border:none;cursor:pointer;color:var(--text-muted);padding:6px;border-radius:var(--radius-sm);display:flex;align-items:center;transition:color var(--transition-fast)}.clear-time-btn:hover{color:var(--accent-error)}.clear-time-btn svg{width:14px;height:14px}.notif-time-hint{font-size:.78rem;color:var(--navy-300);margin-top:var(--space-xs);padding:var(--space-xs) var(--space-sm);background:#2563a81a;border-radius:var(--radius-sm);border-left:2px solid var(--navy-400)}@media(max-width:768px){.habit-tracker{padding:var(--space-sm)}.tracker-header{flex-direction:column;align-items:stretch}.add-task-btn{width:100%;justify-content:center}.task-header,.task-cell{min-width:160px;width:160px}.date-header,.checkbox-cell{width:52px;min-width:52px}.type-selector{flex-direction:column}}.calendar{padding:var(--space-md);max-width:800px;margin:0 auto}.calendar-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-lg)}.calendar-header h2{font-size:1.5rem;font-weight:600}.month-nav{display:flex;align-items:center;gap:var(--space-md)}.nav-arrow{width:36px;height:36px;background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-full);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast)}.nav-arrow svg{width:20px;height:20px}.nav-arrow:hover{background:var(--bg-hover);border-color:var(--border-active);color:var(--text-primary)}.month-year{font-size:1.125rem;font-weight:600;color:var(--text-primary);min-width:160px;text-align:center}.calendar-grid{background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-lg);overflow:hidden;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.weekdays{display:grid;grid-template-columns:repeat(7,1fr);background:#152d5080;border-bottom:1px solid var(--border-primary)}.weekday{padding:var(--space-sm);text-align:center;font-size:.75rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.days-grid{display:grid;grid-template-columns:repeat(7,1fr)}.day-cell{aspect-ratio:1;padding:var(--space-xs);border-right:1px solid var(--border-primary);border-bottom:1px solid var(--border-primary);cursor:pointer;transition:all var(--transition-fast);display:flex;flex-direction:column;align-items:center;position:relative}.day-cell:nth-child(7n){border-right:none}.day-cell:nth-last-child(-n+7){border-bottom:none}.day-cell:hover{background:var(--bg-hover)}.day-cell.other-month{opacity:.4}.day-cell.today{background:linear-gradient(135deg,#1e4d8c4d,#2563a833)}.day-cell.today .day-number{background:var(--navy-500);color:#fff;border-radius:var(--radius-full);width:28px;height:28px;display:flex;align-items:center;justify-content:center}.day-cell.has-events{background:#10b9811a}.day-number{font-size:.875rem;font-weight:500;color:var(--text-secondary)}.event-dots{display:flex;gap:3px;margin-top:auto;padding-bottom:4px}.event-dot{width:6px;height:6px;background:var(--accent-success);border-radius:50%}.event-modal{max-width:480px;max-height:80vh;overflow-y:auto}.existing-events{margin-bottom:var(--space-lg)}.event-item{display:flex;align-items:center;justify-content:space-between;padding:var(--space-sm) var(--space-md);background:var(--bg-tertiary);border-radius:var(--radius-md);margin-bottom:var(--space-sm)}.event-content{display:flex;align-items:center;gap:var(--space-md)}.event-time{font-size:.75rem;font-weight:600;color:var(--navy-300);background:var(--bg-secondary);padding:2px 8px;border-radius:var(--radius-sm)}.event-text{font-size:.875rem;color:var(--text-primary)}.event-delete{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:4px;opacity:.5;transition:all var(--transition-fast)}.event-delete svg{width:16px;height:16px}.event-delete:hover{opacity:1;color:var(--accent-error)}.no-events{text-align:center;color:var(--text-muted);padding:var(--space-md)}.add-event-form{padding-top:var(--space-md);border-top:1px solid var(--border-primary)}.add-event-form h4{font-size:.875rem;font-weight:600;margin-bottom:var(--space-sm);color:var(--text-secondary)}.add-event-form textarea{min-height:80px;margin-bottom:var(--space-md)}.event-options{display:flex;align-items:center;gap:var(--space-lg);margin-bottom:var(--space-md)}.time-input{display:flex;align-items:center;gap:var(--space-sm)}.time-input label{font-size:.75rem;color:var(--text-muted)}.time-input input{width:120px}.reminder-toggle{display:flex;align-items:center;gap:var(--space-sm);cursor:pointer;font-size:.875rem;color:var(--text-secondary)}.reminder-toggle input{accent-color:var(--navy-400)}@media(max-width:640px){.calendar{padding:var(--space-sm)}.calendar-header{flex-direction:column;gap:var(--space-md)}.day-cell{aspect-ratio:auto;min-height:50px}.day-number{font-size:.75rem}.event-dot{width:4px;height:4px}.event-options{flex-direction:column;align-items:flex-start}}.report-overlay{align-items:flex-start;padding-top:40px}.report-modal{max-width:520px;width:100%;max-height:calc(100vh - 80px);overflow-y:auto;animation:reportModalIn .35s cubic-bezier(.34,1.56,.64,1) forwards}@keyframes reportModalIn{0%{opacity:0;transform:translateY(-24px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.report-modal-header{padding:var(--space-lg) var(--space-xl);border-bottom:1px solid var(--border-primary)}.report-title-area{display:flex;align-items:center;gap:var(--space-md)}.report-title-icon{width:42px;height:42px;background:linear-gradient(135deg,var(--navy-600) 0%,var(--navy-500) 100%);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 0 20px #2563a84d}.report-title-icon svg{width:22px;height:22px;color:#fff}.report-title-area h3{font-size:1.1rem;font-weight:700;margin-bottom:2px}.report-subtitle{font-size:.8rem;color:var(--text-muted)}.report-modal-body{padding:var(--space-lg) var(--space-xl);display:flex;flex-direction:column;gap:var(--space-xl)}.report-section{display:flex;flex-direction:column;gap:var(--space-sm)}.report-section-label{font-size:.8rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.report-type-toggle{display:flex;background:var(--bg-tertiary);border-radius:var(--radius-md);padding:4px;gap:4px;border:1px solid var(--border-primary)}.type-toggle-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:transparent;border:none;border-radius:calc(var(--radius-md) - 4px);color:var(--text-muted);font-size:.875rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast);font-family:var(--font-primary)}.type-toggle-btn svg{width:16px;height:16px}.type-toggle-btn.active{background:var(--navy-600);color:#fff;box-shadow:var(--shadow-md)}.type-toggle-btn:not(.active):hover{background:var(--bg-hover);color:var(--text-secondary)}.period-selectors{display:flex;gap:var(--space-sm)}.period-select{flex:1;appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234a90c4' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;padding-right:36px}.report-stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-sm)}.report-stat-card{background:var(--bg-tertiary);border:1px solid var(--border-primary);border-radius:var(--radius-md);padding:var(--space-md);text-align:center}.stat-value{font-size:1.75rem;font-weight:700;line-height:1;margin-bottom:4px}.stat-label{font-size:.72rem;color:var(--text-muted);font-weight:500}.report-highlight-row{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:#2563a81a;border:1px solid rgba(37,99,168,.2);border-radius:var(--radius-md);font-size:.82rem;flex-wrap:wrap}.highlight-label{color:var(--text-muted);font-weight:500}.highlight-value{color:var(--text-primary);font-weight:600;flex:1}.highlight-count{color:var(--navy-300);font-size:.78rem;font-weight:500}.export-buttons{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-sm)}.export-btn{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);border-radius:var(--radius-md);border:1px solid var(--border-primary);cursor:pointer;transition:all var(--transition-fast);font-family:var(--font-primary);text-align:left}.export-btn:disabled{opacity:.45;cursor:not-allowed;transform:none!important}.export-btn svg{width:28px;height:28px;flex-shrink:0}.export-btn-text{display:flex;flex-direction:column;gap:2px}.export-btn-title{font-size:.875rem;font-weight:600}.export-btn-desc{font-size:.75rem;opacity:.7}.export-csv{background:#10b98114;border-color:#10b98140;color:#34d399}.export-csv:not(:disabled):hover{background:#10b9812e;border-color:#10b98180;transform:translateY(-2px);box-shadow:0 6px 20px #10b98133}.export-pdf{background:#2563a814;border-color:#2563a840;color:var(--navy-200)}.export-pdf:not(:disabled):hover{background:#2563a82e;border-color:#2563a880;transform:translateY(-2px);box-shadow:0 6px 20px #2563a833}.export-spinner{width:28px;height:28px;border-radius:50%;border:2px solid rgba(255,255,255,.2);border-top-color:currentColor;animation:spin .7s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.export-empty-note{font-size:.8rem;color:var(--text-muted);text-align:center;padding:var(--space-sm)}@media(max-width:560px){.report-overlay{padding-top:12px}.report-modal-header,.report-modal-body{padding-left:var(--space-lg);padding-right:var(--space-lg)}.report-stats-grid{grid-template-columns:repeat(3,1fr)}.stat-value{font-size:1.4rem}.export-buttons{grid-template-columns:1fr}}.toast-container{position:fixed;bottom:24px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:10px;max-width:360px;width:calc(100vw - 48px);pointer-events:none}.toast{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;border:1px solid transparent;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 8px 32px #0006,0 2px 8px #0000004d;position:relative;overflow:hidden;pointer-events:all;cursor:default}.toast-enter{animation:toastSlideIn .35s cubic-bezier(.34,1.56,.64,1) forwards}.toast-exit{animation:toastSlideOut .32s ease-in forwards}@keyframes toastSlideIn{0%{opacity:0;transform:translate(100%) scale(.85)}to{opacity:1;transform:translate(0) scale(1)}}@keyframes toastSlideOut{0%{opacity:1;transform:translate(0) scale(1);max-height:80px;margin-bottom:0}to{opacity:0;transform:translate(100%) scale(.85);max-height:0;margin-bottom:-10px}}.toast-success{background:#102c20eb;border-color:#10b98159;color:#ecfdf5}.toast-success .toast-icon{color:#10b981;background:#10b98126}.toast-success .toast-progress{background:#10b981}.toast-error{background:#2c1010eb;border-color:#ef444459;color:#fef2f2}.toast-error .toast-icon{color:#ef4444;background:#ef444426}.toast-error .toast-progress{background:#ef4444}.toast-warning{background:#2c2610eb;border-color:#f59e0b59;color:#fffbeb}.toast-warning .toast-icon{color:#f59e0b;background:#f59e0b26}.toast-warning .toast-progress{background:#f59e0b}.toast-info{background:#0f2140f2;border-color:#4e90c459;color:#e8f2fa}.toast-info .toast-icon{color:#4a90c4;background:#4e90c426}.toast-info .toast-progress{background:#4a90c4}.toast-icon{flex-shrink:0;width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center}.toast-icon svg{width:16px;height:16px}.toast-message{flex:1;font-size:.875rem;font-weight:500;line-height:1.4}.toast-close{flex-shrink:0;background:none;border:none;cursor:pointer;padding:4px;border-radius:6px;color:inherit;opacity:.5;transition:opacity .15s ease;display:flex;align-items:center}.toast-close:hover{opacity:1}.toast-close svg{width:14px;height:14px}.toast-progress{position:absolute;bottom:0;left:0;height:3px;border-radius:0 0 0 12px;width:100%;transform-origin:left;animation:toastProgress linear forwards;opacity:.7}@keyframes toastProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}@media(max-width:480px){.toast-container{bottom:16px;right:12px;left:12px;width:auto;max-width:none}}
