:root{color:#173c32;--ink:#173c32;--muted:#617a73;--green:#85cf16;--blue:#20548b;--water:#44a9b9;--surface:#fff;--line:#d9e9e4;background:#f7fbf9;font-family:Inter,system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 50% -10%,#e7f4e6,#0000 37%),#f7fbf9;min-width:320px;margin:0}button,input{font:inherit}button{cursor:pointer}main{color:#14375f;max-width:590px;min-height:100svh;margin:auto;padding:22px 19px 110px}.hero-head{justify-content:space-between;align-items:center;display:flex}.hero-head img{object-fit:contain;width:82px;height:62px}.hello{letter-spacing:-.04em;margin:0;font-size:1.45rem;font-weight:800}.date{color:#6d8098;text-transform:capitalize;margin:4px 0 0;font-size:.88rem}.toast{z-index:10;color:#fff;background:#14375f;border-radius:14px;padding:11px 17px;position:fixed;top:18px;left:50%;transform:translate(-50%);box-shadow:0 8px 25px #14375f44}.home{padding-top:8px}.hydration{text-align:center}.outer{--progress:0deg;background:conic-gradient(#82ce1c var(--progress),#e8eef5 0);border-radius:50%;place-items:center;width:min(74vw,282px);height:min(74vw,282px);margin:9px auto 12px;padding:8px;display:grid;box-shadow:0 12px 28px #14375f12}.orb{background:#fff;border-radius:50%;place-items:center;width:100%;height:100%;display:grid;position:relative;overflow:hidden}.percent{color:#14375f;letter-spacing:-.08em;font-size:1.85rem;font-weight:900;position:absolute;top:22px;left:0;right:0}.percent small{letter-spacing:0;font-size:.9rem}.bottle{filter:drop-shadow(0 6px 8px #14375f22);width:78px;height:142px;position:absolute;bottom:19px}.cap{background:#20548b;border-radius:7px 7px 2px 2px;width:39px;height:14px;margin:auto}.body{background:#eef8ff;border:4px solid #20548b;border-radius:19px 19px 24px 24px;height:126px;position:relative;overflow:hidden}.water{background:linear-gradient(#61c9d8,#38a7c6);transition:height .35s;position:absolute;bottom:0;left:0;right:0}.water:before{content:"";background:#9ce4ed;border-radius:50%;width:140%;height:14px;position:absolute;top:-7px;left:-16%}.water i{border:1px solid #d9f7fb;border-radius:50%;width:5px;height:5px;animation:3s infinite bubble;position:absolute;bottom:24px;left:24px}.water i+i{animation-delay:1s;bottom:42px;left:49px}@keyframes bubble{50%{opacity:.5;transform:translateY(-16px)}}.readout{gap:3px;display:grid}.readout b{font-size:1.1rem}.readout span,.muted{color:#6d8098;font-size:.85rem}.readout strong{color:#d72589;margin-top:3px;font-size:.85rem}.quick-zone{margin-top:22px}.quick-zone h2,.records h2,h2,h3{margin:0;font-size:1.08rem}.quick-grid{grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px;display:grid}.quick-grid button{color:#173b64;background:#f1f8ea;border:0;border-radius:17px;min-height:74px;padding:7px 4px;font-size:.77rem;font-weight:800}.quick-grid span{margin-bottom:4px;font-size:1.28rem;display:block}.custom{margin-top:12px}.custom label,label{margin-bottom:6px;font-size:.82rem;font-weight:800;display:block}.custom>div{gap:8px;display:flex}input{color:#14375f;background:#fff;border:1px solid #d7e2ee;border-radius:12px;width:100%;min-width:0;min-height:47px;padding:11px}button{font:inherit;cursor:pointer}button:focus-visible,input:focus-visible{outline-offset:2px;outline:3px solid #e73a9c}.custom button,.modal button{color:#fff;background:#20548b;border:0;border-radius:12px;min-width:90px;font-weight:800}.tip,.storage,.records,article{border-radius:19px;margin-top:16px;padding:16px}.tip{background:#fff5fb;border:1px solid #ffd6ea;gap:12px;display:flex}.tip>span{font-size:1.45rem}.tip p,.storage p,.tip-card p{color:#6d8098;margin:5px 0 0;font-size:.86rem;line-height:1.45}.storage{background:#f5f8fb;border:1px solid #e0e8f0}.outline{border-radius:11px;margin-top:10px;padding:10px 13px;font-weight:800;color:#20548b!important;background:#fff!important;border:1px solid #20548b!important}.records,article{background:#fff;border:1px solid #e1e8f0}.records ul{margin:10px 0 0;padding:0;list-style:none}.records li{border-top:1px solid #edf1f5;align-items:center;gap:8px;padding:10px 0;display:flex}.records li>div{flex:1;display:grid}.records small{color:#6d8098}.records li button{color:#20548b;background:0 0;border:0;padding:8px 3px;font-size:.78rem;font-weight:800}.records .danger{color:#c04066}.empty{color:#6d8098;font-size:.9rem}.page{padding-top:26px}.history{margin-top:18px}.history>div{border-bottom:1px solid #e6edf3;grid-template-columns:58px 1fr auto;align-items:center;gap:10px;padding:12px 0;font-size:.84rem;display:grid}.history i{background:#edf2f5;border-radius:10px;height:8px;overflow:hidden}.history em{border-radius:inherit;background:#82ce1c;height:100%;display:block}.tip-card{box-shadow:0 5px 17px #14375f0a}.actions{flex-wrap:wrap;gap:8px;display:flex}.actions .outline{margin:0}nav{z-index:5;width:100%;max-width:590px;padding:8px 9px max(8px,env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffff5;border-top:1px solid #e4ebf1;grid-template-columns:repeat(5,1fr);align-items:end;display:grid;position:fixed;bottom:0;left:50%;transform:translate(-50%)}nav button{color:#8292a5;background:0 0;border:0;place-items:center;gap:1px;min-height:55px;font-size:1.28rem;display:grid}nav small{font-size:.62rem}nav .active{color:#20548b;font-weight:900}.add-nav{border-radius:50%;justify-self:center;width:58px;height:58px;font-size:1.8rem;transform:translateY(-19px);box-shadow:0 7px 16px #82ce1c66;color:#14375f!important;background:#82ce1c!important;min-height:58px!important}.add-nav small{margin-top:-6px;font-size:.59rem}.modal{z-index:20;background:#14375f55;place-items:end center;padding:16px;display:grid;position:fixed;inset:0}.modal article{width:min(100%,460px);box-shadow:0 18px 42px #14375f33}.modal h2{margin-bottom:18px}.modal .actions{justify-content:flex-end;margin-top:14px}@media (width<=350px){.quick-grid{grid-template-columns:repeat(2,1fr)}.quick-grid button{min-height:61px}}@media (width>=600px){main{padding-top:34px}.outer{width:292px;height:292px}nav{border:1px solid #e4ebf1;border-bottom:0;border-radius:18px 18px 0 0}}.quick-grid .water-glass{border:2px solid #20548b;border-top:0;border-radius:2px 2px 6px 6px;width:19px;height:24px;margin:0 auto 4px;font-size:0;position:relative;overflow:hidden}.water-glass:before{content:"";background:#49bbcf;border-radius:50% 50% 3px 3px;height:43%;position:absolute;bottom:0;left:-2px;right:-2px}.water-glass i{z-index:1;background:#c4f1f6;border-radius:50%;height:3px;position:absolute;bottom:7px;left:2px;right:2px}.institutional{color:#fff;text-align:center;background:#0b3f73;border-radius:30px 30px 0 0;margin:30px -19px -110px;padding:48px 23px 125px;position:relative;overflow:hidden}.lime-wave{background:#83d021;border-radius:0 0 50% 50%;width:116%;height:49px;position:absolute;top:-20px;left:-8%}.institutional>img{object-fit:contain;background:#fff;border-radius:14px;width:128px;max-height:92px;margin-bottom:8px;padding:6px;position:relative}.institutional h2{font-size:1.13rem}.institutional .tagline{color:#fff;max-width:270px;margin:8px auto 20px;font-size:.91rem;line-height:1.45}.contact,.hours{text-align:left;gap:8px;margin:14px 0;display:grid}.contact a{color:#fff;background:#ffffff12;border-radius:11px;align-items:center;min-height:44px;padding:8px 11px;font-size:.86rem;text-decoration:none;display:flex}.hours{color:#fff;border-top:1px solid #ffffff36;border-bottom:1px solid #ffffff36;padding:13px;font-size:.85rem}.hours b{color:#ec2a7b}.social-links{gap:9px;margin-top:18px;display:grid}.social-links a{color:#fff;border:1px solid #ffffff5c;border-radius:12px;justify-content:center;align-items:center;min-height:45px;font-size:.86rem;font-weight:800;text-decoration:none;display:flex}.social-links .whatsapp{color:#0b3f73;background:#83d021;border-color:#83d021}.institutional-end{color:#fff;margin:25px 0 0;font-size:.82rem;font-weight:800}.pwa-actions{flex-wrap:wrap;align-items:center;gap:9px;margin:14px 0;display:flex}.pwa-actions .outline{margin:0}.pwa-actions span{color:#20548b;font-size:.82rem;font-weight:700}.pwa-card,.reminders{background:#fff;border:1px solid #e1e8f0;border-radius:19px;margin-top:16px;padding:16px}.pwa-card p,.reminders p{color:#6d8098;font-size:.86rem;line-height:1.45}.reminders>button{color:#fff;background:#20548b;border:0;border-radius:11px;min-height:44px;margin:3px 6px 8px 0;padding:10px 13px;font-weight:800}.reminders label{margin-top:11px}.reminders select{color:#14375f;background:#fff;border:1px solid #d7e2ee;border-radius:11px;width:100%;min-height:44px;padding:9px}.time-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.reminders .compat{border-top:1px solid #e7edf2;padding-top:12px}.reminders .outline{background:#fff}.reminders button:disabled{opacity:.55;cursor:not-allowed}