:root{--color-main-bg: #FFFFFF;--color-main-text: #1E293B;--color-secondary-bg: #F8FAFC;--color-primary-blue: #0EA5E9;--color-primary-green: #10B981;--color-accent-orange: #F97316;--color-accent-red: #EF4444;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--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);--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--radius-full: 9999px;--font-family-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}body{margin:0;font-family:var(--font-family-body);background-color:var(--color-secondary-bg);color:var(--color-main-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}h1,h2,h3,h4,h5,h6,p{margin-top:0}a{text-decoration:none;color:inherit}ul{list-style:none;padding:0;margin:0}.app-container{display:flex;flex-direction:column;min-height:100vh;max-width:600px;margin:0 auto;background-color:var(--color-main-bg);box-shadow:var(--shadow-lg);position:relative;overflow-x:hidden}.main-content{flex:1;padding:1.5rem 1.5rem 5rem;overflow-y:auto}.text-xs{font-size:.75rem;line-height:1rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-2xl{font-size:1.5rem;line-height:2rem}.font-bold{font-weight:700}.font-semibold{font-weight:600}.font-medium{font-weight:500}.text-gray-500{color:#64748b}.text-gray-400{color:#94a3b8}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-2{gap:.5rem}.gap-4{gap:1rem}.slide-in-up{animation:slideInUp .3s ease-out forwards}@keyframes slideInUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.bottom-nav{position:fixed;bottom:0;left:0;right:0;height:4.5rem;background-color:var(--color-main-bg);box-shadow:0 -2px 10px #0000000d;display:flex;justify-content:space-around;align-items:center;padding-bottom:env(safe-area-inset-bottom);z-index:50;max-width:600px;margin:0 auto}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--color-gray-400);text-decoration:none;width:100%;height:100%;transition:color .2s ease;min-width:48px;min-height:48px}.nav-item:hover{color:var(--color-gray-500)}.nav-item.active{color:var(--color-primary-blue)}.nav-icon{margin-bottom:.25rem}.nav-label{font-size:.65rem;font-weight:var(--font-medium)}.btn{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:var(--radius-md);font-weight:var(--font-medium);transition:all .2s ease;cursor:pointer;border:none;font-family:var(--font-family-body)}.btn-primary{background-color:var(--color-primary-blue);color:#fff;box-shadow:var(--shadow-sm)}.btn-primary:hover{background-color:#0284c7}.btn-secondary{background-color:var(--color-primary-green);color:#fff;box-shadow:var(--shadow-sm)}.btn-secondary:hover{background-color:#059669}.btn-accent{background-color:var(--color-accent-orange);color:#fff;box-shadow:var(--shadow-sm)}.btn-accent:hover{background-color:#ea580c}.btn-outline{background-color:transparent;border:1px solid var(--color-gray-400);color:var(--color-main-text)}.btn-outline:hover{background-color:var(--color-secondary-bg)}.btn-ghost{background-color:transparent;color:var(--color-main-text)}.btn-ghost:hover{background-color:var(--color-secondary-bg)}.btn-sm{height:2rem;padding:0 .75rem;font-size:.875rem}.btn-md{height:2.5rem;padding:0 1rem;font-size:1rem}.btn-lg{height:3rem;padding:0 1.5rem;font-size:1.125rem}.btn-block{width:100%}.card{background-color:var(--color-main-bg);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);overflow:hidden;transition:box-shadow .2s ease,transform .2s ease}.card:hover{box-shadow:var(--shadow-md)}.card-interactive{cursor:pointer}.card-interactive:active{transform:scale(.98)}.card-header{padding:1rem 1.25rem;border-bottom:1px solid var(--color-secondary-bg)}.card-body{padding:1.25rem}.card-footer{padding:1rem 1.25rem;background-color:var(--color-secondary-bg);border-top:1px solid var(--color-secondary-bg)}.onboarding-container{max-width:100%;padding-top:1rem}.step-content{min-height:50vh}.input-group{display:flex;flex-direction:column;gap:.5rem}.input-group label{font-weight:var(--font-medium);color:var(--color-main-text)}.input-group input,.input-group textarea{padding:.75rem 1rem;border:1px solid var(--color-gray-400);border-radius:var(--radius-md);font-family:inherit;font-size:1rem;transition:border-color .2s ease,box-shadow .2s ease}.input-group input:focus,.input-group textarea:focus{outline:none;border-color:var(--color-primary-blue);box-shadow:0 0 0 3px #0ea5e933}.grid-2-col{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.bottom-action{position:fixed;bottom:0;left:0;right:0;padding:1.5rem;background-color:var(--color-main-bg);box-shadow:0 -4px 6px -1px #0000000d;max-width:600px;margin:0 auto;z-index:10}.border-primary{border-color:var(--color-primary-blue)!important}.ring-2{box-shadow:0 0 0 2px var(--color-primary-blue)}.bg-secondary-bg{background-color:var(--color-secondary-bg)}.dashboard-container{max-width:100%}.bg-gradient-brand{background:linear-gradient(135deg,var(--color-primary-blue) 0%,#0369a1 100%)}.circular-progress{display:flex;justify-content:center;align-items:center}.circular-progress svg{display:block;margin:0 auto;max-width:70px;max-height:70px}.circle-bg{fill:none;stroke:#fff3;stroke-width:3.8}.circle{fill:none;stroke-width:3.8;stroke-linecap:round;stroke:#fff;transition:stroke-dasharray 1s ease-out}.percentage{fill:#fff;font-family:var(--font-family-body);font-size:.6em;text-anchor:middle;font-weight:700}.macros-bar{display:flex;gap:1.5rem}.macro-item{flex:1}.progress-bar-container{height:6px;background-color:#fff3;border-radius:var(--radius-full);overflow:hidden}.progress-bar{height:100%;border-radius:var(--radius-full);transition:width .5s ease}.meal-card{margin-bottom:.75rem;border-radius:var(--radius-md);box-shadow:0 1px 3px #0000000d}.meal-checkbox{width:20px;height:20px;border-radius:50%;border:2px solid var(--color-gray-400);display:flex;align-items:center;justify-content:center;font-size:10px;color:#fff;transition:all .2s}.meal-checkbox.checked{background-color:var(--color-primary-green);border-color:var(--color-primary-green)}.water-icon{width:40px;height:40px;background-color:#e0f2fe;color:var(--color-primary-blue);border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;font-size:1.25rem}.mealplanner-container{max-width:100%}.week-selector{display:flex;align-items:center;gap:.5rem}.days-container{display:flex;justify-content:space-between;flex:1}.nav-arrow{background:none;border:none;cursor:pointer;color:var(--color-gray-400);display:flex;align-items:center;justify-content:center;padding:.25rem}.nav-arrow:hover{color:var(--color-main-text)}.day-item{display:flex;flex-direction:column;align-items:center;padding:.5rem .25rem;border-radius:var(--radius-full);cursor:pointer;transition:all .2s;min-width:36px}.day-item.active{background-color:var(--color-primary-blue);color:#fff}.day-name{font-size:.75rem;margin-bottom:.25rem;font-weight:var(--font-medium);color:inherit}.day-item:not(.active) .day-name{color:var(--color-gray-500)}.day-date{font-size:1rem;font-weight:var(--font-bold)}.swipe-container{position:relative;width:100%;overflow:hidden}.meal-plan-card{transition:transform .3s ease-in-out,opacity .3s ease-in-out}.swipe-left{transform:translate(-100%);opacity:0}.swipe-enter-right{animation:slideInRight .3s ease-out forwards}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.tag-badge{display:inline-block;background-color:#e0f2fe;color:#0369a1;padding:.1rem .5rem;border-radius:var(--radius-full);font-size:.7rem;font-weight:var(--font-semibold)}.tag-badge-time{display:inline-block;background-color:var(--color-secondary-bg);color:var(--color-gray-500);padding:.1rem .5rem;border-radius:var(--radius-full);font-size:.7rem;font-weight:var(--font-medium)}.grocery-container{max-width:100%}.grocery-categories{padding-bottom:2rem}.grocery-item{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;background-color:var(--color-main-bg);border-radius:var(--radius-md);margin-bottom:.5rem;box-shadow:var(--shadow-sm);transition:all .2s;cursor:pointer}.grocery-item.checked{background-color:var(--color-secondary-bg);opacity:.7}.grocery-item.checked .item-name{text-decoration:line-through;color:var(--color-gray-500)}.custom-checkbox{width:24px;height:24px;border-radius:var(--radius-sm);border:2px solid var(--color-gray-400);display:flex;align-items:center;justify-content:center;color:#fff;transition:all .2s}.grocery-item.checked .custom-checkbox{background-color:var(--color-primary-blue);border-color:var(--color-primary-blue)}.fixed-fab{position:fixed;bottom:6rem;right:1.5rem;z-index:40}.cooking-container{max-width:100%}.progress-indicator{display:flex;justify-content:center}.step-dot{width:12px;height:12px;border-radius:50%;background-color:var(--color-gray-400);transition:all .3s}.step-dot.active{background-color:var(--color-primary-blue);transform:scale(1.2)}.step-dot.completed{background-color:var(--color-primary-green)}.main-step-card{border-radius:var(--radius-xl);background-color:#fff;min-height:45vh;display:flex;flex-direction:column}.step-badge{background-color:var(--color-primary-blue);color:#fff;padding:.25rem 1rem;border-radius:var(--radius-full);font-weight:700;font-size:.875rem;box-shadow:0 4px 6px -1px #0ea5e966}.timer-display{background-color:var(--color-secondary-bg);padding:1rem 2rem;border-radius:var(--radius-xl)}.cooking-controls{padding:1rem}.modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:flex-end;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:fadeIn .2s ease-out}.modal-container{background-color:#fff;width:100%;max-width:480px;max-height:90vh;border-radius:24px 24px 0 0;display:flex;flex-direction:column;box-shadow:0 -4px 20px #0000001a;overflow:hidden}@media(min-width:640px){.modal-overlay{align-items:center}.modal-container{border-radius:16px;max-height:85vh}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px 16px;border-bottom:1px solid #f3f4f6}.modal-content{padding:24px;overflow-y:auto;flex:1}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.profile-container{padding-bottom:80px}.profile-avatar{background:linear-gradient(135deg,#10b981,#059669);color:#fff;box-shadow:0 4px 10px #10b9814d}.settings-section li{transition:transform .2s ease,box-shadow .2s ease}.settings-section li:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000000d;cursor:pointer}.auth-container{display:flex;flex-direction:column;min-height:100vh;background-color:#f9fafb}.auth-header{padding-top:4rem}.auth-card{margin-top:1rem;max-width:400px;width:100%;align-self:center}@media(min-width:640px){.auth-container{justify-content:center;padding-bottom:4rem}.auth-header{padding-top:0}}