:root{--bg-base: #0a0a0b;--bg-surface: #141416;--bg-elevated: #202023;--text-primary: #f2f2f3;--text-secondary: #9ea0a5;--text-tertiary: #6a6c71;--accent-base: #bc25f6;--accent-light: #df6aff;--accent-gradient: linear-gradient(135deg, #bc25f6 0%, #ff4b9f 100%);--accent-shadow: rgba(188, 37, 246, .4);--success: #34d399;--error: #fb7185;--warning: #fbbf24;--info: #38bdf8;--border-subtle: rgba(255, 255, 255, .08);--border-radius-sm: 8px;--border-radius-md: 16px;--border-radius-lg: 24px;--border-radius-full: 9999px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-6: 24px;--space-8: 32px;--space-12: 48px;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-display: "Outfit", var(--font-sans);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .25s cubic-bezier(.4, 0, .2, 1);--transition-slow: .4s cubic-bezier(.4, 0, .2, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body{overscroll-behavior-y:none;background-color:var(--bg-base);color:var(--text-primary);font-family:var(--font-sans);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body,#root{min-height:100vh;min-height:-webkit-fill-available;display:flex;flex-direction:column}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:700;color:var(--text-primary);letter-spacing:-.02em}h1{font-size:2.5rem;line-height:1.1}h2{font-size:1.75rem;line-height:1.2}h3{font-size:1.25rem}p{color:var(--text-secondary)}.gradient-text{background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent}.text-center{text-align:center}.text-right{text-align:right}.flex-1{flex:1}.mb-2{margin-bottom:var(--space-2)}.mb-4{margin-bottom:var(--space-4)}.sticky-header{position:sticky;top:0;z-index:40;background-color:var(--bg-base);padding-top:calc(var(--space-6) + env(safe-area-inset-top));padding-bottom:var(--space-2);margin-top:calc(-1 * var(--space-6));margin-left:calc(-1 * var(--space-4));margin-right:calc(-1 * var(--space-4));padding-left:var(--space-4);padding-right:var(--space-4)}.mb-6{margin-bottom:var(--space-6)}.mt-4{margin-top:var(--space-4)}.app-container{display:flex;flex-direction:column;min-height:100vh;max-width:600px;margin:0 auto;width:100%;position:relative;background-color:var(--bg-base)}.main-content{flex:1;padding:var(--space-6) var(--space-4);padding-bottom:calc(80px + env(safe-area-inset-bottom))}.bottom-nav{position:fixed;bottom:0;left:0;right:0;max-width:600px;margin:0 auto;padding:var(--space-2) var(--space-4) calc(var(--space-2) + env(safe-area-inset-bottom));background:#141416d9;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-top:1px solid var(--border-subtle);display:flex;justify-content:space-around;align-items:center;z-index:20}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-tertiary);text-decoration:none;font-size:.75rem;font-weight:500;padding:var(--space-2);min-width:64px;transition:color var(--transition-fast)}.nav-item svg{margin-bottom:4px;transition:transform var(--transition-fast)}.nav-item.active{color:var(--accent-light)}.nav-item.active svg{transform:scale(1.15)}.nav-item:active svg{transform:scale(.9)}.card{background-color:var(--bg-surface);border-radius:var(--border-radius-md);border:1px solid var(--border-subtle);padding:var(--space-4);transition:transform var(--transition-normal),box-shadow var(--transition-normal)}.card:active{transform:scale(.98)}.card-todo{display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-3);background-color:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--border-radius-md);padding:var(--space-3) var(--space-4);transition:all var(--transition-normal)}.card-todo:last-child{margin-bottom:0}.card-todo.completed{opacity:.6}.card-todo.completed .todo-title{text-decoration:line-through;color:var(--text-secondary)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border-radius:var(--border-radius-full);font-family:var(--font-sans);font-weight:600;font-size:1rem;cursor:pointer;border:none;outline:none;transition:all var(--transition-normal);text-decoration:none}.btn-primary{background:var(--accent-gradient);color:#fff;box-shadow:0 4px 14px var(--accent-shadow)}.btn-primary:active{transform:scale(.96);box-shadow:0 2px 8px var(--accent-shadow)}.btn-secondary{background:var(--bg-elevated);color:var(--text-primary);border:1px solid var(--border-subtle)}.btn-secondary:active{transform:scale(.96);background:var(--bg-surface)}.btn-icon-only{padding:var(--space-2);border-radius:var(--border-radius-full);display:inline-flex;align-items:center;justify-content:center;background:var(--bg-elevated);color:var(--text-primary);border:1px solid var(--border-subtle);transition:all var(--transition-fast);cursor:pointer}.btn-icon-only:active{transform:scale(.9);background:var(--bg-surface)}.input-group{margin-bottom:var(--space-4)}.input-label{display:block;font-size:.875rem;color:var(--text-secondary);margin-bottom:var(--space-2);font-weight:500}.input-field{width:100%;background:var(--bg-elevated);border:1px solid var(--border-subtle);border-radius:var(--border-radius-md);padding:var(--space-3) var(--space-4);color:var(--text-primary);font-family:var(--font-sans);font-size:1rem;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.input-field:focus{outline:none;border-color:var(--accent-base);box-shadow:0 0 0 2px #bc25f633}.input-field::placeholder{color:var(--text-tertiary)}.custom-checkbox{appearance:none;width:24px;height:24px;border-radius:6px;border:2px solid var(--border-subtle);background-color:transparent;cursor:pointer;position:relative;transition:all var(--transition-fast);flex-shrink:0}.custom-checkbox:checked{background:var(--accent-gradient);border-color:transparent}.custom-checkbox:checked:after{content:"";position:absolute;left:7px;top:3px;width:6px;height:12px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}.custom-checkbox:active{transform:scale(.85)}@keyframes slideUpFade{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-slide-up{animation:slideUpFade var(--transition-slow) forwards}.avatar-stack{display:flex;align-items:center}.avatar{width:28px;height:28px;border-radius:50%;background:var(--bg-surface);border:2px solid var(--bg-base);display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;color:var(--text-secondary);margin-left:-8px;box-shadow:0 2px 4px #0003}.avatar:first-child{margin-left:0}.avatar.extra{background:var(--accent-gradient);color:#fff}