*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden}body{font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;background:#fafaf7;color:#1a1a17}button{background:none;border:none;cursor:pointer;font-family:inherit}svg{display:block}:root{--accent: #8B6347;--accent-12: rgba(139,99,71,.12);--accent-14: rgba(139,99,71,.14);--accent-30: rgba(139,99,71,.3);--accent-40: rgba(139,99,71,.4);--bg-top: #fafaf7;--bg-bot: #f3efe7;--fg: #1a1a17;--muted: #6f6e69;--white: #ffffff;--glass-bg: rgba(255,255,255,.45);--glass-border: rgba(255,255,255,.8);--ease-expo: cubic-bezier(.16, 1, .3, 1);--ease-back: cubic-bezier(.34, 1.56, .64, 1);--tab-h: 82px}#splash{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;background:linear-gradient(to bottom,#faf5ee,#f0e3ce)}.splash-glow{position:absolute;top:30%;left:50%;translate:-50% -50%;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(139,99,71,.18) 0%,transparent 70%);pointer-events:none}.splash-icon-wrap{position:relative;display:flex;align-items:center;justify-content:center}.splash-icon-wrap:before{content:"";position:absolute;width:130px;height:130px;border-radius:50%;background:#8b63471f;filter:blur(20px)}.splash-icon{width:100px;height:100px;border-radius:28px;background:linear-gradient(135deg,#f5ede0,#e8d5bc);border:1px solid rgba(255,255,255,.6);box-shadow:0 8px 20px #8b634740;display:flex;align-items:center;justify-content:center;position:relative}.splash-text{text-align:center}.splash-text h1{font-family:Playfair Display,serif;font-size:32px;font-weight:500;color:#3d2b1a}.splash-text p{font-size:14px;color:#8b6347cc;margin-top:4px}#app{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;opacity:0}#app-bg{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none}.bg-gradient{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to bottom,var(--bg-top),var(--bg-bot))}.bg-glow{position:absolute;top:-5%;left:50%;translate:-50% 0;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(139,99,71,.13) 0%,transparent 70%)}#content{flex:1;overflow:hidden;position:relative;z-index:1}.tab-panel{position:absolute;top:0;right:0;bottom:0;left:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding-bottom:calc(var(--tab-h) + 16px);display:none;opacity:0}.tab-panel.active{display:block}.tab-panel::-webkit-scrollbar{display:none}#tab-bar{position:relative;z-index:10;height:var(--tab-h);display:flex;align-items:flex-start;justify-content:space-around;padding-top:10px;background:#fafaf7d9;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border-top:.5px solid rgba(0,0,0,.08);padding-bottom:env(safe-area-inset-bottom,0px)}.tab-btn{display:flex;flex-direction:column;align-items:center;gap:4px;padding:4px 16px;color:var(--muted);transition:color .2s;-webkit-tap-highlight-color:transparent}.tab-btn svg{width:24px;height:24px}.tab-btn span{font-size:10px;font-weight:500}.tab-btn.active{color:var(--accent)}.glass-card{background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-radius:22px;border:.6px solid var(--glass-border);box-shadow:0 2px 8px #0000000a,inset 0 1px #ffffff80;overflow:hidden}.section-label{font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}.app-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px 4px}.app-header-left h2{font-family:Playfair Display,serif;font-size:22px;font-weight:500;color:var(--fg)}.app-header-left p{font-size:13px;color:var(--muted)}.device-badge{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:100px;background:var(--accent-12);border:.5px solid var(--accent-30);font-size:12px;font-weight:500;color:var(--accent)}.device-badge .dot{width:7px;height:7px;border-radius:50%;background:#6fcf97;box-shadow:0 0 6px #6fcf9799}.device-badge .dot.offline{background:#bbb;box-shadow:none}.pet-switcher{display:flex;gap:10px;padding:8px 16px;overflow-x:auto}.pet-switcher::-webkit-scrollbar{display:none}.pet-pill{display:flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border-radius:100px;border:1.5px solid transparent;transition:all .3s var(--ease-expo);white-space:nowrap;-webkit-tap-highlight-color:transparent}.pet-pill.active{background:var(--accent-12);border-color:var(--accent-30)}.pet-avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;color:#fff}.pet-pill-name{font-size:14px;font-weight:500;color:var(--fg)}.hero-card{margin:0 16px;padding:20px}.cylinder-wrap{display:flex;flex-direction:column;align-items:center;gap:12px}.cylinder-outer{width:80px;height:140px;border-radius:12px;border:2px solid var(--accent-30);position:relative;overflow:hidden;background:#8b63470d}.cylinder-fill{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,var(--accent),rgba(139,99,71,.4));border-radius:0 0 10px 10px;transition:height 1.2s var(--ease-expo)}.cylinder-shimmer{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:shimmer 2.5s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.cylinder-pct{font-family:Playfair Display,serif;font-size:42px;font-weight:500;color:var(--fg);line-height:1}.cylinder-label{font-size:13px;color:var(--muted)}.hero-divider{height:.5px;background:#0000001a;margin:16px 0}.hero-actions{display:flex;align-items:center;justify-content:flex-end}.btn-dispense{display:flex;align-items:center;gap:6px;padding:10px 18px;border-radius:100px;background:var(--accent);color:#fff;font-size:14px;font-weight:600;box-shadow:0 4px 12px var(--accent-40);transition:transform .15s,box-shadow .15s;-webkit-tap-highlight-color:transparent}.btn-dispense:active{transform:scale(.96);box-shadow:0 2px 6px var(--accent-30)}.btn-dispense svg{width:14px;height:14px}.stats-row{display:flex;gap:12px;padding:0 16px}.stat-card{flex:1;padding:14px 16px;border-radius:20px}.stat-label{font-size:11px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:var(--muted)}.stat-value{font-family:Playfair Display,serif;font-size:22px;font-weight:500;color:var(--fg);margin:4px 0 2px}.stat-sub{font-size:12px;color:var(--muted)}.stat-card.alert .stat-value{color:#e07c4a}.next-meal-card{margin:0 16px;padding:16px;display:flex;align-items:center;gap:14px;border-radius:20px}.next-meal-icon{width:48px;height:48px;border-radius:50%;background:var(--accent-14);display:flex;align-items:center;justify-content:center;flex-shrink:0}.next-meal-icon svg{width:22px;height:22px;color:var(--accent);fill:var(--accent)}.next-meal-info{flex:1}.next-meal-info .label{font-size:11px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:var(--muted)}.next-meal-info .name{font-size:16px;font-weight:600;color:var(--fg);margin-top:3px}.next-meal-time{text-align:right}.next-meal-time .time{font-family:Playfair Display,serif;font-size:22px;color:var(--fg);font-variant-numeric:tabular-nums}.next-meal-time .grams{font-size:13px;color:var(--muted)}.today-section{padding:0 16px}.today-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.meal-timeline{border-radius:20px;overflow:hidden}.meal-row{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.meal-row+.meal-row{border-top:.5px solid rgba(0,0,0,.07)}.meal-row.is-next{background:#8b634712}.meal-row-icon{width:36px;height:36px;border-radius:50%;background:var(--accent-12);display:flex;align-items:center;justify-content:center;flex-shrink:0}.meal-row-icon svg{width:16px;height:16px;fill:var(--accent)}.meal-row-info{flex:1}.meal-row-label{font-size:14px;font-weight:500;color:var(--fg)}.meal-row-sub{font-size:12px;color:var(--muted)}.meal-row-time{font-family:Playfair Display,serif;font-size:18px;color:var(--fg);font-variant-numeric:tabular-nums}.next-badge{font-size:10px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:var(--accent);background:var(--accent-12);border-radius:6px;padding:2px 6px;margin-left:6px}#modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#00000059;display:flex;align-items:flex-end;opacity:0;pointer-events:none;transition:opacity .3s}#modal-overlay.visible{opacity:1;pointer-events:all}#modal-sheet{width:100%;border-radius:32px 32px 0 0;background:linear-gradient(to bottom,var(--bg-top),var(--bg-bot));padding:12px 28px 40px;transform:translateY(100%);transition:transform .45s var(--ease-expo);min-height:340px;display:flex;flex-direction:column}#modal-overlay.visible #modal-sheet{transform:translateY(0)}.modal-handle{width:36px;height:4px;border-radius:2px;background:#00000026;margin:0 auto 20px}.modal-title{font-size:17px;font-weight:600;color:var(--fg);text-align:center;margin-bottom:24px}.modal-phase{display:flex;flex-direction:column;align-items:center;gap:20px;flex:1}.grams-display{text-align:center}.grams-display .number{font-family:Playfair Display,serif;font-size:72px;font-weight:500;color:var(--fg);line-height:1;font-variant-numeric:tabular-nums}.grams-display .unit{font-size:16px;color:var(--muted)}.grams-stepper{display:flex;gap:10px}.grams-btn{width:56px;height:44px;border-radius:14px;font-size:15px;font-weight:600;transition:transform .1s;-webkit-tap-highlight-color:transparent}.grams-btn:active{transform:scale(.94)}.grams-btn.plus{background:var(--accent-12);color:var(--accent)}.grams-btn.minus{background:#1a1a170d;color:var(--muted)}.btn-primary{width:100%;padding:16px;border-radius:18px;background:var(--accent);color:#fff;font-size:16px;font-weight:600;box-shadow:0 5px 15px var(--accent-40);display:flex;align-items:center;justify-content:center;gap:8px;transition:transform .15s,box-shadow .15s;-webkit-tap-highlight-color:transparent}.btn-primary:active{transform:scale(.97);box-shadow:0 2px 8px var(--accent-30)}.btn-primary svg{width:16px;height:16px;fill:#fff}.btn-secondary{font-size:16px;font-weight:600;color:var(--accent);padding:14px;border-radius:16px;background:var(--accent-12);width:100%;-webkit-tap-highlight-color:transparent}.modal-icon{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center}.modal-icon svg{width:36px;height:36px}.modal-icon.success{background:var(--accent-14)}.modal-icon.success svg{fill:var(--accent)}.modal-icon.error{background:#dc35451a}.modal-icon.error svg{fill:#dc3545}.modal-body-title{font-family:Playfair Display,serif;font-size:26px;font-weight:500;color:var(--fg);text-align:center}.modal-body-sub{font-size:14px;color:var(--muted);text-align:center;line-height:1.5}.spinner{width:40px;height:40px;border-radius:50%;border:3px solid var(--accent-30);border-top-color:var(--accent);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.history-section{padding:0 16px}.bar-chart{display:flex;align-items:flex-end;gap:8px;height:100px;padding:12px 16px 0}.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px}.bar{width:100%;border-radius:6px 6px 0 0;background:var(--accent-30);min-height:4px;transition:height .6s var(--ease-expo)}.bar.today{background:var(--accent)}.bar-day{font-size:10px;color:var(--muted);font-weight:500}.history-list{display:flex;flex-direction:column}.history-day-header{font-size:11px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:var(--muted);padding:16px 16px 8px}.history-entry{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.history-entry+.history-entry{border-top:.5px solid rgba(0,0,0,.07)}.history-entry:first-of-type{border-radius:20px 20px 0 0;overflow:hidden}.history-entry:last-of-type{border-radius:0 0 20px 20px;overflow:hidden}.history-entry-icon{width:36px;height:36px;border-radius:50%;background:var(--accent-12);display:flex;align-items:center;justify-content:center}.history-entry-icon svg{width:16px;height:16px;fill:var(--accent)}.history-entry-info{flex:1}.history-entry-title{font-size:14px;font-weight:500;color:var(--fg)}.history-entry-sub{font-size:12px;color:var(--muted)}.history-entry-grams{font-family:Playfair Display,serif;font-size:17px;color:var(--fg)}.day-selector{display:flex;gap:6px;padding:8px 16px;overflow-x:auto}.day-selector::-webkit-scrollbar{display:none}.day-btn{display:flex;flex-direction:column;align-items:center;padding:8px 12px;border-radius:14px;min-width:44px;transition:all .2s;-webkit-tap-highlight-color:transparent}.day-btn.active{background:var(--accent);color:#fff}.day-btn .day-short{font-size:12px;font-weight:600;color:inherit}.day-btn .day-num{font-family:Playfair Display,serif;font-size:18px;color:inherit}.day-btn:not(.active) .day-short{color:var(--muted)}.day-btn:not(.active) .day-num{color:var(--fg)}.schedule-meals{padding:0 16px;display:flex;flex-direction:column;gap:10px}.schedule-meal-card{padding:16px;border-radius:20px}.schedule-meal-header{display:flex;align-items:center;gap:12px}.schedule-meal-icon{width:40px;height:40px;border-radius:50%;background:var(--accent-12);display:flex;align-items:center;justify-content:center}.schedule-meal-icon svg{width:18px;height:18px;fill:var(--accent)}.schedule-meal-info{flex:1}.schedule-meal-name{font-size:15px;font-weight:600;color:var(--fg)}.schedule-meal-time{font-size:13px;color:var(--muted)}.schedule-meal-grams{font-family:Playfair Display,serif;font-size:20px;color:var(--fg)}.settings-section{padding:0 16px}.settings-card{border-radius:20px;overflow:hidden}.settings-row{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.settings-row+.settings-row{border-top:.5px solid rgba(0,0,0,.07)}.settings-row-icon{width:36px;height:36px;border-radius:10px;background:var(--accent-12);display:flex;align-items:center;justify-content:center;flex-shrink:0}.settings-row-icon svg{width:18px;height:18px;fill:var(--accent)}.settings-row-info{flex:1}.settings-row-title{font-size:15px;font-weight:500;color:var(--fg)}.settings-row-sub{font-size:12px;color:var(--muted);margin-top:2px}.settings-row-value{font-size:14px;color:var(--muted)}.pad-x{padding-left:16px;padding-right:16px}.mt-4{margin-top:4px}.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-16{margin-top:16px}.mt-20{margin-top:20px}.hidden{display:none!important}