:root{--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--spacing-3xl: 4rem;--font-size-xs: .625rem;--font-size-sm: .75rem;--font-size-base: .875rem;--font-size-lg: 1rem;--font-size-xl: 1.125rem;--font-size-2xl: 1.25rem;--font-size-3xl: 1.5rem;--font-size-4xl: 1.875rem;--font-size-5xl: 3rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--radius-none: 0;--radius-sm: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--radius-circle: 50%;--radius-full: 9999px;--shadow-xs: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-sm: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--shadow-button: 0 2px 8px rgb(0 0 0 / .1);--shadow-button-hover: 0 4px 16px rgb(0 0 0 / .15);--shadow-celebration: 0 8px 32px rgb(0 0 0 / .12);--shadow-inset: inset 0 1px 3px rgb(0 0 0 / .1);--shadow-focus-ring: 0 0 0 3px var(--color-primary-light), inset 0 1px 3px rgb(0 0 0 / .1);--shadow-success: 0 4px 12px rgb(34 197 94 / .3);--shadow-primary: 0 6px 20px rgb(99 102 241 / .4);--transition-fast: .15s ease;--transition-normal: .2s ease;--transition-slow: .3s ease;--transition-bounce: .3s cubic-bezier(.68, -.55, .265, 1.55);--animation-fast: .15s ease-out;--animation-normal: .2s ease-out;--animation-slow: .3s ease-out;--animation-slide: .3s ease-out;--animation-celebrate: .6s ease-out;--animation-spin: 1s linear infinite;--animation-stagger: .8s ease-out;--animation-stagger-delay-1: .2s;--animation-stagger-delay-2: .4s;--animation-stagger-delay-3: .6s;--animation-stagger-delay-4: .8s;--button-height: 40px;--header-height: 64px;--sidebar-width-mobile: 240px;--sidebar-width-desktop: 280px;--container-max-width: 1200px;--container-lg-width: 800px;--container-md-width: 600px;--container-sm-width: 500px;--container-xs-width: 400px;--spacing-4xl: 3.75rem;--spacing-5xl: 5rem;--z-dropdown: 1000;--z-modal: 1050;--z-popover: 1100;--z-tooltip: 1150;--z-toast: 1200;--opacity-0: 0;--opacity-25: .25;--opacity-30: .3;--opacity-50: .5;--opacity-60: .6;--opacity-75: .75;--opacity-90: .9;--opacity-100: 1;--color-overlay-light: rgba(255, 255, 255, .95);--color-overlay-medium: rgba(255, 255, 255, .3);--color-backdrop-light: rgba(0, 0, 0, .3);--color-backdrop-medium: rgba(0, 0, 0, .5);--color-backdrop-heavy: rgba(0, 0, 0, .6)}:root{--color-primary: #3b82f6;--color-primary-hover: #2563eb;--color-primary-light: #dbeafe;--color-primary-dark: #1d4ed8;--color-background: #ffffff;--color-surface: #f8fafc;--color-surface-hover: #f1f5f9;--color-surface-secondary: #e2e8f0;--color-text: #1f2937;--color-text-muted: #6b7280;--color-text-light: #9ca3af;--color-text-inverse: #ffffff;--color-border: #e5e7eb;--color-border-light: #f3f4f6;--color-border-strong: #d1d5db;--color-success: #10b981;--color-success-light: #d1fae5;--color-warning: #f59e0b;--color-warning-light: #fef3c7;--color-error: #ef4444;--color-error-light: #fee2e2;--color-info: #3b82f6;--color-info-light: #dbeafe;--day-1: #dbeafe;--day-2: #bfdbfe;--day-3: #93c5fd;--day-4: #60a5fa;--day-5: #3b82f6;--day-6: #2563eb;--day-7: #1d4ed8;--level-1: #bfdbfe;--level-2: #93c5fd;--level-3: #60a5fa;--level-4: #3b82f6;--level-5: #1d4ed8}[data-theme=vitality]{--color-primary: #22c55e;--color-primary-hover: #16a34a;--color-primary-light: #dcfce7;--color-primary-dark: #15803d;--color-background: #f0fdf4;--color-surface: #dcfce7;--color-surface-hover: #bbf7d0;--color-surface-secondary: #a7f3d0;--color-text: #14532d;--color-text-muted: #166534;--color-text-light: #22c55e;--color-border: #bbf7d0;--color-border-light: #dcfce7;--color-border-strong: #86efac;--color-success: #10b981;--color-info: #22c55e;--color-warning: #eab308;--color-error: #dc2626;--day-1: #86efac;--day-2: #4ade80;--day-3: #22c55e;--day-4: #16a34a;--day-5: #10b981;--day-6: #059669;--day-7: #047857;--level-1: #a7f3d0;--level-2: #6ee7b7;--level-3: #34d399;--level-4: #10b981;--level-5: #059669}[data-theme=scholar]{--color-primary: #1d4ed8;--color-primary-hover: #1e40af;--color-primary-light: #dbeafe;--color-primary-dark: #1e3a8a;--color-background: #fefbeb;--color-surface: #fef3c7;--color-surface-hover: #fde68a;--color-surface-secondary: #fcd34d;--color-text: #1e3a8a;--color-text-muted: #3730a3;--color-text-light: #6366f1;--color-border: #fde68a;--color-border-light: #fef3c7;--color-border-strong: #f59e0b;--color-success: #059669;--color-info: #1d4ed8;--color-warning: #f59e0b;--color-error: #dc2626;--day-1: #dbeafe;--day-2: #bfdbfe;--day-3: #93c5fd;--day-4: #60a5fa;--day-5: #3b82f6;--day-6: #2563eb;--day-7: #1d4ed8;--level-1: #bfdbfe;--level-2: #93c5fd;--level-3: #60a5fa;--level-4: #3b82f6;--level-5: #1d4ed8}[data-theme=champion]{--color-primary: #ea580c;--color-primary-hover: #dc2626;--color-primary-light: #fed7c3;--color-primary-dark: #c2410c;--color-background: #fffbfa;--color-surface: #fed7c3;--color-surface-hover: #fdba8c;--color-surface-secondary: #fb923c;--color-text: #9a3412;--color-text-muted: #c2410c;--color-text-light: #ea580c;--color-border: #fdba8c;--color-border-light: #fed7c3;--color-border-strong: #f97316;--color-success: #16a34a;--color-info: #ea580c;--color-warning: #eab308;--color-error: #dc2626;--day-1: #fbbf24;--day-2: #f97316;--day-3: #fb923c;--day-4: #fdba8c;--day-5: #ea580c;--day-6: #c2410c;--day-7: #9a3412;--level-1: #fed7c3;--level-2: #fdba8c;--level-3: #fb923c;--level-4: #ea580c;--level-5: #c2410c}[data-theme=craftsman]{--color-primary: #92400e;--color-primary-hover: #78350f;--color-primary-light: #fde68a;--color-primary-dark: #451a03;--color-background: #fefdf8;--color-surface: #fde68a;--color-surface-hover: #fcd34d;--color-surface-secondary: #f59e0b;--color-text: #451a03;--color-text-muted: #92400e;--color-text-light: #d97706;--color-border: #fcd34d;--color-border-light: #fde68a;--color-border-strong: #d97706;--color-success: #059669;--color-info: #92400e;--color-warning: #f59e0b;--color-error: #dc2626;--day-1: #fef3c7;--day-2: #fde68a;--day-3: #fcd34d;--day-4: #f59e0b;--day-5: #d97706;--day-6: #b45309;--day-7: #92400e;--level-1: #fde68a;--level-2: #fcd34d;--level-3: #f59e0b;--level-4: #d97706;--level-5: #92400e}[data-theme=creator]{--color-primary: #7c3aed;--color-primary-hover: #6d28d9;--color-primary-light: #e0e7ff;--color-primary-dark: #5b21b6;--color-background: #fefefe;--color-surface: #e0e7ff;--color-surface-hover: #c7d2fe;--color-surface-secondary: #a5b4fc;--color-text: #3730a3;--color-text-muted: #5b21b6;--color-text-light: #8b5cf6;--color-border: #c7d2fe;--color-border-light: #e0e7ff;--color-border-strong: #8b5cf6;--color-success: #059669;--color-info: #06b6d4;--color-warning: #eab308;--color-error: #dc2626;--day-1: #e0e7ff;--day-2: #c7d2fe;--day-3: #a5b4fc;--day-4: #8b5cf6;--day-5: #a855f7;--day-6: #9333ea;--day-7: #7c3aed;--level-1: #e0e7ff;--level-2: #c7d2fe;--level-3: #a5b4fc;--level-4: #8b5cf6;--level-5: #7c3aed}[data-theme=timekeeper]{--color-primary: #1e40af;--color-primary-hover: #1d4ed8;--color-primary-light: #dbeafe;--color-primary-dark: #1e3a8a;--color-background: #f8fafc;--color-surface: #e2e8f0;--color-surface-hover: #cbd5e1;--color-surface-secondary: #94a3b8;--color-text: #0f172a;--color-text-muted: #334155;--color-text-light: #64748b;--color-border: #cbd5e1;--color-border-light: #e2e8f0;--color-border-strong: #94a3b8;--color-success: #059669;--color-info: #1e40af;--color-warning: #eab308;--color-error: #dc2626;--day-1: #e2e8f0;--day-2: #cbd5e1;--day-3: #94a3b8;--day-4: #93c5fd;--day-5: #60a5fa;--day-6: #3b82f6;--day-7: #1e40af;--level-1: #e2e8f0;--level-2: #cbd5e1;--level-3: #93c5fd;--level-4: #60a5fa;--level-5: #1e40af}[data-theme=zen]{--color-primary: #8b5cf6;--color-primary-hover: #7c3aed;--color-primary-light: #c4b5fd;--color-primary-dark: #6d28d9;--color-background: #0f172a;--color-surface: #1e293b;--color-surface-hover: #334155;--color-surface-secondary: #475569;--color-text: #f1f5f9;--color-text-muted: #94a3b8;--color-text-light: #cbd5e1;--color-text-inverse: #0f172a;--color-border: #475569;--color-border-light: #334155;--color-border-strong: #64748b;--color-success: #34d399;--color-success-light: #064e3b;--color-warning: #fbbf24;--color-warning-light: #451a03;--color-error: #f87171;--color-error-light: #7f1d1d;--color-info: #8b5cf6;--color-info-light: #3730a3;--day-1: #9ca3af;--day-2: #94a3b8;--day-3: #a5b4fc;--day-4: #818cf8;--day-5: #6366f1;--day-6: #4f46e5;--day-7: #4338ca;--level-1: #475569;--level-2: #64748b;--level-3: #94a3b8;--level-4: #c4b5fd;--level-5: #8b5cf6;--color-overlay-light: rgba(30, 41, 59, .95);--color-overlay-medium: rgba(30, 41, 59, .3)}[data-theme=harvest]{--color-primary: #b3001e;--color-primary-hover: #5c0e0c;--color-primary-light: #fed7aa;--color-primary-dark: #000000;--color-background: #b9d185;--color-surface: #edf8dc;--color-surface-hover: #d4cfc0;--color-surface-secondary: #b3001e;--color-text: #590000;--color-text-muted: #b80505;--color-text-light: #200101;--color-border: #af0000;--color-border-light: #080500;--color-border-strong: #000000;--color-success: #630313;--color-info: #000000;--color-warning: #630313;--color-error: #dc2626;--day-1: #630313;--day-2: #630313;--day-3: #630313;--day-4: #630313;--day-5: #630313;--day-6: #630313;--day-7: #630313;--level-1: #630313;--level-2: #630313;--level-3: #630313;--level-4: #630313;--level-5: #630313}[data-theme],[data-theme] .app-header,[data-theme] .app-main,[data-theme] .sidebar-menu,[data-theme] .card,[data-theme] button,[data-theme] input,[data-theme] textarea,[data-theme] select,[data-theme] .btn{transition:background-color var(--transition-normal),border-color var(--transition-normal),color var(--transition-normal),box-shadow var(--transition-normal)}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{line-height:var(--line-height-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:var(--font-size-base);font-weight:var(--font-weight-normal);line-height:var(--line-height-normal);color:var(--color-text);background-color:var(--color-background);min-height:100vh}h1,h2,h3,h4,h5,h6{font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);color:var(--color-text);margin-bottom:var(--spacing-md)}h1{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold)}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{margin-bottom:var(--spacing-md);color:var(--color-text)}small{font-size:var(--font-size-sm);color:var(--color-text-muted)}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-hover);text-decoration:underline}:focus{outline:2px solid var(--color-primary);outline-offset:2px}:focus:not(:focus-visible){outline:none}ul,ol{margin-bottom:var(--spacing-md);padding-left:var(--spacing-lg)}li{margin-bottom:var(--spacing-xs);color:var(--color-text)}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace;font-size:var(--font-size-sm);background-color:var(--color-surface);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);color:var(--color-text)}::selection{background-color:var(--color-primary-light);color:var(--color-text)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-surface)}::-webkit-scrollbar-thumb{background:var(--color-border-strong);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.container{width:100%;max-width:var(--container-max-width);margin:0 auto;padding:0 var(--spacing-md)}.page-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-lg) 0;border-bottom:1px solid var(--color-border);margin-bottom:var(--spacing-xl)}.page-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);min-height:var(--button-height);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);line-height:var(--line-height-tight);border:1px solid transparent;border-radius:var(--radius-md);cursor:pointer;text-decoration:none;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;white-space:nowrap}.btn:disabled{opacity:var(--opacity-60);cursor:not-allowed;pointer-events:none}.btn-primary{background-color:var(--color-primary);color:var(--color-text-inverse);border-color:var(--color-primary)}.btn-primary:hover:not(:disabled){background-color:var(--color-primary-hover);border-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn-secondary{background-color:var(--color-surface);color:var(--color-text);border-color:var(--color-border)}.btn-secondary:hover:not(:disabled){background-color:var(--color-surface-hover);border-color:var(--color-border-strong);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.btn-outline{background-color:transparent;color:var(--color-primary);border-color:var(--color-primary)}.btn-outline:hover:not(:disabled){background-color:var(--color-primary);color:var(--color-text-inverse)}.btn-ghost{background-color:transparent;color:var(--color-text);border-color:transparent}.btn-ghost:hover:not(:disabled){background-color:var(--color-surface);color:var(--color-text)}.btn-sm{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-sm);min-height:var(--button-height)}.btn-lg{padding:var(--spacing-md) var(--spacing-xl);font-size:var(--font-size-lg);min-height:var(--button-height)}.btn-full{width:100%}.form-group{display:flex;flex-direction:column;gap:var(--spacing-xs);margin-bottom:var(--spacing-md)}.form-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text)}.form-input{width:100%;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-fast)}.form-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.form-input:disabled{opacity:var(--opacity-60);cursor:not-allowed;background-color:var(--color-surface)}.form-input.error{border-color:var(--color-error)}.form-input.error:focus{border-color:var(--color-error);box-shadow:0 0 0 3px var(--color-error-light)}.form-error{font-size:var(--font-size-sm);color:var(--color-error);margin-top:var(--spacing-xs)}.form-help{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-top:var(--spacing-xs)}.goal-dropdown-container{margin-bottom:var(--spacing-lg)}.goal-dropdown-container label{display:block;font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:var(--spacing-xs);font-size:var(--font-size-sm)}.goal-dropdown-container select{width:100%;padding:var(--spacing-md) var(--spacing-lg);border:2px solid var(--color-primary);border-radius:var(--radius-md);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);background-color:var(--color-surface);color:var(--color-primary);box-shadow:var(--shadow-sm)}.change-goal-button{width:100%;padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-primary);color:var(--color-background);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast)}.change-goal-button:hover:not(:disabled){background-color:var(--color-primary-hover)}.change-goal-button:disabled{background-color:var(--color-border);color:var(--color-text-muted);cursor:not-allowed}.card{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden;transition:all var(--transition-fast)}.card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.card-header{padding:var(--spacing-lg);border-bottom:1px solid var(--color-border);background-color:var(--color-background)}.card-body{padding:var(--spacing-lg)}.card-footer{padding:var(--spacing-lg);border-top:1px solid var(--color-border);background-color:var(--color-surface-secondary)}.week-indicator{display:flex;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg)}.week-badge{width:32px;height:32px;background-color:var(--color-primary-light);border-radius:50%;display:flex;align-items:center;justify-content:center}.week-badge-text{color:var(--color-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm)}.week-number{font-size:1.5rem;font-weight:var(--font-weight-bold);color:var(--color-primary)}.week-label{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-left:var(--spacing-xs)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--spacing-lg);margin-bottom:var(--spacing-xl)}.stat-card{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--spacing-sm);background-color:var(--color-surface-secondary);border-radius:var(--radius-sm);border:1px solid var(--color-border-light)}.stat-label{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-muted);margin-bottom:4px}.stat-value{font-size:1.1rem;font-weight:var(--font-weight-bold);color:var(--color-text)}.stat-value-text{font-size:var(--font-size-sm);color:var(--color-text);font-weight:var(--font-weight-medium)}.nav{display:flex;gap:var(--spacing-sm)}.nav-link{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text-muted);text-decoration:none;border-radius:var(--radius-md);transition:all var(--transition-fast);cursor:pointer;border:none;background:none}.nav-link:hover{color:var(--color-text);background-color:var(--color-surface);text-decoration:none}.nav-link.active{color:var(--color-primary);background-color:var(--color-primary-light)}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:var(--color-backdrop-medium);display:flex;align-items:center;justify-content:center;padding:var(--spacing-md);z-index:var(--z-modal);animation:fadeIn var(--transition-fast)}.modal{background-color:var(--color-background);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);max-width:var(--container-sm-width);width:100%;max-height:90vh;overflow:hidden;animation:slideUp var(--transition-normal)}.modal-header{padding:var(--spacing-lg);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between}.modal-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0}.modal-close{background:none;border:none;font-size:var(--font-size-xl);color:var(--color-text-muted);cursor:pointer;padding:var(--spacing-xs);border-radius:var(--radius-sm);transition:all var(--transition-fast)}.modal-close:hover{color:var(--color-text);background-color:var(--color-surface)}.modal-body{padding:var(--spacing-lg);max-height:60vh;overflow-y:auto}.modal-footer{padding:var(--spacing-lg);border-top:1px solid var(--color-border);display:flex;gap:var(--spacing-sm);justify-content:flex-end}.loading{display:flex;align-items:center;justify-content:center;padding:var(--spacing-xl);color:var(--color-text-muted)}.spinner{width:24px;height:24px;border:2px solid var(--color-border);border-top:2px solid var(--color-primary);border-radius:var(--radius-circle);animation:spin var(--animation-spin)}.alert{padding:var(--spacing-md);border-radius:var(--radius-md);margin-bottom:var(--spacing-md)}.alert-success{background-color:var(--color-success-light);color:var(--color-success);border:1px solid var(--color-success)}.alert-warning{background-color:var(--color-warning-light);color:var(--color-warning);border:1px solid var(--color-warning)}.alert-error{background-color:var(--color-error-light);color:var(--color-error);border:1px solid var(--color-error)}.alert-info{background-color:var(--color-info-light);color:var(--color-info);border:1px solid var(--color-info)}.checkin-flow-container{display:flex;justify-content:center;padding:var(--spacing-md);min-height:100vh;background:linear-gradient(135deg,var(--color-background) 0%,var(--color-surface) 100%)}.checkin-card{width:100%;max-width:var(--container-md-width);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);overflow:hidden;margin:var(--spacing-lg) 0}.checkin-card-content{padding:var(--spacing-xl);position:relative}.checkin-loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:var(--color-overlay-light);display:flex;align-items:center;justify-content:center;z-index:10;border-radius:var(--radius-xl)}.checkin-spinner{width:48px;height:48px;border:4px solid var(--color-border-light);border-top:4px solid var(--color-primary);border-radius:var(--radius-circle);animation:spin var(--animation-spin);margin:0 auto var(--spacing-lg)}.checkin-loading-text{color:var(--color-text-muted);font-size:var(--font-size-base);text-align:center}.checkin-error-icon{font-size:var(--font-size-5xl);margin-bottom:var(--spacing-lg);text-align:center}.checkin-error-icon-danger{color:var(--color-error)}.checkin-error-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:var(--spacing-md);text-align:center}.checkin-error-text{color:var(--color-text-muted);font-size:var(--font-size-base);margin-bottom:var(--spacing-xl);line-height:var(--line-height-relaxed);text-align:center}.checkin-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);text-align:center;margin:0 0 var(--spacing-xl) 0}.checkin-question-content{margin-bottom:var(--spacing-xl)}.question-text{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text);line-height:var(--line-height-relaxed);margin:0 0 var(--spacing-md) 0;text-align:center}.question-subtitle{font-size:var(--font-size-base);color:var(--color-text-muted);text-align:center;margin:0 0 var(--spacing-lg) 0;font-style:italic}.progress-indicator{margin-bottom:var(--spacing-xl)}.progress-bar-container{margin-bottom:var(--spacing-sm)}.progress-bar{width:100%;height:8px;background-color:var(--color-overlay-medium);border:1px solid var(--color-border);border-radius:var(--radius-full);overflow:hidden;position:relative}.progress-fill{height:100%;background:linear-gradient(90deg,var(--color-primary) 0%,var(--color-primary-hover) 100%);border-radius:var(--radius-full);transition:width var(--animation-slow)}.progress-dots{display:flex;justify-content:center;align-items:center;gap:var(--spacing-xs)}.progress-dot{width:8px;height:8px;border-radius:var(--radius-circle);background-color:var(--color-border);transition:background-color var(--animation-normal)}.progress-dot.filled{background-color:var(--color-primary)}.progress-ellipsis{color:var(--color-text-muted);font-size:var(--font-size-sm);margin:0 var(--spacing-xs)}.progress-text{text-align:center;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-muted)}.choice-options-container,.multichoice-options-container{display:flex;flex-direction:column;gap:var(--spacing-xs);margin:var(--spacing-lg) 0}.choice-option,.multichoice-option{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--spacing-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text);background-color:var(--color-background);border:2px solid var(--color-border);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast);text-align:left;min-height:60px;margin:0}.choice-option:hover,.multichoice-option:hover{border-color:var(--color-primary-light);background-color:var(--color-primary-light);transform:translateY(-2px);box-shadow:var(--shadow-md)}.choice-option.selected,.multichoice-option.selected{border-color:var(--color-primary);background-color:var(--color-primary-light);color:var(--color-primary);font-weight:var(--font-weight-semibold)}.answer-option-text{flex:1;line-height:var(--line-height-relaxed)}.multichoice-option input[type=checkbox]{margin-right:var(--spacing-sm);width:18px;height:18px;accent-color:var(--color-primary)}.answer-option-with-reactions{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-md);width:100%;padding:var(--spacing-lg);background-color:var(--color-background);border:2px solid var(--color-border);border-radius:var(--radius-lg);margin:var(--spacing-xs) 0}.answer-option-with-reactions .choice-option,.answer-option-with-reactions .multichoice-option{flex:1;margin:0;padding:0;background:none;border:none;border-radius:var(--radius-none);min-height:auto;box-shadow:none;transform:none}.answer-option-with-reactions .choice-option:hover,.answer-option-with-reactions .multichoice-option:hover{background:none;transform:none;box-shadow:none}.answer-option-with-reactions .choice-option.selected{background:none;color:var(--color-text);font-weight:var(--font-weight-semibold)}.answer-option-with-reactions.selected{border-color:var(--color-primary);background-color:var(--color-primary-light)}.answer-option__reactions{display:flex;gap:var(--spacing-xs)}.answer-option__reaction-btn{background:none;border:1px solid transparent;font-size:var(--font-size-lg);cursor:pointer;padding:var(--spacing-xs);border-radius:var(--radius-sm);transition:all var(--transition-fast);opacity:var(--opacity-50)}.answer-option__reaction-btn:hover{opacity:var(--opacity-100);background-color:var(--color-surface);transform:scale(1.1)}.answer-option__reaction-btn--active{opacity:var(--opacity-100);background-color:var(--color-surface)}.answer-option__reaction-btn--thumbs-up.answer-option__reaction-btn--active{background-color:var(--color-success-light);color:var(--color-success);border:1px solid var(--color-success)}.answer-option__reaction-btn--thumbs-down.answer-option__reaction-btn--active{background-color:var(--color-error-light);color:var(--color-error);border:1px solid var(--color-error)}.checkin-navigation{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-md);padding-top:var(--spacing-lg);border-top:1px solid var(--color-border);margin-top:var(--spacing-xl)}.checkin-back-button{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);min-height:var(--button-height);background-color:var(--color-background);color:var(--color-text);border:2px solid var(--color-border-strong);border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;white-space:nowrap;box-shadow:var(--shadow-sm)}.checkin-back-button:hover{background-color:var(--color-surface);border-color:var(--color-border-strong);transform:translateY(-1px);box-shadow:var(--shadow-md)}.checkin-next-button{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-lg);min-height:var(--button-height);background-color:var(--color-primary);color:var(--color-text-inverse);border:1px solid var(--color-primary);border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;white-space:nowrap}.checkin-next-button:hover{background-color:var(--color-primary-hover);border-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.primary-button{min-width:140px;padding:var(--spacing-md) var(--spacing-xl);background-color:var(--color-primary);color:var(--color-text-inverse);border:2px solid var(--color-primary);border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);text-align:center}.primary-button:hover:not(:disabled){background-color:var(--color-primary-hover);border-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.primary-button:disabled{background-color:var(--color-surface-secondary);color:var(--color-text-muted);border-color:var(--color-border);cursor:not-allowed;transform:none;box-shadow:none}.secondary-button{min-width:140px;padding:var(--spacing-md) var(--spacing-xl);background-color:transparent;color:var(--color-text);border:2px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);text-align:center}.secondary-button:hover:not(:disabled){background-color:var(--color-surface-secondary);border-color:var(--color-primary);color:var(--color-primary)}.secondary-button:disabled{background-color:transparent;color:var(--color-text-muted);border-color:var(--color-border);cursor:not-allowed;opacity:var(--opacity-60)}.checkin-reactions{display:flex;gap:var(--spacing-sm)}.checkin-reaction{display:flex;align-items:center;justify-content:center;min-height:var(--button-height);min-width:var(--button-height);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-sm);font-size:var(--font-size-xl);cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none}.checkin-reaction:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.checkin-reaction.active{background-color:var(--color-primary-light);border-color:var(--color-primary);box-shadow:var(--shadow-sm)}.checkin-skip-container{position:relative}.checkin-skip-button{display:flex;align-items:center;justify-content:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-lg);min-height:var(--button-height);background-color:var(--color-background);color:var(--color-text);border:2px solid var(--color-border-strong);border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;white-space:nowrap;box-shadow:var(--shadow-sm)}.checkin-skip-button:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong);transform:translateY(-1px);box-shadow:var(--shadow-md)}.checkin-skip-dropdown{position:absolute;bottom:100%;right:0;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);overflow:hidden;z-index:10;margin-bottom:var(--spacing-xs);min-width:180px}.checkin-skip-option{display:block;width:100%;padding:var(--spacing-sm) var(--spacing-md);background:none;border:none;color:var(--color-text);font-size:var(--font-size-sm);text-align:left;cursor:pointer;transition:background-color var(--transition-fast)}.checkin-skip-option:hover{background-color:var(--color-surface-secondary)}.checkin-skip-option:not(:last-child){border-bottom:1px solid var(--color-border)}.checkin-comment-container{margin-bottom:var(--spacing-lg)}.checkin-comment-input{width:100%;padding:var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-background);color:var(--color-text);font-size:var(--font-size-base);font-family:inherit;resize:vertical;min-height:80px;transition:border-color var(--transition-fast)}.checkin-comment-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.checkin-comment-input::placeholder{color:var(--color-text-muted)}.other-text-input{width:100%;padding:var(--spacing-md);margin-top:var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-background);color:var(--color-text);font-size:var(--font-size-base);font-family:inherit;transition:border-color var(--transition-fast)}.other-text-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.other-text-char-count{text-align:right;font-size:var(--font-size-xs);color:var(--color-text-muted);margin-top:var(--spacing-xs)}.other-text-char-count.warning{color:var(--color-warning)}.other-text-char-count.error{color:var(--color-error)}.checkin-completion-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:var(--spacing-xl);background-color:var(--color-background);text-align:center}.checkin-completion-card{background-color:transparent;border:none;border-radius:var(--radius-none);box-shadow:none;padding:var(--spacing-3xl);max-width:480px;width:100%;position:relative}.checkin-completion-icon{width:72px;height:72px;background-color:var(--color-success);border-radius:var(--radius-circle);display:flex;align-items:center;justify-content:center;margin:0 auto var(--spacing-2xl) auto;box-shadow:var(--shadow-celebration);animation:celebrateIcon var(--animation-celebrate);color:var(--color-text-inverse);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold)}.checkin-completion-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0 0 var(--spacing-xl) 0;letter-spacing:-.02em;animation:slideInUp var(--animation-stagger) var(--animation-stagger-delay-1) both}.checkin-completion-message{font-size:var(--font-size-base);color:var(--color-text-muted);line-height:var(--line-height-relaxed);margin:0 0 var(--spacing-2xl) 0;animation:slideInUp var(--animation-stagger) var(--animation-stagger-delay-2) both}.checkin-completion-encouragement{background-color:var(--color-success-light);color:var(--color-success);padding:var(--spacing-lg) var(--spacing-xl);border-radius:var(--radius-xl);border:none;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);margin:0 0 var(--spacing-2xl) 0;animation:slideInUp var(--animation-stagger) var(--animation-stagger-delay-3) both}.checkin-completion-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-xl);min-height:var(--button-height);background-color:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-normal);text-decoration:none;-webkit-user-select:none;user-select:none;box-shadow:var(--shadow-button);animation:slideInUp var(--animation-stagger) var(--animation-stagger-delay-4) both}.checkin-completion-button:hover{transform:translateY(-1px);box-shadow:var(--shadow-button-hover);background-color:var(--color-primary-hover)}.checkin-completion-button:active{transform:translateY(0)}.checkin-review-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:var(--spacing-xl);background:linear-gradient(135deg,var(--color-background) 0%,var(--color-surface) 100%)}.checkin-review-card{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--spacing-2xl);max-width:var(--container-md-width);width:100%;position:relative}.checkin-review-header{text-align:center;margin-bottom:var(--spacing-2xl)}.checkin-review-icon{width:56px;height:56px;background-color:var(--color-primary-light);border-radius:var(--radius-circle);display:flex;align-items:center;justify-content:center;margin:0 auto var(--spacing-lg) auto;font-size:var(--font-size-xl)}.checkin-review-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-sm) 0}.checkin-review-subtitle{font-size:var(--font-size-base);color:var(--color-text-muted);margin:0}.checkin-review-list{margin-bottom:var(--spacing-2xl)}.checkin-review-item{padding:var(--spacing-lg);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:var(--spacing-md);background-color:var(--color-background);transition:all var(--transition-fast)}.checkin-review-item:hover{border-color:var(--color-border-strong);box-shadow:var(--shadow-sm)}.checkin-review-question{display:flex;gap:var(--spacing-sm);margin-bottom:var(--spacing-sm)}.checkin-review-question-number{font-weight:var(--font-weight-semibold);color:var(--color-primary);flex-shrink:0}.checkin-review-question-text{font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text);line-height:var(--line-height-relaxed)}.checkin-review-answer{font-size:var(--font-size-base);color:var(--color-text);padding-left:calc(var(--spacing-lg) + var(--spacing-sm))}.checkin-review-answer-skipped{color:var(--color-text-muted);font-style:italic}.checkin-review-actions{display:flex;gap:var(--spacing-md);justify-content:space-between}.checkin-review-button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-xl);min-height:var(--button-height);border:none;border-radius:var(--radius-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-normal);text-decoration:none;-webkit-user-select:none;user-select:none}.checkin-review-button-secondary{background-color:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border)}.checkin-review-button-secondary:hover:not(:disabled){background-color:var(--color-surface-hover);border-color:var(--color-border-strong);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.checkin-review-button-primary{background-color:var(--color-primary);color:var(--color-text-inverse);box-shadow:var(--shadow-button)}.checkin-review-button-primary:hover:not(:disabled){background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-button-hover)}.checkin-review-button:active:not(:disabled){transform:translateY(0)}.checkin-review-button:disabled{opacity:var(--opacity-50);cursor:not-allowed}@media (max-width: 768px){.checkin-review-container{padding:var(--spacing-md)}.checkin-review-card{padding:var(--spacing-lg)}.checkin-review-item{padding:var(--spacing-md);margin-bottom:var(--spacing-sm)}.checkin-review-actions{gap:var(--spacing-sm)}.checkin-review-button,.checkin-review-actions .checkin-back-button{min-height:var(--button-height);font-size:var(--font-size-sm)}}@keyframes celebrateIcon{0%{transform:scale(0);opacity:var(--opacity-0)}50%{transform:scale(1.2)}to{transform:scale(1);opacity:var(--opacity-100)}}@keyframes slideInUp{0%{opacity:var(--opacity-0);transform:translateY(30px)}to{opacity:var(--opacity-100);transform:translateY(0)}}.code-resolver{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:var(--spacing-xl);background:linear-gradient(135deg,var(--color-background) 0%,var(--color-surface) 100%)}.code-resolver .container{text-align:center;max-width:var(--container-sm-width, 400px);width:100%}.code-resolver.loading h2{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:var(--spacing-none) var(--spacing-none) var(--spacing-lg) var(--spacing-none)}.code-resolver.loading p{font-size:var(--font-size-base);color:var(--color-text-muted);margin:var(--spacing-none)}.loading-spinner{display:flex;justify-content:center;margin-bottom:var(--spacing-lg)}.spinner{width:var(--spacing-2xl, 40px);height:var(--spacing-2xl, 40px);border:var(--border-width-sm, 3px) solid var(--color-border);border-top:var(--border-width-sm, 3px) solid var(--color-primary);border-radius:var(--radius-circle);animation:spin var(--animation-duration-medium, 1s) linear infinite}.code-resolver.error{background-color:var(--color-background)}.code-resolver.error h2{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-error);margin:var(--spacing-none) var(--spacing-none) var(--spacing-md) var(--spacing-none)}.code-resolver.error p{font-size:var(--font-size-base);color:var(--color-text);margin:var(--spacing-none) var(--spacing-none) var(--spacing-xl) var(--spacing-none);line-height:var(--line-height-relaxed)}.code-resolver.error .btn-primary{display:inline-flex;align-items:center;justify-content:center;padding:var(--spacing-md) var(--spacing-xl);min-height:var(--button-height);background-color:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-normal);text-decoration:none;-webkit-user-select:none;user-select:none;box-shadow:var(--shadow-button)}.code-resolver.error .btn-primary:hover{background-color:var(--color-primary-hover);transform:translateY(var(--spacing-xs-negative, -1px));box-shadow:var(--shadow-button-hover)}.code-resolver.error .btn-primary:active{transform:translateY(var(--spacing-none))}@media (max-width: 768px){.code-resolver{padding:var(--spacing-lg)}.code-resolver .container{max-width:var(--container-xs-width, 320px)}.code-resolver h2{font-size:var(--font-size-lg)}.code-resolver p{font-size:var(--font-size-sm)}}.referral-dashboard{padding:var(--spacing-lg);max-width:var(--container-lg-width);margin:0 auto;background-color:var(--color-background);min-height:100vh}.referral-header{text-align:center;margin-bottom:var(--spacing-2xl)}.referral-header h2{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-sm) 0}.referral-header p{font-size:var(--font-size-base);color:var(--color-text-muted);margin:0}.section{margin-bottom:var(--spacing-2xl)}.section-header{margin-bottom:var(--spacing-lg)}.section-header h3{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0 0 var(--spacing-xs) 0;display:flex;align-items:center;gap:var(--spacing-sm)}.section-header p{font-size:var(--font-size-sm);color:var(--color-text-muted);margin:0}.section-content{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-xl);box-shadow:var(--shadow-sm)}.section-content.loading,.loading{display:flex;align-items:center;justify-content:center;padding:var(--spacing-2xl);color:var(--color-text-muted);font-style:italic}.empty-state{text-align:center;padding:var(--spacing-xl);color:var(--color-text-muted);font-style:italic}.referrer-card{display:flex;align-items:center;gap:var(--spacing-lg);padding:var(--spacing-lg);background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.referrer-avatar,.referral-avatar{flex-shrink:0}.avatar-circle,.avatar-placeholder{width:48px;height:48px;background-color:var(--color-primary-light);color:var(--color-primary);border-radius:var(--radius-circle);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);text-transform:uppercase}.referrer-info{flex:1}.referrer-name,.user-name{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:var(--spacing-xs)}.referrer-handle,.user-handle{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-bottom:var(--spacing-xs)}.referrer-email{font-size:var(--font-size-sm);color:var(--color-text-muted);margin-bottom:var(--spacing-sm)}.referrer-meta{display:flex;flex-direction:column;gap:var(--spacing-xs);font-size:var(--font-size-xs);color:var(--color-text-muted)}.referrer-code{background-color:var(--color-surface);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);font-family:Courier New,monospace;font-weight:var(--font-weight-medium)}.referral-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-lg);margin-bottom:var(--spacing-2xl)}.stat-card{background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-xl);text-align:center;box-shadow:var(--shadow-sm);transition:all var(--transition-fast)}.stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.stat-number{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin-bottom:var(--spacing-sm);line-height:1}.stat-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.5px}.referral-funnel{background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-xl);margin-bottom:var(--spacing-2xl);box-shadow:var(--shadow-sm)}.referral-funnel h4{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0 0 var(--spacing-lg) 0;text-align:center}.funnel-steps{display:flex;align-items:center;justify-content:center;gap:var(--spacing-md);flex-wrap:wrap}.funnel-step{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);min-width:80px}.step-count{width:40px;height:40px;background-color:var(--color-primary);color:var(--color-text-inverse);border-radius:var(--radius-circle);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);box-shadow:var(--shadow-sm)}.step-label{font-size:var(--font-size-xs);color:var(--color-text-muted);text-align:center;font-weight:var(--font-weight-medium);line-height:var(--line-height-tight)}.funnel-arrow{color:var(--color-text-muted);font-size:var(--font-size-lg);font-weight:var(--font-weight-bold)}.referral-actions{text-align:center;margin-bottom:var(--spacing-2xl)}.send-referral-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-2xl);min-height:var(--button-height);background-color:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);text-decoration:none;-webkit-user-select:none;user-select:none;box-shadow:var(--shadow-sm)}.send-referral-btn:hover:not(:disabled){background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.send-referral-btn:disabled{opacity:var(--opacity-60);cursor:not-allowed;transform:none}.referral-form-inline{background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-xl);margin-bottom:var(--spacing-2xl);box-shadow:var(--shadow-sm)}.form-header h4{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0 0 var(--spacing-lg) 0}.referral-form .form-group{margin-bottom:var(--spacing-lg)}.referral-form label{display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:var(--spacing-xs)}.referral-form input,.referral-form select,.referral-form textarea{width:100%;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-fast)}.referral-form input:focus,.referral-form select:focus,.referral-form textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.referral-form textarea{resize:vertical;min-height:80px}.referral-form small{display:block;font-size:var(--font-size-xs);color:var(--color-text-muted);margin-top:var(--spacing-xs)}.form-actions{display:flex;gap:var(--spacing-md);justify-content:flex-end;margin-top:var(--spacing-xl)}.cancel-btn{padding:var(--spacing-sm) var(--spacing-lg);min-height:var(--button-height);background-color:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast)}.cancel-btn:hover{background-color:var(--color-surface-hover);border-color:var(--color-border-strong)}.send-btn{padding:var(--spacing-sm) var(--spacing-lg);min-height:var(--button-height);background-color:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast)}.send-btn:hover:not(:disabled){background-color:var(--color-primary-hover)}.send-btn:disabled{opacity:var(--opacity-60);cursor:not-allowed}.referrals-list h4{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0 0 var(--spacing-lg) 0}.referral-cards{display:flex;flex-direction:column;gap:var(--spacing-lg)}.referral-card{background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-sm);transition:all var(--transition-fast)}.referral-card:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}.referral-header-section{display:flex;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.referral-contact{flex:1}.referral-details{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--spacing-lg);margin-bottom:var(--spacing-md)}.referral-status{flex-shrink:0}.status-badge{display:inline-block;padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.5px;border-radius:var(--radius-full);white-space:nowrap}.status-badge.status-pending{background-color:var(--color-warning-light);color:var(--color-warning);border:1px solid var(--color-warning)}.status-badge.status-joined-waitlist{background-color:var(--color-info-light);color:var(--color-info);border:1px solid var(--color-info)}.status-badge.status-waitlist-approved{background-color:var(--color-primary-light);color:var(--color-primary);border:1px solid var(--color-primary)}.status-badge.status-user-onboarded,.status-badge.status-first-checkin{background-color:var(--color-success-light);color:var(--color-success);border:1px solid var(--color-success)}.status-badge.status-expired{background-color:var(--color-error-light);color:var(--color-error);border:1px solid var(--color-error)}.referral-meta{display:flex;flex-direction:column;gap:var(--spacing-xs);font-size:var(--font-size-xs);color:var(--color-text-muted)}.referral-meta strong{color:var(--color-text);font-weight:var(--font-weight-semibold)}.referral-message{background-color:var(--color-surface);border-left:3px solid var(--color-primary);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm);font-style:italic;color:var(--color-text-muted);margin-top:var(--spacing-md)}.toast-container{position:fixed;top:var(--spacing-lg);right:var(--spacing-lg);z-index:var(--z-modal);display:flex;flex-direction:column;gap:var(--spacing-sm)}.toast{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-sm);padding:var(--spacing-md);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);cursor:pointer;transition:all var(--transition-fast);max-width:var(--container-xs-width);animation:slideInRight var(--animation-slide)}.toast:hover{transform:translate(-4px)}.toast-success{border-left:4px solid var(--color-success)}.toast-error{border-left:4px solid var(--color-error)}.toast-content{display:flex;align-items:center;gap:var(--spacing-sm);flex:1}.toast-icon{font-size:var(--font-size-lg);line-height:1}.toast-message{font-size:var(--font-size-sm);color:var(--color-text);line-height:var(--line-height-relaxed)}.toast-close{background:none;border:none;font-size:var(--font-size-lg);color:var(--color-text-muted);cursor:pointer;padding:var(--spacing-xs);border-radius:var(--radius-sm);transition:all var(--transition-fast);flex-shrink:0}.toast-close:hover{color:var(--color-text);background-color:var(--color-surface-hover)}@keyframes slideInRight{0%{opacity:var(--opacity-0);transform:translate(100%)}to{opacity:var(--opacity-100);transform:translate(0)}}.friends-tab{padding:var(--spacing-lg);max-width:var(--container-max-width);margin:0 auto;background-color:var(--color-background);min-height:100vh}.friends-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-xl);align-items:start}.friends-list-card{grid-row:1 / -1}.friends-right-section{display:flex;flex-direction:column;gap:var(--spacing-xl)}.friends-card{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden;transition:all var(--transition-fast)}.friends-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.friends-card-header{background-color:var(--color-background);border-bottom:1px solid var(--color-border);padding:var(--spacing-lg);display:flex;align-items:center;gap:var(--spacing-sm)}.friends-card-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;color:var(--color-primary);background-color:var(--color-primary-light);border-radius:var(--radius-md);font-size:var(--font-size-lg)}.friends-card-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0}.friends-card-body{padding:var(--spacing-lg)}.user-search{display:flex;flex-direction:column;gap:var(--spacing-lg)}.search-header h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0 0 var(--spacing-xs) 0}.search-header p{font-size:var(--font-size-sm);color:var(--color-text-muted);margin:0}.search-input-wrapper{position:relative;display:flex;align-items:center}.search-input{width:100%;padding:var(--spacing-md) var(--spacing-lg);padding-right:var(--spacing-3xl);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-background);border:2px solid var(--color-border);border-radius:var(--radius-lg);transition:all var(--transition-fast);box-shadow:var(--shadow-inset)}.search-input:focus{outline:none;border-color:var(--color-primary);box-shadow:var(--shadow-focus-ring);transform:translateY(-1px)}.search-input:disabled{opacity:var(--opacity-60);cursor:not-allowed;background-color:var(--color-surface)}.search-input::placeholder{color:var(--color-text-muted);font-style:italic}.search-loading{position:absolute;right:var(--spacing-md);display:flex;align-items:center;justify-content:center}.search-error{background-color:var(--color-error-light);color:var(--color-error);border:1px solid var(--color-error);border-radius:var(--radius-md);padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.search-hint{background-color:var(--color-info-light);color:var(--color-info);border:1px solid var(--color-info);border-radius:var(--radius-md);padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm);font-style:italic}.search-results h4{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0 0 var(--spacing-md) 0}.user-list{display:flex;flex-direction:column;gap:var(--spacing-sm)}.user-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-fast)}.user-item:hover{border-color:var(--color-primary-light);background-color:var(--color-primary-light);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.user-avatar{flex-shrink:0}.user-info{flex:1;min-width:0}.user-handle{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:var(--spacing-xs)}.user-name{font-size:var(--font-size-sm);color:var(--color-text-muted)}.send-request-btn{padding:var(--spacing-xs) var(--spacing-md);min-height:var(--button-height);background-color:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);display:flex;align-items:center;gap:var(--spacing-xs);white-space:nowrap}.send-request-btn:hover:not(:disabled){background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.send-request-btn:disabled{opacity:var(--opacity-60);cursor:not-allowed;transform:none}.already-friends-badge,.disabled-badge,.current-user-badge{background-color:var(--color-surface);color:var(--color-text-muted);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);white-space:nowrap}.already-friends-badge{background-color:var(--color-success-light);color:var(--color-success);border-color:var(--color-success)}.current-user-badge{background-color:var(--color-primary-light);color:var(--color-primary);border-color:var(--color-primary)}.current-user-indicator{color:var(--color-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-xs)}.no-results{text-align:center;padding:var(--spacing-xl);color:var(--color-text-muted);font-style:italic;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md)}.friend-requests{display:flex;flex-direction:column;gap:var(--spacing-lg)}.friend-requests h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0}.request-sections{display:flex;flex-direction:column;gap:var(--spacing-xl)}.request-section h4{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0 0 var(--spacing-md) 0;display:flex;align-items:center;gap:var(--spacing-sm)}.request-count,.friend-count{background-color:var(--color-primary);color:var(--color-text-inverse);border-radius:var(--radius-full);padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);min-width:20px;text-align:center}.friends-table-container{background-color:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden}.friends-table{width:100%;border-collapse:collapse}.friends-table tbody tr{border-bottom:1px solid var(--color-border);transition:background-color var(--transition-fast)}.friends-table tbody tr:last-child{border-bottom:none}.friends-table tbody tr:hover{background-color:var(--color-surface)}.friends-table td{padding:var(--spacing-md);vertical-align:middle}.friends-table td:first-child{width:48px;padding-right:var(--spacing-sm)}.friend-name{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text)}.friend-handle{font-size:var(--font-size-sm);color:var(--color-text-muted);min-width:80px}.friend-actions{text-align:right;white-space:nowrap}.remove-friend-btn{padding:var(--spacing-xs) var(--spacing-sm);min-height:32px;background-color:var(--color-error-light);color:var(--color-error);border:1px solid var(--color-error);border-radius:var(--radius-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);display:inline-flex;align-items:center;gap:var(--spacing-xs)}.remove-friend-btn:hover:not(:disabled){background-color:var(--color-error);color:var(--color-text-inverse);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.remove-friend-btn:disabled{opacity:var(--opacity-60);cursor:not-allowed;transform:none}.accept-btn,.decline-btn{padding:var(--spacing-xs);min-height:32px;min-width:32px;border:none;border-radius:var(--radius-sm);font-size:var(--font-size-base);font-weight:var(--font-weight-bold);cursor:pointer;transition:all var(--transition-fast);display:inline-flex;align-items:center;justify-content:center;margin-right:var(--spacing-xs)}.accept-btn{background-color:var(--color-success);color:var(--color-text-inverse)}.accept-btn:hover:not(:disabled){background-color:var(--color-success-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.decline-btn{background-color:var(--color-error);color:var(--color-text-inverse)}.decline-btn:hover:not(:disabled){background-color:var(--color-error-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.accept-btn:disabled,.decline-btn:disabled{opacity:var(--opacity-60);cursor:not-allowed;transform:none}.status-badge.pending{background-color:var(--color-warning-light);color:var(--color-warning);border:1px solid var(--color-warning);border-radius:var(--radius-full);padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);text-transform:uppercase;letter-spacing:.5px}.friends-list{display:flex;flex-direction:column;gap:var(--spacing-lg)}.friends-list h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0;display:flex;align-items:center;gap:var(--spacing-sm)}.loading-state,.error-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-2xl);text-align:center;gap:var(--spacing-md)}.loading-state{color:var(--color-text-muted)}.error-state{color:var(--color-error)}.loading-spinner,.button-spinner{width:20px;height:20px;border:2px solid var(--color-border);border-top:2px solid var(--color-primary);border-radius:var(--radius-circle);animation:spin var(--animation-spin)}.button-spinner{width:16px;height:16px;border-width:2px}.retry-btn{padding:var(--spacing-sm) var(--spacing-lg);min-height:var(--button-height);background-color:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast)}.retry-btn:hover{background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.empty-state{text-align:center;padding:var(--spacing-2xl);color:var(--color-text-muted);font-style:italic;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md)}.empty-state p{margin:0 0 var(--spacing-sm) 0}.empty-state p:last-child{margin:0}@media (max-width: 768px){.friends-tab{padding:var(--spacing-md)}.friends-grid{grid-template-columns:1fr;gap:var(--spacing-lg)}.friends-list-card{order:1;grid-row:auto}.friends-right-section{order:2}.friends-card-header,.friends-card-body{padding:var(--spacing-md)}.search-input{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm)}.user-item{padding:var(--spacing-sm);gap:var(--spacing-sm)}.user-info{min-width:0}.user-handle{font-size:var(--font-size-sm)}.user-name{font-size:var(--font-size-xs)}.send-request-btn{padding:var(--spacing-xs);min-height:32px;font-size:var(--font-size-xs)}.friends-table td{padding:var(--spacing-sm)}.friend-name{font-size:var(--font-size-sm)}.friend-handle{font-size:var(--font-size-xs);min-width:60px}.remove-friend-btn{font-size:var(--font-size-xs);padding:var(--spacing-xs)}.request-sections{gap:var(--spacing-lg)}.loading-state,.error-state,.empty-state{padding:var(--spacing-lg)}}.profile-container{padding:var(--spacing-lg);max-width:var(--container-max-width);margin:0 auto}.profile-layout{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-2xl);align-items:start}.profile-section{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.profile-header{background-color:var(--color-surface);color:var(--color-text);padding:var(--spacing-xl);text-align:center;border-bottom:1px solid var(--color-border)}.profile-header h2{margin:0 0 var(--spacing-sm) 0;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold)}.profile-header p{margin:0;opacity:var(--opacity-90);font-size:var(--font-size-base)}.profile-body{padding:var(--spacing-xl)}.profile-field{margin-bottom:var(--spacing-lg)}.profile-field:last-child{margin-bottom:0}.profile-field label{display:flex;align-items:center;gap:var(--spacing-xs);font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:var(--spacing-xs);font-size:var(--font-size-sm)}.profile-field label svg{width:16px;height:16px;color:var(--color-text-muted);flex-shrink:0}.profile-field input,.profile-field select{width:100%;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);background-color:var(--color-background);color:var(--color-text);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.profile-field input:focus,.profile-field select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.profile-field input:disabled,.profile-field select:disabled{background-color:var(--color-surface-secondary);color:var(--color-text-muted);cursor:not-allowed}.goal-section{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.goal-header{background-color:var(--color-surface-secondary);padding:var(--spacing-lg);border-bottom:1px solid var(--color-border)}.goal-header h3{margin:0 0 var(--spacing-sm) 0;font-size:var(--font-size-xl);color:var(--color-text);font-weight:var(--font-weight-bold)}.goal-header p{margin:0;color:var(--color-text-muted);font-size:var(--font-size-sm)}.goal-body{padding:var(--spacing-xl)}.questionnaire-section{margin-top:var(--spacing-lg);padding-top:var(--spacing-lg);border-top:1px solid var(--color-border)}.questionnaire-header{margin-bottom:var(--spacing-lg)}.questionnaire-header h4{margin:0 0 var(--spacing-xs) 0;font-size:var(--font-size-lg);color:var(--color-text);font-weight:var(--font-weight-bold)}.questionnaire-header p{margin:0;color:var(--color-text-muted);font-size:var(--font-size-sm)}.questionnaire-item{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-lg);margin-bottom:var(--spacing-md);transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.questionnaire-item:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}.questionnaire-item:last-child{margin-bottom:0}.questionnaire-question{font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:var(--spacing-sm);font-size:var(--font-size-base);line-height:var(--line-height-normal)}.questionnaire-answer{color:var(--color-text-muted);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);padding:var(--spacing-sm);background-color:var(--color-background);border-radius:var(--radius-sm);border-left:3px solid var(--color-primary)}.questionnaire-answer.array-answer{background-color:var(--color-background)}.questionnaire-answer ul{margin:0;padding-left:var(--spacing-lg)}.questionnaire-answer li{margin-bottom:var(--spacing-xs)}.questionnaire-answer li:last-child{margin-bottom:0}.questionnaire-empty{text-align:center;padding:var(--spacing-xl);color:var(--color-text-muted);font-style:italic;background-color:var(--color-surface-secondary);border:1px dashed var(--color-border);border-radius:var(--radius-md)}.questionnaire-empty .empty-icon{font-size:var(--font-size-2xl);margin-bottom:var(--spacing-sm);opacity:var(--opacity-50)}.profile-button,.edit-profile-button{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);margin-top:var(--spacing-lg);min-height:var(--button-height)}.profile-button:hover,.edit-profile-button:hover{background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.profile-button:disabled,.edit-profile-button:disabled{background-color:var(--color-surface-secondary);color:var(--color-text-muted);cursor:not-allowed;transform:none;box-shadow:none}.avatar-edit-section{margin-bottom:var(--spacing-lg);text-align:center}.select-avatar-button{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);min-height:var(--button-height);margin-top:var(--spacing-md)}.select-avatar-button:hover{background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.select-avatar-button:disabled{background-color:var(--color-surface-secondary);color:var(--color-text-muted);cursor:not-allowed;transform:none;box-shadow:none}.form-group{margin-bottom:var(--spacing-lg)}.form-group:last-child{margin-bottom:0}.form-group label{display:flex;align-items:center;gap:var(--spacing-xs);font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:var(--spacing-xs);font-size:var(--font-size-sm)}.form-group label svg,.label-with-icon svg{width:16px;height:16px;color:var(--color-text-muted);flex-shrink:0}.form-group input,.form-group select,.form-group textarea{width:100%;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);background-color:var(--color-background);color:var(--color-text);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.form-group input:disabled,.form-group select:disabled,.form-group textarea:disabled{background-color:var(--color-surface-secondary);color:var(--color-text-muted);cursor:not-allowed}.form-group small{display:block;margin-top:var(--spacing-xs);font-size:var(--font-size-xs);color:var(--color-text-muted)}.readonly-input{background-color:var(--color-surface-secondary)!important;color:var(--color-text-muted)!important;cursor:not-allowed!important}.handle-status{padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);font-size:var(--font-size-xs);margin-top:var(--spacing-xs)}.handle-status.available{background-color:var(--color-success-light);color:var(--color-success);border:1px solid var(--color-success-light)}.handle-status.error{background-color:var(--color-error-light);color:var(--color-error);border:1px solid var(--color-error-light)}.handle-status.loading{background-color:var(--color-surface-secondary);color:var(--color-text-muted)}.handle-suggestions{margin-top:var(--spacing-sm)}.suggestion-buttons{display:flex;flex-wrap:wrap;gap:var(--spacing-xs);margin-top:var(--spacing-xs)}.suggestion-button{padding:var(--spacing-xs) var(--spacing-sm);background-color:var(--color-surface-secondary);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-xs);cursor:pointer;transition:all var(--transition-fast)}.suggestion-button:hover{background-color:var(--color-primary-light);border-color:var(--color-primary);color:var(--color-primary)}.time-input-wrapper{position:relative}.custom-time-picker{position:absolute;top:100%;left:0;right:0;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);z-index:10;margin-top:var(--spacing-xs);max-height:200px;overflow:hidden}.time-options-list{max-height:200px;overflow-y:auto;padding:var(--spacing-xs) 0}.time-option{padding:var(--spacing-sm) var(--spacing-md);cursor:pointer;transition:background-color var(--transition-fast);font-size:var(--font-size-sm);color:var(--color-text)}.time-option:hover{background-color:var(--color-primary-light);color:var(--color-primary)}.time-option.selected{background-color:var(--color-primary);color:var(--color-text-inverse);font-weight:var(--font-weight-semibold)}.time-option.selected:hover{background-color:var(--color-primary-hover)}.edit-actions{display:flex;gap:var(--spacing-md);margin-top:var(--spacing-xl)}.cancel-button{flex:1;padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-surface-secondary);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);min-height:var(--button-height)}.cancel-button:hover{background-color:var(--color-border);border-color:var(--color-text-muted)}.save-button{flex:1;padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);min-height:var(--button-height)}.save-button:hover{background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.save-button:disabled,.cancel-button:disabled{background-color:var(--color-surface-secondary);color:var(--color-text-muted);cursor:not-allowed;transform:none;box-shadow:none}.login-container{display:flex;min-height:100vh;align-items:center;justify-content:center;padding:var(--spacing-lg);background:linear-gradient(135deg,var(--color-background) 0%,var(--color-surface-secondary) 100%)}.login-card{width:100%;max-width:var(--container-xs-width);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--spacing-2xl);margin:var(--spacing-lg)}.login-header{text-align:center;margin-bottom:var(--spacing-xl)}.login-header h2{margin:0 0 var(--spacing-sm) 0;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text)}.login-header p{margin:0;font-size:var(--font-size-base);color:var(--color-text-muted)}.login-form{display:flex;flex-direction:column;gap:var(--spacing-lg)}.login-form-group{display:flex;flex-direction:column;gap:var(--spacing-xs)}.login-form-group label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text)}.login-form-group input{width:100%;padding:var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);background-color:var(--color-background);color:var(--color-text);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.login-form-group input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.login-form-group input::placeholder{color:var(--color-text-muted)}.login-button{width:100%;padding:var(--spacing-md) var(--spacing-lg);background-color:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);min-height:var(--button-height);display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm)}.login-button:hover:not(:disabled){background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.login-button:disabled{background-color:var(--color-surface-secondary);color:var(--color-text-muted);cursor:not-allowed;transform:none;box-shadow:none}.login-loading-spinner{width:16px;height:16px;border:2px solid transparent;border-top:2px solid currentColor;border-radius:var(--radius-circle);animation:spin var(--animation-spin)}.login-forgot-password{text-align:right;margin-top:var(--spacing-sm)}.login-forgot-password button{background:none;border:none;color:var(--color-primary);font-size:var(--font-size-sm);text-decoration:underline;cursor:pointer;transition:color var(--transition-fast)}.login-forgot-password button:hover{color:var(--color-primary-hover)}.login-divider{margin-top:var(--spacing-xl);padding-top:var(--spacing-lg);border-top:1px solid var(--color-border);text-align:center}.login-signup-link{font-size:var(--font-size-sm);color:var(--color-text-muted)}.login-signup-link a{color:var(--color-primary);font-weight:var(--font-weight-semibold);text-decoration:underline;transition:color var(--transition-fast)}.login-signup-link a:hover{color:var(--color-primary-hover)}.login-error-message{padding:var(--spacing-md);background-color:var(--color-error-light);color:var(--color-error);border:1px solid var(--color-error-light);border-radius:var(--radius-md);font-size:var(--font-size-sm);margin-bottom:var(--spacing-lg)}.login-success-message{padding:var(--spacing-md);background-color:var(--color-success-light);color:var(--color-success);border:1px solid var(--color-success-light);border-radius:var(--radius-md);font-size:var(--font-size-sm);margin-bottom:var(--spacing-lg)}.login-info-message{padding:var(--spacing-md);background-color:var(--color-primary-light);color:var(--color-primary);border:1px solid var(--color-primary-light);border-radius:var(--radius-md);font-size:var(--font-size-sm);margin-bottom:var(--spacing-lg)}.signup-container{display:flex;min-height:100vh;align-items:center;justify-content:center;padding:var(--spacing-lg);background:linear-gradient(135deg,var(--color-background) 0%,var(--color-surface-secondary) 100%)}.signup-card{width:100%;max-width:450px;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--spacing-2xl);margin:var(--spacing-lg)}.signup-header{text-align:center;margin-bottom:var(--spacing-xl)}.signup-header h2{margin:0 0 var(--spacing-sm) 0;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text)}.signup-header p{margin:0;font-size:var(--font-size-base);color:var(--color-text-muted)}.signup-form{display:flex;flex-direction:column;gap:var(--spacing-lg)}.signup-form-group{display:flex;flex-direction:column;gap:var(--spacing-xs)}.signup-form-group label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text)}.signup-form-group input{width:100%;padding:var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);background-color:var(--color-background);color:var(--color-text);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.signup-form-group input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.signup-form-group input::placeholder{color:var(--color-text-muted)}.signup-form-group input.input-error{border-color:var(--color-error);box-shadow:0 0 0 3px var(--color-error-light)}.signup-error-text{font-size:var(--font-size-xs);color:var(--color-error);margin-top:var(--spacing-xs)}.password-requirements{background-color:var(--color-surface-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-md)}.password-requirements-title{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0 0 var(--spacing-sm) 0}.password-requirements-list{display:flex;flex-direction:column;gap:var(--spacing-xs)}.password-requirement{display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-sm)}.password-requirement.valid{color:var(--color-success)}.password-requirement.invalid{color:var(--color-text-muted)}.password-requirement-icon{width:16px;height:16px;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold)}.terms-section{display:flex;flex-direction:column;gap:var(--spacing-xs)}.terms-checkbox-container{display:flex;align-items:flex-start;gap:var(--spacing-sm)}.terms-checkbox{width:16px;height:16px;margin-top:var(--spacing-xs);accent-color:var(--color-primary);cursor:pointer}.terms-label{font-size:var(--font-size-sm);color:var(--color-text);line-height:var(--line-height-normal);cursor:pointer}.terms-link{color:var(--color-primary);font-weight:var(--font-weight-semibold);text-decoration:underline;cursor:pointer;transition:color var(--transition-fast)}.terms-link:hover{color:var(--color-primary-hover)}.signup-button{width:100%;padding:var(--spacing-md) var(--spacing-lg);background-color:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);min-height:var(--button-height);display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm)}.signup-button:hover:not(:disabled){background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.signup-button:disabled{background-color:var(--color-surface-secondary);color:var(--color-text-muted);cursor:not-allowed;transform:none;box-shadow:none}.signup-loading-spinner{width:16px;height:16px;border:2px solid transparent;border-top:2px solid currentColor;border-radius:var(--radius-circle);animation:spin var(--animation-spin)}.signup-divider{margin-top:var(--spacing-xl);padding-top:var(--spacing-lg);border-top:1px solid var(--color-border);text-align:center}.signup-login-link{font-size:var(--font-size-sm);color:var(--color-text-muted)}.signup-login-link a{color:var(--color-primary);font-weight:var(--font-weight-semibold);text-decoration:underline;transition:color var(--transition-fast)}.signup-login-link a:hover{color:var(--color-primary-hover)}.signup-error-message{padding:var(--spacing-md);background-color:var(--color-error-light);color:var(--color-error);border:1px solid var(--color-error-light);border-radius:var(--radius-md);font-size:var(--font-size-sm);margin-bottom:var(--spacing-lg)}.friend-badges{width:120px;padding:var(--spacing-sm) var(--spacing-md);min-width:100px}.friend-badges-container{display:flex;align-items:center;gap:var(--spacing-xs);min-height:24px;flex-wrap:wrap}.friend-badge-wrapper{position:relative;cursor:pointer;display:flex;align-items:center;justify-content:center}.friend-badge-icon{border-radius:50%;cursor:pointer;transition:transform var(--transition-fast);box-shadow:0 1px 2px #0000001a;border:1px solid var(--color-border);background-color:var(--color-surface)}.friend-badge-icon:hover{transform:scale(1.15);box-shadow:0 2px 6px #0003;border-color:var(--color-primary-light)}.friend-badge-icon--tiny{width:18px;height:18px}.friend-badge-icon--small{width:24px;height:24px}.friend-badge-icon--medium{width:32px;height:32px}.friend-badges-count{font-size:var(--font-size-xs);color:var(--color-text-muted);font-weight:var(--font-weight-medium);white-space:nowrap;margin-left:var(--spacing-xs);background-color:var(--color-surface-secondary);border-radius:var(--radius-full);padding:2px var(--spacing-xs);line-height:1}.friend-badges-empty{padding:var(--spacing-xs) 0;min-height:24px;display:flex;align-items:center}.friend-badges-empty-text{font-size:var(--font-size-xs);color:var(--color-text-muted);font-style:italic}@media (max-width: 768px){.friend-badges{width:auto;min-width:80px;padding:var(--spacing-xs) var(--spacing-sm)}.friend-badges-container{gap:2px;justify-content:flex-start}.friend-badge-icon--small{width:20px;height:20px}.friend-badge-icon--tiny{width:16px;height:16px}.friend-badges-count{font-size:10px;margin-left:2px}}.auth-form{max-width:var(--container-xs-width);margin:0 auto;padding:var(--spacing-2xl);background-color:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);border:1px solid var(--color-border)}.auth-form-header{text-align:center;margin-bottom:var(--spacing-xl)}.auth-form-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-sm) 0}.auth-form-subtitle{color:var(--color-text-muted);font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);margin:0}.auth-error-message{padding:var(--spacing-md);background-color:var(--color-error-light);border:1px solid var(--color-error);border-radius:var(--radius-md);color:var(--color-error-dark);font-size:var(--font-size-sm);margin-bottom:var(--spacing-lg);line-height:var(--line-height-relaxed)}.auth-form-content{margin-bottom:var(--spacing-xl)}.auth-form-group{margin-bottom:var(--spacing-lg)}.auth-form-label{display:block;font-weight:var(--font-weight-medium);color:var(--color-text);margin-bottom:var(--spacing-sm);font-size:var(--font-size-sm)}.auth-form-input{width:100%;padding:var(--spacing-md);border:2px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-surface);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.auth-form-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.auth-form-input::placeholder{color:var(--color-text-muted)}.auth-form-button{width:100%;padding:var(--spacing-md) var(--spacing-lg);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm)}.auth-form-button.primary{background-color:var(--color-primary);color:var(--color-text-inverse);border:2px solid var(--color-primary)}.auth-form-button.primary:hover:not(:disabled){background-color:var(--color-primary-hover);border-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.auth-form-button:disabled{background-color:var(--color-surface-secondary);color:var(--color-text-muted);border-color:var(--color-border);cursor:not-allowed;transform:none;box-shadow:none}.auth-button-loading{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm)}.auth-loading-spinner{width:16px;height:16px;animation:spin var(--animation-spin)}.auth-loading-circle{opacity:var(--opacity-25)}.auth-loading-path{opacity:var(--opacity-75)}.auth-form-footer{text-align:center;padding-top:var(--spacing-md);border-top:1px solid var(--color-border)}.auth-form-footer-text{color:var(--color-text-muted);font-size:var(--font-size-sm);margin:0}.auth-form-link{color:var(--color-primary);font-weight:var(--font-weight-medium);text-decoration:underline;background:none;border:none;cursor:pointer;font-size:inherit;transition:color var(--transition-fast)}.auth-form-link:hover{color:var(--color-primary-hover);text-decoration:none}.auth-password-requirements{background-color:color-mix(in srgb,var(--color-info) 10%,var(--color-surface));border:1px solid var(--color-info);border-radius:var(--radius-md);padding:var(--spacing-md);margin-bottom:var(--spacing-lg)}.auth-requirements-title{font-weight:var(--font-weight-medium);color:var(--color-text);font-size:var(--font-size-sm);margin:0 0 var(--spacing-xs) 0}.auth-requirements-list{margin:0;padding-left:var(--spacing-lg);color:var(--color-text-muted);font-size:var(--font-size-xs)}.auth-requirements-list li{margin-bottom:var(--spacing-xs);line-height:var(--line-height-relaxed)}.auth-requirements-list li:last-child{margin-bottom:0}.auth-success-message{text-align:center;padding:var(--spacing-xl)}.auth-success-title{color:var(--color-success);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);margin:0 0 var(--spacing-sm) 0}.auth-success-text{color:var(--color-text-muted);font-size:var(--font-size-base);margin:0;line-height:var(--line-height-relaxed)}@media (max-width: 768px){.auth-form{margin:var(--spacing-md);padding:var(--spacing-xl);max-width:none}.auth-form-title{font-size:var(--font-size-xl)}.auth-form-subtitle{font-size:var(--font-size-xs)}}.auth-form.confirmation-form{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;width:100%;max-width:var(--container-sm-width);margin:0 auto;padding:var(--spacing-2xl);background-color:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);border:1px solid var(--color-border);text-align:center;position:relative}.auth-form.confirmation-form:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,var(--color-background) 0%,var(--color-surface-secondary) 100%);z-index:-1}.confirmation-form h2{margin:0 0 var(--spacing-lg) 0;font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text)}.confirmation-form p{margin:0 0 var(--spacing-md) 0;font-size:var(--font-size-base);color:var(--color-text);line-height:var(--line-height-normal)}.confirmation-subtitle{font-size:var(--font-size-sm)!important;color:var(--color-text-muted)!important;margin-bottom:var(--spacing-xl)!important}.verification-wrapper{display:flex;flex-direction:column;gap:var(--spacing-xl);margin:var(--spacing-xl) 0}.code-input-container{display:flex;gap:var(--spacing-md);justify-content:center;align-items:center;margin:var(--spacing-lg) 0}.code-input-box{width:60px;height:60px;text-align:center;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text);background-color:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-fast);outline:none}.code-input-box:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light);transform:scale(1.05)}.code-input-box:not(:placeholder-shown){border-color:var(--color-success);background-color:var(--color-success-light)}.verify-button{width:100%;padding:var(--spacing-md) var(--spacing-lg);background-color:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);text-transform:uppercase;letter-spacing:.5px}.verify-button:hover:not(:disabled){background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.verify-button:disabled{background-color:var(--color-surface-secondary);color:var(--color-text-muted);cursor:not-allowed;transform:none;box-shadow:none}.form-footer{margin-top:var(--spacing-xl);font-size:var(--font-size-sm);color:var(--color-text-muted);display:flex;align-items:center;justify-content:center;gap:var(--spacing-xs)}.resend-button{background:none!important;border:none!important;color:var(--color-primary)!important;font-size:var(--font-size-sm)!important;font-weight:var(--font-weight-semibold)!important;cursor:pointer;text-decoration:underline;transition:color var(--transition-fast);text-transform:uppercase;letter-spacing:.3px}.resend-button:hover:not(:disabled){color:var(--color-primary-hover)!important}.resend-button:disabled{color:var(--color-text-muted)!important;cursor:not-allowed;opacity:var(--opacity-60)}.loading-spinner{margin:var(--spacing-md) auto;width:24px;height:24px;border:3px solid var(--color-border);border-top:3px solid var(--color-primary);border-radius:var(--radius-circle);animation:spin var(--animation-spin)}@media (max-width: 768px){.auth-form.confirmation-form{padding:var(--spacing-xl);margin:var(--spacing-md);min-height:calc(100vh - 2 * var(--spacing-md));max-width:calc(100% - 2 * var(--spacing-md))}.confirmation-form h2{font-size:var(--font-size-xl)}.code-input-container{gap:var(--spacing-sm)}.code-input-box{width:50px;height:50px;font-size:var(--font-size-lg)}}@media (max-width: 480px){.code-input-container{gap:var(--spacing-xs)}.code-input-box{width:45px;height:45px}.form-footer{flex-direction:column;gap:var(--spacing-sm);text-align:center}}@media (max-width: 768px){.signup-container{padding:var(--spacing-md)}.signup-card{padding:var(--spacing-xl);margin:0;border-radius:var(--radius-lg)}.signup-header h2{font-size:var(--font-size-xl)}.terms-checkbox-container{align-items:center}}@media (max-width: 768px){.login-container{padding:var(--spacing-md)}.login-card{padding:var(--spacing-xl);margin:0;border-radius:var(--radius-lg)}.login-header h2{font-size:var(--font-size-xl)}}@media (max-width: 768px){.profile-container{padding:var(--spacing-md)}.profile-layout{grid-template-columns:1fr;gap:var(--spacing-lg)}.profile-section,.goal-section{order:1}.goal-section{order:2}.profile-header{padding:var(--spacing-lg)}.profile-header h2{font-size:var(--font-size-xl)}.profile-body,.goal-body{padding:var(--spacing-lg)}.questionnaire-item{padding:var(--spacing-md)}.questionnaire-question{font-size:var(--font-size-sm)}.questionnaire-answer{font-size:var(--font-size-xs)}}.onboarding-wizard{min-height:100vh;background:linear-gradient(135deg,var(--color-background) 0%,var(--color-surface-secondary) 100%);display:flex;align-items:center;justify-content:center;padding:var(--spacing-lg)}.onboarding-container{width:100%;max-width:var(--container-lg-width);margin:0 auto}.onboarding-header{margin-bottom:var(--spacing-2xl);text-align:center}.onboarding-content{transition:opacity var(--animation-fast)}.onboarding-content.transitioning{opacity:var(--opacity-0)}.global-error{margin-bottom:var(--spacing-xl);position:relative}.error-dismiss{position:absolute;top:var(--spacing-sm);right:var(--spacing-sm);background:none;border:none;color:var(--color-error);cursor:pointer;font-size:var(--font-size-lg);line-height:1;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.onboarding-step{background-color:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);border:1px solid var(--color-border);padding:var(--spacing-2xl);text-align:center;animation:slideUp var(--animation-slide);width:100%;max-width:700px;margin:0 auto}@keyframes slideUp{0%{opacity:var(--opacity-0);transform:translateY(20px)}to{opacity:var(--opacity-100);transform:translateY(0)}}.step-content{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xl)}.welcome-step{max-width:var(--container-md-width);margin:0 auto}.onboarding-step .profile-layout.wizard-layout{display:block!important;max-width:none!important;width:100%!important;grid-template-columns:none!important}.onboarding-step .profile-identity-communication,.onboarding-step form,.onboarding-step .form-group{width:100%!important;max-width:none!important}.wizard-actions{display:flex;justify-content:center;align-items:center;margin-top:var(--spacing-2xl);gap:var(--spacing-lg);flex-wrap:wrap}.wizard-actions .primary-button{min-width:160px}.wizard-actions .secondary-button{min-width:120px}.welcome-icon{width:120px;height:120px;margin:0 auto var(--spacing-xl);display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-secondary) 100%);border-radius:var(--radius-circle);box-shadow:var(--shadow-lg)}.welcome-icon-svg{width:60px;height:60px;color:var(--color-text-inverse)}.welcome-content{text-align:center}.welcome-title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-lg) 0;line-height:var(--line-height-tight)}.welcome-description{font-size:var(--font-size-lg);color:var(--color-text);line-height:var(--line-height-relaxed);margin:0 0 var(--spacing-2xl) 0;max-width:var(--container-sm-width);margin-left:auto;margin-right:auto}.welcome-features{display:flex;flex-direction:column;gap:var(--spacing-lg);margin:var(--spacing-2xl) 0;max-width:var(--container-xs-width);margin-left:auto;margin-right:auto}.feature-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);background-color:var(--color-surface-secondary);border-radius:var(--radius-md);border:1px solid var(--color-border);transition:all var(--transition-fast)}.feature-item:hover{background-color:var(--color-primary-light);border-color:var(--color-primary);transform:translate(4px)}.feature-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background-color:var(--color-primary);border-radius:var(--radius-circle);flex-shrink:0}.feature-icon svg{width:20px;height:20px;color:var(--color-text-inverse)}.feature-item span{font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text);text-align:left}.welcome-time-estimate{font-size:var(--font-size-sm);color:var(--color-text-muted);margin:var(--spacing-xl) 0 0 0;font-style:italic}.step-navigation{display:flex;gap:var(--spacing-md);justify-content:center;align-items:center;margin-top:var(--spacing-2xl);flex-wrap:wrap}.step-navigation .primary-button,.step-navigation .secondary-button{min-width:140px;padding:var(--spacing-md) var(--spacing-xl);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);border-radius:var(--radius-md);transition:all var(--transition-fast);cursor:pointer;border:2px solid transparent;text-align:center}.step-navigation .primary-button{background-color:var(--color-primary);color:var(--color-text-inverse);border-color:var(--color-primary)}.step-navigation .primary-button:hover{background-color:var(--color-primary-hover);border-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.step-navigation .secondary-button{background-color:transparent;color:var(--color-text);border-color:var(--color-border)}.step-navigation .secondary-button:hover{background-color:var(--color-surface-secondary);border-color:var(--color-primary);color:var(--color-primary)}.onboarding-progress-indicator{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-lg);margin-bottom:var(--spacing-xl);width:100%;max-width:var(--container-md-width);margin:0 auto var(--spacing-xl)}.step-indicators{display:flex;justify-content:center;align-items:center;gap:var(--spacing-xs);position:relative;width:100%;max-width:var(--container-xs-width)}.step-indicator{display:flex;align-items:center;position:relative}.step-circle{width:48px;height:48px;border-radius:var(--radius-circle);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);border:3px solid var(--color-border);background-color:var(--color-surface);color:var(--color-text-muted);transition:all var(--transition-normal);position:relative;z-index:2}.step-indicator.completed .step-circle{background-color:var(--color-success);border-color:var(--color-success);color:var(--color-text-inverse);box-shadow:var(--shadow-success)}.step-indicator.current .step-circle{background-color:var(--color-primary);border-color:var(--color-primary);color:var(--color-text-inverse);transform:scale(1.15);box-shadow:var(--shadow-primary)}.step-indicator.accessible .step-circle{border-color:var(--color-primary-light);background-color:var(--color-primary-light);color:var(--color-primary)}.step-indicator.inactive .step-circle{background-color:var(--color-surface-secondary);border-color:var(--color-border);color:var(--color-text-muted)}.step-number{font-size:var(--font-size-base);font-weight:var(--font-weight-bold)}.check-icon{width:20px;height:20px}.step-connector{width:60px;height:3px;background-color:var(--color-border);margin:0 var(--spacing-xs);border-radius:var(--radius-full);transition:background-color var(--transition-normal);position:relative;z-index:1}.step-connector.completed{background-color:var(--color-success)}.progress-text{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.8px;text-align:center}@media (max-width: 768px){.onboarding-wizard{padding:var(--spacing-md);align-items:flex-start;padding-top:var(--spacing-xl)}.onboarding-step{padding:var(--spacing-xl)}.welcome-icon{width:100px;height:100px}.welcome-icon-svg{width:50px;height:50px}.welcome-title{font-size:var(--font-size-2xl)}.welcome-description{font-size:var(--font-size-base)}.welcome-features{gap:var(--spacing-md)}.feature-item{padding:var(--spacing-sm) var(--spacing-md)}.feature-icon{width:36px;height:36px}.feature-icon svg{width:18px;height:18px}.step-navigation{flex-direction:column;gap:var(--spacing-sm)}.step-navigation .primary-button,.step-navigation .secondary-button{width:100%;min-width:auto}.onboarding-progress-indicator{max-width:350px}.step-indicators{max-width:280px}.step-circle{width:40px;height:40px}.step-number{font-size:var(--font-size-sm)}.step-connector{width:40px}}@media (max-width: 480px){.onboarding-wizard{padding:var(--spacing-sm)}.onboarding-step{padding:var(--spacing-lg)}.welcome-title{font-size:var(--font-size-xl)}.welcome-features{margin:var(--spacing-xl) 0}.feature-item span{font-size:var(--font-size-sm)}.step-circle{width:36px;height:36px}.step-number{font-size:var(--font-size-xs)}.step-connector{width:30px;height:2px}}.avatar-picker-modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--color-backdrop-heavy);display:flex;align-items:center;justify-content:center;z-index:9999;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fadeIn var(--animation-normal)}.avatar-picker-modal-backdrop.closing{animation:fadeOut var(--animation-normal)}.avatar-picker-modal{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-2xl);border:1px solid var(--color-border);max-width:90vw;max-height:90vh;width:600px;display:flex;flex-direction:column;animation:scaleIn var(--animation-normal)}.avatar-picker-modal.closing{animation:scaleOut var(--animation-normal)}.avatar-picker-modal-header{padding:var(--spacing-xl);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;background:var(--color-surface);border-radius:var(--radius-lg) var(--radius-lg) 0 0}.avatar-picker-modal-header h2{margin:0;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text)}.avatar-picker-modal-close{background:none;border:none;cursor:pointer;padding:var(--spacing-sm);color:var(--color-text-muted);border-radius:var(--radius-sm);transition:all var(--transition-fast);display:flex;align-items:center;justify-content:center}.avatar-picker-modal-close:hover{background-color:var(--color-surface-secondary);color:var(--color-text)}.avatar-picker-modal-close svg{width:20px;height:20px}.avatar-picker-modal-body{padding:var(--spacing-xl);flex:1;overflow:hidden;display:flex;flex-direction:column}.avatar-style-selector{margin-bottom:var(--spacing-xl)}.style-selector-label{display:block;font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:var(--spacing-md);font-size:var(--font-size-sm)}.style-buttons{display:flex;gap:var(--spacing-sm);flex-wrap:wrap}.style-button{padding:var(--spacing-sm) var(--spacing-md);background:var(--color-surface-secondary);border:2px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast)}.style-button:hover{border-color:var(--color-primary);background:var(--color-primary-light)}.style-button.active{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-text-inverse)}.avatar-grid-container{flex:1;overflow-y:auto;margin:0 calc(-1 * var(--spacing-md));padding:0 var(--spacing-md)}.avatar-grid-modal{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-md);opacity:var(--opacity-100);transition:opacity var(--animation-fast)}.avatar-grid-modal.transitioning{opacity:var(--opacity-30)}.avatar-option-modal{aspect-ratio:1;background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.avatar-option-modal:hover{border-color:var(--color-primary);transform:scale(1.05);box-shadow:var(--shadow-md)}.avatar-option-modal.selected{border-color:var(--color-primary);background:var(--color-primary-light);box-shadow:0 0 0 2px var(--color-primary-light)}.selection-indicator{position:absolute;top:var(--spacing-xs);right:var(--spacing-xs);width:20px;height:20px;background:var(--color-success);border-radius:var(--radius-circle);display:flex;align-items:center;justify-content:center;color:var(--color-text-inverse)}.selection-indicator svg{width:12px;height:12px}.avatar-loading{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);padding:var(--spacing-2xl);color:var(--color-text-muted)}.avatar-loading .loading-spinner{width:32px;height:32px;border:3px solid var(--color-border);border-top:3px solid var(--color-primary);border-radius:var(--radius-circle);animation:spin var(--animation-spin)}.avatar-error{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);padding:var(--spacing-2xl);color:var(--color-error);text-align:center}.retry-button{padding:var(--spacing-sm) var(--spacing-md);background:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-sm);transition:background var(--transition-fast)}.retry-button:hover{background:var(--color-primary-hover)}.avatar-picker-modal-footer{padding:var(--spacing-xl);border-top:1px solid var(--color-border);display:flex;gap:var(--spacing-md);justify-content:flex-end;background:var(--color-surface);border-radius:0 0 var(--radius-lg) var(--radius-lg)}.generate-more-button-modal{padding:var(--spacing-sm) var(--spacing-md);background:transparent;color:var(--color-text);border:2px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);transition:all var(--transition-fast)}.generate-more-button-modal:hover{border-color:var(--color-primary);color:var(--color-primary);background:var(--color-primary-light)}.modal-select-button{padding:var(--spacing-sm) var(--spacing-lg);background:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);transition:all var(--transition-fast)}.modal-select-button:hover:not(:disabled){background:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-sm)}.modal-select-button:disabled{background:var(--color-surface-secondary);color:var(--color-text-muted);cursor:not-allowed}.avatar-hover-preview-modal{position:absolute;top:var(--spacing-md);left:var(--spacing-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--spacing-md);box-shadow:var(--shadow-lg);z-index:1000;animation:fadeIn var(--animation-fast)}.hover-preview-details{margin-top:var(--spacing-sm);text-align:center}.preview-style{font-size:var(--font-size-xs);color:var(--color-text);font-weight:var(--font-weight-medium)}.preview-hint{font-size:var(--font-size-xs);color:var(--color-text-muted)}@keyframes fadeIn{0%{opacity:var(--opacity-0)}to{opacity:var(--opacity-100)}}@keyframes fadeOut{0%{opacity:var(--opacity-100)}to{opacity:var(--opacity-0)}}@keyframes scaleIn{0%{opacity:var(--opacity-0);transform:scale(.95)}to{opacity:var(--opacity-100);transform:scale(1)}}@keyframes scaleOut{0%{opacity:var(--opacity-100);transform:scale(1)}to{opacity:var(--opacity-0);transform:scale(.95)}}@media (max-width: 768px){.avatar-picker-modal{width:95vw;max-height:85vh}.avatar-grid-modal{grid-template-columns:repeat(4,1fr);gap:var(--spacing-sm)}.avatar-picker-modal-header,.avatar-picker-modal-body,.avatar-picker-modal-footer{padding:var(--spacing-lg)}.style-buttons{gap:var(--spacing-xs)}.style-button{padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-xs)}}.goal-step{text-align:left}.goal-step .step-header{text-align:center;margin-bottom:var(--spacing-2xl)}.goal-step .step-header h2{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--spacing-md) 0}.goal-step .step-header p{font-size:var(--font-size-lg);color:var(--color-text-muted);margin:0}.goal-selection-form{width:100%}.goal-options{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md);margin-bottom:var(--spacing-2xl)}.goal-option{background:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);cursor:pointer;transition:all var(--transition-normal);text-align:center;position:relative;overflow:hidden;min-height:80px;display:flex;align-items:center;justify-content:center}.goal-option:hover:not(.disabled){border-color:var(--color-primary);background:var(--color-primary-light);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.goal-option:active:not(.disabled){transform:translateY(0)}.goal-option.disabled{opacity:var(--opacity-60);cursor:not-allowed;transform:none}.goal-option-content{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-sm);width:100%}.goal-text{text-align:center}.goal-name{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0;line-height:var(--line-height-tight)}.goal-option:hover:not(.disabled) .goal-name{color:var(--color-primary)}.goal-loading{text-align:center;padding:var(--spacing-2xl);color:var(--color-text-muted)}.goal-submitting{text-align:center;padding:var(--spacing-lg);color:var(--color-primary);font-weight:var(--font-weight-medium)}.no-goals{text-align:center;padding:var(--spacing-2xl);color:var(--color-text-muted)}@media (max-width: 768px){.goal-options{grid-template-columns:1fr;gap:var(--spacing-sm)}.goal-option{padding:var(--spacing-md);min-height:60px}.goal-name{font-size:var(--font-size-sm)}.goal-step .step-header h2{font-size:var(--font-size-xl)}.goal-step .step-header p{font-size:var(--font-size-base)}}@media (max-width: 480px){.goal-option{padding:var(--spacing-sm);min-height:50px}.goal-name{font-size:var(--font-size-xs);line-height:var(--line-height-tight)}}.onboarding-questionnaire-container{display:flex;justify-content:center;padding:var(--spacing-md);min-height:100vh;background:transparent}.onboarding-questionnaire-card{width:100%;max-width:900px;min-width:600px;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);overflow:hidden;margin:var(--spacing-lg) 0;padding:var(--spacing-xl)}.onboarding-questionnaire-card h2{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin-bottom:var(--spacing-lg);text-align:center}.onboarding-questionnaire-card .question-container{margin-top:var(--spacing-lg)}.onboarding-questionnaire-card .question-text{font-size:var(--font-size-xl);font-weight:var(--font-weight-medium);color:var(--color-text);margin-bottom:var(--spacing-lg);line-height:var(--line-height-relaxed);text-align:left}@media (max-width: 768px){.onboarding-questionnaire-container{padding:0;min-height:100vh;width:100%}.onboarding-questionnaire-card{margin:0;border-radius:var(--radius-lg);width:80%;max-width:80%;min-width:0;padding:var(--spacing-lg);box-sizing:border-box;overflow:hidden}.onboarding-questionnaire-card h2{font-size:var(--font-size-xl)}.onboarding-questionnaire-card .question-text{font-size:var(--font-size-lg)}}.text-input-container{width:100%;margin-top:var(--spacing-md)}.text-answer-input{width:100%;min-height:120px;padding:var(--spacing-md);border:2px solid var(--color-border);border-radius:var(--radius-lg);font-size:var(--font-size-base);font-family:inherit;line-height:var(--line-height-relaxed);background-color:var(--color-surface);color:var(--color-text);resize:vertical;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.text-answer-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary) 20%,transparent)}.text-answer-input:disabled{background-color:var(--color-surface-disabled);color:var(--color-text-disabled);cursor:not-allowed}.text-answer-input::placeholder{color:var(--color-text-muted);font-style:italic}.other-input-container{margin-top:var(--spacing-sm)}.other-text-input{min-height:80px}@media (max-width: 768px){.text-answer-input{min-height:100px;padding:var(--spacing-sm);font-size:var(--font-size-sm)}.other-text-input{min-height:70px}}.question-navigation{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:var(--spacing-lg);gap:var(--spacing-md)}.question-nav-back,.question-nav-next{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);min-width:120px;width:auto}.question-nav-back span,.question-nav-next span{font-size:var(--font-size-lg);line-height:1}.question-nav-spacer{flex:1}@media (max-width: 768px){.question-nav-back,.question-nav-next{min-width:100px;flex:1}}.choice-options-container,.multichoice-options-container{display:flex;flex-direction:column;gap:var(--spacing-sm);margin-top:var(--spacing-md)}.choice-option,.multichoice-option{display:flex;align-items:center;justify-content:flex-start;gap:var(--spacing-md);padding:var(--spacing-md);background-color:var(--color-surface);border:2px solid var(--color-border);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast);text-align:left;width:100%;font-size:var(--font-size-base);color:var(--color-text)}.choice-option:hover,.multichoice-option:hover{border-color:var(--color-border-strong);background-color:var(--color-surface-hover)}.choice-option.selected,.multichoice-option.selected{border-color:var(--color-primary);background-color:color-mix(in srgb,var(--color-primary) 10%,var(--color-surface))}.choice-option:disabled,.multichoice-option:disabled{opacity:var(--opacity-60);cursor:not-allowed}.choice-option span,.multichoice-option span{text-align:left;width:100%}.multichoice-option{padding-left:var(--spacing-lg)}.multichoice-option input[type=checkbox]{margin-right:var(--spacing-sm);pointer-events:none}.multichoice-selection-counter{margin-top:var(--spacing-sm);padding:var(--spacing-xs) var(--spacing-sm);font-size:var(--font-size-sm);color:var(--color-text-muted);text-align:right}@media (max-width: 768px){.choice-option,.multichoice-option{padding:var(--spacing-sm);font-size:var(--font-size-sm)}.multichoice-option{padding-left:var(--spacing-md)}.text-answer-input{min-width:0;max-width:100%;width:100%;box-sizing:border-box}}.questionnaire-review-container{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:var(--spacing-md);background:linear-gradient(135deg,var(--color-background) 0%,var(--color-surface) 100%)}.questionnaire-review-card{width:100%;max-width:700px;background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--spacing-xl);margin:var(--spacing-lg) 0}.questionnaire-review-header{margin-bottom:var(--spacing-lg)}.questionnaire-review-title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0 0 var(--spacing-sm) 0}.questionnaire-review-subtitle{font-size:var(--font-size-base);color:var(--color-text-muted);margin:0;line-height:var(--line-height-relaxed)}.questionnaire-review-content{max-height:400px;overflow-y:auto;margin:var(--spacing-lg) 0;padding:0;border:1px solid var(--color-border);border-radius:var(--radius-lg);background-color:var(--color-surface)}.questionnaire-review-item{padding:var(--spacing-md);padding-left:60px;border-bottom:1px solid var(--color-border);transition:background-color var(--transition-fast);position:relative}.questionnaire-review-item:hover{background-color:color-mix(in srgb,var(--color-primary) 3%,var(--color-surface))}.questionnaire-review-item:last-child{border-bottom:none}.questionnaire-review-item:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:var(--color-primary);opacity:var(--opacity-0);transition:opacity var(--transition-fast)}.questionnaire-review-item:hover:before{opacity:var(--opacity-100)}.questionnaire-review-question{font-weight:var(--font-weight-semibold);color:var(--color-text);margin-bottom:var(--spacing-sm);line-height:var(--line-height-relaxed)}.questionnaire-review-question:before{content:"Q.";position:absolute;left:var(--spacing-md);top:var(--spacing-md);color:var(--color-primary);font-weight:var(--font-weight-bold);font-size:var(--font-size-xs);background-color:color-mix(in srgb,var(--color-primary) 15%,transparent);border-radius:var(--radius-sm);line-height:1;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.questionnaire-review-answer{color:var(--color-text);line-height:var(--line-height-relaxed);font-size:var(--font-size-sm);background-color:color-mix(in srgb,var(--color-background) 30%,var(--color-surface));padding:var(--spacing-sm);border-radius:var(--radius-md);margin-left:calc(-1 * var(--spacing-md));padding-left:var(--spacing-md)}.questionnaire-review-answer:before{content:"A.";position:absolute;left:var(--spacing-md);top:calc(var(--spacing-md) + var(--spacing-sm) + var(--line-height-relaxed) * 1em + var(--spacing-sm) + 2px);color:var(--color-text-muted);font-weight:var(--font-weight-medium);font-size:var(--font-size-xs);background-color:var(--color-surface);border-radius:var(--radius-sm);border:1px solid var(--color-border);line-height:1;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.questionnaire-review-answer-list{margin:0;padding-left:var(--spacing-md);list-style:disc}.questionnaire-review-answer-list li{margin-bottom:var(--spacing-xs);line-height:var(--line-height-relaxed)}.questionnaire-review-answer-list li:last-child{margin-bottom:0}.questionnaire-review-actions{display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-md);width:100%;margin-top:var(--spacing-lg)}.questionnaire-review-back,.questionnaire-review-submit{display:flex;align-items:center;gap:var(--spacing-sm);min-width:120px}.questionnaire-review-back span{font-size:var(--font-size-lg);line-height:1}@media (max-width: 768px){.questionnaire-review-container{padding:var(--spacing-xs);align-items:stretch;min-height:100vh}.questionnaire-review-card{max-width:none;border-radius:var(--radius-lg);padding:var(--spacing-md);margin:0;min-height:100vh;display:flex;flex-direction:column}.questionnaire-review-title{font-size:var(--font-size-xl);margin-bottom:var(--spacing-xs)}.questionnaire-review-header{margin-bottom:var(--spacing-md)}.questionnaire-review-content{max-height:none;height:calc(100vh - 200px);padding:var(--spacing-sm);margin:var(--spacing-sm) 0;flex:1}.questionnaire-review-actions{gap:var(--spacing-sm);margin-top:var(--spacing-md)}.questionnaire-review-back,.questionnaire-review-submit{flex:1;min-width:100px;justify-content:center}}.goal-change-modal-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background-color:var(--color-backdrop-medium);display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--spacing-lg);opacity:var(--opacity-0);animation:fadeIn var(--animation-normal) forwards}@keyframes fadeIn{to{opacity:var(--opacity-100)}}.goal-change-modal{background-color:var(--color-surface);border-radius:var(--radius-xl);width:100%;max-width:480px;max-height:90vh;overflow-y:auto;box-shadow:var(--shadow-xl);display:flex;flex-direction:column;border:1px solid var(--color-border);transform:translateY(20px);animation:slideUp var(--animation-normal) forwards}@keyframes slideUp{to{transform:translateY(0)}}.goal-change-modal-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg) var(--spacing-lg) var(--spacing-md);border-bottom:1px solid var(--color-border);position:sticky;top:0;background-color:var(--color-surface);z-index:10}.goal-change-modal-title-container{position:relative}.goal-change-modal-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0}.goal-change-modal-title-underline{position:absolute;bottom:-4px;left:0;width:40px;height:2px;background:linear-gradient(90deg,var(--color-warning),var(--color-warning-light));border-radius:var(--radius-full)}.goal-change-modal-close{background:transparent;border:none;font-size:var(--font-size-2xl);line-height:1;color:var(--color-text-muted);cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);transition:all var(--transition-fast)}.goal-change-modal-close:hover{background-color:color-mix(in srgb,var(--color-error) 10%,transparent);color:var(--color-error);transform:rotate(90deg)}.goal-change-modal-body{padding:var(--spacing-lg);overflow-y:auto;flex-grow:1}.goal-change-modal-content{display:flex;flex-direction:column;align-items:center;padding:var(--spacing-lg);border-radius:var(--radius-lg)}.goal-change-modal-icon{margin-bottom:var(--spacing-md);width:64px;height:64px}.goal-change-modal-icon svg{width:100%;height:100%}.goal-change-modal-message{font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);color:var(--color-text);margin-bottom:var(--spacing-lg);text-align:left;line-height:var(--line-height-relaxed);margin-top:0}.goal-change-modal-question{font-size:var(--font-size-lg);font-weight:var(--font-weight-medium);color:var(--color-text);margin:0;text-align:left;line-height:var(--line-height-relaxed);max-width:100%}.goal-change-modal-footer{display:flex;justify-content:flex-end;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-lg);border-top:1px solid var(--color-border);position:sticky;bottom:0;background-color:var(--color-surface);z-index:10}.goal-change-modal-cancel{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);color:var(--color-text-muted);font-size:var(--font-size-base);cursor:pointer;transition:all var(--transition-fast);font-weight:var(--font-weight-medium);box-shadow:var(--shadow-sm);min-width:120px}.goal-change-modal-cancel:hover{background-color:var(--color-surface-hover);color:var(--color-text);border-color:var(--color-border-strong)}.goal-change-modal-cancel:active{transform:translateY(1px);box-shadow:none}.goal-change-modal-confirm{padding:var(--spacing-sm) var(--spacing-lg);background-color:var(--color-error);border:none;border-radius:var(--radius-lg);color:var(--color-text-inverse);font-size:var(--font-size-base);cursor:pointer;transition:all var(--transition-fast);font-weight:var(--font-weight-medium);box-shadow:var(--shadow-md);min-width:120px}.goal-change-modal-confirm:hover{background-color:color-mix(in srgb,var(--color-error) 85%,black);box-shadow:var(--shadow-lg);transform:translateY(-1px)}.goal-change-modal-confirm:active{transform:translateY(0);box-shadow:var(--shadow-sm)}@media (max-width: 768px){.goal-change-modal-backdrop{padding:var(--spacing-md)}.goal-change-modal{max-width:none;border-radius:var(--radius-lg)}.goal-change-modal-content{padding:var(--spacing-md)}.goal-change-modal-icon{width:56px;height:56px}.goal-change-modal-message,.goal-change-modal-question{font-size:var(--font-size-base)}}.badge{display:flex;flex-direction:column;align-items:center;text-align:center;cursor:pointer;transition:all var(--transition-fast);border-radius:var(--radius-lg);padding:var(--spacing-md);position:relative;background:var(--color-surface);border:2px solid transparent}.badge:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--color-primary-200)}.badge:focus{outline:none;box-shadow:0 0 0 3px var(--color-primary-100)}.badge--small{padding:var(--spacing-sm)}.badge--small .badge__icon{width:32px;height:32px}.badge--small .badge__label{font-size:var(--text-xs);margin-top:var(--spacing-xs)}.badge--medium{padding:var(--spacing-md)}.badge--medium .badge__icon{width:48px;height:48px}.badge--medium .badge__label{font-size:var(--text-sm);margin-top:var(--spacing-sm)}.badge--large{padding:var(--spacing-lg)}.badge--large .badge__icon{width:64px;height:64px}.badge--large .badge__label{font-size:var(--text-base);margin-top:var(--spacing-md)}.badge--earned{background:linear-gradient(135deg,var(--color-surface) 0%,var(--color-primary-50) 100%);border-color:var(--color-primary-200)}.badge--earned .badge__icon{filter:none}.badge--unearned{background:var(--color-gray-50);opacity:.7}.badge--unearned .badge__icon{filter:grayscale(100%) opacity(.5)}.badge--unearned .badge__label{color:var(--color-text-muted)}.badge__icon{position:relative;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--color-white);box-shadow:var(--shadow-sm)}.badge__image{width:100%;height:100%;object-fit:contain;border-radius:50%}.badge__placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--color-primary-400)}.badge__default-icon{width:70%;height:70%}.badge__earned-indicator{position:absolute;bottom:-2px;right:-2px;width:16px;height:16px;background:var(--color-success);border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid var(--color-white)}.badge__check-icon{width:10px;height:10px;color:#fff}.badge__content{width:100%}.badge__label{font-weight:var(--font-semibold);color:var(--color-text);margin:0;line-height:1.3}.badge__description{font-size:var(--text-xs);color:var(--color-text-muted);margin:var(--spacing-xs) 0 0;line-height:1.4}.badge__earned-info{margin-top:var(--spacing-xs)}.badge__earned-date{font-size:var(--text-xs);color:var(--color-success);font-weight:var(--font-medium)}.badge__tooltip{position:absolute;bottom:calc(100% + 12px);left:50%;transform:translate(-50%);z-index:1000;opacity:0;animation:tooltip-fade-in .2s ease-out forwards;pointer-events:none}.badge__tooltip-content{background:var(--color-gray-900);color:var(--color-white);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-lg);font-size:var(--text-sm);line-height:1.4;max-width:200px;width:max-content;box-shadow:var(--shadow-xl);text-align:center}.badge__tooltip-content strong{display:block;font-weight:var(--font-semibold);margin-bottom:var(--spacing-xs);color:var(--color-white)}.badge__tooltip-content p{margin:0 0 var(--spacing-xs);font-size:var(--text-xs);line-height:1.3}.badge__tooltip-content small{display:block;font-size:var(--text-xs);opacity:.8;margin-top:var(--spacing-xs)}.badge__tooltip-arrow{position:absolute;top:100%;left:50%;transform:translate(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid var(--color-gray-900)}@keyframes tooltip-fade-in{0%{opacity:0;transform:translate(-50%) translateY(4px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.badges-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-sm)}@media (min-width: 768px){.badges-grid{grid-template-columns:repeat(2,1fr);gap:var(--spacing-md)}}@media (min-width: 1200px){.badges-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}.badge-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:all var(--transition-fast);position:relative;cursor:pointer}.badge-item:hover{background:var(--color-primary-50);border-color:var(--color-primary-200);transform:translateY(-1px);box-shadow:var(--shadow-md)}.badge-item__icon{width:40px;height:40px;flex-shrink:0;position:relative;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--color-white);box-shadow:var(--shadow-sm)}.badge-item__image{width:100%;height:100%;object-fit:contain;border-radius:50%}.badge-item__placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--color-primary-400)}.badge-item__default-icon{width:70%;height:70%}.badge-item__content{flex:1;min-width:0}.badge-item__label{font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text);margin:0 0 var(--spacing-xs);line-height:1.3}.badge-item__date{font-size:var(--text-xs);color:var(--color-text-muted);margin:0;line-height:1.2}.badge-item__tooltip-trigger{position:absolute;top:0;left:0;right:0;bottom:0;opacity:0;pointer-events:none}.badge-item:hover .badge-item__tooltip-trigger{pointer-events:auto}.badge-item__hidden-badge{opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@media (max-width: 767px){.badge-item{padding:var(--spacing-sm) var(--spacing-md)}.badge-item__icon{width:36px;height:36px}.badge-item__label{font-size:var(--text-xs)}.badge-item__date{font-size:11px}}.badge-collection{width:100%}.badge-collection__progress{margin-bottom:var(--spacing-xl);padding:var(--spacing-lg);background:var(--color-surface);border-radius:var(--radius-lg);border:1px solid var(--color-border)}.badge-collection__progress-title{font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text);margin:0 0 var(--spacing-md)}.badge-collection__progress-stats{display:flex;flex-direction:column;gap:var(--spacing-sm)}.badge-collection__earned-count{font-size:var(--text-sm);color:var(--color-text-muted);font-weight:var(--font-medium)}.badge-collection__progress-bar{width:100%;height:8px;background:var(--color-gray-200);border-radius:var(--radius-full);overflow:hidden}.badge-collection__progress-fill{height:100%;background:linear-gradient(90deg,var(--color-primary-500),var(--color-primary-400));border-radius:var(--radius-full);transition:width var(--transition-slow)}.badge-collection__section{margin-bottom:var(--spacing-xl)}.badge-collection__section-title{font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text);margin:0 0 var(--spacing-lg)}.badge-collection--grid .badge-collection__badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:var(--spacing-lg)}.badge-collection--list .badge-collection__badges{display:flex;flex-direction:column;gap:var(--spacing-md)}.badge-collection--list .badge{flex-direction:row;text-align:left;padding:var(--spacing-md)}.badge-collection--list .badge__icon{margin-right:var(--spacing-md);flex-shrink:0}.badge-collection--list .badge__content{flex:1}.badge-collection__empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--spacing-xl) var(--spacing-lg);background:var(--color-surface);border-radius:var(--radius-lg);border:2px dashed var(--color-border)}.badge-collection__empty-icon{width:64px;height:64px;margin-bottom:var(--spacing-lg);color:var(--color-text-muted)}.badge-collection__empty-svg{width:100%;height:100%}.badge-collection__empty-title{font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text-muted);margin:0 0 var(--spacing-sm)}.badge-collection__empty-message{font-size:var(--text-sm);color:var(--color-text-muted);margin:0;line-height:1.5}.badge-modal__backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--spacing-lg)}.badge-modal{background:var(--color-white);border-radius:var(--radius-xl);max-width:480px;width:100%;max-height:90vh;overflow-y:auto;position:relative;box-shadow:var(--shadow-xl);animation:modalSlideUp .3s ease-out}.badge-modal__close{position:absolute;top:var(--spacing-lg);right:var(--spacing-lg);width:32px;height:32px;border:none;background:var(--color-gray-100);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all var(--transition-fast);z-index:1}.badge-modal__close:hover{background:var(--color-gray-200);transform:scale(1.1)}.badge-modal__close-icon{width:16px;height:16px;color:var(--color-text-muted)}.badge-modal__content{padding:var(--spacing-xl)}.badge-modal__icon{display:flex;align-items:center;justify-content:center;margin:0 auto var(--spacing-xl);position:relative}.badge-modal__icon--earned .badge-modal__image,.badge-modal__icon--earned .badge-modal__placeholder{width:96px;height:96px}.badge-modal__icon--unearned .badge-modal__image,.badge-modal__icon--unearned .badge-modal__placeholder{width:96px;height:96px;filter:grayscale(100%) opacity(.6)}.badge-modal__image{border-radius:50%;box-shadow:var(--shadow-lg)}.badge-modal__placeholder{display:flex;align-items:center;justify-content:center;background:var(--color-gray-100);border-radius:50%;color:var(--color-text-muted)}.badge-modal__default-icon{width:60%;height:60%}.badge-modal__earned-overlay{position:absolute;bottom:0;right:0;width:32px;height:32px}.badge-modal__check-icon{width:100%;height:100%;filter:drop-shadow(var(--shadow-sm))}.badge-modal__details{text-align:center}.badge-modal__header{margin-bottom:var(--spacing-lg)}.badge-modal__title{font-size:var(--text-2xl);font-weight:var(--font-bold);color:var(--color-text);margin:0 0 var(--spacing-xs)}.badge-modal__category{display:inline-block;font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--color-primary-600);background:var(--color-primary-50);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-full)}.badge-modal__description{font-size:var(--text-base);color:var(--color-text);line-height:1.6;margin:0 0 var(--spacing-lg)}.badge-modal__criteria{background:var(--color-gray-50);border-radius:var(--radius-lg);padding:var(--spacing-lg);margin-bottom:var(--spacing-lg);text-align:left}.badge-modal__criteria-title{font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text);margin:0 0 var(--spacing-sm)}.badge-modal__criteria-text{font-size:var(--text-sm);color:var(--color-text-muted);margin:0;line-height:1.5}.badge-modal__earned-info{background:linear-gradient(135deg,var(--color-success-50) 0%,var(--color-success-100) 100%);border:1px solid var(--color-success-200);border-radius:var(--radius-lg);padding:var(--spacing-lg);text-align:left}.badge-modal__earned-status{display:flex;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-md)}.badge-modal__status-icon{width:20px;height:20px}.badge-modal__status-text{font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-success-700)}.badge-modal__earned-details>div{margin-bottom:var(--spacing-sm);font-size:var(--text-sm);color:var(--color-text)}.badge-modal__earned-details>div:last-child{margin-bottom:0}.badge-modal__unearned-info{background:var(--color-gray-50);border:1px solid var(--color-gray-200);border-radius:var(--radius-lg);padding:var(--spacing-lg);text-align:left}.badge-modal__progress-hint{display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--text-sm);color:var(--color-text-muted)}.badge-modal__hint-icon{width:16px;height:16px}.badge-notifications-container{position:fixed;top:0;right:0;z-index:1001;pointer-events:none}.badge-notifications-container>*{pointer-events:auto}.badge-notification{position:fixed;top:var(--spacing-lg);right:var(--spacing-lg);max-width:400px;background:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);border:1px solid var(--color-border);z-index:1001;cursor:pointer;transform:translate(100%);transition:transform var(--transition-slow);overflow:hidden}.badge-notification--visible{transform:translate(0)}.badge-notification--leaving{transform:translate(100%)}.badge-notification__content{padding:var(--spacing-lg);display:flex;align-items:flex-start;gap:var(--spacing-md)}.badge-notification__icon{position:relative;width:48px;height:48px;flex-shrink:0}.badge-notification__image{width:100%;height:100%;object-fit:contain;border-radius:50%;box-shadow:var(--shadow-sm)}.badge-notification__placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--color-primary-100);border-radius:50%;color:var(--color-primary-600)}.badge-notification__default-icon{width:70%;height:70%}.badge-notification__sparkles{position:absolute;top:0;left:0;right:0;bottom:0;pointer-events:none}.badge-notification__sparkle{position:absolute;font-size:12px;animation:sparkle 2s infinite}.badge-notification__sparkle--1{top:-5px;left:5px;animation-delay:0s}.badge-notification__sparkle--2{top:5px;right:-5px;animation-delay:.5s}.badge-notification__sparkle--3{bottom:-5px;left:-5px;animation-delay:1s}.badge-notification__details{flex:1;min-width:0}.badge-notification__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-xs)}.badge-notification__title{font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-success);margin:0}.badge-notification__close{width:24px;height:24px;border:none;background:none;color:var(--color-text-muted);cursor:pointer;font-size:20px;line-height:1;padding:0;display:flex;align-items:center;justify-content:center}.badge-notification__close:hover{color:var(--color-text)}.badge-notification__badge-name{font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--color-text);margin:0 0 var(--spacing-xs)}.badge-notification__description{font-size:var(--text-sm);color:var(--color-text-muted);margin:0 0 var(--spacing-sm);line-height:1.4}.badge-notification__achievement{font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--color-primary-600);margin:0}.badge-notification__progress{position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--color-gray-200)}.badge-notification__progress-bar{height:100%;background:linear-gradient(90deg,var(--color-primary-500),var(--color-success));animation:progressBar linear;transform-origin:left}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes sparkle{0%,to{opacity:0;transform:scale(.5) rotate(0)}50%{opacity:1;transform:scale(1) rotate(180deg)}}@keyframes progressBar{0%{width:100%}to{width:0%}}@media (max-width: 768px){.badge-collection--grid .badge-collection__badges{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:var(--spacing-md)}.badge-modal__backdrop{padding:var(--spacing-md)}.badge-modal{max-width:none}.badge-notification{top:var(--spacing-md);right:var(--spacing-md);left:var(--spacing-md);max-width:none}}@media (max-width: 480px){.badge-collection--grid .badge-collection__badges{grid-template-columns:repeat(2,1fr)}}.privacy-toggle-container{padding:var(--spacing-md) 0}.toggle-row{display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-lg);max-width:500px}.toggle-info{flex:1}.toggle-info h3{margin:0 0 var(--spacing-xs) 0;font-size:var(--font-size-md);font-weight:var(--font-weight-bold);color:var(--text-primary)}.toggle-description{color:var(--text-secondary);font-size:var(--font-size-sm);margin:0;line-height:1.4}.toggle-switch{position:relative;width:50px;height:28px;flex-shrink:0;cursor:pointer}.toggle-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#cbd5e1;transition:var(--transition-normal);border-radius:var(--radius-full);border:2px solid #94a3b8}.slider:before{position:absolute;content:"";height:20px;width:20px;left:var(--spacing-xs);bottom:var(--spacing-xs);background-color:#fff;transition:var(--transition-normal);border-radius:var(--radius-full);box-shadow:0 2px 6px #0000004d;border:1px solid #64748b}input:checked+.slider{background-color:var(--primary);border-color:var(--primary-dark)}input:checked+.slider:before{transform:translate(22px)}input:disabled+.slider{opacity:.6;cursor:not-allowed}input:disabled+.slider:before{cursor:not-allowed}.privacy-note{margin-top:var(--spacing-md);padding:var(--spacing-sm);background:var(--background-alt);border-radius:var(--radius-md);display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-sm);color:var(--text-secondary);border:1px solid var(--border)}.note-icon{flex-shrink:0;font-size:var(--font-size-md)}.privacy-saving{margin-top:var(--spacing-sm);font-size:var(--font-size-sm);color:var(--text-secondary);font-style:italic}.privacy-settings-section{background:var(--card-bg);border-radius:var(--radius-lg);padding:var(--spacing-lg)}.privacy-settings-header{display:flex;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-md)}.privacy-settings-header h2{margin:0;font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--text-primary)}.privacy-settings-header .icon{font-size:var(--font-size-lg)}.privacy-settings-description{margin:0 0 var(--spacing-lg) 0;color:var(--text-secondary);font-size:var(--font-size-sm)}@media (max-width: 768px){.toggle-row{gap:var(--spacing-md)}.toggle-info h3{font-size:var(--font-size-sm)}.toggle-description{font-size:var(--font-size-xs)}.toggle-switch{width:44px;height:24px}.slider:before{height:16px;width:16px;left:var(--spacing-xs);bottom:var(--spacing-xs)}input:checked+.slider:before{transform:translate(20px)}}.settings-container{padding:var(--spacing-lg);max-width:var(--container-max-width);margin:0 auto;background-color:var(--color-background);min-height:100vh}.settings-header{margin-bottom:var(--spacing-xl)}.settings-header h2{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0}.settings-tabs-nav{display:flex;background-color:var(--color-surface);border-radius:var(--radius-lg);padding:var(--spacing-xs);margin-bottom:var(--spacing-xl);border:1px solid var(--color-border);overflow-x:auto;gap:var(--spacing-xs)}.settings-tab-button{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md) var(--spacing-lg);border:none;border-radius:var(--radius-md);background-color:transparent;color:var(--color-text-muted);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;min-height:44px;flex:1;justify-content:center}.settings-tab-button:hover{background-color:var(--color-background);color:var(--color-text);transform:translateY(-1px)}.settings-tab-button.active{background-color:var(--color-primary);color:var(--color-text-inverse);font-weight:var(--font-weight-semibold);box-shadow:var(--shadow-sm)}.settings-tab-button.active:hover{background-color:var(--color-primary-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.settings-tab-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center;color:inherit}.settings-tab-icon svg{width:100%;height:100%;stroke:currentColor}.settings-tab-label{font-size:var(--font-size-base)}.settings-tabs-content{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden}.settings-tab-content{padding:var(--spacing-xl)}.settings-content-header{margin-bottom:var(--spacing-xl);padding-bottom:var(--spacing-lg);border-bottom:1px solid var(--color-border)}.settings-content-header h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text);margin:0;line-height:var(--line-height-normal)}@media (max-width: 768px){.settings-container{padding:var(--spacing-md)}.settings-header{margin-bottom:var(--spacing-lg)}.settings-header h2{font-size:var(--font-size-xl)}.settings-tabs-nav{margin-bottom:var(--spacing-lg);padding:var(--spacing-xs)}.settings-tab-button{padding:var(--spacing-sm) var(--spacing-md);min-height:40px;flex-direction:column;gap:var(--spacing-xs)}.settings-tab-icon{width:18px;height:18px}.settings-tab-label{font-size:var(--font-size-sm)}.settings-tab-content{padding:var(--spacing-lg)}.settings-content-header{margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-md)}.settings-content-header h3{font-size:var(--font-size-base)}}@media (max-width: 480px){.settings-container{padding:var(--spacing-sm)}.settings-tab-button{padding:var(--spacing-sm);font-size:var(--font-size-sm)}.settings-tab-content{padding:var(--spacing-md)}}@media (prefers-color-scheme: dark){.settings-tabs-nav{background-color:var(--color-surface-secondary)}.settings-tab-button:hover{background-color:var(--color-surface)}}.skip-management{padding:0;background:transparent;border:none;box-shadow:none}.skip-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-lg)}.skip-current-status{background:var(--color-primary);color:var(--color-surface);border-radius:var(--radius-lg);padding:var(--spacing-lg);margin-bottom:var(--spacing-xl);box-shadow:var(--shadow-md)}.skip-status-header{display:flex;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.skip-status-icon{width:32px;height:32px;color:var(--color-surface);flex-shrink:0}.skip-status-content{flex:1}.skip-status-title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-surface);margin:0 0 var(--spacing-xs) 0}.skip-status-subtitle{font-size:var(--font-size-base);color:var(--color-surface);opacity:.9;margin:0}.skip-status-reason{opacity:.8;font-style:italic}.skip-status-badge{flex-shrink:0}.status-indicator{background:#fff3;color:var(--color-surface);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-full);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);text-transform:capitalize}.skip-status-actions{display:flex;justify-content:flex-end}.skip-header-content{display:flex;align-items:center;gap:var(--spacing-md)}.skip-icon{width:24px;height:24px;color:var(--color-primary);flex-shrink:0}.skip-header h3{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin:0;letter-spacing:-.025em}.skip-header p{color:var(--color-text-secondary);margin:0;font-size:var(--font-size-sm)}.skip-status{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--border-radius-full);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.skip-status.active,.skip-status.upcoming{background:var(--color-surface);color:var(--color-text-primary);border:1px solid var(--color-border)}.skip-form{display:flex;flex-direction:column;gap:var(--spacing-lg)}.form-group{display:flex;flex-direction:column;gap:var(--spacing-xs)}.form-group label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.form-group input,.form-group select{padding:var(--spacing-sm);border:1px solid var(--color-border);border-radius:var(--border-radius-md);font-size:var(--font-size-base);transition:all var(--transition-fast);background:var(--color-bg-primary);color:var(--color-text-primary)}.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-alpha-20)}.form-group input[type=date]{position:relative;padding:var(--spacing-md) var(--spacing-sm);background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--border-radius-lg);font-size:var(--font-size-base);font-family:var(--font-family-base);color:var(--color-text-primary);cursor:pointer;transition:all var(--transition-fast);box-shadow:0 1px 3px #0000000d}.form-group input[type=date]:hover{border-color:var(--color-primary);box-shadow:0 2px 8px #0000001a;transform:translateY(-1px)}.form-group input[type=date]:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-alpha-20),0 4px 12px #00000026;transform:translateY(-1px)}.form-group input[type=date]::-webkit-calendar-picker-indicator{background:transparent;bottom:0;color:transparent;cursor:pointer;height:auto;left:0;position:absolute;right:0;top:0;width:auto;padding:var(--spacing-sm)}.form-group input[type=date]:before{content:"";position:absolute;top:50%;right:var(--spacing-sm);transform:translateY(-50%);width:20px;height:20px;background:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3e%3c/rect%3e%3cline x1='16' y1='2' x2='16' y2='6'%3e%3c/line%3e%3cline x1='8' y1='2' x2='8' y2='6'%3e%3c/line%3e%3cline x1='3' y1='10' x2='21' y2='10'%3e%3c/line%3e%3c/svg%3e") no-repeat center;background-size:contain;pointer-events:none;opacity:.6;transition:opacity var(--transition-fast)}.form-group input[type=date]:hover:before,.form-group input[type=date]:focus:before{opacity:1}.form-group input[type=date]:invalid{color:var(--color-text-tertiary)}.form-group input[type=date]:valid{color:var(--color-text-primary)}.form-group{position:relative}.form-group label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-xs);display:block;letter-spacing:.025em}.duration-toggle{display:flex;background:var(--color-bg-secondary);border-radius:var(--border-radius-lg);padding:4px;margin-bottom:var(--spacing-sm);border:1px solid var(--color-border)}.toggle-btn{flex:1;padding:var(--spacing-sm) var(--spacing-md);background:transparent;border:none;border-radius:var(--border-radius-md);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast);text-align:center}.toggle-btn:hover{color:var(--color-text-primary);background:var(--color-bg-primary)}.toggle-btn.active{background:var(--color-primary);color:var(--color-surface);box-shadow:0 2px 4px #0000001a}.toggle-btn:focus{outline:2px solid var(--color-primary);outline-offset:2px}.help-text{font-size:var(--font-size-xs);color:var(--color-text-secondary)}.form-actions{display:flex;gap:var(--spacing-sm);justify-content:flex-end}.skip-active{display:flex;flex-direction:column;gap:var(--spacing-md)}.skip-period-info{padding:var(--spacing-md);background:var(--color-bg-secondary);border-radius:var(--radius-md);border:1px solid var(--color-border)}.skip-period-dates{display:flex;flex-direction:column;gap:var(--spacing-sm)}.date-range{display:flex;align-items:center;gap:var(--spacing-sm)}.date-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.date-value{font-size:var(--font-size-sm);color:var(--color-text-primary);display:flex;flex-direction:column;gap:var(--spacing-xs)}.skip-duration-note{font-size:var(--font-size-xs);color:var(--color-text-tertiary);font-style:italic}.skip-detail-note{font-size:var(--font-size-xs);color:var(--color-text-tertiary);font-style:italic;margin-top:var(--spacing-xs)}.skip-active-indicator{display:flex;align-items:center;gap:var(--spacing-xs);color:var(--color-warning-text);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.skip-active-indicator svg{width:16px;height:16px}.skip-empty{text-align:center;padding:var(--spacing-xl);background:var(--color-bg-secondary);border-radius:var(--radius-md);border:1px solid var(--color-border)}.skip-empty p{color:var(--color-text-secondary);margin-bottom:var(--spacing-lg);font-size:var(--font-size-sm);line-height:1.5}.skip-history{margin-top:var(--spacing-lg)}.skip-history h4{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-md)}.skip-history-list{display:flex;flex-direction:column;gap:var(--spacing-sm)}.skip-history-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-xs) var(--spacing-md);background:var(--color-bg-secondary);border-radius:var(--border-radius-md);border-left:3px solid;margin-bottom:var(--spacing-xs);min-height:44px}.skip-history-item.active{border-left-color:var(--color-primary);background:var(--color-bg-secondary)}.skip-history-item.cancelled{border-left-color:var(--color-text-tertiary);background:var(--color-bg-secondary)}.skip-history-item.completed{border-left-color:var(--color-text-secondary);background:var(--color-bg-secondary)}.skip-history-content{flex:1;display:flex;align-items:center;gap:var(--spacing-sm)}.skip-history-dates{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.skip-history-actual{color:var(--color-text-secondary);font-weight:var(--font-weight-normal)}.skip-history-reason{font-size:var(--font-size-xs);color:var(--color-text-secondary);font-style:italic;text-transform:capitalize;opacity:.8}.status-badge{padding:2px var(--spacing-xs);border-radius:var(--border-radius-md);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);text-transform:capitalize;letter-spacing:.025em}.status-badge.active{background:var(--color-primary);color:var(--color-surface)}.status-badge.cancelled{background:var(--color-text-tertiary);color:var(--color-surface)}.status-badge.completed{background:var(--color-text-secondary);color:var(--color-surface)}.skip-info{margin-top:var(--spacing-lg);padding:var(--spacing-md);background:var(--color-bg-secondary);border-radius:var(--radius-md);border:1px solid var(--color-border)}.skip-info h4{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-sm)}.skip-info ul{list-style:none;padding:0;margin:0}.skip-info li{position:relative;padding-left:var(--spacing-md);margin-bottom:var(--spacing-xs);color:var(--color-text-secondary);font-size:var(--font-size-sm);line-height:1.4}.skip-info li:before{content:"•";position:absolute;left:0;color:var(--color-primary);font-weight:700}.skip-status-banner{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--spacing-md);margin-bottom:var(--spacing-md);transition:all var(--transition-fast);animation:fadeIn .3s ease-in-out}.skip-status-banner:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.skip-banner-content{display:flex;align-items:center;gap:var(--spacing-md)}.skip-banner-icon{width:24px;height:24px;flex-shrink:0}.skip-banner-text{flex:1}.skip-banner-title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-xs)}.skip-banner-subtitle{font-size:var(--font-size-sm);opacity:.8}.skip-banner-actions{display:flex;gap:var(--spacing-sm)}.skip-banner-details-btn{padding:var(--spacing-xs) var(--spacing-sm);border:1px solid var(--color-border);border-radius:var(--border-radius-md);background:var(--color-background);color:var(--color-text);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast)}.skip-banner-details-btn:hover{background:var(--color-surface);border-color:var(--color-primary);color:var(--color-primary);transform:translateY(-1px)}.skip-banner-details{margin-top:var(--spacing-md);padding-top:var(--spacing-md);border-top:1px solid;opacity:.8}.skip-status-banner.active .skip-banner-details{border-color:var(--color-warning-border)}.skip-status-banner.upcoming .skip-banner-details{border-color:var(--color-info-border)}.skip-details-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.skip-detail{display:flex;flex-direction:column;gap:var(--spacing-xs)}.skip-detail-label{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);text-transform:uppercase;letter-spacing:.05em;opacity:.7}.skip-detail-value{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.skip-details-info{margin-bottom:var(--spacing-md)}.skip-details-info p{font-size:var(--font-size-sm);margin:0;opacity:.8}.skip-details-actions{display:flex;justify-content:flex-end}.skip-management.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-xl)}.loading-spinner{width:24px;height:24px;border:2px solid var(--color-border);border-top:2px solid var(--color-primary);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:var(--spacing-sm)}.error-message{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--color-error-bg);color:var(--color-error-text);border:1px solid var(--color-error-border);border-radius:var(--border-radius-md);margin-bottom:var(--spacing-md);font-size:var(--font-size-sm)}.error-message svg{width:16px;height:16px;flex-shrink:0}@keyframes fadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.inline-skip-banner{margin-bottom:var(--spacing-lg)}.inline-skip-banner-collapsed{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-lg);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast);color:var(--color-text-primary);box-shadow:var(--shadow-sm)}.inline-skip-banner-collapsed:hover{box-shadow:var(--shadow-md);transform:translateY(-1px);border-color:var(--color-primary)}.inline-skip-banner-icon{width:20px;height:20px;flex-shrink:0;color:var(--color-primary)}.inline-skip-banner-text{flex:1;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:var(--color-text-primary)}.inline-skip-banner-arrow{width:18px;height:18px;flex-shrink:0;color:var(--color-text-secondary);transition:transform var(--transition-fast)}.inline-skip-banner-collapsed:hover .inline-skip-banner-arrow{transform:translate(2px);color:var(--color-primary)}.inline-skip-banner-expanded{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);color:var(--color-text-primary);box-shadow:var(--shadow-sm);animation:expandBanner .3s ease-out}.inline-skip-banner-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-md);border-bottom:1px solid var(--color-border)}.inline-skip-banner-title{display:flex;align-items:center;gap:var(--spacing-md);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}.inline-skip-banner-close{padding:var(--spacing-xs);background:transparent;border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast);width:32px;height:32px;display:flex;align-items:center;justify-content:center}.inline-skip-banner-close:hover{background:var(--color-bg-secondary);border-color:var(--color-primary);color:var(--color-primary)}.inline-skip-banner-close svg{width:16px;height:16px}.inline-skip-banner-error{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md);background:var(--color-error-bg);color:var(--color-error-text);border:1px solid var(--color-error-border);border-radius:var(--radius-md);margin-bottom:var(--spacing-lg);font-size:var(--font-size-sm)}.inline-skip-banner-error svg{width:16px;height:16px;flex-shrink:0}.inline-skip-banner-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--spacing-sm);margin-bottom:var(--spacing-md)}.inline-skip-banner .skip-form-group{margin-bottom:var(--spacing-lg)}.inline-skip-banner .skip-form-group label{display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin-bottom:var(--spacing-xs)}.inline-skip-banner .skip-form-group select{width:100%;padding:var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);background:var(--color-bg-primary);color:var(--color-text-primary);transition:all var(--transition-fast)}.inline-skip-banner .skip-form-group select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-alpha-20)}.inline-skip-banner .skip-form-group select:hover{border-color:var(--color-primary)}.inline-skip-banner .skip-form-group select option[disabled],.form-group select option[disabled]{color:var(--color-text-tertiary);font-style:italic}.skip-option-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-xs);padding:var(--spacing-md) var(--spacing-sm);background:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--border-radius-lg);cursor:pointer;transition:all var(--transition-fast);min-height:80px;color:var(--color-text-primary)}.skip-option-button:hover{border-color:var(--color-primary);background:var(--color-primary-bg);transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.skip-option-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.skip-option-duration{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-text-primary)}.skip-option-description{font-size:var(--font-size-xs);color:var(--color-text-secondary);text-align:center}.skip-option-spinner{width:20px;height:20px;border:2px solid var(--color-border);border-top:2px solid var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}.skip-today-actions{display:flex;justify-content:stretch;margin:var(--spacing-lg) 0 var(--spacing-md) 0}.skip-today-btn{width:100%;padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--transition-fast)}.skip-today-btn:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.skip-extended-link{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);margin:var(--spacing-md) 0;padding:var(--spacing-sm) var(--spacing-md);background:var(--color-bg-secondary);border-radius:var(--radius-md);font-size:var(--font-size-sm);border:1px solid var(--color-border)}.skip-extended-text{color:var(--color-text-secondary)}.skip-settings-link{color:var(--color-primary);font-weight:var(--font-weight-medium);text-decoration:none;background:none;border:none;cursor:pointer;padding:0;font-size:inherit;transition:color var(--transition-fast)}.skip-settings-link:hover{color:var(--color-primary);text-decoration:underline}.inline-skip-banner-note{display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:var(--color-bg-secondary);border-radius:var(--radius-md);font-size:var(--font-size-xs);color:var(--color-text-secondary);margin-top:var(--spacing-md);text-align:center;border:1px solid var(--color-border)}.inline-skip-banner-note svg{color:var(--color-success)}.inline-skip-banner-note svg{width:16px;height:16px;flex-shrink:0}@keyframes expandBanner{0%{opacity:0;transform:scaleY(.8);transform-origin:top}to{opacity:1;transform:scaleY(1)}}@media (max-width: 768px){.skip-header,.skip-banner-content{flex-direction:column;align-items:flex-start;gap:var(--spacing-sm)}.skip-banner-actions{align-self:flex-end}.form-actions{flex-direction:column}.skip-details-grid,.inline-skip-banner-options{grid-template-columns:1fr}.skip-option-button{min-height:60px;padding:var(--spacing-sm)}.inline-skip-banner-text{font-size:var(--font-size-xs)}.skip-history-item{flex-direction:column;align-items:flex-start;gap:var(--spacing-sm)}.skip-history-status{align-self:flex-end}}@media (max-width: 768px){.container{padding:0 var(--spacing-sm)}.page-header{flex-direction:column;align-items:flex-start;gap:var(--spacing-md)}.modal{margin:var(--spacing-sm);max-height:calc(100vh - var(--spacing-lg))}.btn-lg{padding:var(--spacing-sm) var(--spacing-lg)}.checkin-flow-container{padding:var(--spacing-sm);min-height:100vh}.checkin-card{margin:0;border-radius:var(--radius-lg)}.checkin-card-content{padding:var(--spacing-lg)}.checkin-title{font-size:var(--font-size-xl)}.question-text{font-size:var(--font-size-lg)}.choice-option,.multichoice-option{padding:var(--spacing-md);min-height:50px}.checkin-navigation{flex-wrap:nowrap;gap:var(--spacing-xs)}.checkin-back-button,.checkin-next-button{min-width:80px;padding:var(--spacing-sm);font-size:var(--font-size-sm)}.checkin-skip-button{padding:var(--spacing-sm);font-size:var(--font-size-sm);min-width:70px}.checkin-reaction{min-height:40px;min-width:40px;padding:var(--spacing-xs)}.checkin-skip-dropdown{right:auto;left:0;width:100%}.checkin-completion-container{padding:var(--spacing-lg)}.checkin-completion-card{padding:var(--spacing-xl)}.checkin-completion-icon{width:60px;height:60px}.checkin-completion-title{font-size:var(--font-size-2xl)}.checkin-completion-message{font-size:var(--font-size-base)}.checkin-completion-button{width:100%;padding:var(--spacing-md) var(--spacing-lg)}.referral-dashboard{padding:var(--spacing-md)}.referral-stats{grid-template-columns:1fr;gap:var(--spacing-md)}.stat-card{padding:var(--spacing-lg)}.stat-number{font-size:var(--font-size-2xl)}.funnel-steps{flex-direction:column;gap:var(--spacing-sm)}.funnel-arrow{transform:rotate(90deg)}.funnel-step{min-width:auto;width:100%}.referrer-card{flex-direction:column;align-items:flex-start;gap:var(--spacing-md);text-align:center}.referrer-avatar{align-self:center}.section-content,.referral-form-inline{padding:var(--spacing-lg)}.form-actions{flex-direction:column;gap:var(--spacing-sm)}.cancel-btn,.send-btn{width:100%}.referral-details{flex-direction:column;gap:var(--spacing-md);align-items:flex-start}.referral-meta{align-self:stretch}.toast-container{left:var(--spacing-sm);right:var(--spacing-sm);top:var(--spacing-sm)}.toast{max-width:none}}.app-header{position:sticky;top:0;z-index:100;background-color:var(--color-surface);border-bottom:1px solid var(--color-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:color-mix(in srgb,var(--color-surface) 95%,transparent)}.app-header-content{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md) var(--spacing-lg);max-width:1400px;margin:0 auto;height:var(--header-height)}.app-header-logo{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0;flex:1;text-align:center}.hamburger-button{width:40px;height:40px;padding:0;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);transition:background-color var(--transition-fast)}.hamburger-button:hover{background-color:var(--color-surface-secondary)}.hamburger-icon{width:24px;height:18px;position:relative;display:block}.hamburger-icon span{display:block;position:absolute;height:3px;width:100%;background:var(--color-text);border-radius:var(--radius-sm);left:0;transition:all var(--transition-fast)}.hamburger-icon span:nth-child(1){top:0}.hamburger-icon span:nth-child(2){top:var(--spacing-sm)}.hamburger-icon span:nth-child(3){top:var(--spacing-md)}.header-avatar-button{width:40px;height:40px;padding:0;border:none;background:transparent;cursor:pointer;border-radius:var(--radius-full);overflow:hidden;transition:transform var(--transition-fast)}.header-avatar-button:hover{transform:scale(1.05)}.mobile-menu-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background-color:var(--color-backdrop-light);z-index:998;opacity:var(--opacity-0);visibility:hidden;transition:opacity var(--transition-normal),visibility var(--transition-normal)}.mobile-menu-backdrop.open{opacity:var(--opacity-100);visibility:visible}.sidebar-menu{position:fixed;top:0;left:0;bottom:0;width:var(--sidebar-width-mobile);background-color:var(--color-surface);box-shadow:var(--shadow-2xl);z-index:999;transform:translate(-100%);transition:transform var(--transition-normal);display:flex;flex-direction:column;padding-top:var(--spacing-5xl)}.sidebar-menu.open{transform:translate(0)}.sidebar-nav{flex:1;overflow-y:auto;padding:var(--spacing-md) 0}.sidebar-footer{padding:var(--spacing-md) 0;border-top:1px solid var(--color-border);margin-top:auto}.sidebar-nav-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-xl);border:none;background:transparent;color:var(--color-text);width:100%;text-align:left;cursor:pointer;font-size:var(--font-size-base);font-weight:var(--font-weight-medium);transition:all var(--transition-fast);position:relative}.sidebar-nav-item:hover{background-color:var(--color-surface-secondary)}.sidebar-nav-item.active{color:var(--color-primary);background-color:var(--color-primary-light)}.sidebar-nav-item.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background-color:var(--color-primary)}.sidebar-nav-item.logout{color:var(--color-text-muted)}.sidebar-nav-item.logout:hover{color:var(--color-error);background-color:var(--color-error-light)}.nav-icon{width:20px;height:20px;flex-shrink:0;display:flex;align-items:center;justify-content:center}.nav-icon svg{width:100%;height:100%}.nav-label{font-size:var(--font-size-base)}.app-main{flex:1;padding:var(--spacing-xl) 0;min-height:calc(100vh - 64px)}.app-container{min-height:100vh;display:flex;flex-direction:column;background-color:var(--color-background)}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-lg)}.field-icon{width:20px;height:20px;flex-shrink:0;color:var(--color-text-muted)}.label-with-icon{display:flex;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-sm);font-weight:var(--font-weight-medium);color:var(--color-text)}.profile-info-icon{width:16px;height:16px;flex-shrink:0;color:var(--color-primary)}.profile-info-item{display:flex;align-items:center;gap:var(--spacing-sm);color:var(--color-text-muted);font-size:var(--font-size-sm)}.icon-sm{width:16px;height:16px}.icon-md{width:20px;height:20px}.icon-lg{width:24px;height:24px}.desktop-nav{display:none}@media (max-width: 767px){.app-header-content{padding:var(--spacing-sm) var(--spacing-md)}.app-header-logo{font-size:var(--font-size-xl)}.container{padding:0 var(--spacing-md)}}@media (min-width: 768px){.sidebar-menu{width:var(--sidebar-width-desktop)}.sidebar-nav-item{padding:var(--spacing-md) var(--spacing-2xl)}}:root{--color-surface-rgb: 255, 255, 255}[data-theme=zen]{--color-surface-rgb: 30, 41, 59}