:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:#15251d;background:#eef3ef;line-height:1.45;color-scheme:light}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:linear-gradient(160deg,#f7faf7 0,#e7efe9 100%)}button,input,select,textarea{font:inherit}button{cursor:pointer}main{width:min(680px,100%);min-height:100vh;margin:auto;padding:max(22px,env(safe-area-inset-top)) 18px max(28px,env(safe-area-inset-bottom))}.view{min-height:calc(100vh - 50px)}.login-view{display:flex;flex-direction:column;justify-content:center;max-width:430px;margin:auto}.brand{display:grid;place-items:center;width:62px;height:62px;border-radius:20px;background:#245c43;color:white;font-size:22px;font-weight:850;box-shadow:0 14px 30px #245c4333}.eyebrow{margin:20px 0 2px;color:#52705f;font-size:11px;font-weight:800;letter-spacing:.16em}.login-view h1,header h1{margin:0;font-size:32px;letter-spacing:-.035em}.intro{margin:7px 0 25px;color:#687a70}.panel{padding:22px;border:1px solid #d7e1da;border-radius:22px;background:#fff;box-shadow:0 16px 50px #1f3b2b12}label{display:grid;gap:7px;margin-bottom:17px;color:#33483c;font-size:13px;font-weight:750}input,select,textarea{width:100%;border:1px solid #c9d6ce;border-radius:12px;padding:13px 14px;background:white;color:#15251d;outline:none}input:focus,select:focus,textarea:focus{border-color:#2e7656;box-shadow:0 0 0 3px #2e76561c}textarea{resize:vertical}button[type=submit],.choice-card{width:100%;border:0;border-radius:14px;background:#245c43;color:#fff;padding:14px 18px;font-weight:800}button:disabled{cursor:wait;opacity:.6}.error{min-height:21px;margin:0 0 8px;color:#b42318;font-size:13px}header{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:10px;margin-bottom:25px}header .eyebrow{margin:0}.icon-button,.text-button,.secondary{border:0;background:transparent;color:#245c43;font-weight:800}.icon-button{width:42px;height:42px;border-radius:12px;background:#fff;font-size:24px;box-shadow:0 4px 14px #1f3b2b14}.text-button{padding:10px 0}.welcome{margin:0 0 18px;color:#607268}.choice-grid{display:grid;gap:14px}.choice-card{display:grid;grid-template-columns:56px 1fr;align-items:center;gap:15px;min-height:112px;text-align:left;box-shadow:0 14px 30px #245c4322}.choice-card.accent{background:#fff;color:#1d4936;border:1px solid #cbdcd1}.choice-card strong,.choice-card small{display:block}.choice-card strong{font-size:19px}.choice-card small{margin-top:4px;opacity:.72;font-weight:600}.choice-icon,.choice-count{display:grid;place-items:center;width:54px;height:54px;border-radius:17px;background:#ffffff20;font-size:29px}.choice-count{background:#dcebe1;color:#245c43;font-size:18px;font-weight:900}.form-panel{box-shadow:none}.date-row{display:flex;align-items:end;gap:10px;margin-bottom:18px}.date-row label{flex:1;margin:0}.date-row .secondary{height:47px;padding:0 14px;border-radius:12px;background:#dce8e0}.injection-list{display:grid;gap:12px}.injection-card{padding:17px;border:1px solid #d3dfd7;border-radius:18px;background:#fff;box-shadow:0 8px 26px #2443320d}.injection-card header{display:flex;justify-content:space-between;margin:0 0 12px}.injection-card h2{margin:0;font-size:22px}.medicine{padding:9px 11px;border-radius:10px;background:#eef5f0;font-weight:800}.meta{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0;color:#64766b;font-size:13px}.complete-button{width:100%;border:0;border-radius:12px;padding:12px;background:#245c43;color:white;font-weight:800}.empty{padding:45px 20px;text-align:center;color:#6a7c71;border:1px dashed #bccdc2;border-radius:18px;background:#ffffff99}dialog{width:min(520px,calc(100% - 24px));border:0;border-radius:24px;padding:0;box-shadow:0 30px 90px #10201955}dialog::backdrop{background:#10201999}dialog form{position:relative;padding:24px}dialog h2{margin:0 0 15px}dialog .eyebrow{margin:0}.dialog-close{position:absolute;right:16px;top:14px;border:0;background:transparent;color:#64766b;font-size:28px}dl{display:grid;grid-template-columns:auto 1fr;gap:5px 12px;margin:0 0 20px;padding:13px;border-radius:12px;background:#eef5f0;font-size:13px}dt{color:#65776c}dd{margin:0;font-weight:750}.toast{position:fixed;left:50%;bottom:max(22px,env(safe-area-inset-bottom));transform:translate(-50%,30px);padding:11px 17px;border-radius:12px;background:#15251d;color:white;opacity:0;pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}[hidden]{display:none!important}@media(min-width:600px){.choice-grid{grid-template-columns:1fr 1fr}.choice-card{min-height:145px;grid-template-columns:1fr}.choice-icon,.choice-count{margin-bottom:5px}}

.step{margin-bottom:14px;padding:16px;border:1px solid #d6e1da;border-radius:16px;background:#f9fbf9;animation:step-in .25s ease-out}.step-heading{display:flex;align-items:center;gap:9px;margin-bottom:13px}.step-heading span{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:#245c43;color:#fff;font-size:13px;font-weight:900}.step label{margin-bottom:10px}.step-button{width:100%;padding:11px;border:0;border-radius:11px;background:#dcebe1;color:#245c43;font-weight:850}.history{display:grid;gap:7px;margin-top:13px;padding-top:13px;border-top:1px solid #d5e1d9;font-size:12px}.history-row{display:grid;grid-template-columns:68px 82px 1fr;align-items:center;gap:7px}.status{padding:3px 5px;border-radius:6px;text-align:center;font-size:10px;font-weight:900;text-transform:uppercase}.status.planned{background:#fff0c7;color:#795b00}.status.done{background:#dcebe1;color:#245c43}.selection-result{min-height:20px;margin:8px 0 0;color:#245c43;font-size:12px;font-weight:750}.selection-result.invalid{color:#b42318}.dose-preview{display:grid;gap:7px;margin-bottom:15px}.dose-preview div{display:flex;justify-content:space-between;padding:12px;border-radius:11px;background:#e7f1ea}.dose-preview strong{color:#245c43}.check-option{display:flex;grid-template-columns:22px 1fr;align-items:start}.check-option input{width:20px;height:20px;margin:2px 0}.check-option strong,.check-option small{display:block}.check-option small{margin-top:2px;color:#687a70;font-weight:500}@keyframes step-in{from{opacity:0;transform:translateY(8px)}}

.check-status{min-height:18px;margin:0;color:#648071;font-size:12px}.weight-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.weight-button{display:grid;place-items:center;min-height:55px;border:1px solid #c8d8ce;border-radius:12px;background:#fff;color:#245c43;font-size:17px;font-weight:900}.weight-button small{font-size:9px;font-weight:750;text-transform:uppercase}.weight-button.selected{border-color:#245c43;background:#245c43;color:#fff;box-shadow:0 6px 16px #245c4330}@media(max-width:380px){.weight-grid{grid-template-columns:repeat(3,1fr)}}
.melovem-calendar{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:10px 0 15px}.melovem-day{display:grid;place-items:center;gap:2px;min-height:62px;margin:0!important;padding:7px 4px;border:1px solid #c8d8ce;border-radius:11px;background:#fff;text-align:center}.melovem-day input{position:absolute;width:1px;height:1px;opacity:0}.melovem-day span{font-size:12px}.melovem-day small{color:#687a70;font-size:10px}.melovem-day:has(input:checked){border-color:#245c43;background:#245c43;color:#fff}.melovem-day:has(input:checked) small{color:#dcebe1}@media(max-width:380px){.melovem-calendar{grid-template-columns:repeat(3,1fr)}}
.medicine-warning{margin-top:10px;padding:13px;border:1px solid #e3a008;border-radius:12px;background:#fff4ce;color:#704b00;font-size:13px;line-height:1.45}.medicine-warning strong{display:block;margin-bottom:3px;color:#9b2c22;font-size:14px}

.today-icon{background:#dcebe1;color:#245c43}.card-actions{display:grid;grid-template-columns:90px 1fr;gap:8px}.complete-button,.skip-button{width:100%;border:0;border-radius:12px;padding:12px;font-weight:800}.skip-button{background:#f2e4e1;color:#9b2c22}.today-date-label{margin:-12px 0 14px;color:#52705f;font-size:15px;font-weight:800}.medicine-summary{margin-bottom:14px}.medicine-summary h2{margin:0 0 7px;font-size:14px}.summary-table{overflow:hidden;border:1px solid #cedbd2;border-radius:13px;background:#fff}.summary-table div{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;padding:8px 11px;border-bottom:1px solid #e1e9e3;font-size:12px}.summary-table div:last-child{border-bottom:0}.summary-table span{color:#687a70}.summary-table b{color:#245c43}
.vaccine-icon{background:#fff0c7;color:#795b00;font-size:22px;font-weight:950}.weekly-vaccine-card{border-left:6px solid #d5a800}.weekly-vaccine-card header{align-items:center}.weekly-vaccine-card h2{font-size:20px}.weekly-vaccine-card .complete-button{margin-top:12px}.vaccine-group{padding:7px 9px;border-radius:9px;background:#fff4ce;color:#704b00;font-size:13px}
.install-actions{display:grid;gap:8px}.install-actions .secondary{padding:12px;border-radius:12px;background:#e7eee9}.install-actions button:first-child{width:100%;border:0;border-radius:12px;background:#245c43;color:#fff;padding:12px;font-weight:800}
.pin-display{height:58px;text-align:center;font-size:28px;font-weight:900;letter-spacing:.32em;background:#f4f8f5}.pin-keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:-4px 0 16px}.pin-keypad button{min-height:62px;border:1px solid #cbd9d0;border-radius:16px;background:#f8fbf9;color:#183e2d;font-size:25px;font-weight:900;box-shadow:0 3px 8px #1f3b2b10;touch-action:manipulation}.pin-keypad button:active{transform:scale(.96);background:#dcebe1}.pin-keypad .pin-action{font-size:14px;color:#52705f}
.altersyn-icon{background:#f4ead0;color:#765b16;font-size:24px;font-weight:950}.altersyn-details{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.altersyn-details div{display:grid;gap:3px;padding:12px;border-radius:12px;background:#eef5f0}.altersyn-details span,.extra-dose-row>span{color:#64766b;font-size:12px;font-weight:750}.altersyn-details strong{font-size:18px}.extra-dose-row{display:flex;align-items:center;justify-content:space-between;margin:12px 0}.stepper{display:grid;grid-template-columns:48px 54px 48px;align-items:center;overflow:hidden;border:1px solid #c8d8ce;border-radius:13px}.stepper button{height:46px;border:0;background:#e5efe8;color:#245c43;font-size:25px;font-weight:900;touch-action:manipulation}.stepper output{text-align:center;font-size:20px;font-weight:900}.completed-note{margin:0;padding:12px;border-radius:12px;background:#dcebe1;color:#245c43;font-size:13px;font-weight:750}

/* Keep sign-in controls within the available phone viewport. */
body:has(#login-view:not([hidden])) main{min-height:100dvh;height:100dvh;padding: max(8px,env(safe-area-inset-top)) 12px max(8px,env(safe-area-inset-bottom))}
#login-view{height:100%;min-height:0;justify-content:center;gap:6px}
#login-view .brand,#login-view .eyebrow,#login-view .intro{display:none}
#login-view h1{font-size:24px;flex-shrink:0}
#login-form{display:flex;flex-direction:column;min-height:0;max-height:calc(100% - 40px);padding:12px;gap:6px}
#login-form .user-picker{display:flex;flex-direction:column;min-height:54px;flex:0 1 160px;margin:0}
#login-form .user-picker legend{margin:0 0 4px}
#login-form .user-grid{overflow-y:auto;min-height:0;gap:6px}
#login-form .user-button{padding:6px;gap:3px}
#login-form .user-button span{width:30px;height:30px;font-size:14px}
#login-form label{margin:0;gap:3px;flex-shrink:0}
#login-form .pin-display{height:40px;padding:4px;font-size:24px}
#login-form .pin-keypad{flex:0 1 280px;min-height:180px;grid-template-rows:repeat(4,minmax(0,1fr));gap:6px;margin:0}
#login-form .pin-keypad button{min-height:0;font-size:23px;border-radius:10px}
#login-form .pin-keypad .pin-action{font-size:13px}
#login-form .error{min-height:0;margin:0;flex-shrink:0}
#login-form .error:empty{display:none}
#login-form button[type=submit]{flex-shrink:0;min-height:44px;padding:10px}
@media(max-height:480px) and (min-width:480px){
 #login-view{max-width:650px}#login-view h1{display:none}
 #login-form{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr auto;max-height:100%;height:100%;gap:8px}
 #login-form .user-picker{grid-column:1;grid-row:1 / 3;min-height:0}
 #login-form label{grid-column:2;grid-row:1}
 #login-form .pin-keypad{grid-column:2;grid-row:2;min-height:0}
 #login-form .error{grid-column:1;grid-row:3}
 #login-form button[type=submit]{grid-column:2;grid-row:3}
}

.weekly-vaccine-card .vaccine-group-number{font-size:54px;line-height:1.1;color:#245c43;overflow-wrap:anywhere}.vaccine-recipient{font-size:24px;background:#fff0c7;padding:10px;border-radius:12px}.vaccine-quantity{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:16px 0;font-size:20px}.vaccine-quantity .stepper{grid-template-columns:48px minmax(64px,auto) 48px}.vaccine-quantity output{font-size:30px}.vaccine-date{font-size:13px;color:#64766b}
