@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap";
:root{--bg-color:#000;--card-bg:#1c1c1e99;--card-blur:blur(20px);--text-primary:#fff;--text-secondary:#8a8a93;--accent-blue:#0a84ff;--accent-blue-hover:#006ee6;--success-green:#30d158;--warning-yellow:#ffd60a;--danger-red:#ff453a;--bubble-bg:#2c2c2e;--bubble-completed:#0a84ff;--border-color:#ffffff14;--radius-lg:24px;--radius-md:16px;--radius-pill:9999px}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-primary);-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 15%,#0a84ff1f,#0000 25%),radial-gradient(circle at 85% 30%,#30d15814,#0000 25%);background-attachment:fixed;font-family:Outfit,sans-serif;line-height:1.5}@keyframes slide-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-slide-up{animation:.5s cubic-bezier(.16,1,.3,1) forwards slide-up}.container{max-width:500px;margin:0 auto;padding:24px 16px 100px}.card{background:var(--card-bg);-webkit-backdrop-filter:var(--card-blur);border-radius:var(--radius-lg);border:1px solid var(--border-color);margin-bottom:20px;padding:20px;transition:transform .2s,box-shadow .2s;box-shadow:0 8px 32px #0000004d}.btn-primary{background:linear-gradient(135deg, var(--accent-blue), #005bb5);color:#fff;text-align:center;border-radius:var(--radius-lg);cursor:pointer;border:none;width:100%;padding:16px;font-size:1.125rem;font-weight:600;transition:all .2s;display:block;box-shadow:0 4px 15px #0a84ff66}.btn-primary:active{transform:scale(.97);box-shadow:0 2px 8px #0a84ff66}.smart-bubble{background-color:var(--bubble-bg);border-radius:var(--radius-pill);cursor:pointer;-webkit-user-select:none;user-select:none;border:1px solid var(--border-color);flex-direction:column;justify-content:center;align-items:center;min-width:68px;height:68px;padding:8px;transition:all .3s cubic-bezier(.25,1,.5,1);display:inline-flex}.smart-bubble.completed{background-color:var(--bubble-completed);border-color:#fff3;transform:scale(1.08);box-shadow:0 0 20px #0a84ff80}.smart-bubble .reps{color:#fff;font-size:1.35rem;font-weight:700;line-height:1}.smart-bubble .weight{color:var(--text-secondary);margin-top:2px;font-size:.75rem;font-weight:500}.smart-bubble.completed .weight{color:#ffffffe6}.progress-container{border-radius:var(--radius-pill);background-color:#ffffff0d;width:100%;height:8px;margin-top:6px;overflow:hidden}.progress-bar{border-radius:var(--radius-pill);height:100%;transition:width 1s cubic-bezier(.25,1,.5,1)}.bg-protein{background:linear-gradient(90deg,#0a84ff,#5e5ce6)}.bg-carbs{background:linear-gradient(90deg,#30d158,#32ade6)}.bg-fats{background:linear-gradient(90deg,#ffd60a,#ff9f0a)}h1{letter-spacing:-.5px;margin-bottom:8px;font-size:2.25rem;font-weight:800}h2{letter-spacing:-.3px;margin-bottom:12px;font-size:1.5rem;font-weight:700}p{color:var(--text-secondary);margin-bottom:16px;font-size:1rem}.input-field{border:1px solid var(--border-color);border-radius:var(--radius-md);color:#fff;background:#ffffff0d;width:100%;margin-bottom:12px;padding:14px 16px;font-family:inherit;font-size:1rem;transition:border-color .2s}.input-field:focus{border-color:var(--accent-blue);outline:none}.track-container{border:1px solid var(--border-color);background:#1c1c1e;border-radius:20px;height:40px;margin-top:16px;position:relative;overflow:hidden}.track-ghost{background:#ffffff1a;border-right:2px dashed #ffffff4d;transition:width 1s;position:absolute;top:0;bottom:0}.track-user{border-right:4px solid var(--accent-blue);background:linear-gradient(90deg,#0000,#0a84ff99);transition:width 1s;position:absolute;top:0;bottom:0;box-shadow:2px 0 10px #0a84ffcc}
