:root{--calm-bg:#f5f2fa;--calm-shell:#ffffff;--calm-card:#f0edf4;--calm-raised:#e8e2f0;--calm-border:#ddd5e7;--calm-text:#242127;--calm-muted:#77707e;--calm-accent:#8a66d9;--calm-accent-soft:#dfd3f8;--calm-danger:#c45562}
body{background:var(--calm-bg);color:var(--calm-text)}.app{max-width:780px;background:var(--calm-shell);padding:20px 18px 122px;border-inline:1px solid var(--calm-border)}
header{min-height:62px;margin-bottom:6px;border:0}h1{color:var(--calm-text);font-size:29px;display:flex;align-items:center;gap:10px}h1::before{content:'♡';display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:var(--calm-accent);color:#fff;font-size:22px}.lang,.theme-toggle{background:var(--calm-card);color:var(--calm-text);border:1px solid var(--calm-border);box-shadow:none}.lang::after{content:''}
#cloudStatus{display:table;margin:0 auto 16px;padding:0;background:transparent;color:var(--calm-muted);font-size:12px}.page-heading{display:grid;grid-template-columns:1fr auto;align-items:end;gap:8px;margin:20px 0 16px}.page-heading>div{min-width:0}.page-eyebrow{color:var(--calm-muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.page-heading h2{margin:5px 0 2px;color:var(--calm-text);font-size:24px}.page-heading .updated{margin:0;color:var(--calm-muted);font-size:12px}.page-heading .add{position:static;transform:none;width:auto;min-width:0;margin:0;padding:10px 13px;border-radius:11px;background:#fff;color:#18161b;box-shadow:none;font-size:14px}.status-chip{grid-column:1/-1;display:none}
.grid{gap:14px}.card{min-height:136px;border:0;border-radius:22px;padding:17px;background:var(--calm-card);box-shadow:none;text-align:start;direction:inherit}.card-sugar,.card-pressure,.card-inr,.card-heart,.card-weight,.card-catheter{background:var(--calm-card)}.card .card-label{color:var(--calm-text);font-size:14px;font-weight:700}.card .metric-icon{width:40px;height:40px;border:0;border-radius:12px;background:#d9d1e3;font-size:16px}.card strong{color:var(--calm-text);font-size:25px;margin:10px 0 4px}.card small{color:var(--calm-muted)}
.alerts-banner{margin-top:14px;background:var(--calm-card);border:1px solid var(--calm-border);border-radius:20px;padding:14px;box-shadow:none}.alerts-title{color:var(--calm-text);font-size:16px}.alert-row+.alert-row{border-top:1px solid var(--calm-border)}.alert-thumb{background:var(--calm-raised)}.alert-link:hover,.alert-link:focus-visible{background:var(--calm-raised)}
.tabs{width:min(744px,calc(100% - 28px));bottom:12px;background:var(--calm-card);border:1px solid var(--calm-border);border-radius:20px;padding:8px;box-shadow:none}.tab{background:transparent;color:var(--calm-muted);border-radius:13px;padding:11px}.tab.active{background:transparent;color:var(--calm-accent)}
.section-title{color:var(--calm-text);font-size:25px}.med-toolbar{margin:18px 0 14px}.view-btn,.edit,.activity-btn,.photo,.google-image-button,.history-all{background:var(--calm-card);color:var(--calm-text);border:1px solid var(--calm-border)}.view-btn.active,.dose-btn,.history-add,.save{background:var(--calm-accent);color:#fff;border-color:transparent;box-shadow:none}.med{background:var(--calm-card);border:0;border-radius:22px;box-shadow:none;padding:15px}.med-photo{background:var(--calm-raised);border-color:var(--calm-border);border-radius:14px}.med-info b{color:var(--calm-text);font-size:17px}.med-info small{color:var(--calm-muted)}.pill-count{color:var(--calm-accent)!important}.low{color:var(--calm-danger)!important}
#medList.grid-view{gap:14px}.grid-view .med{min-height:300px}.grid-view .med-actions{display:grid;grid-template-columns:1fr 1fr}.grid-view .dose-btn{grid-column:1/-1}.grid-view .edit{width:auto}.history-item{background:var(--calm-card);border:0;border-radius:18px;box-shadow:none;padding:15px}.history-item b{color:var(--calm-text)}.history-item small,.byline{color:var(--calm-muted)!important}
.overlay{background:#171419b8;backdrop-filter:blur(5px)}.sheet{background:var(--calm-shell);color:var(--calm-text);border:1px solid var(--calm-border);box-shadow:none}.sheet-head{border-bottom:1px solid var(--calm-border);padding-bottom:10px;margin-bottom:10px}.sheet h2,.field label{color:var(--calm-text)}.close,.choice{background:var(--calm-card);color:var(--calm-text);border-color:var(--calm-border)}.field input,.field select,.field textarea{background:var(--calm-card);color:var(--calm-text);border-color:var(--calm-border)}.field input:focus,.field select:focus,.field textarea:focus{outline:3px solid #8a66d92c;border-color:var(--calm-accent)!important}.medicine-preview,.activity-row{background:var(--calm-card);border-color:var(--calm-border)}.check-field input{accent-color:var(--calm-accent)}.danger{background:#f8e8eb;color:var(--calm-danger)}
#authOverlay .sheet{max-width:470px;border-radius:24px;padding:24px}#authOverlay h2{text-align:center;color:var(--calm-text)}#authOverlay #authHelp{text-align:center;color:var(--calm-muted)}
html[data-theme="dark"]{--calm-bg:#171717;--calm-shell:#222222;--calm-card:#303030;--calm-raised:#3a3740;--calm-border:#454545;--calm-text:#f6f4f8;--calm-muted:#aaa5ad;--calm-accent:#b18bf4;--calm-accent-soft:#51485f;--calm-danger:#ff8793;color-scheme:dark}html[data-theme="dark"] body{background:var(--calm-bg);color:var(--calm-text)}html[data-theme="dark"] .app{background:var(--calm-shell);border-color:var(--calm-border)}html[data-theme="dark"] h1,html[data-theme="dark"] .section-title,html[data-theme="dark"] .page-heading h2{color:var(--calm-text)}html[data-theme="dark"] h1::before{background:var(--calm-accent);color:#1d1724}html[data-theme="dark"] .lang,html[data-theme="dark"] .theme-toggle{background:var(--calm-card);color:var(--calm-text);border-color:var(--calm-border)}
html[data-theme="dark"] .card,html[data-theme="dark"] .med,html[data-theme="dark"] .history-item,html[data-theme="dark"] .alerts-banner,html[data-theme="dark"] .sheet{background:var(--calm-card);color:var(--calm-text);border-color:var(--calm-border);box-shadow:none}html[data-theme="dark"] .card-sugar,html[data-theme="dark"] .card-pressure,html[data-theme="dark"] .card-inr,html[data-theme="dark"] .card-heart,html[data-theme="dark"] .card-weight,html[data-theme="dark"] .card-catheter{background:var(--calm-card)}html[data-theme="dark"] .card .card-label,html[data-theme="dark"] .card strong,html[data-theme="dark"] .med-info b,html[data-theme="dark"] .history-item b{color:var(--calm-text)}html[data-theme="dark"] .card small,html[data-theme="dark"] .med-info small,html[data-theme="dark"] .history-item small,html[data-theme="dark"] #cloudStatus{color:var(--calm-muted)}html[data-theme="dark"] .card .metric-icon{background:#514c5e}
html[data-theme="dark"] .tabs{background:var(--calm-card);border-color:var(--calm-border)}html[data-theme="dark"] .tab{color:var(--calm-muted)}html[data-theme="dark"] .tab.active{background:transparent;color:var(--calm-accent)}html[data-theme="dark"] .page-heading .add{background:#fff;color:#171717}html[data-theme="dark"] .alert-thumb,html[data-theme="dark"] .med-photo{background:var(--calm-raised);border-color:var(--calm-border)}html[data-theme="dark"] .med-photo img{background:#fff}
html[data-theme="dark"] .view-btn,html[data-theme="dark"] .edit,html[data-theme="dark"] .activity-btn,html[data-theme="dark"] .photo,html[data-theme="dark"] .google-image-button,html[data-theme="dark"] .history-all,html[data-theme="dark"] .close,html[data-theme="dark"] .choice{background:var(--calm-raised);color:var(--calm-text);border-color:var(--calm-border)}html[data-theme="dark"] .view-btn.active,html[data-theme="dark"] .dose-btn,html[data-theme="dark"] .history-add,html[data-theme="dark"] .save{background:var(--calm-accent);color:#201729}html[data-theme="dark"] .field input,html[data-theme="dark"] .field select,html[data-theme="dark"] .field textarea,html[data-theme="dark"] .medicine-preview,html[data-theme="dark"] .activity-row{background:#292929;color:var(--calm-text);border-color:var(--calm-border)}html[data-theme="dark"] .danger{background:#492d32;color:#ffb1b8}
@media(max-width:560px){.app{padding:14px 12px 112px;border:0}header{min-height:58px}h1{font-size:26px}h1::before{width:36px;height:36px}.page-heading{align-items:center}.page-heading h2{font-size:21px}.page-heading .add{padding:9px 10px;font-size:13px}.grid{gap:10px}.card{min-height:132px;padding:14px;border-radius:18px}.card strong{font-size:23px}.med-toolbar{align-items:flex-start;flex-direction:column}.med-toolbar>div{width:100%;justify-content:space-between}.tabs{width:calc(100% - 20px);bottom:8px}.grid-view .med-actions{width:100%}}
@media(max-width:370px){.grid{grid-template-columns:1fr}.card{min-height:112px}.page-heading{grid-template-columns:1fr}.page-heading .add{justify-self:stretch}.lang{font-size:12px;padding:8px}.theme-toggle{width:40px;height:40px}}

/* Compact, consistent health cards and medication controls */
.card{min-height:112px;padding:12px 13px;border-radius:18px}.card .card-label{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px;min-height:34px}.card .metric-icon{display:inline-grid!important;place-items:center!important;width:34px;height:34px;min-width:34px;flex:0 0 34px;border-radius:10px;overflow:hidden;line-height:1;font-size:15px;color:var(--calm-accent);font-style:normal}.card strong{font-size:22px;line-height:1.15;margin:8px 0 3px}.card small{font-size:11px;line-height:1.25}.card-inr strong,.card-catheter strong,.card strong.countdown{color:var(--calm-accent)!important;font-size:20px;line-height:1.15}
.med-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;width:100%}.med-actions .dose-btn{grid-column:1/-1}.med-actions button{width:100%!important;min-width:0!important;min-height:46px;padding:10px 8px!important;border-radius:12px!important;font:inherit;font-weight:700}.grid-view .med-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-view .dose-btn{grid-column:1/-1}.grid-view .med-info{min-height:88px}.grid-view .med-info b{min-height:44px;display:grid;place-items:center}.grid-view .med-info small{margin-top:4px}
.counter-missing{color:var(--calm-muted)!important;font-weight:700;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px}
html[data-theme="dark"] .card-inr strong,html[data-theme="dark"] .card-catheter strong,html[data-theme="dark"] .card strong.countdown{color:var(--calm-accent)!important}
@media(max-width:560px){.card{min-height:106px;padding:11px}.card .card-label{font-size:13px}.card strong{font-size:21px}.card-inr strong,.card-catheter strong,.card strong.countdown{font-size:18px}.card .metric-icon{width:32px;height:32px;min-width:32px;flex-basis:32px}.grid-view .med-actions button{min-height:44px}.grid-view .med-info{min-height:82px}}

/* Long medicine names must never push the pill count out of view. */
.grid-view .med{height:auto;min-height:310px;overflow:visible}
.grid-view .med-info{min-height:118px;height:auto;display:flex;flex-direction:column;justify-content:flex-start}
.grid-view .med-info b{display:block;min-height:0;font-size:14px;line-height:1.28;overflow-wrap:break-word;word-break:normal;text-wrap:balance}
.grid-view .med-info small{display:block;flex:0 0 auto;margin-top:5px;line-height:1.3}
.grid-view .pill-count{min-height:18px}
@media(max-width:390px){.grid-view .med-info b{font-size:13px}.grid-view .med-info{min-height:112px}}

/* Keep information and controls in separate layout rows on iPhone. */
#medList{padding-bottom:calc(130px + env(safe-area-inset-bottom))}
.grid-view .med-info{flex:0 0 auto!important;min-height:0!important;padding:0 2px 14px;overflow:visible!important}
.grid-view .med-actions{position:static!important;inset:auto!important;flex:0 0 auto!important;margin-top:0;z-index:0}
.grid-view .pill-count{min-height:0;white-space:normal;overflow:visible}
.grid-view .med{justify-content:flex-start;overflow:visible;padding-bottom:16px}
@media(max-width:560px){#medList{padding-bottom:calc(155px + env(safe-area-inset-bottom))}.grid-view .med-info{padding-bottom:16px}.grid-view .med-actions{margin-top:0}}

/* Equal-height grid cards with perfectly aligned action labels. */
#medList.grid-view{align-items:stretch;grid-auto-rows:1fr}
#medList.grid-view .med{display:grid!important;grid-template-rows:140px minmax(126px,auto) auto;align-content:start;height:100%!important;min-height:0!important}
#medList.grid-view .med-photo{grid-row:1;width:100%;height:140px;min-height:140px;margin:0 0 10px}
#medList.grid-view .med-info{grid-row:2;width:100%;height:auto!important;min-height:126px!important;padding:0 2px 12px;align-self:stretch}
#medList.grid-view .med-actions{grid-row:3;width:100%;align-self:end}
.med-actions button{display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;line-height:1.15!important;white-space:nowrap}
@media(max-width:420px){#medList.grid-view .med{grid-template-rows:126px minmax(120px,auto) auto}#medList.grid-view .med-photo{height:126px;min-height:126px}#medList.grid-view .med-info{min-height:120px!important}.med-actions button{font-size:14px!important}}