:root{--bg:#fbf7ee;--card:#fff;--fill:#f2ece1;--text:#26313d;--muted:#75808d;--line:#e6dfd2;--accent:#3a7fbf;--accent-text:#fff;--breast:#dca274;--formula:#7fbde8;--nursing:#86ae94;--wet:#5fa8d3;--dirty:#b08a5a;--warn:#9a6a00;--danger:#b3261e;--bar:#fbf7eed1;--shadow:0 1px 2px #26313d0f, 0 4px 16px #26313d0d;--spring:cubic-bezier(.32, .72, 0, 1);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#131b25;--card:#1c2633;--fill:#263241;--text:#f4efe5;--muted:#9aa7b6;--line:#2d3948;--accent:#9fd0f0;--accent-text:#10202e;--breast:#e8c4a0;--formula:#8cc6ee;--nursing:#9cc7a8;--wet:#7cc0e8;--dirty:#c9a272;--warn:#e3b341;--danger:#f2827a;--bar:#131b25d1;--shadow:none}}*{box-sizing:border-box}html{touch-action:manipulation;-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;margin:0;font:16px/1.4 -apple-system,system-ui,sans-serif}#app{flex-direction:column;max-width:560px;min-height:100dvh;margin:0 auto;display:flex}main{padding:4px 16px calc(96px + env(safe-area-inset-bottom));flex-direction:column;flex:1;gap:12px;display:flex}.center{text-align:center;justify-content:center;align-items:center}.login{justify-content:flex-start;padding-top:15vh}.login img{box-shadow:var(--shadow);border-radius:18px}h1,h2,h3{margin:0 0 8px}h3 small{color:var(--muted);font-weight:400}header{z-index:1;background:var(--bar);-webkit-backdrop-filter:saturate(180%)blur(20px);backdrop-filter:saturate(180%)blur(20px);padding:calc(10px + env(safe-area-inset-top)) 16px 10px;flex-direction:column;gap:10px;display:flex;position:sticky;top:0}.titlebar{justify-content:space-between;align-items:center;display:flex}.titlebar h1{letter-spacing:-.02em;margin:0;font-size:32px}.refresh{background:var(--fill);width:40px;min-height:40px;color:var(--muted);box-shadow:none;border-radius:50%;flex:none;place-items:center;padding:0;transition:color .3s;display:grid}.refresh .icon{width:22px;height:22px}.refresh.wait{color:var(--warn)}.refresh.bad{color:var(--danger)}.refresh.spin .icon{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.tabbar{z-index:1;background:var(--bar);border-top:.5px solid var(--line);-webkit-backdrop-filter:saturate(180%)blur(20px);backdrop-filter:saturate(180%)blur(20px);padding:6px 8px calc(6px + env(safe-area-inset-bottom));justify-content:center;display:flex;position:fixed;bottom:0;left:0;right:0}.tabbar button{max-width:120px;color:var(--muted);background:0 0;border:none;flex-direction:column;flex:1;align-items:center;gap:2px;min-height:48px;padding:4px 0;font-size:11px;font-weight:500;display:flex}.tabbar button.on{color:var(--accent);background:0 0}.icon{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:26px;height:26px;transition:transform .25s var(--spring)}.tabbar button.on .icon{transform:scale(1.08)}button,input,select{font:inherit;color:inherit;background:var(--card);border:none;border-radius:14px;min-height:48px;padding:8px 14px}input,select{background:var(--fill);width:100%;font-size:16px}input[type=datetime-local],input[type=date]{appearance:none;box-sizing:border-box;min-width:0;display:block}input::-webkit-date-and-time-value{text-align:center}input:focus,select:focus{outline:2px solid var(--accent);outline-offset:-2px}button{cursor:pointer;box-shadow:var(--shadow);-webkit-user-select:none;user-select:none;transition:transform .15s var(--spring), opacity .15s, background .2s;font-weight:500}button:active:not(:disabled){opacity:.85;transform:scale(.96)}button.primary{background:var(--accent);color:var(--accent-text);font-weight:600}button:disabled{opacity:.4}button.link{box-shadow:none;color:var(--muted);background:0 0;border:none;align-self:center;font-weight:400}button.danger{color:var(--danger)}button small{color:var(--accent);text-transform:uppercase;letter-spacing:.04em;font-size:11px;font-weight:600;display:block}button.suggest{outline:2px solid var(--accent);outline-offset:-2px}label,.field,.stepper{color:var(--muted);flex-direction:column;flex:1;gap:6px;min-width:0;font-size:14px;display:flex}form{flex-direction:column;gap:14px;width:100%;display:flex}.seg{grid-template-columns:repeat(var(--n), 1fr);background:var(--fill);border-radius:12px;padding:3px;display:grid;position:relative}.seg:before{content:"";width:calc((100% - 6px) / var(--n));background:var(--card);transform:translateX(calc(var(--i) * 100%));transition:transform .3s var(--spring);border-radius:10px;position:absolute;top:3px;bottom:3px;left:3px;box-shadow:0 1px 4px #0000001f}.seg button{box-shadow:none;min-height:36px;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;background:0 0;border-radius:10px;padding:4px 8px;font-size:14px;position:relative;overflow:hidden}.seg button.on{color:var(--text);font-weight:600}.seg button:active:not(:disabled){transform:none}.stepper>div{background:var(--fill);border-radius:14px;align-items:center;display:flex}.stepper input{text-align:center;-moz-appearance:textfield;background:0 0;padding:8px 0;font-weight:600}.stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.stepper button{width:44px;box-shadow:none;color:var(--accent);background:0 0;flex:none;padding:0;font-size:22px}.row{gap:10px;display:flex}.row>*{flex:1}.card{background:var(--card);box-shadow:var(--shadow);border-radius:20px;flex-direction:column;gap:10px;padding:16px;display:flex}.card small{color:var(--muted)}.hero{flex-direction:row;align-items:center;gap:14px;padding:14px 16px}.ring{flex:none;width:64px;height:64px;position:relative}.ring svg{width:100%;height:100%;transform:rotate(-90deg)}.ring circle{fill:none;stroke-width:10px}.ring .track{stroke:var(--fill)}.ring .fill{stroke:var(--accent);stroke-linecap:round;transition:stroke-dasharray .6s var(--spring), stroke .3s}.hero.late .ring .fill{stroke:var(--warn)}.since{flex-direction:column;min-width:0;display:flex}.since strong{letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-size:28px;font-weight:700;line-height:1.15}.since .next{color:var(--text);font-weight:500}.hero.late .since .next{color:var(--warn)}.total{flex-wrap:wrap;align-items:baseline;gap:8px;margin:0;display:flex}.total small{color:var(--muted);align-self:center}.total strong{letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-size:26px}.total span{color:var(--muted);font-size:15px}.stats{grid-template-columns:repeat(3,1fr);gap:14px 8px;display:grid}.stats div{flex-direction:column;display:flex}.stats strong{font-variant-numeric:tabular-nums;font-size:20px}.today .stats strong{font-size:18px}.today .stats small i{vertical-align:1px;border-radius:50%;width:8px;height:8px;margin-right:5px;display:inline-block}.today .stats small i.nursing{background:var(--nursing)}.actions{flex-direction:column;gap:10px;display:flex}button small.sub{text-transform:none;letter-spacing:0;color:var(--muted);font-size:13px;font-weight:400}.diapers .dayhead .tags{flex:none}.session{animation:rise .35s var(--spring)}.session .stats{text-align:center;grid-template-columns:1fr 1fr}.session .stats strong{font-size:28px;font-weight:600;transition:color .3s}.session .stats small:before{content:"";background:var(--line);vertical-align:1px;border-radius:50%;width:8px;height:8px;margin-right:6px;display:inline-block}.running strong{color:var(--accent)}.running small:before{animation:1.4s ease-in-out infinite pulse;background:var(--accent)!important}.install{border:1.5px dashed var(--line);box-shadow:none}.warn{color:var(--warn);margin:0}.next{margin-top:6px;font-weight:500;color:var(--text)!important}.next.late{color:var(--warn)!important}.hint{color:var(--muted);margin-top:-6px}.dayhead{justify-content:space-between;align-items:center;gap:8px;display:flex}.pct{background:var(--fill);color:var(--muted);font-variant-numeric:tabular-nums;border-radius:999px;flex:none;align-self:center;margin-left:auto;padding:2px 8px;font-size:13px;font-weight:600}.pct.met{background:color-mix(in srgb, var(--nursing) 22%, transparent);color:var(--nursing)}.progress{background:var(--fill);border-radius:4px;height:8px;overflow:hidden}.progress i{background:linear-gradient(90deg, var(--breast), var(--formula));height:100%;transition:width .6s var(--spring);border-radius:4px;display:block}.error{color:var(--danger);margin:0}.muted{color:var(--muted);margin:0}.callout{color:var(--text);background:color-mix(in srgb, var(--formula) 18%, transparent);border-radius:16px;margin:0;padding:12px 14px;font-size:14px}.info{gap:0}.info summary{cursor:pointer;align-items:center;gap:12px;min-height:40px;list-style:none;display:flex}.info summary::-webkit-details-marker{display:none}.info summary h3{flex:1;margin:0}.info .chip{width:36px;height:36px;color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, transparent);border-radius:11px;flex:none;place-items:center;display:grid}.info .chip .icon{width:22px;height:22px}.info.alert .chip{color:var(--danger);background:color-mix(in srgb, var(--danger) 12%, transparent)}.chev{fill:none;width:18px;height:18px;stroke:var(--muted);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s var(--spring)}.info[open] .chev{transform:rotate(90deg)}.info[open] summary{margin-bottom:12px}.info[open]>:not(summary){animation:view-in .28s var(--spring)}.ages{background:var(--fill);border-radius:14px;flex-direction:column;margin-bottom:12px;display:flex;overflow:hidden}.age{justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;display:flex}.age+.age{border-top:.5px solid var(--line)}.age div{flex-direction:column;display:flex}.age small{color:var(--muted);font-size:13px}.age .amount{white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--accent);font-weight:600}.info ul{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.info li{padding:10px 0 10px 18px;font-size:15px;line-height:1.45;position:relative}.info li+li{border-top:.5px solid var(--line)}.info li:before{content:"";background:var(--accent);border-radius:50%;width:6px;height:6px;position:absolute;top:18px;left:2px}.info.alert li:before{background:var(--danger)}.code{letter-spacing:.06em;text-align:center;-webkit-user-select:all;user-select:all;margin:4px 0 8px;font:600 26px ui-monospace,SFMono-Regular,monospace}.day{flex-direction:column;gap:6px;display:flex}h3.dayhead{color:var(--muted);margin:6px 4px 0;font-size:15px;font-weight:600}.daysum{flex-wrap:wrap;align-items:baseline;gap:10px;display:flex}.daysum strong{letter-spacing:-.01em;font-variant-numeric:tabular-nums;font-size:24px}.daysum .muted{font-size:14px}.day .split{height:6px;margin:0}.list{margin:0 -16px -6px;padding:0;list-style:none}.list button{text-align:left;width:100%;box-shadow:none;border-top:.5px solid var(--line);background:0 0;border-radius:0;align-items:center;gap:12px;padding:10px 12px 10px 16px;font-weight:400;display:flex}.list button:active:not(:disabled){background:var(--fill);opacity:1;transform:none}.list .when{font-variant-numeric:tabular-nums;flex-direction:column;flex:none;min-width:52px;display:flex}.list .when b{font-weight:600}.list small{text-transform:none;letter-spacing:0;color:var(--muted);font-weight:400;display:inline}.tags{flex-wrap:wrap;flex:1;gap:6px;display:flex}.tag{white-space:nowrap;font-variant-numeric:tabular-nums;border-radius:999px;padding:3px 9px;font-size:14px;font-weight:600}.tag small{font-size:13px}.tag.breast{background:color-mix(in srgb, var(--breast) 22%, transparent)}.tag.formula{background:color-mix(in srgb, var(--formula) 24%, transparent)}.tag.nursing{background:color-mix(in srgb, var(--nursing) 22%, transparent)}.wet{fill:var(--wet);background:var(--wet)}.dirty{fill:var(--dirty);background:var(--dirty)}.tag.diaper.wet{background:color-mix(in srgb, var(--wet) 22%, transparent)}.tag.diaper.dirty{background:color-mix(in srgb, var(--dirty) 24%, transparent)}.tag.diaper.both{background:linear-gradient(90deg, color-mix(in srgb, var(--wet) 22%, transparent), color-mix(in srgb, var(--dirty) 24%, transparent))}.diapers .row button{background:var(--fill)}.diapers .link{align-self:flex-start;min-height:32px;padding:0;font-size:14px}.list .chev{flex:none;margin-left:-4px}.sheet{z-index:2;background:#00000059;justify-content:center;align-items:flex-end;transition:background .22s;animation:.25s ease-out fade;display:flex;position:fixed;inset:0}.sheet.closing{background:0 0}.panel{background:var(--bg);width:100%;max-width:560px;padding:0 16px calc(20px + env(safe-area-inset-bottom));overscroll-behavior:contain;max-height:92dvh;animation:slide-up .38s var(--spring);border-radius:22px 22px 0 0;transition:transform .22s ease-in;overflow:auto}.sheet.closing .panel{transform:translateY(100%)}.grab{touch-action:none;cursor:grab;justify-content:center;padding:8px 0 14px;display:flex}.grab span{background:var(--line);border-radius:3px;width:40px;height:5px}.actions{text-align:center;flex-direction:column;gap:10px;display:flex}.actions p{color:var(--muted);margin:0 0 6px}.actions .destructive{color:var(--danger);font-weight:600}.view{animation:view-in .28s var(--spring)}.view.from-right{animation-name:from-right;animation-duration:.32s}.view.from-left{animation-name:from-left;animation-duration:.32s}h1.from-right{animation:title-from-right .32s var(--spring)}h1.from-left{animation:title-from-left .32s var(--spring)}html,body{overflow-x:clip}svg{width:100%;height:auto}svg .axis{fill:var(--muted);font-size:10px}svg rect{transform-origin:bottom;transform-box:fill-box;animation:grow .5s var(--spring) backwards}.breast{fill:var(--breast);background:var(--breast)}.formula{fill:var(--formula);background:var(--formula)}polyline.nursing{fill:none;stroke:var(--nursing);stroke-width:2px}.daynav{justify-content:space-between;align-items:center;display:flex}.daynav button{background:var(--fill);width:44px;box-shadow:none;padding:0;font-size:24px}svg .grid{stroke:var(--line);stroke-width:.5px}svg .target{stroke:var(--accent);stroke-width:1px;stroke-dasharray:4 3}.nursing-strip{fill:var(--nursing)}.legend i.target{border-top:2px dashed var(--accent);background:0 0;border-radius:0;height:0}p.dayhead{color:var(--muted);margin:0;font-size:14px}svg .hit{fill:#0000}.gap{fill:var(--formula);background:var(--formula);opacity:.55}.plan,.avg{fill:var(--accent);background:var(--accent);opacity:.8}.night{fill:var(--text);background:var(--text);opacity:.55}.daytime{fill:var(--breast);background:var(--breast)}svg .nightbg{fill:var(--text);opacity:.05}polyline.gapmax,polyline.count,polyline.shareline,polyline.weight,polyline.length{fill:none;stroke-width:2px}.gapmax{stroke:var(--formula);fill:var(--formula)}.count{stroke:var(--text);fill:var(--text)}.shareline{stroke:var(--breast);fill:var(--breast)}.weight{stroke:var(--accent);fill:var(--accent)}.length{stroke:var(--nursing);fill:var(--nursing)}circle.nursing,circle.dot.nursing{fill:var(--nursing)}.legend i.gapmax,.legend i.count,.legend i.shareline,.legend i.weight,.legend i.length{background:currentColor;height:3px}.legend i.gapmax{color:var(--formula)}.legend i.count{color:var(--text)}.legend i.weight{color:var(--accent)}.legend i.length{color:var(--nursing)}.legend i.dot,.legend i.nursing.dot{border-radius:50%;height:10px}.legend i.night{opacity:.55}.legend i.nightbg{background:var(--text);opacity:.12}.chartnote{margin-top:6px;font-size:14px}.split{border-radius:7px;gap:2px;height:14px;margin:4px 0 8px;display:flex;overflow:hidden}.left{background:var(--breast)}.right{background:var(--formula)}.measures{margin:8px 0;padding:0;list-style:none}.measures li{border-top:.5px solid var(--line);align-items:center;gap:12px;display:flex}.measures li span:first-child{color:var(--muted);min-width:64px}.measures li span:nth-child(2){flex:1}.measures .link{min-height:40px;font-size:20px}.measure-form{flex-direction:column;gap:10px;display:flex}.legend{color:var(--muted);flex-wrap:wrap;align-items:center;gap:6px 14px;margin:0;font-size:13px;display:flex}.legend i{border-radius:3px;width:10px;height:10px;margin-right:4px;display:inline-block}.legend i.nursing{background:var(--nursing);height:3px}@keyframes fade{0%{background:0 0}}@keyframes slide-up{0%{transform:translateY(100%)}}@keyframes view-in{0%{opacity:0;transform:translateY(8px)}}@keyframes from-right{0%{transform:translate(100%)}}@keyframes title-from-right{0%{opacity:0;transform:translate(50%)}}@keyframes title-from-left{0%{opacity:0;transform:translate(-50%)}}@keyframes from-left{0%{transform:translate(-100%)}}@keyframes rise{0%{opacity:0;transform:scale(.97)}}@keyframes grow{0%{transform:scaleY(0)}}@keyframes pulse{50%{opacity:.35}}@media (prefers-reduced-motion:reduce){*,:before{transition:none!important;animation:none!important}}
