/* Health: medicines, courses, appointments */
.label .lr { font-weight: 500; text-transform: none; letter-spacing: 0; }
.label .la { display: flex; align-items: center; gap: var(--sp-2); }
.sg-f input, .sg-f select { font-family: inherit; color: var(--text); -webkit-appearance: none; appearance: none; }
.sg-f input::placeholder, .sg-f textarea::placeholder { color: var(--faint); }
.sg-f input[type=date] { display: flex; align-items: center; text-align: left; }
.sg-f select { width: 100%; height: var(--h-btn); padding: 0 40px 0 14px; border: 0; outline: 0; border-radius: var(--r-md); font-size: var(--t-lg);
  background: var(--raised) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239e9a93' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center / 18px; }
.sg-f .hint { margin: var(--sp-2) 2px 0; }
.sg-go { width: 100%; height: var(--h-btn); margin-top: var(--sp-2); border-radius: var(--r-md); background: var(--inv); color: var(--on-inv); font-size: var(--t-lg); font-weight: 650; }
.sg-go:disabled { opacity: .6; }
.sg-list { padding: 0 var(--pad-x); }
.sg-row { display: flex; align-items: center; gap: var(--sp-3); width: 100%; padding: 14px 0; text-align: left; font-size: var(--t-base); }
.sg-row + .sg-row { border-top: 1px solid var(--line); }
.sg-row .t { flex: 1; min-width: 0; }
.sg-row .t b, .sg-row .r b { display: block; font-weight: 600; }
.sg-row .t small, .sg-row .r small { display: block; color: var(--muted); font-size: var(--t-sm); }
.sg-row .r { flex: none; text-align: right; font-variant-numeric: tabular-nums; }
.sg-row .r small.soon { color: var(--warn); }
.sg-row.taken .t b { color: var(--muted); }
.sg-tick { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; border: 1.8px solid var(--line-2); color: transparent; transition: background .15s, border-color .15s; }
.sg-tick svg { width: var(--g-xs); height: var(--g-xs); }
.sg-tick.on { border-color: var(--good); background: var(--good); color: var(--on-acc); }
.sg-dots { display: flex; gap: 6px; margin-top: var(--sp-2); }
.sg-dots i { width: 10px; height: 10px; border-radius: 50%; background: var(--raised); }
.sg-dots i.on { background: var(--good); }
.sg-dots i.now:not(.on) { box-shadow: inset 0 0 0 1.8px var(--text); }
.sg-f label { display: block; margin: var(--sp-3) 2px 6px; color: var(--muted); font-size: var(--t-sm); font-weight: 600; }
.sg-f input { width: 100%; height: var(--h-btn); padding: 0 14px; border: 0; outline: 0; border-radius: var(--r-md); background: var(--raised); font-size: var(--t-lg); }
.sg-f .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap); }
.sg-f .err-t { min-height: 1.2em; margin-top: var(--sp-2); color: var(--bad); font-size: var(--t-sm); }
.sg-del, .sg-alt { width: 100%; height: var(--h-btn); margin-top: 6px; border-radius: var(--r-md); color: var(--bad); font-size: var(--t-lg); font-weight: 600; }
.sg-alt { color: var(--text); }
.ai-note { margin: var(--sp-3) 4px 0; }
.ai-c3 { padding: 0 var(--pad-x); }
.ai-c3 > div { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-1) 0; padding: var(--pad-y) 0; }
.ai-c3 span + span { padding-left: var(--sp-3); border-left: 1px solid var(--line); }
.ai-c3 span:not(:last-child) { padding-right: var(--sp-3); }
.ai-c3 > div + div { border-top: 1px solid var(--line); }
.ai-c3 p { grid-column: 1 / -1; margin: 0 0 var(--sp-1); font-size: var(--t-base); font-weight: 600; }
.ai-c3 small { display: block; color: var(--muted); font-size: var(--t-sm); font-variant-numeric: tabular-nums; }
.ai-c3 b { display: block; margin: 2px 0; font-size: var(--t-stat); font-weight: 650; letter-spacing: -.03em; line-height: 1.15; }
.tab[data-tab="server"] { white-space: nowrap; letter-spacing: 0; }  /* "Server & Apps" on one line */
.tab.on { color: var(--text); }
/* Medicines (0.2.0): today by time, the add sheet, and the tab that shows your first name */
.tab-n { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tab { min-width: 0; }
.sg-time { flex: none; width: calc(var(--ib) + var(--sp-5)); color: var(--muted); font-size: var(--t-sm); font-variant-numeric: tabular-nums; }
.sg-pill { display: inline-block; margin-left: var(--sp-2); padding: var(--hair) var(--sp-2); border-radius: var(--r-xs); background: var(--raised); color: var(--muted); font-size: var(--t-xs); font-weight: 600; font-style: normal; vertical-align: middle; }
.sg-add { height: var(--h-btn-sm); padding: 0 var(--sp-3); border-radius: var(--r-sm); background: var(--raised); color: var(--text); font-size: var(--t-md); font-weight: 600; letter-spacing: 0; text-transform: none; }
.sg-row .chev { flex: none; color: var(--faint); }
.sg-row .chev svg { width: var(--g-sm); height: var(--g-sm); }
.sg-chips { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-2); }
.sg-chip { height: var(--h-field); padding: 0 var(--sp-3); border-radius: var(--r-sm); background: var(--card); color: var(--muted); font-size: var(--t-md); font-weight: 600; }
.sg-chip.on { background: var(--sel); color: var(--on-sel); }
.sg-chip.ghost { background: transparent; box-shadow: inset 0 0 0 var(--hair) var(--line-2); }
.sg-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: var(--sp-1); }
.sg-days .sg-chip { padding: 0; }
.sg-times { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.sg-tin { display: inline-flex; align-items: center; gap: var(--sp-1); }
.sg-f .sg-tin input { width: auto; min-width: calc(var(--h-tile) + var(--sp-7)); height: var(--h-field); }
.sg-tin button { width: var(--ib-sm); height: var(--ib-sm); border-radius: 50%; color: var(--faint); }
.sg-stop { display: flex; align-items: center; gap: var(--sp-3); margin-top: var(--sp-2); color: var(--muted); font-size: var(--t-base); }
.sg-f .sg-stop input { width: calc(var(--h-tile) + var(--sp-4)); }
.sg-swrow { display: flex; align-items: center; gap: var(--sp-3); margin-top: var(--sp-4); padding: var(--sp-3) var(--pad-x); border-radius: var(--r-md); background: var(--card); }
.sg-swrow span { flex: 1; min-width: 0; }
.sg-swrow b { display: block; font-size: var(--t-base); }
.sg-swrow small { display: block; color: var(--muted); font-size: var(--t-sm); }
#sgs .sheet-body { padding-bottom: var(--sp-4); }
#sgs .sg-go { margin-top: var(--sp-4); background: var(--sel); color: var(--on-sel); }
/* Medicines v2: pill count, the month calendar, quiet hours, and the next medicine on Home */
.sg-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--gap); }
.sg-row .t small.soon { color: var(--warn); }
.sg-mnav { width: var(--ib-sm); height: var(--ib-sm); border-radius: 50%; color: var(--muted); font-size: var(--t-xl); text-transform: none; }
.sg-cal { padding: var(--pad-y) var(--pad-x); }
.sg-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: var(--sp-1); }
.sg-wd { padding-bottom: var(--sp-1); color: var(--faint); font-size: var(--t-xs); font-style: normal; font-weight: 600; text-align: center; }
.sg-dd { aspect-ratio: 1; border-radius: var(--r-sm); font-size: var(--t-sm); font-weight: 600; color: var(--muted); font-variant-numeric: tabular-nums; }
.sg-dd.none, .sg-dd.later { color: var(--faint); }
.sg-dd.all { background: color-mix(in srgb, var(--good) 22%, transparent); color: var(--good); }
.sg-dd.some { background: color-mix(in srgb, var(--warn) 22%, transparent); color: var(--warn); }
.sg-dd.missed { background: color-mix(in srgb, var(--bad) 14%, transparent); color: var(--bad); }
.sg-dd.today { box-shadow: inset 0 0 0 calc(2 * var(--hair)) var(--text); }
.sg-dd.pick { outline: calc(2 * var(--hair)) solid var(--auto); outline-offset: var(--hair); }
.sg-key { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-3); color: var(--muted); font-size: var(--t-xs); }
.sg-key span { display: inline-flex; align-items: center; gap: var(--sp-1); }
.sg-key i { width: var(--sp-3); height: var(--sp-3); border-radius: var(--r-xs); }
.sg-key i.all { background: color-mix(in srgb, var(--good) 40%, transparent); }
.sg-key i.some { background: color-mix(in srgb, var(--warn) 40%, transparent); }
.sg-key i.missed { background: color-mix(in srgb, var(--bad) 30%, transparent); }
.sg-dayl { margin-top: var(--sp-3); padding-top: var(--sp-3); border-top: var(--hair) solid var(--line); font-size: var(--t-base); }
.sg-dayl > div { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-1) 0; }
.sg-dayl span { flex: none; width: calc(var(--ib) + var(--sp-5)); color: var(--muted); font-size: var(--t-sm); }
.sg-dayl em { margin-left: auto; color: var(--faint); font-size: var(--t-sm); font-style: normal; }
.sg-dayl em.ok { color: var(--good); }
.hm-dose { display: flex; align-items: center; gap: var(--sp-3); margin-top: var(--sp-3); padding: var(--sp-3) var(--pad-x); }
.hm-dose .t { flex: 1; min-width: 0; }
.hm-dose small { display: block; color: var(--muted); font-size: var(--t-sm); }
.hm-dose b { display: block; font-size: var(--t-lg); font-weight: 650; }
.hm-ic { flex: none; width: var(--ic-sm); height: var(--ic-sm); display: grid; place-items: center; border-radius: var(--r-sm); background: var(--raised); color: var(--muted); }
.hm-ic svg { width: var(--g-md); height: var(--g-md); }
.hm-ic.ok { color: var(--good); background: color-mix(in srgb, var(--good) 14%, transparent); }
