@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap";:root{--bg-primary:#050508;--bg-secondary:#0a0a12;--bg-card:#0f0f1a;--bg-card-hover:#14142a;--bg-input:#0c0c18;--accent-aqua:#00f5d4;--accent-aqua-dim:#00f5d426;--accent-aqua-glow:#00f5d44d;--accent-violet:#7b61ff;--accent-violet-dim:#7b61ff26;--accent-rococo:#ff6bca;--accent-gold:#ffd93d;--accent-red:#ff4d6a;--accent-green:#4ade80;--accent-blue:#38bdf8;--accent-yellow:#facc15;--accent-purple:#a78bfa;--accent-teal:#2dd4bf;--surface-1:var(--bg-card);--surface-2:var(--bg-input);--text-primary:#e8e8f0;--text-secondary:#8888a0;--text-muted:#555570;--border:#ffffff0f;--border-hover:#00f5d433;--font-sans:"Inter", -apple-system, sans-serif;--font-mono:"JetBrains Mono", monospace;--radius-sm:.375rem;--radius-md:.625rem;--radius-lg:1rem;--shadow-card:0 4px 24px #00000080;--shadow-glow-aqua:0 0 20px #00f5d440;--ease-out:cubic-bezier(.16, 1, .3, 1);--transition-fast:.15s var(--ease-out);--transition-normal:.25s var(--ease-out);--transition-slow:.4s var(--ease-out)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;font-size:16px!important}body{font-family:var(--font-sans);background:var(--bg-primary);color:var(--text-primary);min-height:100vh;line-height:1.5;overflow-x:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#00f5d433;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#00f5d466}.app{background:var(--bg-secondary);grid-template-rows:1fr auto;max-width:30rem;min-height:100vh;margin:0 auto;display:grid;box-shadow:0 0 50px #000c}.app-content{flex-direction:column;gap:1.25rem;padding:1rem 1rem 5.5rem;display:flex;overflow-y:auto}.bottom-nav{width:100%;max-width:30rem;padding:.5rem .625rem max(.5rem, env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-top:1px solid var(--border);z-index:100;background:#0a0a12d9;justify-content:space-between;align-items:center;display:flex;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.nav-item{color:var(--text-muted);font-family:var(--font-sans);cursor:pointer;transition:all var(--transition-normal);border-radius:var(--radius-md);background:0 0;border:none;flex-direction:row;justify-content:center;align-items:center;padding:.5rem;display:flex}.nav-item:hover{color:var(--text-secondary)}.nav-item.active{color:var(--accent-aqua);background:var(--accent-aqua-dim);padding:.5rem .75rem}.nav-icon{font-size:1.2rem;line-height:1;display:inline-block}.nav-label{opacity:0;white-space:nowrap;max-width:0;transition:max-width var(--transition-normal), opacity var(--transition-normal), margin var(--transition-normal);font-size:.75rem;font-weight:600;overflow:hidden}.nav-item.active .nav-label{opacity:1;max-width:6rem;margin-left:.375rem}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);transition:all var(--transition-normal);padding:1.25rem;position:relative;overflow:hidden}.card:before{content:"";width:100%;height:2px;transition:transform .6s var(--ease-out);background:linear-gradient(90deg,#0000,#00f5d433,#0000);position:absolute;top:0;left:0;transform:translate(-100%)}.card:hover:before{transform:translate(100%)}.card:hover{border-color:var(--border-hover);box-shadow:var(--shadow-card)}.card-header{justify-content:space-between;align-items:center;margin-bottom:.75rem;display:flex}.card-title{text-transform:uppercase;letter-spacing:1px;color:var(--text-secondary);font-size:.8125rem;font-weight:700}.progress-ring{justify-content:center;align-items:center;display:flex;position:relative}.progress-ring svg{filter:drop-shadow(0 0 8px #00f5d426);transform-origin:50%;overflow:visible;transform:rotate(-90deg)}.progress-ring .bg-circle{fill:none;stroke:var(--bg-input);stroke-width:8px}.progress-ring .progress-circle{fill:none;stroke:var(--accent-aqua);stroke-width:8px;stroke-linecap:round;transition:stroke-dashoffset var(--transition-slow)}.progress-center{flex-direction:column;align-items:center;gap:2px;display:flex;position:absolute}.progress-value{font-size:1.75rem;font-weight:800;font-family:var(--font-mono);color:var(--text-primary)}.progress-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;font-size:.6875rem}.macro-row{align-items:center;gap:.625rem;display:flex}.macro-label{color:var(--text-secondary);min-width:3.5rem;font-size:.75rem;font-weight:600}.macro-bar{background:var(--bg-input);border-radius:3px;flex:1;height:.375rem;overflow:hidden}.macro-bar-fill{height:100%;transition:width var(--transition-slow);border-radius:3px}.macro-bar-fill.protein{background:var(--accent-aqua);box-shadow:0 0 8px #00f5d44d}.macro-bar-fill.fat{background:var(--accent-violet);box-shadow:0 0 8px #7b61ff4d}.macro-bar-fill.carbs{background:var(--accent-gold);box-shadow:0 0 8px #ffd93d4d}.macro-bar-fill.fiber{background:var(--accent-green);box-shadow:0 0 8px #4ade804d}.macro-value{font-size:.75rem;font-family:var(--font-mono);text-align:right;min-width:4.5rem}.water-glass-container{flex-direction:column;align-items:center;gap:.75rem;margin:1rem 0;display:flex}.water-glass{border:4px solid var(--text-primary);background:#0c0c1880;border-top:none;border-radius:0 0 1.5rem 1.5rem;width:7.5rem;height:10rem;position:relative;overflow:hidden;box-shadow:0 8px 32px #0006}.water-fill{width:300%;transition:height .6s var(--ease-out), transform .15s ease-out;transform-origin:50% 100%;background:linear-gradient(#00f5d4 0%,#07f 100%);position:absolute;bottom:0;left:-100%}.water-fill:after{content:"";background:#07f;width:100%;height:25rem;position:absolute;top:99%;left:0}.water-wave{aspect-ratio:1;background:#00f5d466;border-radius:38%;width:120%;animation:12s linear infinite wave-anim;position:absolute;top:0;left:50%}.water-wave-back{aspect-ratio:1;background:#0077ff4d;border-radius:42%;width:120%;animation:9s linear infinite wave-anim-back;position:absolute;top:0;left:50%}@keyframes wave-anim{0%{transform:translate(-50%,-90%)rotate(0)}to{transform:translate(-50%,-90%)rotate(360deg)}}@keyframes wave-anim-back{0%{transform:translate(-50%,-89%)rotate(360deg)}to{transform:translate(-50%,-89%)rotate(0)}}.meal-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);transition:all var(--transition-normal);cursor:pointer;align-items:center;gap:.75rem;padding:.75rem .875rem;display:flex}.meal-card:hover{border-color:var(--border-hover);background:var(--bg-card-hover);transform:translateY(-1px)}.meal-icon{background:var(--bg-input);border-radius:var(--radius-sm);border:1px solid var(--border);justify-content:center;align-items:center;width:2.5rem;height:2.5rem;font-size:1.5rem;display:flex}.meal-info{flex:1;min-width:0}.meal-name{color:var(--text-primary);font-size:.875rem;font-weight:700}.meal-details{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:.75rem;overflow:hidden}.meal-calories{font-size:.875rem;font-weight:700;font-family:var(--font-mono);color:var(--accent-aqua);text-shadow:0 0 8px #00f5d433}.btn{border-radius:var(--radius-md);font-family:var(--font-sans);cursor:pointer;transition:all var(--transition-fast);border:none;outline:none;justify-content:center;align-items:center;gap:.5rem;padding:.625rem 1.25rem;font-size:.875rem;font-weight:600;display:inline-flex}.btn-primary{background:var(--accent-aqua);color:var(--bg-primary)}.btn-primary:hover{box-shadow:var(--shadow-glow-aqua);transform:translateY(-1px)}.btn-ghost{color:var(--text-secondary);border:1px solid var(--border);background:0 0}.btn-ghost:hover{border-color:var(--border-hover);color:var(--text-primary);background:#ffffff05}.btn-danger{background:var(--accent-red);color:var(--text-primary)}.btn-danger:hover{box-shadow:0 0 15px #ff4d6a4d}.btn-icon{border-radius:var(--radius-sm);width:2.25rem;height:2.25rem;padding:0;font-size:1.125rem}.input{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-md);width:100%;color:var(--text-primary);font-family:var(--font-sans);transition:all var(--transition-fast);outline:none;padding:.625rem .875rem;font-size:.875rem}.input:focus{border-color:var(--accent-aqua);box-shadow:0 0 0 3px var(--accent-aqua-dim)}.input::placeholder{color:var(--text-muted)}.select{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-md);width:100%;color:var(--text-primary);font-family:var(--font-sans);transition:all var(--transition-fast);cursor:pointer;outline:none;padding:.625rem .875rem;font-size:.875rem}.select:focus{border-color:var(--accent-aqua)}.page-header{justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1.25rem;display:flex}.page-title{background:linear-gradient(135deg, var(--accent-aqua), var(--accent-violet));-webkit-text-fill-color:transparent;letter-spacing:-.5px;-webkit-background-clip:text;background-clip:text;font-size:1.375rem;font-weight:800}.fab{background:linear-gradient(135deg, var(--accent-aqua), var(--accent-violet));width:3rem;height:3rem;color:var(--bg-primary);cursor:pointer;transition:all var(--transition-fast);z-index:50;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:1.5rem;display:flex;position:fixed;bottom:5rem;right:max(1.5rem,50% - 13.5rem);box-shadow:0 4px 20px #00f5d44d}.fab:hover{transform:scale(1.08)rotate(5deg);box-shadow:0 4px 24px #00f5d480}.chart-svg{background:0 0;overflow:visible}.chart-axis line{stroke:var(--border)}.chart-axis text{fill:var(--text-secondary);font-size:.625rem;font-family:var(--font-mono)}.chart-grid line{stroke:var(--border);stroke-dasharray:4 4}.chart-bar{rx:2px;transition:fill var(--transition-fast)}.chart-bar.consumed{fill:var(--accent-aqua)}.chart-bar.target{fill:var(--bg-input);opacity:.5}.chart-line{fill:none;stroke:var(--accent-aqua);stroke-width:3px;stroke-linecap:round}.chart-dot{fill:var(--bg-card);stroke:var(--accent-aqua);stroke-width:2.5px;transition:r var(--transition-fast);cursor:pointer}.chart-dot:hover{r:6px;fill:var(--accent-aqua)}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:200;background:#050508d9;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.modal{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg) var(--radius-lg) 0 0;width:100%;max-width:30rem;max-height:85vh;animation:slideUp .35s var(--ease-out);padding:1.25rem;overflow-y:auto}.modal-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.animate-in{animation:fadeIn .35s var(--ease-out)}@media (width>=48rem){html{font-size:18px}.app{max-width:100%;height:100vh;box-shadow:none;grid-template-rows:1fr;grid-template-columns:16rem 1fr;margin:0}.app-content{width:100%;max-width:68rem;height:100vh;margin:0 auto;padding:2.5rem;overflow-y:auto}.bottom-nav{border-top:none;border-right:1px solid var(--border);background:var(--bg-card);flex-direction:column;justify-content:flex-start;gap:.75rem;width:100%;max-width:100%;height:100%;padding:2.5rem 1.25rem;position:relative;left:0;transform:none}.nav-item{border-radius:var(--radius-md);flex-direction:row;align-items:center;gap:.875rem;width:100%;padding:.75rem 1rem;font-size:.875rem}.nav-label{opacity:1;max-width:none;margin-left:0}.nav-brand-desktop{display:block!important}.nav-item.active{background:var(--accent-aqua-dim)}.nav-item.active:before{width:3px;height:1.25rem;top:50%;left:0;transform:translateY(-50%)}.fab{bottom:2.5rem;right:2.5rem}.dashboard-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:1.5rem;display:grid}.dashboard-col-left,.dashboard-col-right{flex-direction:column;gap:1.5rem;min-width:0;display:flex}}.toast-notification{z-index:9999;border-radius:var(--radius-md);font-family:var(--font-sans);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);animation:toastSlideIn .3s var(--ease-out);text-align:center;align-items:center;gap:.5rem;width:max-content;max-width:90%;padding:.75rem 1.5rem;font-size:.875rem;font-weight:700;display:flex;position:fixed;top:1.5rem;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #0009,0 0 15px #00f5d41a}.toast-notification.success{border:1px solid var(--accent-aqua);color:var(--accent-aqua);text-shadow:0 0 8px #00f5d44d;background:#00f5d426}.toast-notification.error{border:1px solid var(--accent-red);color:var(--accent-red);text-shadow:0 0 8px #ff4d6a4d;background:#ff4d6a26}.toast-notification.warning{border:1px solid var(--accent-gold);color:var(--accent-gold);text-shadow:0 0 8px #ffd93d4d;background:#ffd93d26}.toast-notification.info{border:1px solid var(--accent-violet);color:var(--accent-violet);text-shadow:0 0 8px #7b61ff4d;background:#7b61ff26}@keyframes toastSlideIn{0%{opacity:0;transform:translate(-50%,-20px)}to{opacity:1;transform:translate(-50%)}}