@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800;900&display=swap');
:root{--ink:#31433e;--muted:#82938b;--mint:#bfe9d5;--mint-deep:#65b895;--mint-wash:#e9f7ef;--cream:#fffdf8;--coral:#ff9da6;--lavender:#ece7fb;--yellow:#ffdc87;--line:#edf1ed;--shadow:0 14px 38px rgba(68,113,91,.10)}
*{box-sizing:border-box}html{background:#eff4f0;scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:'Nunito',ui-rounded,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:radial-gradient(circle at 10% 0%,#e9f8f0 0,#f7f9f5 34%,#f1f5f1 100%);min-height:100vh}.app-shell{width:min(100%,480px);min-height:100vh;margin:0 auto;background:#fbfcfa;position:relative;overflow:hidden;box-shadow:0 0 60px rgba(53,88,70,.08);padding-bottom:100px}.topbar{height:78px;padding:16px 23px 10px;display:flex;align-items:center;justify-content:space-between}.brand-lockup{display:flex;align-items:center;gap:10px}.brand-mark{width:44px;height:44px;border-radius:16px;background:#dff4e8;overflow:hidden;display:grid;place-items:center}.brand-mark img{width:55px;height:55px;object-fit:contain;transform:translateY(4px)}.brand-name{font-size:18px;line-height:1;font-weight:900;letter-spacing:-.65px;color:#527c68}.brand-name span{color:#f19aa2;margin-left:1px}.brand-caption{font-size:9px;letter-spacing:1.15px;color:#9aaa9f;font-weight:800;text-transform:uppercase;margin-top:4px}.icon-button{border:0;background:#fff;width:42px;height:42px;border-radius:15px;box-shadow:0 5px 15px rgba(74,111,91,.08);display:grid;place-items:center;color:#82b59a;cursor:pointer}.profile-dot{width:26px;height:26px;border-radius:9px;background:#fce9e7;display:grid;place-items:center;color:#ec9ca2;font-size:19px}
main{padding:10px 22px 26px}.screen{display:none;animation:fadeUp .32s ease}.screen.active{display:block}@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.greeting-row{display:flex;align-items:center;justify-content:space-between;min-height:112px;padding:8px 0 10px}.eyebrow{font-size:9px;letter-spacing:1.35px;font-weight:900;color:#9db1a5}.greeting-row h1,.page-heading h1{font-size:27px;letter-spacing:-.9px;margin:5px 0 2px;font-weight:900;color:#354740;line-height:1.12}.wave{color:#f0c16a;font-size:20px;display:inline-block;transform:rotate(12deg)}.subheading{font-size:12px;color:#8d9b93;margin:4px 0 0;font-weight:600}.mascot-peek{width:98px;height:104px;border-radius:35px 35px 27px 27px;background:linear-gradient(140deg,#ecf8f1,#f9f3e7);display:grid;place-items:center;position:relative;overflow:hidden;transform:rotate(3deg);flex-shrink:0}.mascot-peek:after{content:'✦';position:absolute;right:11px;top:9px;color:#f2c66c;font-size:15px}.mascot-peek img{width:112px;height:112px;object-fit:contain;transform:translateY(6px)}
.date-strip{display:flex;gap:8px;overflow-x:auto;padding:10px 1px 15px;scrollbar-width:none}.date-strip::-webkit-scrollbar{display:none}.date-chip{border:1px solid #edf2ed;background:#fff;border-radius:19px;min-width:47px;height:67px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;color:#95a49b;cursor:pointer;box-shadow:0 3px 10px rgba(65,97,79,.03);font:inherit}.date-chip .day-name{font-size:9px;font-weight:800;text-transform:uppercase}.date-chip .day-number{font-size:17px;font-weight:900;color:#52655a}.date-chip.today .day-number{color:#fff}.date-chip.selected{background:#80c6a2;border-color:#80c6a2;box-shadow:0 7px 15px rgba(101,184,149,.25)}.date-chip.selected .day-name,.date-chip.selected .day-number{color:#fff}.date-chip.today:not(.selected){border-color:#9fd6b7;background:#f0fbf4}
.progress-card{position:relative;overflow:hidden;min-height:134px;border-radius:25px;padding:19px 20px;background:linear-gradient(115deg,#79c5a0 0%,#a7d9bb 100%);display:flex;align-items:center;justify-content:space-between;color:#fff;box-shadow:0 12px 24px rgba(113,190,148,.2)}.progress-card:before{content:'';position:absolute;width:200px;height:200px;border-radius:50%;border:1px solid rgba(255,255,255,.23);right:-50px;top:-88px}.progress-card:after{content:'';position:absolute;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,.08);right:81px;bottom:-110px}.eyebrow.light{color:rgba(255,255,255,.8)}.progress-number{font-size:12px;margin-top:8px;font-weight:700}.progress-number strong{font-size:29px;line-height:1;margin-right:3px}.progress-number span{color:rgba(255,255,255,.95)}.progress-number b{font-weight:900}.progress-note{font-size:10px;color:rgba(255,255,255,.84);margin-top:6px}.progress-ring{--progress:0deg;width:82px;height:82px;flex-shrink:0;border-radius:50%;background:conic-gradient(#fff var(--progress),rgba(255,255,255,.28) 0);display:grid;place-items:center;position:relative;z-index:1}.progress-ring:before{content:'';position:absolute;inset:6px;background:#8fcda9;border-radius:50%}.ring-inner{position:relative;display:flex;flex-direction:column;align-items:center;line-height:1.1}.ring-inner strong{font-size:18px;font-weight:900}.ring-inner span{font-size:8px;color:rgba(255,255,255,.9);font-weight:700}.progress-spark{position:absolute;color:rgba(255,255,255,.65);font-size:17px}.spark-one{top:14px;right:116px}.spark-two{bottom:16px;left:49%}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between}.next-heading{margin:25px 1px 11px}.section-kicker{display:block;font-size:8px;color:#a6b4ac;font-weight:900;letter-spacing:1.5px;margin-bottom:2px}.section-heading h2{margin:0;font-size:18px;font-weight:900;letter-spacing:-.45px;color:#3d5147}.soft-pill{background:#fff4dc;color:#d6a74b;border-radius:20px;padding:6px 10px;font-size:9px;font-weight:900;white-space:nowrap}.next-card{position:relative;border-radius:23px;background:#fff;padding:15px 16px 15px 14px;display:flex;align-items:center;gap:13px;box-shadow:var(--shadow);border:1px solid #f0f5f0;overflow:hidden}.next-card:after{content:'✦';position:absolute;right:12px;top:9px;color:#f2c96f;font-size:14px;opacity:.8}.med-thumb{width:58px;height:58px;border-radius:19px;background:#edf8f1;display:grid;place-items:center;overflow:hidden;flex-shrink:0}.med-thumb img{width:100%;height:100%;object-fit:cover}.med-thumb .med-emoji{font-size:26px}.next-card-main{flex:1;min-width:0}.next-time{font-size:10px;font-weight:900;color:#6fb893;letter-spacing:.3px}.next-name{font-size:15px;font-weight:900;margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.next-meta{font-size:10px;color:#93a199;margin-top:3px}.take-button{border:0;border-radius:14px;padding:10px 12px;background:#79c69f;color:white;font:inherit;font-size:10px;font-weight:900;cursor:pointer;white-space:nowrap;box-shadow:0 5px 12px rgba(113,190,148,.2);position:relative;z-index:1}.take-button:active,.save-button:active,.add-medication-button:active{transform:scale(.98)}.take-button.done{background:#eef8f1;color:#68ad88;box-shadow:none}.empty-next{background:#fff;border:1px dashed #cfe5d7;border-radius:21px;padding:18px;display:flex;align-items:center;gap:12px;color:#789887;font-size:12px}.empty-next .empty-icon{font-size:25px}.empty-next strong{display:block;color:#577866;font-size:13px}.schedule-heading{margin:24px 1px 10px;align-items:center}.text-button{border:0;background:transparent;color:#80ba98;font:inherit;font-size:10px;font-weight:900;cursor:pointer;padding:4px}.text-button span{font-size:15px;margin-left:4px}.timeline{display:flex;flex-direction:column;gap:9px}.dose-row{display:flex;align-items:center;gap:10px;background:white;padding:10px 12px;border-radius:18px;border:1px solid #f0f4f0;box-shadow:0 4px 12px rgba(69,102,82,.035)}.dose-time{width:42px;flex-shrink:0;font-size:11px;font-weight:900;color:#78998a;text-align:center}.dose-line{height:29px;width:1px;background:#e8f0e9}.dose-info{flex:1;min-width:0}.dose-info strong{display:block;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dose-info small{display:block;color:#99a69f;font-size:9px;margin-top:2px}.dose-status{font-size:9px;font-weight:900;border-radius:12px;padding:6px 8px;background:#fff5df;color:#d6aa5e;white-space:nowrap}.dose-status.taken{background:#e9f7ee;color:#67b18c}.dose-status.missed{background:#fff0f0;color:#e18d95}.dose-check{width:28px;height:28px;border-radius:10px;border:1.5px solid #d6e9dd;background:#f8fcf9;display:grid;place-items:center;color:#fff;font-weight:900;cursor:pointer;flex-shrink:0}.dose-check.checked{background:#76c39b;border-color:#76c39b}.empty-state{background:#fff;border:1px dashed #d9e9de;border-radius:20px;padding:25px 18px;text-align:center;color:#9aa99f;font-size:11px}.empty-state .empty-emoji{font-size:30px;margin-bottom:8px}.empty-state strong{display:block;color:#698674;font-size:13px;margin-bottom:3px}.gentle-note{margin-top:17px;padding:12px 13px;border-radius:18px;background:#f0f7f2;display:flex;gap:10px;align-items:center;position:relative}.note-icon{width:32px;height:32px;border-radius:11px;background:#fff;display:grid;place-items:center;color:#89c5a2;font-size:19px;flex-shrink:0}.gentle-note strong{font-size:10px;color:#63836f}.gentle-note p{font-size:9px;line-height:1.45;margin:1px 15px 0 0;color:#91a197}.note-star{position:absolute;right:11px;top:10px;color:#ecc66e}
.page-heading{padding:13px 0 17px}.page-heading h1{font-size:27px}.medicine-summary{background:linear-gradient(115deg,#f5e9fa,#f9eff1);border-radius:21px;padding:16px 18px;display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.medicine-summary strong{font-size:23px;color:#846e9d}.medicine-summary small{display:block;font-size:10px;color:#a392ae;font-weight:700}.medicine-summary .summary-bubble{width:52px;height:52px;border-radius:18px;background:#fff;display:grid;place-items:center;font-size:25px}.filter-row{display:flex;gap:7px;overflow:auto;padding:1px 0 13px;scrollbar-width:none}.filter-chip{border:1px solid #edf1ee;border-radius:18px;background:#fff;color:#92a198;padding:7px 11px;white-space:nowrap;font:inherit;font-size:9px;font-weight:900;cursor:pointer}.filter-chip.active{background:#7fc6a0;border-color:#7fc6a0;color:white}.medicine-list{display:flex;flex-direction:column;gap:9px}.medicine-card{display:flex;align-items:center;gap:11px;border:1px solid #eff3ef;background:#fff;border-radius:19px;padding:11px 12px;box-shadow:0 4px 12px rgba(69,102,82,.035)}.medicine-card .med-thumb{width:53px;height:53px;border-radius:16px}.medicine-details{flex:1;min-width:0}.medicine-details strong{display:block;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.medicine-details small{display:block;color:#9aa69f;font-size:9px;margin-top:3px}.category-tag{display:inline-block;background:#f0f7f2;color:#78a88b;border-radius:10px;padding:3px 7px;font-size:8px;font-weight:900;margin-top:5px}.card-actions{display:flex;flex-direction:column;gap:5px}.tiny-icon-btn{width:27px;height:27px;border-radius:9px;background:#f6faf7;border:0;color:#82b598;cursor:pointer;font-size:13px}.tiny-icon-btn.delete{color:#e2a0a3}.add-medication-button{width:100%;border:1.5px dashed #b8dcc6;border-radius:19px;background:#f7fcf8;margin-top:13px;padding:13px;display:flex;align-items:center;text-align:left;gap:11px;color:#6fa989;cursor:pointer;font:inherit}.plus-icon{width:34px;height:34px;border-radius:12px;background:#e2f4e9;display:grid;place-items:center;font-size:22px;font-weight:700}.add-medication-button strong{display:block;font-size:11px;font-weight:900}.add-medication-button small{display:block;color:#9aafa1;font-size:9px;margin-top:1px}.button-arrow{margin-left:auto;font-size:19px;color:#9bc9ad}
.month-card{background:white;border:1px solid #eff3ef;border-radius:23px;padding:16px 14px 13px;box-shadow:var(--shadow)}.month-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}.month-top strong{font-size:14px;font-weight:900}.month-arrow{border:0;width:28px;height:28px;background:#f1f8f3;border-radius:10px;color:#70ad8a;font-size:22px;line-height:1;cursor:pointer}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.calendar-weekday{text-align:center;font-size:8px;color:#a8b4ac;font-weight:900;padding:4px 0}.calendar-day{border:0;background:transparent;height:39px;border-radius:12px;font:inherit;color:#63746a;font-size:11px;font-weight:800;position:relative;cursor:pointer}.calendar-day.muted{color:#d2d9d4}.calendar-day.selected{background:#80c6a0;color:#fff}.calendar-day.today:not(.selected){background:#edf8f1;color:#6bb28b}.calendar-day.has-doses:after{content:'';width:4px;height:4px;background:#f1c96f;border-radius:50%;position:absolute;bottom:3px;left:calc(50% - 2px)}.calendar-day.selected.has-doses:after{background:#fff}.calendar-legend{display:flex;gap:17px;margin-top:13px;padding-top:11px;border-top:1px solid #f1f4f1}.calendar-legend span{display:flex;align-items:center;gap:5px;font-size:9px;color:#94a39a;font-weight:700}.legend-dot{width:6px;height:6px;border-radius:50%;display:inline-block}.legend-dot.taken{background:#7fc69f}.legend-dot.pending{background:#f0c76b}.calendar-detail-heading{margin:22px 1px 11px}.settings-card{background:#fff;border:1px solid #eef3ef;border-radius:23px;padding:15px;box-shadow:var(--shadow)}.setting-hero{display:flex;align-items:center;gap:12px;background:#f0f8f2;border-radius:17px;padding:10px 12px;margin-bottom:9px}.setting-hero img{width:54px;height:54px;object-fit:contain}.setting-hero strong{font-size:13px}.setting-hero p{margin:2px 0 0;color:#93a49a;font-size:9px}.setting-row{display:flex;align-items:center;gap:10px;padding:13px 3px;border-bottom:1px solid #f1f4f1}.setting-row:last-child{border-bottom:0}.setting-icon{width:33px;height:33px;border-radius:12px;display:grid;place-items:center;font-size:18px;flex-shrink:0}.setting-icon.mint{background:#e8f7ed;color:#76b790}.setting-icon.lilac{background:#f0edfb;color:#9b8dc7}.setting-icon.peach{background:#fff0e8;color:#df9b78}.setting-icon.yellow{background:#fff7df;color:#d6b15f}.setting-text{flex:1;min-width:0}.setting-text strong{display:block;font-size:10px}.setting-text small{display:block;color:#9aa79f;font-size:8px;margin-top:3px;line-height:1.35}.small-action{border:0;border-radius:11px;background:#edf8f1;color:#6fae88;font:inherit;font-size:9px;font-weight:900;padding:8px 10px;cursor:pointer;white-space:nowrap}.small-action.danger{background:#fff0f0;color:#d78b92}.safety-card{margin-top:14px;background:#fff8e9;border:1px solid #f8edcf;border-radius:19px;padding:13px;display:flex;gap:10px}.safety-icon{width:30px;height:30px;border-radius:10px;background:#fff;color:#e3bd61;display:grid;place-items:center;font-size:18px;flex-shrink:0}.safety-card strong{font-size:10px;color:#ad8c4b}.safety-card p{font-size:9px;line-height:1.55;color:#9f987d;margin:3px 0 0}.app-version{text-align:center;font-size:8px;letter-spacing:1.3px;color:#c0cac3;font-weight:900;margin:20px 0 0}
.bottom-nav{position:fixed;z-index:20;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,480px);height:78px;padding:9px 18px max(10px,env(safe-area-inset-bottom));display:flex;justify-content:space-between;align-items:center;background:rgba(255,255,255,.95);backdrop-filter:blur(18px);border-top:1px solid #eff3ef;box-shadow:0 -6px 20px rgba(71,101,81,.05)}.nav-item{width:61px;border:0;background:transparent;color:#b1bdb5;display:flex;flex-direction:column;align-items:center;gap:2px;font:inherit;cursor:pointer}.nav-icon{font-size:22px;line-height:24px}.nav-item small{font-size:8px;font-weight:900}.nav-item.active{color:#70b48d}.nav-add{width:48px;height:48px;border:0;border-radius:17px;background:linear-gradient(145deg,#8bd0a9,#70bc92);box-shadow:0 7px 14px rgba(113,190,148,.28);color:white;font-size:29px;font-weight:400;display:grid;place-items:center;margin-top:-22px;cursor:pointer}
.modal-backdrop{position:fixed;z-index:50;inset:0;background:rgba(47,67,57,.34);backdrop-filter:blur(5px);display:none;align-items:flex-end;justify-content:center}.modal-backdrop.open{display:flex;animation:fade .2s ease}@keyframes fade{from{opacity:0}to{opacity:1}}.modal-sheet{width:min(100%,480px);max-height:91vh;overflow:auto;background:#fbfcfa;border-radius:28px 28px 0 0;padding:10px 22px calc(22px + env(safe-area-inset-bottom));box-shadow:0 -15px 55px rgba(40,70,52,.18);animation:sheetUp .28s ease}@keyframes sheetUp{from{transform:translateY(24px);opacity:.7}to{transform:translateY(0);opacity:1}}.modal-handle{height:4px;width:40px;border-radius:5px;background:#dce7df;margin:0 auto 17px}.modal-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:17px}.modal-header h2{font-size:21px;line-height:1.15;margin:4px 0 3px;font-weight:900;letter-spacing:-.5px}.modal-header p{font-size:9px;color:#9aa79f;margin:0}.close-modal{width:32px;height:32px;border:0;border-radius:11px;background:#eff6f0;color:#80b593;font-size:22px;cursor:pointer}.form-section-title{font-size:11px;font-weight:900;color:#668775;margin:2px 0 10px}.form-section-title.spaced{margin-top:18px}.photo-upload-row{display:flex;align-items:center;gap:12px;background:#f1f8f3;border-radius:17px;padding:10px;margin-bottom:14px}.photo-upload{width:62px;height:62px;border-radius:15px;background:#fff;border:1px dashed #bedfc9;display:grid;place-items:center;position:relative;overflow:hidden;flex-shrink:0;cursor:pointer}.photo-upload img{width:100%;height:100%;object-fit:cover}.photo-plus{position:absolute;right:3px;bottom:3px;width:18px;height:18px;border-radius:7px;background:#78bf97;color:white;display:grid;place-items:center;font-size:14px;border:2px solid #fff}.photo-upload-row strong{font-size:10px}.photo-upload-row p{font-size:8px;color:#98a69d;margin:2px 0 3px;max-width:205px}.upload-link{font-size:9px;font-weight:900;color:#72b28c;cursor:pointer}.field-label{display:block;font-size:9px;font-weight:900;color:#657a6d;margin:10px 0 5px}.field-label em{color:#ec929b;font-style:normal}.field-input{width:100%;border:1px solid #e8f0e9;background:white;border-radius:13px;min-height:42px;padding:10px 12px;font:inherit;font-size:11px;color:#42564b;outline:none;box-shadow:0 2px 5px rgba(51,83,63,.02)}.field-input:focus{border-color:#9ad4b1;box-shadow:0 0 0 3px rgba(131,200,158,.12)}.field-input::placeholder{color:#c1cbc4}.form-grid{display:grid;gap:10px}.form-grid.two-cols{grid-template-columns:1fr 1fr}.dose-grid{grid-template-columns:1.2fr .8fr}.time-inputs{display:grid;grid-template-columns:1fr 1fr;gap:7px}.time-inputs input{width:100%;border:1px solid #e8f0e9;background:white;border-radius:12px;padding:9px 10px;font:inherit;font-size:11px;color:#62776a;min-height:39px}.notes-input{resize:vertical;min-height:70px}.form-footer{display:flex;gap:9px;margin-top:17px}.cancel-button,.save-button{border:0;border-radius:14px;min-height:45px;font:inherit;font-size:11px;font-weight:900;cursor:pointer}.cancel-button{width:31%;background:#f0f4f1;color:#8b9c91}.save-button{flex:1;background:linear-gradient(110deg,#81c9a0,#6fba91);color:white;box-shadow:0 7px 16px rgba(113,190,148,.2)}.save-button span:last-child{margin-left:9px;color:#fff1c9}.form-disclaimer{font-size:8px;color:#a8b3ab;text-align:center;line-height:1.45;margin:10px 8px 0}.toast{position:fixed;z-index:100;left:50%;bottom:90px;transform:translate(-50%,12px);background:#3f5e4e;color:#fff;border-radius:15px;padding:11px 16px;font-size:10px;font-weight:800;box-shadow:0 10px 24px rgba(38,73,50,.2);opacity:0;pointer-events:none;transition:.23s;max-width:calc(100% - 40px);text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:700px){body{padding:26px 0}.app-shell{min-height:calc(100vh - 52px);border-radius:36px}.bottom-nav{bottom:26px;border-radius:0 0 36px 36px}.modal-sheet{border-radius:28px;max-height:88vh;margin-bottom:20px}.modal-backdrop{align-items:center}.app-shell:after{content:'';position:absolute;top:0;left:0;right:0;height:6px;background:linear-gradient(90deg,#bfe9d5,#ffb3b8,#f8d987,#c5b8ee);opacity:.7}}
@media(max-width:370px){main{padding-left:16px;padding-right:16px}.topbar{padding-left:17px;padding-right:17px}.greeting-row h1{font-size:24px}.mascot-peek{width:83px;height:94px}.date-chip{min-width:43px}.progress-card{padding:16px}.progress-ring{width:74px;height:74px}.form-grid.two-cols{gap:7px}}
.date-reminder-row{align-items:end;margin-top:9px}.reminder-toggle{display:flex;align-items:center;gap:9px;min-height:42px;padding:5px 8px;background:#f1f8f3;border-radius:13px;cursor:pointer}.reminder-toggle input{position:absolute;opacity:0;width:1px;height:1px}.toggle-track{width:28px;height:16px;border-radius:12px;background:#d3dfd7;position:relative;flex-shrink:0;transition:.2s}.toggle-track:after{content:'';position:absolute;left:2px;top:2px;width:12px;height:12px;border-radius:50%;background:white;box-shadow:0 1px 3px #9faea3;transition:.2s}.reminder-toggle input:checked+.toggle-track{background:#82c69f}.reminder-toggle input:checked+.toggle-track:after{left:14px}.reminder-toggle strong{display:block;font-size:9px;color:#6d8676}.reminder-toggle small{display:block;font-size:7px;color:#9aaba0;margin-top:1px}
.calendar-day.all-done:after{background:#79c29a}