:root{--primary-green: #22c55e;--primary-green-dark: #16a34a;--primary-green-light: #bbf7d0;--primary-green-muted: rgba(34, 197, 94, .12);--primary-blue: #2b6cee;--primary-blue-dark: #1d4ed8;--primary-blue-light: #bfdbfe;--primary-blue-muted: rgba(43, 108, 238, .12);--gray-50: #f9fafb;--gray-100: #f3f4f6;--gray-200: #e5e7eb;--gray-300: #d1d5db;--gray-400: #9ca3af;--gray-500: #6b7280;--gray-600: #4b5563;--gray-700: #374151;--gray-800: #1f2937;--gray-900: #111827;--success: #22c55e;--warning: #f59e0b;--error: #ef4444;--info: #3b82f6;--bg-primary: #f6f6f8;--bg-secondary: #ffffff;--bg-card: #ffffff;--bg-dark: #101622;--bg-dark-card: #1a2236;--bg-dark-surface: #1e2a3a;--text-primary: #111827;--text-secondary: #6b7280;--text-muted: #9ca3af;--text-inverse: #ffffff;--border-color: #e5e7eb;--border-color-dark: #2d3748;--radius-xs: .25rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--radius-full: 9999px;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--line-height-tight: 1.25;--line-height-snug: 1.375;--line-height-normal: 1.5;--line-height-relaxed: 1.625;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .05);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .1), 0 1px 2px rgba(0, 0, 0, .06);--shadow-md: 0 4px 6px rgba(0, 0, 0, .07), 0 2px 4px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1), 0 4px 6px rgba(0, 0, 0, .05);--shadow-xl: 0 20px 25px rgba(0, 0, 0, .1), 0 10px 10px rgba(0, 0, 0, .04);--shadow-green: 0 4px 14px rgba(34, 197, 94, .35);--shadow-blue: 0 4px 14px rgba(43, 108, 238, .35);--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .4s ease;--nav-height: 4rem;--bottom-nav-height: 4.5rem;--max-width-sm: 480px;--max-width-md: 768px;--max-width-lg: 1024px;--max-width-xl: 1280px;--z-base: 0;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-toast: 500}.dark{--bg-primary: #101622;--bg-secondary: #1a2236;--bg-card: #1a2236;--text-primary: #f9fafb;--text-secondary: #9ca3af;--text-muted: #6b7280;--border-color: #2d3748;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .3), 0 1px 2px rgba(0, 0, 0, .2);--shadow-md: 0 4px 6px rgba(0, 0, 0, .25), 0 2px 4px rgba(0, 0, 0, .2);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .3), 0 4px 6px rgba(0, 0, 0, .2)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;border:none;border-radius:var(--radius-full);font-family:var(--font-family);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);line-height:1;cursor:pointer;transition:all var(--transition-base);text-decoration:none;white-space:nowrap}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background:var(--primary-green);color:#fff;box-shadow:var(--shadow-green)}.btn--primary:hover:not(:disabled){background:var(--primary-green-dark);transform:translateY(-1px);box-shadow:0 6px 20px #22c55e73}.btn--primary:active:not(:disabled){transform:translateY(0)}.btn--secondary{background:transparent;color:var(--primary-green);border:2px solid var(--primary-green)}.btn--secondary:hover:not(:disabled){background:var(--primary-green-muted)}.btn--blue{background:var(--primary-blue);color:#fff;box-shadow:var(--shadow-blue)}.btn--blue:hover:not(:disabled){background:var(--primary-blue-dark);transform:translateY(-1px)}.btn--ghost{background:transparent;color:var(--text-secondary);border:1px solid var(--border-color)}.btn--ghost:hover:not(:disabled){background:var(--gray-100);border-color:var(--gray-300)}.btn--danger{background:var(--error);color:#fff}.btn--danger:hover:not(:disabled){background:#dc2626}.btn--sm{padding:.5rem 1rem;font-size:var(--font-size-sm)}.btn--lg{padding:1rem 2rem;font-size:var(--font-size-lg)}.btn--full{width:100%}.btn--icon{padding:.625rem;border-radius:var(--radius-full);width:2.5rem;height:2.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.25rem}.form-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--text-secondary)}.form-input{width:100%;padding:.875rem 1rem;border:1.5px solid var(--border-color);border-radius:var(--radius-lg);font-family:var(--font-family);font-size:var(--font-size-base);color:var(--text-primary);background:var(--bg-secondary);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);box-sizing:border-box;outline:none}.form-input::placeholder{color:var(--text-muted)}.form-input:focus{border-color:var(--primary-green);box-shadow:0 0 0 3px var(--primary-green-muted)}.form-input--error{border-color:var(--error);box-shadow:0 0 0 3px #ef44441f}.form-input-wrapper{position:relative}.form-input-wrapper .form-input{padding-left:2.75rem}.form-input-wrapper .input-icon{position:absolute;left:.875rem;top:50%;transform:translateY(-50%);color:var(--text-muted);font-size:1.25rem;pointer-events:none}.form-input-wrapper .input-icon-right{position:absolute;right:.875rem;top:50%;transform:translateY(-50%);color:var(--text-muted);font-size:1.25rem;cursor:pointer}.form-input-wrapper .input-icon-right:hover{color:var(--text-secondary)}.form-error{font-size:var(--font-size-xs);color:var(--error);margin-top:.25rem}.card{background:var(--bg-card);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);overflow:hidden}.card--elevated{box-shadow:var(--shadow-md)}.card--bordered{border:1px solid var(--border-color);box-shadow:none}.badge{display:inline-flex;align-items:center;padding:.25rem .625rem;border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);line-height:1}.badge--success{background:#22c55e1f;color:#16a34a}.badge--error{background:#ef44441f;color:#dc2626}.badge--warning{background:#f59e0b1f;color:#d97706}.badge--info{background:#3b82f61f;color:#2563eb}.badge--neutral{background:var(--gray-100);color:var(--gray-600)}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.section-header .section-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--text-primary)}.section-header .section-link{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--primary-blue);text-decoration:none}.section-header .section-link:hover{text-decoration:underline}.divider{width:100%;height:1px;background:var(--border-color);margin:1.5rem 0}.divider--text{display:flex;align-items:center;gap:1rem;margin:1.5rem 0}.divider--text:before,.divider--text:after{content:"";flex:1;height:1px;background:var(--border-color)}.divider--text span{font-size:var(--font-size-sm);color:var(--text-muted);white-space:nowrap}.skeleton{background:linear-gradient(90deg,var(--gray-200) 25%,var(--gray-100) 50%,var(--gray-200) 75%);background-size:200% 100%;animation:skeleton-loading 1.5s infinite;border-radius:var(--radius-md)}.skeleton--text{height:1rem;width:100%}.skeleton--circle{border-radius:var(--radius-full)}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.chip{display:inline-flex;align-items:center;gap:.25rem;padding:.375rem .75rem;border-radius:var(--radius-full);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);border:1.5px solid var(--border-color);background:var(--bg-secondary);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.chip:hover{border-color:var(--primary-green);color:var(--primary-green)}.chip--active{background:var(--primary-green);border-color:var(--primary-green);color:#fff}.avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-full);overflow:hidden;background:var(--primary-green-muted);color:var(--primary-green);font-weight:var(--font-weight-semibold);flex-shrink:0}.avatar img{width:100%;height:100%;object-fit:cover}.avatar--sm{width:2rem;height:2rem;font-size:var(--font-size-xs)}.avatar--md{width:2.5rem;height:2.5rem;font-size:var(--font-size-sm)}.avatar--lg{width:3.5rem;height:3.5rem;font-size:var(--font-size-lg)}.avatar--xl{width:5rem;height:5rem;font-size:var(--font-size-2xl)}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:var(--radius-full);border:none;background:transparent;cursor:pointer;color:var(--text-secondary);transition:all var(--transition-fast)}.icon-btn:hover{background:var(--gray-100);color:var(--text-primary)}.icon-btn--filled{background:var(--bg-card);box-shadow:var(--shadow-sm)}.icon-btn--filled:hover{background:var(--gray-50);box-shadow:var(--shadow-md)}.page-container{min-height:100vh;background:var(--bg-primary);padding-bottom:var(--bottom-nav-height)}@media(min-width:768px){.page-container{padding-bottom:0;padding-top:var(--nav-height)}}.content-section{padding:1.25rem 1rem}@media(min-width:768px){.content-section{padding:1.5rem 2rem;max-width:var(--max-width-xl);margin:0 auto}}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1.5rem;text-align:center}.empty-state .empty-state-icon{font-size:3.5rem;color:var(--gray-300);margin-bottom:1rem}.empty-state .empty-state-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin-bottom:.5rem}.empty-state .empty-state-text{font-size:var(--font-size-sm);color:var(--text-muted);max-width:280px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{font-family:var(--font-family);font-size:var(--font-size-base);font-weight:var(--font-weight-normal);line-height:var(--line-height-normal);color:var(--text-primary);background-color:var(--bg-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);color:var(--text-primary)}h1{font-size:var(--font-size-3xl)}h2{font-size:var(--font-size-2xl)}h3{font-size:var(--font-size-xl)}h4{font-size:var(--font-size-lg)}h5{font-size:var(--font-size-base)}h6{font-size:var(--font-size-sm)}p{color:var(--text-secondary);line-height:var(--line-height-relaxed)}a{color:var(--primary-blue);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--primary-blue-dark)}img{max-width:100%;height:auto;display:block}button{font-family:inherit;cursor:pointer}input,textarea,select{font-family:inherit}ul,ol{list-style:none}.material-symbols-outlined{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24;-webkit-user-select:none;user-select:none;line-height:1;vertical-align:middle;display:inline-block}.material-symbols-outlined.filled{font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}.scroll-x{display:flex;gap:.75rem;overflow-x:auto;padding-bottom:.5rem;scrollbar-width:none}.scroll-x::-webkit-scrollbar{display:none}.text-green{color:var(--primary-green)}.text-blue{color:var(--primary-blue)}.text-muted{color:var(--text-muted)}.text-secondary{color:var(--text-secondary)}.text-center{text-align:center}.text-sm{font-size:var(--font-size-sm)}.text-xs{font-size:var(--font-size-xs)}.text-lg{font-size:var(--font-size-lg)}.font-bold{font-weight:var(--font-weight-bold)}.font-semibold{font-weight:var(--font-weight-semibold)}.font-medium{font-weight:var(--font-weight-medium)}.w-full{width:100%}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-4{gap:1rem}.mt-4{margin-top:1rem}.mb-4{margin-bottom:1rem}.p-4{padding:1rem}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleInFade{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.animate-fade-in{animation:fadeIn .3s ease both}.animate-slide-up{animation:slideUp .4s ease both}.animate-stagger>*{opacity:0;animation:fadeInUp .45s ease forwards}.animate-stagger>*:nth-child(1){animation-delay:.05s}.animate-stagger>*:nth-child(2){animation-delay:.1s}.animate-stagger>*:nth-child(3){animation-delay:.15s}.animate-stagger>*:nth-child(4){animation-delay:.2s}.animate-stagger>*:nth-child(5){animation-delay:.25s}.animate-stagger>*:nth-child(6){animation-delay:.3s}.animate-stagger>*:nth-child(7){animation-delay:.35s}.animate-stagger>*:nth-child(8){animation-delay:.4s}.animate-stagger>*:nth-child(9){animation-delay:.45s}.animate-stagger>*:nth-child(n+10){animation-delay:.5s}.desktop-only{display:none!important}@media(min-width:1024px){.desktop-only{display:block!important}}app-root{display:block;min-height:100vh}