:root {
  --navy: #173550;
  --navy-deep: #0f2942;
  --blue: #1985d1;
  --blue-strong: #0e6eb7;
  --cyan: #19bddb;
  --sky: #e1f4fb;
  --sky-deep: #ccebf7;
  --paper: #eef7fc;
  --white: #ffffff;
  --line: #dfeaf1;
  --line-soft: #eaf1f5;
  --muted: #708698;
  --muted-light: #9aacb9;
  --purple: #7458bf;
  --purple-soft: #f1edfb;
  --orange: #d48745;
  --orange-soft: #fff3e6;
  --coral: #cf6a61;
  --coral-soft: #fff0ee;
  --green: #3a9a82;
  --green-soft: #eaf8f3;
  --shadow: 0 14px 40px rgba(31, 84, 119, .07);
  --shadow-deep: 0 24px 65px rgba(28, 74, 108, .13);
  --radius: 18px;
  --radius-sm: 12px;
  --sidebar: 244px;
  --topbar: 72px;
  color-scheme: light;
}

* { box-sizing: border-box; }
html { min-width: 320px; overflow-x: hidden; scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; min-height: 100vh; overflow-x: hidden; background: var(--paper); color: var(--navy); font-family: 'DM Sans', system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
.storage-consent { position: relative; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px clamp(18px,4vw,48px); border-bottom: 1px solid #b8dce9; background: #eaf9fc; color: var(--navy); box-shadow: 0 8px 24px #17355012; }
.storage-consent[hidden] { display: none; }
.storage-consent b { display: block; font-size: 14px; }
.storage-consent p { max-width: 720px; margin: 4px 0 0; color: #486b80; font-size: 12px; line-height: 1.5; }
.storage-consent-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.storage-consent .primary-button, .storage-consent .secondary-button { min-height: 44px; white-space: nowrap; }
.storage-consent a { padding: 10px; color: #0b6da8; font-size: 12px; font-weight: 800; }
/* Pro access changes available features only; the DoctorAI visual system stays blue and consistent. */
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
a { color: inherit; }
[hidden] { display: none !important; }

.hub-shell { min-width: 0; min-height: 100vh; display: flex; }
.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 30; width: var(--sidebar); display: flex; flex-direction: column; padding: 28px 16px 18px; overflow: hidden; border-right: 1px solid var(--line); background: rgba(255, 255, 255, .92); backdrop-filter: blur(18px); }
.brand, .mobile-brand { display: inline-flex; align-items: center; color: var(--navy); text-decoration: none; }
.brand { padding: 0 2px; }
.brand-lockup { display: block; width: 180px; height: 160px; overflow: hidden; border-radius: 15px; background: transparent; }
.brand-lockup img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; mix-blend-mode: normal; }
.brand-mark { width: 35px; height: 35px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 12px; background: var(--navy); color: #d7f4ff; box-shadow: 0 8px 16px rgba(23, 53, 80, .14); }
.brand-mark svg { width: 27px; height: 27px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.brand-wordmark { font-size: 22px; font-weight: 700; letter-spacing: -.05em; }
.brand-wordmark span { color: var(--cyan); }
.sidebar-label { margin: 42px 12px 12px; color: var(--muted-light); font-size: 9px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.primary-nav { display: grid; gap: 4px; }
.nav-item { min-height: 42px; display: flex; align-items: center; gap: 12px; padding: 0 12px; border: 0; border-radius: 10px; background: transparent; color: #7890a0; text-align: left; font-size: 12px; font-weight: 600; transition: background .18s ease, color .18s ease, transform .18s ease; }
.nav-item:hover { background: #f1f8fc; color: var(--blue-strong); }
.nav-item.active { background: var(--sky); color: var(--blue-strong); box-shadow: inset 3px 0 0 var(--blue); }
.nav-icon { width: 23px; color: #89a2b2; font-size: 19px; line-height: 1; text-align: center; }
.nav-item.active .nav-icon { color: var(--blue); }
.nav-spark { font-size: 17px; }
.sidebar-bottom { margin-top: auto; display: grid; gap: 12px; }
.upgrade-card { display: flex; align-items: center; gap: 9px; padding: 11px 10px; border: 1px solid #ccebf3; border-radius: 12px; background: linear-gradient(135deg, #f0fbff, #e9f8fc); color: var(--navy); text-decoration: none; box-shadow: 0 8px 20px rgba(43, 136, 171, .06); }
.upgrade-card:hover { border-color: #8bcfe1; transform: translateY(-1px); }
.upgrade-icon { width: 27px; height: 27px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; background: var(--navy); color: var(--cyan); font-size: 13px; }
.upgrade-card b, .upgrade-card small { display: block; }.upgrade-card b { font-size: 10px; }.upgrade-card small { margin-top: 3px; color: var(--muted); font-size: 7px; }.upgrade-arrow { margin-left: auto; color: var(--blue); font-size: 14px; }
.memory-mini { display: flex; align-items: center; gap: 9px; width: 100%; padding: 11px 10px; border: 1px solid #dbeef8; border-radius: 12px; background: linear-gradient(135deg, #f3fbff, #edf9fc); color: var(--navy); text-align: left; }
.memory-mini-icon { width: 26px; height: 26px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; background: #d9f4fb; color: var(--blue); font-size: 14px; }
.memory-mini b, .memory-mini small, .account-link b, .account-link small { display: block; }
.memory-mini b, .account-link b { font-size: 10px; }
.memory-mini small, .account-link small { margin-top: 3px; color: var(--muted-light); font-size: 8px; }
.memory-arrow { margin-left: auto; color: var(--blue); font-size: 17px; }
.account-link { display: flex; align-items: center; gap: 9px; padding: 8px 10px; border: 0; border-top: 1px solid var(--line-soft); background: transparent; color: var(--navy); text-align: left; }
.account-more { margin-left: auto; color: var(--muted-light); font-size: 13px; letter-spacing: 2px; }
.avatar { width: 34px; height: 34px; display: inline-grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--navy); color: #fff; font-size: 10px; font-weight: 700; letter-spacing: .04em; }
.trust-welcome { max-width: 620px; margin: 13px 0 0; color: #587487; font-size: 11px; line-height: 1.65; }
.page-heading-actions { display: flex; align-items: center; justify-content: flex-end; gap: 9px; flex-wrap: wrap; }
@media (max-width: 650px) { .page-heading-actions { width: 100%; justify-content: stretch; }.page-heading-actions > button { flex: 1 1 180px; } }
.initials-avatar { background: linear-gradient(145deg, #173451, #168ec2); border-color: transparent; }
.avatar-small { width: 29px; height: 29px; font-size: 8px; }
.avatar-large { width: 46px; height: 46px; font-size: 13px; }
.google-avatar { background: #fff; border: 1px solid #d5e8f2; }
.google-mark { width: 20px; height: 20px; display: block; flex: 0 0 auto; }
.avatar-small .google-mark { width: 17px; height: 17px; }
.avatar-large .google-mark { width: 25px; height: 25px; }

.hub-main { width: calc(100% - var(--sidebar)); min-width: 0; min-height: 100vh; margin-left: var(--sidebar); display: flex; flex-direction: column; }
.hub-topbar { position: sticky; top: 0; z-index: 20; min-width: 0; height: var(--topbar); display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 0 clamp(22px, 4vw, 58px); border-bottom: 1px solid rgba(223, 234, 241, .9); background: rgba(246, 250, 255, .88); backdrop-filter: blur(18px); }
.mobile-brand-wrap { display: none; }
.topbar-context { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 10px; }
.secure-dot { width: 7px; height: 7px; border-radius: 50%; background: #3fa88f; box-shadow: 0 0 0 4px #e2f6f0; }
.topbar-divider { width: 1px; height: 13px; margin: 0 3px; background: var(--line); }
.topbar-actions { display: flex; align-items: center; min-width: 0; gap: 16px; }
.pro-button { min-height: 34px; display: inline-flex; align-items: center; gap: 5px; padding: 0 10px; border: 1px solid #c8e9f1; border-radius: 9px; background: #effbfe; color: #147c99; font-size: 9px; font-weight: 800; text-decoration: none; }.pro-button span { color: #0fa4c3; font-size: 12px; }.pro-button:hover { border-color: #8fd4e2; background: #e4f8fc; }
.add-health-button, .profile-trigger, .ask-button, .primary-button, .secondary-button, .quiet-button, .text-button, .upload-button { border: 0; }
.add-health-button { min-height: 38px; padding: 0 13px; border: 1px solid #cde3ef; border-radius: 9px; background: #fff; color: var(--blue-strong); font-size: 10px; font-weight: 700; box-shadow: 0 5px 14px rgba(35, 99, 138, .05); }
.add-health-button span { margin-right: 4px; font-size: 15px; font-weight: 400; vertical-align: -1px; }
.add-health-button:hover, .secondary-button:hover, .quiet-button:hover { border-color: #9bcae2; background: #f3fbff; }
.profile-trigger { display: flex; align-items: center; gap: 8px; padding: 4px 2px 4px 5px; background: transparent; color: var(--navy); }
.profile-trigger-name { font-size: 11px; font-weight: 700; }
.chevron { color: var(--muted-light); font-size: 15px; }

.category-bar { position: sticky; top: var(--topbar); z-index: 19; padding: 0 clamp(22px, 4vw, 58px); border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--paper) 88%, transparent); backdrop-filter: blur(18px); }
.category-bar-scroll { display: flex; align-items: center; gap: 4px; min-height: 48px; overflow-x: auto; scrollbar-width: none; }
.category-bar-scroll::-webkit-scrollbar { display: none; }
.category-bar-label { margin-right: 8px; color: var(--muted-light); font-size: 8px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; white-space: nowrap; }
.category-tab { position: relative; min-height: 31px; padding: 0 11px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--muted); font-size: 9px; font-weight: 700; white-space: nowrap; transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease; }
.category-tab:hover { color: var(--blue-strong); background: var(--sky); transform: translateY(-1px); }
.category-tab.active { border-color: color-mix(in srgb, var(--blue) 22%, var(--line)); background: var(--sky); color: var(--blue-strong); box-shadow: 0 5px 13px rgba(31, 84, 119, .06); }
.category-tab.active::after { content: ''; position: absolute; right: 11px; bottom: -9px; left: 11px; height: 2px; border-radius: 2px; background: var(--blue); }

body { transition: background-color .24s ease, color .24s ease; }
body[data-hub-theme="ask"] { --blue: #7659bd; --blue-strong: #5c439c; --cyan: #b088df; --sky: #f3effd; --sky-deep: #e8def8; --paper: #faf8ff; --line: #e5ddf2; --line-soft: #f0ebf8; --shadow: 0 14px 40px rgba(92, 67, 156, .09); }
body[data-hub-theme="health"] { --blue: #15949b; --blue-strong: #08767e; --cyan: #42c4bd; --sky: #eaf9f7; --sky-deep: #d6f1ee; --paper: #f5fcfb; --line: #dbeeea; --line-soft: #e9f5f3; --shadow: 0 14px 40px rgba(14, 118, 126, .08); }
body[data-hub-theme="medications"] { --blue: #277bc5; --blue-strong: #165fa7; --cyan: #58b4e9; --sky: #edf6ff; --sky-deep: #dceeff; --paper: #f6faff; --line: #dceaf5; --line-soft: #edf4f9; --shadow: 0 14px 40px rgba(22, 95, 167, .08); }
body[data-hub-theme="appointments"] { --blue: #a15aa4; --blue-strong: #7b3e82; --cyan: #df9bbb; --sky: #fff1f8; --sky-deep: #f9dce9; --paper: #fffafd; --line: #f0dfe9; --line-soft: #f8edf3; --shadow: 0 14px 40px rgba(123, 62, 130, .08); }
body[data-hub-theme="results"] { --blue: #cf6e5f; --blue-strong: #b45447; --cyan: #e7a184; --sky: #fff3ef; --sky-deep: #fbe2da; --paper: #fffaf8; --line: #f0e1dc; --line-soft: #f8eeeb; --shadow: 0 14px 40px rgba(180, 84, 71, .08); }
body[data-hub-theme="timeline"] { --blue: #2b9975; --blue-strong: #167153; --cyan: #67c8a5; --sky: #ebfaf4; --sky-deep: #d7f2e7; --paper: #f7fcfa; --line: #dceee6; --line-soft: #edf7f2; --shadow: 0 14px 40px rgba(22, 113, 83, .08); }
body[data-hub-theme="documents"] { --blue: #c17a33; --blue-strong: #9a5c20; --cyan: #e5ad6a; --sky: #fff7eb; --sky-deep: #f9e7ca; --paper: #fffdf9; --line: #f0e5d5; --line-soft: #f8f1e6; --shadow: 0 14px 40px rgba(154, 92, 32, .08); }

.view-stack { width: min(1220px, calc(100% - 2 * clamp(22px, 4vw, 58px))); min-width: 0; margin: 0 auto; flex: 1; }
.view { padding: 43px 0 35px; animation: view-in .25s ease; }
@keyframes view-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 27px; }
.eyebrow, .card-kicker { margin: 0 0 8px; color: var(--blue); font-size: 9px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.page-heading h1 { margin: 0; color: var(--navy); font-size: clamp(32px, 4vw, 51px); line-height: .98; letter-spacing: -.065em; }
.page-heading h1 .heading-spark { color: var(--cyan); font-size: .5em; vertical-align: top; letter-spacing: 0; }
.page-subtitle { max-width: 610px; margin: 13px 0 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.today-heading { align-items: flex-end; }
.today-heading h1 { font-size: clamp(33px, 4.1vw, 52px); }
.today-heading-actions { display: flex; align-items: center; gap: 12px; padding-bottom: 2px; }
.date-chip { color: var(--muted); font-size: 10px; white-space: nowrap; }
.ask-button, .primary-button { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 15px; border-radius: 10px; background: var(--navy); color: #fff; font-size: 10px; font-weight: 700; box-shadow: 0 8px 19px rgba(23, 53, 80, .15); }
.ask-button:hover, .primary-button:hover { background: #246288; transform: translateY(-1px); }
.button-spark { color: var(--cyan); font-size: 15px; }
.primary-button span { color: #a9e9f7; margin-left: 8px; }
.secondary-button { min-height: 37px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 0 12px; border: 1px solid #cfe3ee; border-radius: 9px; background: #fff; color: var(--blue-strong); font-size: 9px; font-weight: 700; }
.secondary-button span { color: var(--cyan); font-size: 13px; }
.quiet-button { min-height: 34px; padding: 0 10px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--blue-strong); font-size: 9px; font-weight: 700; }
.text-button { padding: 0; background: transparent; color: var(--blue-strong); font-size: 10px; font-weight: 700; text-decoration: none; }
.text-button span { margin-left: 8px; color: var(--cyan); }
.full-width { width: 100%; }
.icon-button { width: 31px; height: 31px; padding: 0; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--blue-strong); font-size: 17px; line-height: 1; }
.icon-button:hover { background: var(--sky); border-color: #b9dced; }

.daily-insight { min-height: 68px; display: flex; align-items: center; gap: 13px; padding: 13px 17px; border: 1px solid #ceeaf6; border-radius: var(--radius-sm); background: linear-gradient(100deg, #edfaff 0%, #f8fcff 70%); }
.insight-icon { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 11px; background: #d4f2fb; color: var(--blue); font-size: 16px; }
.daily-insight b { display: block; color: var(--navy); font-size: 11px; }
.daily-insight p { margin: 4px 0 0; color: var(--muted); font-size: 10px; }
.insight-action { margin-left: auto; border: 0; background: transparent; color: var(--blue-strong); font-size: 9px; font-weight: 700; white-space: nowrap; }
.insight-action span { margin-left: 8px; color: var(--cyan); }
.overview-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; margin: 12px 0 18px; }
.overview-stat { min-width: 0; display: flex; align-items: center; gap: 9px; padding: 13px 11px; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.8); color: var(--navy); text-align: left; transition: border .18s ease, box-shadow .18s ease, transform .18s ease; }
.overview-stat:hover { border-color: #b9dceb; box-shadow: var(--shadow); transform: translateY(-1px); }
.overview-icon { width: 28px; height: 28px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 9px; font-size: 13px; }
.overview-icon.blue, .info-icon.blue { background: var(--sky); color: var(--blue); }
.overview-icon.purple, .info-icon.purple { background: var(--purple-soft); color: var(--purple); }
.overview-icon.orange { background: var(--orange-soft); color: var(--orange); }
.overview-icon.cyan, .info-icon.cyan { background: #e4f9fc; color: #0e9eb9; }
.overview-stat > span:nth-child(2) { min-width: 0; }
.overview-stat small, .overview-stat b, .overview-stat em { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.overview-stat small { color: var(--muted-light); font-size: 8px; }
.overview-stat b { margin-top: 3px; color: var(--navy); font-size: 11px; }
.overview-stat em { margin-top: 3px; color: var(--blue); font-size: 8px; font-style: normal; }
.stat-arrow { margin-left: auto; color: #b6c8d2; font-size: 17px; }

.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(285px, .85fr); gap: 13px; align-items: start; }
.panel-card { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255,255,255,.9); box-shadow: var(--shadow); }
.card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.card-heading h2 { margin: 0; color: var(--navy); font-size: 17px; letter-spacing: -.035em; }
.card-heading a { padding-top: 5px; color: var(--blue-strong); font-size: 9px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.card-heading a span { margin-left: 7px; color: var(--cyan); }
.day-card { grid-row: span 2; padding: 22px; }
.medication-list { margin-top: 20px; }
.medication-row-wrap { border-top: 1px solid var(--line-soft); }
.medication-row-wrap:first-child { border-top: 0; }
.medication-row { display: flex; align-items: center; gap: 13px; padding: 14px 0; }
.medication-check { width: 30px; height: 30px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid #a8d4e8; border-radius: 50%; background: #fff; color: transparent; font-size: 13px; }
.medication-row.taken .medication-check { border-color: var(--green); background: var(--green); color: white; }
.medication-row.missed .medication-check { border-color: var(--coral); background: var(--coral-soft); color: var(--coral); }
.medication-row > div:nth-child(2) { min-width: 0; }
.medication-time { width: 42px; color: var(--muted-light); font-size: 9px; font-weight: 700; }
.medication-copy b, .medication-copy span, .medication-copy small { display: block; }
.medication-copy b { color: var(--navy); font-size: 12px; }
.medication-copy span { margin-top: 3px; color: var(--muted); font-size: 9px; }
.medication-copy small { margin-top: 4px; color: var(--muted-light); font-size: 8px; }
.medication-status { margin-left: auto; color: var(--muted-light); font-size: 9px; white-space: nowrap; }
.medication-row.taken .medication-status { color: var(--green); font-weight: 700; }
.medication-row.missed .medication-status { color: var(--coral); font-weight: 700; }
.medication-actions { display: flex; align-items: center; gap: 9px; margin-left: auto; }
.medication-actions .medication-status { margin-left: 0; }
.missed-button { padding: 0; border: 0; background: transparent; color: var(--coral); font-size: 8px; font-weight: 700; }
.card-footnote, .library-disclaimer, .result-disclaimer { display: flex; gap: 8px; margin-top: 16px; padding-top: 13px; border-top: 1px solid var(--line-soft); color: var(--muted-light); font-size: 8px; line-height: 1.55; }
.card-footnote p, .library-disclaimer p, .result-disclaimer p { margin: 0; }
.footnote-icon, .library-disclaimer > span, .result-disclaimer > span { width: 14px; height: 14px; display: inline-grid; place-items: center; flex: 0 0 auto; border: 1px solid #bfd3df; border-radius: 50%; color: var(--blue); font-size: 8px; font-weight: 700; }
.appointment-card { padding: 22px; }
.appointment-preview { display: flex; align-items: center; gap: 14px; margin-top: 20px; }
.appointment-date { width: 53px; height: 61px; display: grid; place-content: center; flex: 0 0 auto; border: 1px solid #d9d0f0; border-radius: 13px; background: var(--purple-soft); color: var(--purple); text-align: center; }
.appointment-date b { font-size: 24px; line-height: 1; letter-spacing: -.06em; }
.appointment-date span { margin-top: 5px; font-size: 8px; font-weight: 800; letter-spacing: .14em; }
.appointment-details { min-width: 0; }
.appointment-details > b, .appointment-details > span, .appointment-details > small { display: block; }
.appointment-details > b { font-size: 12px; }
.appointment-details > span { margin-top: 4px; color: var(--muted); font-size: 9px; }
.appointment-details > small { margin-top: 6px; color: var(--muted); font-size: 8px; }
.appointment-details > small i { margin-right: 4px; color: var(--purple); font-style: normal; }
.appointment-actions { display: flex; align-items: center; gap: 12px; margin-top: 20px; }
.trend-card { padding: 22px; }
.trend-layout { display: grid; grid-template-columns: .75fr 1.25fr; gap: 16px; align-items: end; margin-top: 18px; }
.trend-summary > span, .trend-summary > b, .trend-summary > em, .trend-updated { display: block; }
.trend-summary > span { color: var(--muted); font-size: 9px; }
.trend-summary > b { margin-top: 6px; font-size: 25px; letter-spacing: -.06em; }
.trend-summary > b small { color: var(--muted); font-size: 12px; font-weight: 500; letter-spacing: -.02em; }
.trend-summary > em { margin-top: 6px; color: var(--green); font-size: 8px; font-style: normal; line-height: 1.45; }
.trend-summary > em i { margin-right: 4px; font-style: normal; }
.trend-updated { margin-top: 12px; color: var(--muted-light); font-size: 8px; }
.mini-chart { min-width: 0; }
.mini-chart svg { width: 100%; height: 106px; display: block; overflow: visible; }
.chart-gridline { fill: none; stroke: #edf2f5; stroke-width: 1; }
.chart-area { fill: url(#trend-fill); }
.chart-line { fill: none; stroke: var(--blue); stroke-width: 2.5; stroke-linecap: round; }
.mini-chart circle { fill: #fff; stroke: var(--blue); stroke-width: 2.5; }
.chart-labels, .chart-axis { display: flex; justify-content: space-between; margin-top: 2px; color: var(--muted-light); font-size: 7px; }
.trend-pills, .measurement-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 19px; }
.trend-pills span, .measurement-chips span { padding: 7px 8px; border-radius: 7px; background: #f7fafc; color: var(--muted); font-size: 8px; }
.trend-pills b, .measurement-chips b { margin-left: 4px; color: var(--navy); }
.pill-dot, .blue-dot, .purple-dot, .green-dot { display: inline-block; width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; background: var(--blue); }
.blue-dot { background: var(--blue); }
.purple-dot { background: var(--purple); }
.green-dot { background: var(--green); }
.tasks-card { padding: 22px; }
.task-count, .soft-count { color: var(--muted-light); font-size: 9px; }
.task-list { margin-top: 17px; }
.task-row { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid var(--line-soft); }
.task-row:first-child { border-top: 0; }
.task-check { width: 19px; height: 19px; display: grid; place-items: center; flex: 0 0 auto; padding: 0; border: 1px solid #bcd4df; border-radius: 6px; background: #fff; color: transparent; font-size: 11px; }
.task-row.done .task-check { border-color: var(--green); background: var(--green); color: #fff; }
.task-row.done b { color: var(--muted-light); text-decoration: line-through; }
.task-row b { color: var(--navy); font-size: 10px; font-weight: 600; }
.task-row small { display: block; margin-top: 3px; color: var(--muted-light); font-size: 8px; }
.task-row > span:last-child { margin-left: auto; color: var(--muted-light); font-size: 8px; }
.ask-prompt-card { display: flex; gap: 15px; padding: 22px; background: linear-gradient(135deg, #f5fcff, #eaf8fc); border-color: #d2edf5; }
.ask-orb { width: 39px; height: 39px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 13px; background: var(--navy); color: var(--cyan); font-size: 17px; box-shadow: 0 8px 15px rgba(18, 62, 91, .12); }
.doctorai-head-icon { display: block; width: 21px; height: 22px; object-fit: contain; }
.assistant-mark .doctorai-head-icon { width: 25px; height: 25px; }
.chat-welcome-icon .doctorai-head-icon { width: 34px; height: 35px; }
.ask-orb .doctorai-head-icon { width: 26px; height: 27px; }
.rail-icon .doctorai-head-icon { width: 19px; height: 20px; }
.ask-prompt-card h2 { margin: 0; font-size: 17px; letter-spacing: -.04em; }
.ask-prompt-card p:not(.card-kicker) { max-width: 320px; margin: 7px 0 12px; color: var(--muted); font-size: 9px; line-height: 1.55; }
.activity-card { padding: 22px; }
.mini-activity { margin-top: 15px; }
.mini-activity-row { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid var(--line-soft); }
.mini-activity-row:first-child { border-top: 0; }
.activity-icon { width: 23px; height: 23px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; background: var(--sky); color: var(--blue); font-size: 11px; }
.mini-activity-row b, .mini-activity-row small { display: block; }
.mini-activity-row b { font-size: 9px; }
.mini-activity-row small { margin-top: 3px; color: var(--muted-light); font-size: 8px; }
.mini-activity-row time { margin-left: auto; align-self: flex-start; color: var(--muted-light); font-size: 8px; }
.safety-note { display: flex; align-items: center; gap: 9px; margin-top: 18px; padding: 11px 13px; border: 1px solid #e4edf2; border-radius: 11px; background: rgba(255,255,255,.6); }
.safety-note > span { color: var(--blue); font-size: 13px; }
.safety-note p { margin: 0; color: var(--muted); font-size: 8px; line-height: 1.5; }
.safety-note p b { color: var(--navy); }
.safety-note button { margin-left: auto; padding: 0; border: 0; background: transparent; color: var(--blue-strong); font-size: 8px; font-weight: 700; white-space: nowrap; }

/* Ask DoctorAI */
.privacy-badge { display: inline-flex; align-items: center; gap: 5px; padding: 8px 10px; border-radius: 99px; background: var(--green-soft); color: var(--green); font-size: 9px; white-space: nowrap; }
.privacy-badge i, .timeline-note i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.ask-layout { display: grid; grid-template-columns: 235px minmax(0, 1fr); gap: 14px; align-items: stretch; }
.context-rail { display: flex; flex-direction: column; padding: 18px 15px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow); }
.context-rail-head { display: flex; align-items: center; gap: 9px; padding-bottom: 17px; border-bottom: 1px solid var(--line-soft); }
.rail-icon { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; background: var(--sky); color: var(--blue); font-size: 13px; }
.context-rail-head b, .context-rail-head small { display: block; }
.context-rail-head b { font-size: 10px; }
.context-rail-head small { margin-top: 3px; color: var(--muted-light); font-size: 8px; }
.context-toggle-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 17px 0 12px; }
.context-toggle-row b, .context-toggle-row small { display: block; }
.context-toggle-row b { font-size: 10px; }
.context-toggle-row small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.switch { position: relative; display: inline-block; width: 32px; height: 19px; flex: 0 0 auto; }
.switch input { position: absolute; opacity: 0; }
.switch span { position: absolute; inset: 0; border-radius: 99px; background: #c9d8e0; transition: .18s ease; }
.switch span::after { content: ''; position: absolute; width: 13px; height: 13px; top: 3px; left: 3px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(20,50,70,.2); transition: .18s ease; }
.switch input:checked + span { background: var(--blue); }
.switch input:checked + span::after { transform: translateX(13px); }
.context-list { display: grid; gap: 9px; padding: 8px 0 17px; border-bottom: 1px solid var(--line-soft); }
.context-list span { color: var(--muted); font-size: 8px; }
.context-list i { display: inline-grid; place-items: center; width: 15px; height: 15px; margin-right: 7px; border-radius: 50%; background: var(--green-soft); color: var(--green); font-size: 8px; font-style: normal; }
.rail-link { display: flex; justify-content: space-between; padding: 15px 0; border: 0; background: transparent; color: var(--blue-strong); font-size: 9px; font-weight: 700; text-align: left; }
.rail-link span, .legacy-link span { color: var(--cyan); }
.rail-safety { margin-top: auto; padding: 11px; border-radius: 10px; background: var(--coral-soft); }
.rail-safety b { color: var(--coral); font-size: 9px; }
.rail-safety p { margin: 5px 0 0; color: #9c6b67; font-size: 8px; line-height: 1.5; }
.legacy-link { display: flex; justify-content: space-between; gap: 8px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line-soft); color: var(--muted); font-size: 8px; line-height: 1.4; text-decoration: none; }
.conversation-panel { min-height: 620px; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-deep); overflow: hidden; }
.conversation-header { height: 67px; display: flex; align-items: center; justify-content: space-between; padding: 0 21px; border-bottom: 1px solid var(--line-soft); }
.assistant-identity { display: flex; align-items: center; gap: 10px; }
.assistant-mark { width: 33px; height: 33px; display: grid; place-items: center; border-radius: 11px; background: var(--navy); color: var(--cyan); font-size: 16px; }
.assistant-identity b, .assistant-identity small { display: block; }
.assistant-identity b { font-size: 11px; }
.assistant-identity small { margin-top: 4px; color: var(--muted-light); font-size: 8px; }
.assistant-identity small i { display: inline-block; width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; background: var(--green); }
.conversation-scroll { flex: 1; min-height: 300px; max-height: 440px; overflow: auto; padding: 30px 28px 15px; scroll-behavior: smooth; }
.chat-welcome { max-width: 410px; margin: 32px auto 20px; text-align: center; }
.chat-welcome-icon { width: 46px; height: 46px; display: grid; place-items: center; margin: 0 auto 14px; border-radius: 15px; background: var(--sky); color: var(--blue); font-size: 20px; }
.chat-welcome h2 { margin: 0; font-size: 20px; letter-spacing: -.04em; }
.chat-welcome p { margin: 9px auto 0; color: var(--muted); font-size: 10px; line-height: 1.6; }
.chat-messages { display: grid; gap: 15px; }
.chat-message { display: flex; gap: 10px; max-width: 75%; }
.chat-message.user { margin-left: auto; flex-direction: row-reverse; }
.chat-message-avatar { width: 26px; height: 26px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 9px; background: var(--navy); color: var(--cyan); font-size: 12px; }
.chat-message-avatar .doctorai-head-icon { width: 20px; height: 20px; }
.chat-message.user .chat-message-avatar { background: var(--sky-deep); color: var(--blue-strong); font-size: 8px; font-weight: 700; }
.chat-message-body { min-width: 0; }
.chat-message-body small { display: block; margin-bottom: 4px; color: var(--muted-light); font-size: 8px; font-weight: 700; }
.chat-message-body p { margin: 0; padding: 10px 12px; border-radius: 13px 13px 13px 3px; background: #f3f8fb; color: #476274; font-size: 10px; line-height: 1.6; white-space: pre-wrap; }
.chat-message.user .chat-message-body p { border-radius: 13px 13px 3px 13px; background: var(--navy); color: #fff; }
.chat-message.loading .chat-message-body p { color: var(--muted); }
.delete-item { margin-top: 7px; padding: 0; border: 0; background: transparent; color: var(--coral); font-size: 8px; font-weight: 700; }
.delete-item:hover { text-decoration: underline; }
.library-meta .delete-item { display: block; margin-left: auto; }
.library-meta .library-item-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin-top: 5px; }
.library-meta .library-item-actions .delete-item { display: inline-block; margin: 0; }
.medication-edit-link { min-height: 32px; padding: 6px 8px; border: 1px solid #c9e8f1; border-radius: 7px; background: #f3fbfd; color: var(--blue-strong); font-size: 8px; font-weight: 700; }
.medication-edit-link:hover, .medication-edit-link:focus-visible { border-color: #8fcfe0; background: var(--sky); }
.medication-clear-refill { display: flex; align-items: flex-start; gap: 8px; }
.medication-clear-refill input { width: auto; margin-top: 2px; }
.past-item .delete-item { display: block; margin-top: 8px; }
.thinking-dots { display: inline-flex; gap: 3px; }
.thinking-dots i { width: 5px; height: 5px; border-radius: 50%; background: var(--blue); animation: bounce 1s infinite; }
.thinking-dots i:nth-child(2) { animation-delay: .12s; }.thinking-dots i:nth-child(3) { animation-delay: .24s; }
@keyframes bounce { 50% { opacity: .3; transform: translateY(-2px); } }
.quick-asks { display: flex; flex-wrap: wrap; gap: 7px; padding: 0 21px 15px; }
.quick-asks button { min-height: 31px; padding: 0 10px; border: 1px solid #dce9ef; border-radius: 99px; background: #fff; color: var(--muted); font-size: 8px; }
.quick-asks button:hover { border-color: #a5d5e7; color: var(--blue-strong); background: var(--sky); }
.quick-asks span { margin-left: 5px; color: var(--cyan); }
.chat-composer { margin: 0 19px; border: 1px solid #c9dce6; border-radius: 13px; background: #fff; box-shadow: 0 6px 20px rgba(38,95,130,.06); overflow: hidden; }
.chat-composer:focus-within { border-color: var(--blue); box-shadow: 0 0 0 3px #e2f5fc; }
.chat-composer textarea { width: 100%; min-height: 57px; max-height: 150px; padding: 13px 14px 5px; border: 0; outline: 0; resize: vertical; color: var(--navy); font-size: 11px; line-height: 1.5; }
.chat-composer textarea::placeholder { color: #9babb6; }
.composer-row { display: flex; align-items: center; gap: 12px; padding: 6px 7px 7px 13px; color: var(--muted-light); font-size: 8px; }
.composer-row span:nth-child(2) { margin-left: auto; }
.composer-row button { min-height: 32px; padding: 0 12px; border: 0; border-radius: 8px; background: var(--navy); color: #fff; font-size: 9px; font-weight: 700; }
.composer-row button:hover { background: var(--blue-strong); }.composer-row button b { margin-left: 6px; color: var(--cyan); }
.chat-disclaimer { margin: 11px 18px 14px; color: var(--muted-light); font-size: 8px; text-align: center; }

/* My Health */
.health-overview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.health-snapshot, .memory-card { min-height: 249px; padding: 22px; }
.profile-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 20px; }
.profile-fact { min-width: 0; padding: 10px; border-radius: 10px; background: #f7fafc; }
.profile-fact small, .profile-fact b { display: block; }.profile-fact small { color: var(--muted-light); font-size: 8px; }.profile-fact b { margin-top: 5px; overflow: hidden; color: var(--navy); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.health-note { display: flex; gap: 7px; margin-top: 16px; padding: 10px; border-radius: 9px; background: var(--sky); color: var(--muted); font-size: 8px; line-height: 1.5; }.health-note span { width: 14px; height: 14px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: #d8f1fb; color: var(--blue); font-size: 8px; }.health-note p { margin: 0; }
.memory-card { background: linear-gradient(135deg, #f6fcff, #ebf8fc); border-color: #d3edf5; }.memory-card-top { display: flex; align-items: center; gap: 11px; }.memory-large-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 12px; background: var(--navy); color: var(--cyan); font-size: 16px; }.memory-card-top .switch { margin-left: auto; }.memory-card > p { max-width: 480px; margin: 13px 0 14px; color: var(--muted); font-size: 9px; line-height: 1.6; }.memory-approved { display: flex; flex-wrap: wrap; gap: 6px; }.memory-approved span { padding: 6px 8px; border: 1px solid #d1ebf3; border-radius: 6px; background: rgba(255,255,255,.65); color: var(--blue-strong); font-size: 8px; }.memory-card-actions { display: flex; align-items: center; gap: 15px; margin-top: 16px; }.section-title-row { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin: 31px 0 14px; }.section-title-row h2 { margin: 0; font-size: 21px; letter-spacing: -.05em; }.health-info-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px; }.info-card { padding: 18px; }.info-card-heading { display: flex; align-items: center; gap: 10px; }.info-icon { width: 30px; height: 30px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 9px; font-size: 13px; }.info-icon.coral, .overview-icon.coral { background: var(--coral-soft); color: var(--coral); }.info-icon.dark { background: var(--navy); color: #b9f3ff; }.info-card-heading > div { min-width: 0; }.info-card-heading h3 { margin: 0; font-size: 12px; letter-spacing: -.02em; }.info-card-heading small { display: block; margin-top: 4px; color: var(--muted-light); font-size: 8px; }.info-card-heading > button { margin-left: auto; padding: 0; border: 0; background: transparent; color: var(--blue-strong); font-size: 8px; font-weight: 700; }.tag-list { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 17px; }.tag-list span { padding: 7px 8px; border-radius: 7px; background: var(--sky); color: var(--blue-strong); font-size: 8px; }.tag-list .muted-tag { background: #f7fafc; color: var(--muted-light); }.allergy-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 14px; padding-top: 11px; border-top: 1px solid var(--line-soft); }.allergy-row b { font-size: 9px; }.allergy-row span { color: var(--muted); font-size: 8px; }.allergy-row .status-ok { color: var(--green); font-weight: 700; }.provider-row { display: flex; align-items: center; gap: 9px; margin-top: 13px; padding-top: 11px; border-top: 1px solid var(--line-soft); }.provider-avatar { width: 25px; height: 25px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; background: var(--purple-soft); color: var(--purple); font-size: 8px; font-weight: 700; }.provider-avatar.pale { background: var(--sky); color: var(--blue); }.provider-row b, .provider-row small { display: block; }.provider-row b { font-size: 9px; }.provider-row small { margin-top: 3px; color: var(--muted-light); font-size: 8px; }.provider-arrow { margin-left: auto; color: var(--muted-light); }.emergency-card { background: var(--navy); color: #fff; border-color: var(--navy); }.emergency-card .info-card-heading h3 { color: #fff; }.emergency-card .info-card-heading small { color: #abc1ce; }.emergency-card .info-card-heading > button { color: #a9e9f7; }.emergency-facts { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin-top: 19px; }.emergency-facts span { padding: 9px; border: 1px solid rgba(180, 222, 239, .15); border-radius: 9px; background: rgba(255,255,255,.06); }.emergency-facts small, .emergency-facts b { display: block; }.emergency-facts small { color: #9db6c4; font-size: 7px; }.emergency-facts b { margin-top: 5px; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }

/* Medication and appointment views */
.medication-view-grid, .appointments-layout { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(275px, .7fr); gap: 13px; align-items: start; }.library-card, .upcoming-card { padding: 22px; }.library-list { margin-top: 18px; }.library-item { display: grid; grid-template-columns: 36px minmax(0,1fr) auto; gap: 11px; align-items: center; padding: 14px 0; }.library-item-wrap { border-top: 1px solid var(--line-soft); }.library-item-wrap:first-child { border-top: 0; }.medicine-icon { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 11px; background: var(--sky); color: var(--blue); font-size: 15px; }.library-copy b, .library-copy span, .library-copy small { display: block; }.library-copy b { font-size: 11px; }.library-copy span { margin-top: 4px; color: var(--muted); font-size: 9px; }.library-copy small { margin-top: 5px; color: var(--muted-light); font-size: 8px; }.library-meta { text-align: right; }.library-meta b, .library-meta span { display: block; }.library-meta b { color: var(--green); font-size: 9px; }.library-meta span { margin-top: 4px; color: var(--muted-light); font-size: 8px; }.medication-side { display: grid; gap: 13px; }.refill-card { padding: 22px; }.refill-icon { width: 35px; height: 35px; display: grid; place-items: center; margin-bottom: 17px; border-radius: 11px; background: var(--orange-soft); color: var(--orange); font-size: 18px; }.refill-card h2 { margin: 0; font-size: 18px; letter-spacing: -.04em; }.refill-card > p:not(.card-kicker) { margin: 9px 0 15px; color: var(--muted); font-size: 9px; line-height: 1.6; }.refill-progress { height: 7px; overflow: hidden; border-radius: 99px; background: #f6e6d4; }.refill-progress span { display: block; height: 100%; border-radius: inherit; background: var(--orange); }.refill-meta { display: flex; justify-content: space-between; margin: 8px 0 18px; color: var(--muted-light); font-size: 8px; }.refill-meta b { color: var(--orange); }.history-card { padding: 22px; }.history-item { display: flex; align-items: center; gap: 9px; padding-top: 14px; margin-top: 14px; border-top: 1px solid var(--line-soft); }.history-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--muted-light); }.history-dot.changed { background: var(--purple); }.history-item b, .history-item small { display: block; }.history-item b { font-size: 9px; }.history-item small { margin-top: 3px; color: var(--muted-light); font-size: 8px; }.history-item > span:last-child { margin-left: auto; color: var(--muted-light); }
.medication-safety-alerts { display: grid; gap: 7px; padding: 0 0 13px; }
.medication-safety-alert { display: flex; gap: 9px; align-items: flex-start; padding: 10px 11px; border: 1px solid; border-radius: 10px; }
.medication-safety-alert.critical { border-color: #efb8b4; background: #fff1f0; color: #8f2f2b; }
.medication-safety-alert.caution { border-color: #f0d3a9; background: #fff8ed; color: #875722; }
.safety-alert-icon { width: 21px; height: 21px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; color: #fff; font-size: 12px; font-weight: 900; }
.critical .safety-alert-icon { background: #d64c47; }
.caution .safety-alert-icon { background: #d18a2b; }
.medication-safety-alert b, .medication-safety-alert p, .medication-safety-alert small { display: block; }
.medication-safety-alert b { font-size: 9px; }
.medication-safety-alert p { margin: 3px 0 0; color: inherit; font-size: 8px; line-height: 1.45; }
.medication-safety-alert small { margin-top: 5px; color: inherit; opacity: .75; font-size: 7px; line-height: 1.4; }
.clash-panel { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line-soft); }
.clash-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.clash-heading h2 { margin: 0; font-size: 16px; letter-spacing: -.04em; }
.clash-heading > span { padding: 5px 7px; border-radius: 6px; background: #e8f8fc; color: var(--blue-strong); font-size: 8px; font-weight: 800; }
.clash-description { margin: 8px 0 12px; color: var(--muted); font-size: 9px; line-height: 1.55; }
.clash-status .pro-gate { margin-top: 10px; }
.clash-box { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border: 1px solid; border-radius: 11px; }
.clash-box > span { width: 24px; height: 24px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; color: #fff; font-size: 13px; font-weight: 900; }
.clash-box-good { border-color: #b9e4d3; background: #effbf5; color: #176a4e; }
.clash-box-good > span { background: #249b72; }
.clash-box-note { border-color: #c4dce9; background: #f0f7fb; color: #24516f; }
.clash-box-note > span { background: #367a9f; }
.clash-box-warning, .clash-box-danger { border-color: #efb8b4; background: #fff1f0; color: #8f2f2b; }
.clash-box-warning > span, .clash-box-danger > span { background: #d64c47; }
.clash-box-caution { border-color: #f0d3a9; background: #fff8ed; color: #875722; }
.clash-box-caution > span { background: #c9842c; }
.clash-box b, .clash-box p { display: block; }
.clash-box b { font-size: 9px; }
.clash-box p { margin: 4px 0 0; color: inherit; font-size: 8px; line-height: 1.5; }
.clash-footnote { display: block; margin-top: 9px; color: var(--muted-light); font-size: 7px; line-height: 1.5; }
.appointment-large { display: flex; gap: 20px; margin-top: 21px; padding: 18px; border: 1px solid #e4def5; border-radius: 14px; background: linear-gradient(135deg, #fbfaff, #f8f5ff); }.large-date { width: 61px; height: 78px; display: grid; align-content: center; flex: 0 0 auto; border-radius: 12px; background: #fff; color: var(--purple); text-align: center; box-shadow: 0 5px 14px rgba(102, 73, 168, .08); }.large-date span, .large-date small { font-size: 8px; font-weight: 800; text-transform: uppercase; }.large-date b { margin: 4px 0; font-size: 27px; line-height: 1; letter-spacing: -.07em; }.large-appointment-copy { min-width: 0; }.appointment-type { color: var(--purple); font-size: 9px; font-weight: 700; }.appointment-type span { margin-right: 5px; }.large-appointment-copy h3 { margin: 8px 0 5px; font-size: 17px; letter-spacing: -.04em; }.large-appointment-copy p { margin: 0; color: var(--muted); font-size: 9px; }.large-appointment-copy p span { color: var(--purple); }.appointment-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 13px; }.appointment-tags span { padding: 6px 8px; border-radius: 6px; background: #eee9fa; color: var(--purple); font-size: 8px; }.appointment-tags span + span { background: var(--green-soft); color: var(--green); }.large-appointment-actions { display: flex; align-items: center; gap: 10px; margin-top: 15px; }.appointment-prep { display: flex; align-items: center; gap: 10px; margin-top: 14px; padding: 11px 12px; border-radius: 10px; background: #f5fafc; }.appointment-prep > span { color: var(--blue); }.appointment-prep b, .appointment-prep p { display: block; }.appointment-prep b { font-size: 9px; }.appointment-prep p { margin: 4px 0 0; color: var(--muted); font-size: 8px; }.appointment-prep .text-button { margin-left: auto; white-space: nowrap; }.past-appointments { padding: 22px; }.past-item { padding: 14px 0; border-top: 1px solid var(--line-soft); }.past-item:first-of-type { margin-top: 10px; }.past-item div { display: flex; justify-content: space-between; gap: 10px; }.past-item b { font-size: 9px; }.past-item span { color: var(--muted); font-size: 8px; }.past-item time, .past-item small { display: block; }.past-item time { margin-top: 7px; color: var(--muted-light); font-size: 8px; }.past-item small { margin-top: 5px; color: var(--green); font-size: 8px; }

/* Results, timeline and documents */
.results-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 13px; align-items: start; }.result-list-card, .measurements-card { padding: 22px; }.upload-button { min-height: 31px; display: inline-flex; align-items: center; padding: 0 9px; border: 1px solid #cfe3ee; border-radius: 8px; background: #fff; color: var(--blue-strong); font-size: 8px; font-weight: 700; }.upload-button:hover { background: var(--sky); }.result-list { margin-top: 16px; }.result-item { display: grid; grid-template-columns: 31px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 13px 0; border-top: 1px solid var(--line-soft); }.result-item:first-child { border-top: 0; }.result-file-icon { width: 31px; height: 34px; display: grid; place-items: center; border-radius: 8px; background: var(--coral-soft); color: var(--coral); font-size: 11px; }.result-copy b, .result-copy span, .result-copy small { display: block; }.result-copy b { font-size: 10px; }.result-copy span { margin-top: 3px; color: var(--muted); font-size: 8px; }.result-copy small { margin-top: 4px; color: var(--muted-light); font-size: 7px; }.result-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }.result-actions button { padding: 0; border: 0; background: transparent; color: var(--blue-strong); font-size: 8px; font-weight: 700; white-space: nowrap; }.result-disclaimer { margin-top: 13px; }.trend-tabs { display: flex; gap: 4px; margin-top: 18px; padding: 3px; border-radius: 8px; background: #f3f8fb; }.trend-tabs button { min-height: 28px; flex: 1; padding: 0 6px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); font-size: 8px; font-weight: 700; }.trend-tabs button.active { background: #fff; color: var(--blue-strong); box-shadow: 0 2px 7px rgba(33,92,126,.08); }.large-trend-value { margin-top: 19px; }.large-trend-value b { display: block; font-size: 27px; letter-spacing: -.07em; }.large-trend-value b small { color: var(--muted); font-size: 12px; letter-spacing: -.02em; }.large-trend-value span, .large-trend-value em { display: block; }.large-trend-value span { margin-top: 5px; color: var(--muted); font-size: 8px; }.large-trend-value em { margin-top: 7px; color: var(--green); font-size: 8px; font-style: normal; }.large-chart { margin-top: 10px; }.large-chart svg { width: 100%; height: 150px; display: block; overflow: visible; }.large-area { fill: #e6f7fc; }.large-line { fill: none; stroke: var(--blue); stroke-width: 3; stroke-linecap: round; }.large-chart circle { fill: #fff; stroke: var(--blue); stroke-width: 3; }.measurement-chips { margin-top: 16px; }.timeline-toolbar, .document-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }.filter-tabs, .document-filters { display: flex; gap: 4px; flex-wrap: wrap; }.filter-tabs button, .document-filters button { min-height: 31px; padding: 0 10px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--muted); font-size: 8px; font-weight: 700; }.filter-tabs button:hover, .document-filters button:hover { color: var(--blue-strong); background: var(--sky); }.filter-tabs button.active, .document-filters button.active { border-color: #cce4ee; background: #fff; color: var(--blue-strong); box-shadow: 0 4px 10px rgba(31,84,119,.05); }.timeline-note { display: inline-flex; align-items: center; gap: 6px; color: var(--muted-light); font-size: 8px; white-space: nowrap; }.timeline-card { padding: 21px 26px; }.timeline-list { position: relative; }.timeline-list::before { content: ''; position: absolute; top: 13px; bottom: 16px; left: 8px; width: 1px; background: #dbe8ef; }.timeline-entry { position: relative; display: grid; grid-template-columns: 18px 1fr auto; gap: 14px; padding: 14px 0; }.timeline-dot { position: relative; z-index: 1; width: 17px; height: 17px; display: grid; place-items: center; border: 4px solid #fff; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 1px #b9dbe9; color: #fff; font-size: 7px; }.timeline-entry.appointment .timeline-dot { background: var(--purple); box-shadow: 0 0 0 1px #d5c9ed; }.timeline-entry.result .timeline-dot { background: var(--coral); box-shadow: 0 0 0 1px #f0c7c3; }.timeline-entry.medication .timeline-dot { background: var(--green); box-shadow: 0 0 0 1px #bfe5d9; }.timeline-entry.symptom .timeline-dot { background: var(--orange); box-shadow: 0 0 0 1px #f0d5b8; }.timeline-entry h3 { margin: 0; font-size: 11px; }.timeline-entry p { margin: 5px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }.timeline-entry time { color: var(--muted-light); font-size: 8px; white-space: nowrap; }.document-drop { display: flex; align-items: center; gap: 13px; min-height: 76px; padding: 13px 17px; margin-bottom: 18px; border: 1px dashed #b8d8e6; border-radius: 14px; background: linear-gradient(100deg, #effaff, #fbfdff); }.drop-icon { width: 35px; height: 35px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 11px; background: #d9f2fb; color: var(--blue); font-size: 17px; }.document-drop b { display: block; font-size: 10px; }.document-drop p { margin: 4px 0 0; color: var(--muted); font-size: 8px; }.document-drop label { margin-left: auto; }.document-drop .secondary-button { margin-left: auto; white-space: nowrap; }.document-toolbar { padding-bottom: 10px; border-bottom: 1px solid var(--line); }.document-toolbar > span { color: var(--muted-light); font-size: 8px; }.documents-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }.document-card { position: relative; min-height: 150px; padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.9); box-shadow: var(--shadow); }.document-card:hover { border-color: #b9dceb; }.document-card .document-type { display: inline-flex; padding: 5px 7px; border-radius: 5px; background: var(--coral-soft); color: var(--coral); font-size: 7px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }.document-card h3 { margin: 16px 0 4px; font-size: 11px; line-height: 1.35; }.document-card p { margin: 0; color: var(--muted); font-size: 8px; line-height: 1.5; }.document-card small { display: block; margin-top: 13px; color: var(--muted-light); font-size: 7px; }.document-card-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 13px; }.document-card-actions button { padding: 0; border: 0; background: transparent; color: var(--blue-strong); font-size: 8px; font-weight: 700; }.documents-permission { display: flex; align-items: center; gap: 9px; margin-top: 18px; padding: 12px 14px; border: 1px solid #e2edf2; border-radius: 11px; }.documents-permission > span { color: var(--blue); }.documents-permission p { margin: 0; color: var(--muted); font-size: 8px; line-height: 1.5; }.documents-permission p b { color: var(--navy); }.documents-permission button { margin-left: auto; padding: 0; border: 0; background: transparent; color: var(--blue-strong); font-size: 8px; font-weight: 700; white-space: nowrap; }

/* Drawers and dialogs */
.profile-drawer { position: fixed; inset: 0; z-index: 80; display: flex; justify-content: flex-end; }.drawer-backdrop { position: absolute; inset: 0; border: 0; background: rgba(15, 41, 66, .32); backdrop-filter: blur(3px); }.drawer-panel { position: relative; width: min(385px, calc(100% - 24px)); height: 100%; overflow: auto; padding: 28px 22px 24px; background: #fff; box-shadow: -18px 0 50px rgba(21,60,89,.18); animation: drawer-in .22s ease; }.drawer-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; padding-bottom: 20px; border-bottom: 1px solid var(--line-soft); }.drawer-header h2 { margin: 0; font-size: 24px; letter-spacing: -.05em; }.drawer-profile { display: flex; align-items: center; gap: 11px; padding: 19px 0; }.drawer-profile > div { min-width: 0; }.drawer-profile b, .drawer-profile small { display: block; }.drawer-profile b { font-size: 12px; }.drawer-profile small { margin-top: 4px; color: var(--muted); font-size: 8px; }.drawer-profile .quiet-button { margin-left: auto; }.drawer-section { padding: 17px 0; border-top: 1px solid var(--line-soft); }.drawer-label { margin: 0 0 9px; color: var(--muted-light); font-size: 8px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }.drawer-row { display: flex; align-items: center; gap: 10px; width: 100%; padding: 11px 0; border: 0; background: transparent; color: var(--navy); text-align: left; text-decoration: none; }.drawer-row:hover { color: var(--blue-strong); }.drawer-row-icon { width: 30px; height: 30px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 9px; font-size: 13px; }.drawer-row-icon.cyan { background: #e4f9fc; color: #0e9eb9; }.drawer-row-icon.blue { background: var(--sky); color: var(--blue); }.drawer-row-icon.purple { background: var(--purple-soft); color: var(--purple); }.drawer-row b, .drawer-row small { display: block; }.drawer-row b { font-size: 10px; }.drawer-row small { margin-top: 4px; color: var(--muted); font-size: 8px; }.drawer-row > span:last-child { margin-left: auto; color: var(--muted-light); }.drawer-safety { margin: 14px 0 20px; padding: 14px; border-radius: 12px; background: var(--coral-soft); }.drawer-safety b { color: var(--coral); font-size: 9px; }.drawer-safety p { margin: 6px 0 0; color: #986c68; font-size: 8px; line-height: 1.6; }.drawer-signout { width: 100%; min-height: 40px; border: 1px solid #e4edf2; border-radius: 9px; background: #fff; color: var(--muted); font-size: 9px; font-weight: 700; text-align: left; }.drawer-signout span { float: right; color: var(--blue); }.quick-modal, .privacy-modal { width: min(520px, calc(100% - 28px)); max-height: min(720px, calc(100vh - 30px)); padding: 0; border: 1px solid var(--line); border-radius: 18px; background: #fff; color: var(--navy); box-shadow: 0 30px 90px rgba(16,48,74,.22); }.quick-modal::backdrop, .privacy-modal::backdrop { background: rgba(12, 40, 61, .4); backdrop-filter: blur(4px); }.modal-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 22px 23px 16px; border-bottom: 1px solid var(--line-soft); }.modal-header h2 { margin: 0; font-size: 23px; letter-spacing: -.05em; }.modal-form { display: grid; gap: 13px; padding: 20px 23px 23px; }.modal-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }.modal-field { display: grid; gap: 6px; }.modal-field.full { grid-column: 1 / -1; }.modal-field span { color: var(--muted); font-size: 8px; font-weight: 700; }.modal-field input, .modal-field textarea, .modal-field select { width: 100%; min-height: 39px; padding: 8px 10px; border: 1px solid #cfe0e8; border-radius: 8px; outline: 0; background: #fff; color: var(--navy); font-size: 11px; }.modal-field textarea { min-height: 76px; resize: vertical; }.modal-field input:focus, .modal-field textarea:focus, .modal-field select:focus { border-color: var(--blue); box-shadow: 0 0 0 3px #e2f5fc; }.modal-actions { display: flex; justify-content: flex-end; gap: 9px; padding-top: 6px; }.modal-choice-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; padding: 21px 23px 23px; }.modal-choice { min-height: 91px; padding: 13px; border: 1px solid var(--line); border-radius: 11px; background: #fff; color: var(--navy); text-align: left; }.modal-choice:hover { border-color: #aad3e5; background: var(--sky); }.modal-choice span { display: grid; place-items: center; width: 28px; height: 28px; margin-bottom: 9px; border-radius: 9px; background: var(--sky); color: var(--blue); }.modal-choice b { display: block; font-size: 9px; }.modal-choice small { display: block; margin-top: 4px; color: var(--muted); font-size: 7px; line-height: 1.4; }.privacy-copy { padding: 20px 23px 23px; }.privacy-highlight { display: flex; gap: 10px; padding: 12px; border-radius: 10px; background: var(--sky); color: var(--muted); font-size: 9px; line-height: 1.55; }.privacy-highlight > span { color: var(--blue); font-size: 15px; }.privacy-highlight p { margin: 0; }.privacy-highlight b { color: var(--navy); }.privacy-copy h3 { margin: 19px 0 6px; font-size: 11px; }.privacy-copy p:not(.privacy-highlight p) { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.65; }.privacy-actions { display: flex; justify-content: flex-end; align-items: center; gap: 15px; margin-top: 20px; }.toast { position: fixed; left: 50%; bottom: 24px; z-index: 100; max-width: calc(100% - 30px); padding: 10px 14px; border-radius: 9px; background: var(--navy); color: #fff; font-size: 9px; box-shadow: var(--shadow-deep); opacity: 0; pointer-events: none; transform: translate(-50%, 8px); transition: .2s ease; }.toast.show { opacity: 1; transform: translate(-50%, 0); }
@keyframes drawer-in { from { opacity: 0; transform: translateX(15px); } to { opacity: 1; transform: none; } }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
:where(button, a, input, textarea, select):focus-visible { outline: 3px solid rgba(25, 133, 209, .28); outline-offset: 2px; }

.hub-footer { display: flex; align-items: center; gap: 18px; padding: 23px 0 max(23px, env(safe-area-inset-bottom)); color: var(--muted-light); font-size: 8px; }.hub-footer span:nth-child(2) { margin-right: auto; }.hub-footer button, .hub-footer a { padding: 0; border: 0; background: transparent; color: var(--muted); font-size: 8px; text-decoration: none; }.hub-footer button:hover, .hub-footer a:hover { color: var(--blue-strong); }

@media (max-width: 1100px) {
  :root { --sidebar: 212px; }
  .overview-strip { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid { grid-template-columns: 1fr 1fr; }.day-card { grid-row: span 1; }.trend-card { grid-column: 1 / -1; }.ask-prompt-card { grid-column: 1; }.activity-card { grid-column: 2; }
}
@media (max-width: 800px) {
  .storage-consent { align-items: flex-start; flex-direction: column; }
  .storage-consent-actions { width: 100%; }
  :root { --sidebar: 0px; --topbar: 64px; }
  .sidebar { display: none; }
  .hub-main { width: 100%; margin: 0; padding-bottom: 0; }.hub-topbar { padding: 0 18px; }.mobile-brand-wrap { display: block; }.mobile-brand .brand-lockup { width: 103px; height: 53px; border-radius: 8px; }.mobile-brand .brand-lockup img { object-fit: contain; }.topbar-context { display: none; }.topbar-actions { margin-left: auto; }.add-health-button { padding: 0 10px; font-size: 9px; }.profile-trigger-name, .profile-trigger .chevron { display: none; }.profile-trigger { padding: 0; }.view-stack { width: calc(100% - 36px); }.view { min-width: 0; padding-top: 29px; }.page-heading { align-items: flex-start; flex-direction: column; gap: 18px; }.page-heading > * { max-width: 100%; }.page-heading h1, .today-heading h1, .page-subtitle, .trust-welcome { max-width: 100%; overflow-wrap: anywhere; }.today-heading-actions { width: 100%; justify-content: space-between; }.page-heading h1 { font-size: 39px; }.page-subtitle { font-size: 12px; }.daily-insight { align-items: flex-start; }.insight-action { align-self: center; }.overview-strip { grid-template-columns: repeat(2, 1fr); }.dashboard-grid, .health-overview-grid, .health-info-grid, .medication-view-grid, .appointments-layout, .results-grid { grid-template-columns: 1fr; }.trend-card, .ask-prompt-card, .activity-card { grid-column: auto; }.ask-layout { grid-template-columns: 1fr; }.context-rail { order: 2; }.conversation-panel { min-height: 600px; }.documents-grid { grid-template-columns: repeat(2, 1fr); }.hub-footer { flex-wrap: wrap; }.hub-footer span:nth-child(2) { width: 100%; order: 3; }.hub-footer button { margin-left: auto; }
}
@media (max-width: 520px) {
  .pro-gate { align-items: flex-start; flex-wrap: wrap; }.pro-gate a { margin-left: 42px; }
  .hub-topbar { gap: 6px; }.mobile-brand .brand-lockup { width: 84px; }.topbar-actions { gap: 5px; }.pro-button { min-height: 34px; padding: 0 7px; }.add-health-button { width: 38px; min-height: 35px; padding: 0; font-size: 0; }.add-health-button span { margin: 0; font-size: 16px; }.avatar { width: 30px; height: 30px; font-size: 9px; }.view-stack { width: calc(100% - 26px); }.view { padding-top: 24px; }.today-heading h1, .page-heading h1 { font-size: 34px; }.today-heading-actions { gap: 8px; }.date-chip { font-size: 8px; }.ask-button { min-height: 39px; padding: 0 10px; font-size: 9px; }.daily-insight { padding: 12px; }.daily-insight p { max-width: 180px; line-height: 1.45; }.insight-action { display: none; }.overview-strip { gap: 7px; }.overview-stat { padding: 10px 8px; }.overview-icon { width: 24px; height: 24px; font-size: 11px; }.overview-stat small { font-size: 7px; }.overview-stat b { font-size: 9px; }.overview-stat em { font-size: 7px; }.panel-card { border-radius: 14px; }.day-card, .appointment-card, .trend-card, .tasks-card, .ask-prompt-card, .activity-card, .health-snapshot, .memory-card, .info-card, .library-card, .refill-card, .history-card, .upcoming-card, .past-appointments, .result-list-card, .measurements-card { padding: 16px; }.card-heading h2 { font-size: 16px; }.trend-layout { grid-template-columns: 1fr; gap: 4px; }.mini-chart svg { height: 90px; }.trend-pills span { width: 100%; }.safety-note { align-items: flex-start; }.safety-note button { display: none; }.page-heading > .primary-button, .page-heading > .upload-primary { width: 100%; }.health-overview-grid { gap: 10px; }.profile-facts { gap: 6px; }.profile-fact { padding: 8px; }.profile-fact b { font-size: 9px; }.emergency-facts { grid-template-columns: 1fr 1fr; }.emergency-facts span:last-child { grid-column: 1 / -1; }.appointment-large { gap: 11px; padding: 12px; }.large-date { width: 53px; height: 71px; }.large-appointment-copy h3 { font-size: 14px; }.large-appointment-actions { align-items: flex-start; flex-direction: column; }.appointment-prep { align-items: flex-start; }.appointment-prep .text-button { display: none; }.modal-form-grid, .modal-choice-grid { grid-template-columns: 1fr; }.modal-field.full { grid-column: auto; }.documents-grid { grid-template-columns: 1fr; }.document-drop { align-items: flex-start; flex-wrap: wrap; }.document-drop label { margin-left: 48px; }.document-toolbar { align-items: flex-start; flex-direction: column; }.document-filters { width: 100%; overflow-x: auto; flex-wrap: nowrap; }.timeline-toolbar { align-items: flex-start; flex-direction: column; }.filter-tabs { flex-wrap: nowrap; width: 100%; overflow-x: auto; }.filter-tabs button, .document-filters button { flex: 0 0 auto; }.timeline-card { padding: 15px; }.timeline-entry { grid-template-columns: 18px 1fr; gap: 9px; }.timeline-entry time { grid-column: 2; margin-top: -7px; }.conversation-scroll { padding: 20px 16px 10px; }.conversation-header { padding: 0 15px; }.quick-asks { padding: 0 14px 12px; overflow-x: auto; flex-wrap: nowrap; }.quick-asks button { flex: 0 0 auto; }.chat-composer { margin: 0 13px; }.composer-row span:nth-child(2) { display: none; }.context-rail { padding: 15px; }.hub-footer { gap: 10px; font-size: 7px; }.hub-footer button, .hub-footer a { font-size: 7px; }
}

/* Home focus: logo first, quick-access wheel second, useful health features below. */
#view-today .colour-hero-live {
  grid-template-columns: 1fr;
  gap: 10px;
  min-height: 0;
  padding-top: 28px;
}
#view-today .home-hero-logo-copy {
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 132px;
}
#view-today .home-hero-logo {
  display: block;
  width: min(330px, 62vw);
  height: auto;
  max-height: 138px;
  object-fit: contain;
  filter: drop-shadow(0 14px 24px rgba(27, 105, 146, .12));
}
#view-today .colour-orbit {
  width: min(100%, 650px);
  min-height: 455px;
  margin: 0 auto;
}
#view-today .orbit-instruction {
  padding: 7px 13px;
  border: 1px solid rgba(149, 199, 222, .72);
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  color: #285873;
  font-size: 10px;
  letter-spacing: .01em;
  box-shadow: 0 8px 18px rgba(24, 86, 119, .08);
}
#view-today .orbit-instruction span {
  display: inline-block;
  margin-right: 5px;
  color: #087ee8;
  font-size: 15px;
  line-height: .7;
  vertical-align: -1px;
}
@media (max-width: 900px) {
  #view-today .colour-hero-live { gap: 4px; padding-top: 18px; }
  #view-today .home-hero-logo-copy { min-height: 112px; }
  #view-today .home-hero-logo { width: min(300px, 70vw); max-height: 118px; }
}
@media (max-width: 520px) {
  #view-today .colour-hero-live { padding-top: 10px; gap: 0; }
  #view-today .home-hero-logo-copy { min-height: 94px; }
  #view-today .home-hero-logo { width: min(250px, 68vw); max-height: 98px; }
  #view-today .colour-orbit { min-height: 380px; margin-top: 0; }
  #view-today .orbit-instruction { font-size: 9px; bottom: 1px; }
}
@media (max-width: 800px) {
  .category-bar { padding: 0 13px; }
  .category-bar-scroll { min-height: 44px; gap: 3px; }
  .category-bar-label { display: none; }
  .category-tab { min-height: 29px; padding: 0 10px; font-size: 8px; }
  .category-tab.active::after { right: 10px; bottom: -7px; left: 10px; }
}
.google-signin-modal { width: min(460px, calc(100% - 28px)); max-height: min(650px, calc(100vh - 30px)); padding: 0; border: 1px solid var(--line); border-radius: 18px; background: #fff; color: var(--navy); box-shadow: 0 30px 90px rgba(16,48,74,.22); }
.google-signin-modal::backdrop { background: rgba(12, 40, 61, .4); backdrop-filter: blur(4px); }
.google-signin-copy { padding: 23px; }
.google-signin-button-host { min-height: 44px; display: flex; justify-content: center; }
.google-signin-fallback { width: 100%; min-height: 46px; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 0 16px; border: 1px solid #cbdde7; border-radius: 8px; background: #fff; color: var(--navy); font-size: 11px; font-weight: 700; box-shadow: 0 5px 15px rgba(35, 99, 138, .06); }
.google-signin-fallback:hover { border-color: #9fcbe0; background: #f6fcff; }
.google-signin-fallback > span:last-child { margin-left: auto; color: var(--blue); font-size: 15px; }
.google-g-mark { width: 22px; height: 22px; display: grid; place-items: center; flex: 0 0 auto; }
.pro-feature-control { transition: border-color .2s ease, background .2s ease, color .2s ease; }.pro-feature-control.pro-locked { border-color: #d5e8ef; background: linear-gradient(120deg, #fbfeff, #f3fbfd); color: var(--blue-strong); }.pro-feature-control.pro-locked:hover { border-color: #a9d8e6; background: var(--sky); }.pro-gate { display: flex; align-items: center; gap: 12px; padding: 16px; border: 1px solid #d3e9f1; border-radius: 12px; background: linear-gradient(120deg, #f2fbfe, #fff); }.pro-gate-icon { width: 30px; height: 30px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 9px; background: #dff5fb; color: var(--blue); font-size: 14px; }.pro-gate-copy { min-width: 0; }.pro-gate-copy b, .pro-gate-copy p { display: block; }.pro-gate-copy b { font-size: 10px; }.pro-gate-copy p { margin: 4px 0 0; color: var(--muted); font-size: 8px; line-height: 1.55; }.pro-gate a { margin-left: auto; color: var(--blue-strong); font-size: 8px; font-weight: 800; text-align: right; white-space: nowrap; }.empty-state { padding: 20px 12px; border: 1px dashed #d8e7ef; border-radius: 11px; background: #fbfdff; color: var(--muted-light); font-size: 9px; line-height: 1.6; text-align: center; }
.empty-inline { padding: 14px 0; color: var(--muted-light); font-size: 9px; line-height: 1.5; }
.trend-empty { display: block; width: 100%; color: var(--muted-light); font-size: 8px; }
.signin-status { margin: 17px 0 0; padding: 10px 11px; border-radius: 9px; background: var(--sky); color: var(--muted); font-size: 9px; line-height: 1.55; }
.signin-status[data-tone="setup"] { background: #fff7ed; color: #94683f; }
.signin-disclaimer { margin: 15px 0 0; color: var(--muted-light); font-size: 8px; line-height: 1.65; }
.account-link:hover { background: #f6fcff; }
.google-signin-fallback[hidden], .google-signin-button-host[hidden] { display: none; }
@media (max-width: 520px) { .google-signin-copy { padding: 18px; } .google-signin-fallback { font-size: 10px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

/* Final visual guardrails: Pro changes access only; branding and layout remain shared. */
body[data-subscription="pro"] {
  --navy: #071b36;
  --navy-deep: #041329;
  --blue: #0d75f5;
  --blue-strong: #075bc0;
  --cyan: #25cce6;
  --sky: #e9f8ff;
  --sky-deep: #d6f2fb;
  --paper: #f7fbff;
  --line: #d8e7f2;
  --line-soft: #e8f1f7;
  --muted: #55728d;
  --muted-light: #8097aa;
}

/* Keep the quick-access wheel centred, evenly spaced and inside the viewport. */
#view-today .colour-orbit {
  width: min(100%, 650px);
  min-height: 468px;
  margin-inline: auto;
  padding-inline: 8px;
}
#view-today .orbit-action {
  max-width: 138px;
}
#view-today .orbit-action-ask { top: 12px; }
#view-today .orbit-action-research,
#view-today .orbit-action-medicines { top: 96px; }
#view-today .orbit-action-symptoms,
#view-today .orbit-action-appointments { bottom: 94px; }
#view-today .orbit-action-health { bottom: 35px; }
#view-today .orbit-instruction { bottom: 0; }

@media (max-width: 620px) {
  #hub-shell #view-today .colour-orbit {
    width: min(100%, 430px);
    min-height: 424px;
    padding-inline: 4px;
  }
  #view-today .orbit-action {
    min-width: 98px;
    max-width: 118px;
  }
  #view-today .orbit-action-ask { top: 8px; }
  #view-today .orbit-action-research,
  #view-today .orbit-action-medicines { top: 75px; }
  #view-today .orbit-action-symptoms,
  #view-today .orbit-action-appointments { bottom: 84px; }
  #view-today .orbit-action-health { bottom: 34px; }
  #view-today .orbit-instruction { bottom: 0; }
}
.app-promo { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:18px; padding:22px 24px; background:linear-gradient(120deg,var(--sky),#fff); }
.app-promo-copy { max-width:540px; }.app-promo h2 { margin:0; color:var(--navy); font-size:19px; letter-spacing:-.04em; }.app-promo p:not(.card-kicker) { margin:7px 0 15px; color:var(--muted); font-size:10px; line-height:1.55; }.app-promo .primary-button { display:inline-flex; width:auto; min-height:37px; padding:0 14px; font-size:10px; }
.store-badges { display:flex; gap:9px; }.store-badge { display:flex; align-items:center; gap:8px; min-width:115px; padding:9px 11px; border:1px solid var(--line); border-radius:11px; background:rgba(255,255,255,.78); }.store-glyph { display:grid; place-items:center; width:25px; height:25px; border-radius:7px; background:var(--navy); color:#fff; }.store-logo { width:16px; height:16px; display:block; fill:currentColor; }.store-badge b,.store-badge small { display:block; }.store-badge b { color:var(--navy); font-size:9px; }.store-badge small { margin-top:2px; color:var(--muted); font-size:7px; white-space:nowrap; }
.install-help { position:fixed; z-index:50; left:50%; bottom:20px; transform:translateX(-50%); width:min(92vw,430px); padding:14px 16px; border:1px solid var(--line); border-radius:14px; background:var(--navy); color:#fff; box-shadow:0 14px 36px rgba(12,34,62,.28); font-size:13px; line-height:1.45; }.install-help strong { display:block; margin-bottom:4px; }.install-help[hidden] { display:none; }
@media (max-width:800px) { .app-promo { align-items:flex-start; flex-direction:column; gap:16px; } .store-badges { width:100%; } .store-badge { flex:1; min-width:0; } }
.drawer-pro-status { display:flex; align-items:center; gap:10px; padding:12px; border:1px solid #d8edf2; border-radius:12px; background:#f4fbfd; }.drawer-pro-status > div { flex:1; min-width:0; }.drawer-pro-status b, .drawer-pro-status small { display:block; }.drawer-pro-status b { color:var(--navy); font-size:12px; }.drawer-pro-status small { margin-top:3px; color:var(--muted); font-size:10px; line-height:1.35; }.drawer-pro-status a { color:var(--blue-strong); font-size:22px; text-decoration:none; }

/* Launch accessibility hardening: visible keyboard focus and readable critical copy. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible { outline: 3px solid #0b76c5; outline-offset: 3px; }
.trust-welcome, .safety-note p, .rail-safety p, .chat-disclaimer, .modal-help, .privacy-copy p, .documents-permission p { font-size: 12px; line-height: 1.6; }
.hub-footer, .hub-footer button, .hub-footer a { font-size: 11px; }
@media (max-width: 800px) {
  input, select, textarea { font-size: 16px; }
  .category-tab, .pro-button, .add-health-button, .ask-button, .primary-button, .secondary-button, .quiet-button { min-height: 44px; font-size: 12px; }
  .quick-asks button, .composer-row button { min-height: 44px; font-size: 12px; }
}
.research-nav-highlight { position:relative; border:1px solid #d9d8ef !important; background:linear-gradient(100deg,#edfaff,#f7f0ff,#fff3e9) !important; color:var(--navy) !important; }.research-nav-highlight:before { content:""; position:absolute; inset:-1px; z-index:-1; border-radius:inherit; padding:1px; background:linear-gradient(90deg,#63c8ec,#8b9bea,#d797c7,#f0ad8d); -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; }.research-nav-highlight .nav-icon,.research-nav-highlight > span:first-of-type { color:var(--blue) !important; }.research-nav-highlight small { display:block; margin-top:3px; color:var(--muted); font-size:7px; }.category-tab.research-nav-highlight { display:inline-flex; align-items:center; gap:4px; color:var(--blue-strong) !important; font-weight:800; }.category-tab.research-nav-highlight:before { border-radius:9px; }

/* Keep Today calm: the first screen is a clear summary, while detail stays available below. */
#view-today .page-heading { margin-bottom: 18px; }
#view-today .daily-insight { min-height: 0; margin: 0 0 14px; padding: 0 2px; border: 0; background: transparent; }
#view-today .insight-icon { width: 24px; height: 24px; border-radius: 8px; font-size: 12px; }
#view-today .daily-insight b { font-size: 10px; }
#view-today .daily-insight p { margin-top: 2px; font-size: 9px; }
#view-today .insight-action { display: none; }
#view-today .overview-strip { margin: 0 0 20px; padding: 5px; gap: 0; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.72); }
#view-today .overview-stat { padding: 11px 12px; border: 0; border-radius: 10px; background: transparent; box-shadow: none; }
#view-today .overview-stat + .overview-stat { border-left: 1px solid var(--line-soft); }
#view-today .overview-stat:hover { border-color: transparent; background: var(--sky); box-shadow: none; transform: none; }
#view-today .dashboard-grid { gap: 12px; }
#view-today .day-card { grid-row: auto; }
#view-today .trend-card, #view-today .tasks-card, #view-today .activity-card { padding: 15px 2px 4px; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; }
#view-today .ask-prompt-card { box-shadow: none; }
#view-today .safety-note { margin-top: 14px; }
@media (max-width: 800px) {
  #view-today .overview-stat:nth-child(3) { border-left: 0; border-top: 1px solid var(--line-soft); }
  #view-today .overview-stat:nth-child(4) { border-top: 1px solid var(--line-soft); }
}
@media (max-width: 520px) {
  #view-today .overview-stat { padding: 10px 8px; }
  #view-today .trend-card, #view-today .tasks-card, #view-today .activity-card { padding-top: 13px; }
}
.brand-lockup { width: 196px; height: 138px; }
.brand-lockup img { object-fit: contain; }
@media (max-width: 800px) {
  .mobile-brand .brand-lockup { width: 126px; height: 58px; }
}
@media (max-width: 520px) {
  .mobile-brand .brand-lockup { width: 116px; height: 54px; }
}

/* Today layout pass: one clear action, then the information people return for. */
#view-today .today-heading .ask-button { display: none; }
#view-today .dashboard-grid { grid-template-columns: minmax(0, 1.18fr) minmax(260px, .82fr); gap: 14px; }
#view-today .ask-prompt-card { grid-column: 1 / -1; order: -1; min-height: 118px; align-items: center; padding: 24px 26px; border-color: #163b5c; background: linear-gradient(118deg, #123552 0%, #1c4b70 58%, #217c9f 100%); color: #fff; box-shadow: 0 16px 30px rgba(19, 56, 84, .16); }
#view-today .ask-prompt-card .card-kicker { color: #a9e4f2; }
#view-today .ask-prompt-card h2 { color: #fff; }
#view-today .ask-prompt-card p:not(.card-kicker) { color: rgba(255,255,255,.78); }
#view-today .ask-prompt-card .text-button { color: #b8f2fa; }
#view-today .ask-prompt-card .ask-orb { background: #e4fbff; color: #167ca1; box-shadow: 0 10px 20px rgba(6, 26, 45, .16); }
#view-today .day-card { grid-row: auto; }
#view-today .trend-card { grid-column: 1 / -1; }
#view-today .tasks-card, #view-today .activity-card { min-height: 150px; }

@media (max-width: 800px) {
  #view-today .dashboard-grid { grid-template-columns: 1fr; gap: 10px; }
  #view-today .ask-prompt-card { min-height: 0; padding: 20px; }
  #view-today .trend-card { grid-column: auto; }
}

/* Aurora control centre — shared web/app direction approved August 2026. */
body[data-hub-theme="today"] {
  --navy: #071b36;
  --navy-deep: #041329;
  --blue: #0d75f5;
  --blue-strong: #075bc0;
  --cyan: #25cce6;
  --sky: #e9f8ff;
  --sky-deep: #d6f2fb;
  --paper: #f7fbff;
  --line: #d8e7f2;
  --line-soft: #e8f1f7;
  --muted: #55728d;
  --muted-light: #8097aa;
}
body {
  background:
    radial-gradient(circle at 8% 7%, rgba(93, 228, 245, .16), transparent 23rem),
    radial-gradient(circle at 92% 12%, rgba(165, 138, 255, .12), transparent 26rem),
    radial-gradient(circle at 86% 82%, rgba(255, 139, 120, .08), transparent 24rem),
    var(--paper);
  background-attachment: fixed;
}
.sidebar { display: none !important; }
.hub-main { width: 100%; margin-left: 0; }
.hub-topbar {
  --topbar: 92px;
  height: var(--topbar);
  padding: 0 clamp(18px, 3vw, 46px);
  border-top: 4px solid transparent;
  border-bottom-color: rgba(181, 207, 224, .72);
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(90deg, #36c7ee, #8e91ff, #ff8f87, #ffd96e) border-box;
  box-shadow: 0 9px 30px rgba(17, 59, 92, .07);
}
.mobile-brand-wrap { display: block; flex: 0 0 auto; }
.mobile-brand .brand-lockup { width: 210px; height: 78px; border-radius: 0; }
.mobile-brand .brand-lockup img { object-fit: contain; object-position: left center; }
.topbar-context { display: none; }
.topbar-actions { margin-left: auto; gap: 10px; }
.pro-button, .add-health-button, .profile-trigger {
  min-height: 42px;
  border-radius: 13px;
}
.pro-button { padding: 0 13px; background: #e9fbff; }
.add-health-button { padding-inline: 15px; }
.profile-trigger { padding-inline: 6px; }
.category-bar {
  top: 92px;
  padding: 0 clamp(18px, 3vw, 46px);
  background: rgba(247, 251, 255, .93);
  backdrop-filter: none;
  box-shadow: 0 7px 24px rgba(20, 64, 96, .045);
}
.category-bar-scroll { min-height: 62px; gap: 7px; overflow-y: visible; }
.category-bar-label { margin-right: 5px; color: var(--blue-strong); }
.category-tab {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 13px;
  border-color: rgba(195, 216, 231, .78);
  border-radius: 13px;
  background: rgba(255, 255, 255, .78);
  color: #526e84;
  font-size: 10px;
}
.category-tab > span:first-child { color: var(--blue); font-size: 14px; }
.category-tab:hover { border-color: rgba(13, 117, 245, .28); }
.category-tab.active {
  border-color: transparent;
  background: linear-gradient(135deg, var(--navy), #174b72);
  color: #fff;
  box-shadow: 0 9px 19px rgba(7, 27, 54, .17);
}
.category-tab.active > span:first-child { color: #77e8f5; }
.category-tab.active::after { display: none; }
.category-tab.research-nav-highlight {
  min-height: 40px;
  border-color: transparent !important;
  background: linear-gradient(105deg, #e3fbff, #f2edff 48%, #fff0e8) !important;
  box-shadow: 0 6px 16px rgba(99, 113, 175, .09);
}
.category-more { position: relative; flex: 0 0 auto; }
.category-more > button { cursor: pointer; }
.category-more > button[aria-expanded="true"] { border-color: rgba(13, 117, 245, .28); background: var(--sky); color: var(--blue-strong); }
.category-more-menu {
  position: fixed;
  top: 158px;
  right: clamp(18px, 3vw, 46px);
  z-index: 60;
  width: 250px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 20px 48px rgba(14, 48, 78, .18);
}
.category-more-menu button {
  width: 100%; min-height: 58px; display: flex; align-items: center; gap: 12px;
  padding: 9px 10px; border: 0; border-radius: 11px; background: transparent;
  color: var(--navy); text-align: left;
}
.category-more-menu button:hover, .category-more-menu button:focus-visible { background: var(--sky); }
.category-more-menu button > span:first-child { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; background: var(--sky); color: var(--blue); }
.category-more-menu b, .category-more-menu small { display: block; }
.category-more-menu b { font-size: 10px; }
.category-more-menu small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.view-stack { width: min(1320px, calc(100% - 2 * clamp(20px, 4vw, 60px))); }
.view { padding-top: 36px; }
.page-heading h1 { max-width: 820px; }
.panel-card, .overview-strip, .daily-insight {
  box-shadow: 0 15px 38px rgba(23, 72, 106, .07);
}
.empty-state { color: var(--muted); }
/* WCAG AA: the compact overview labels stay readable at every text size. */
#view-today .overview-stat small { color: #50687a; }
#view-today .overview-stat em { color: #075f87; }
body #view-today .overview-stat:nth-child(1) .overview-icon { background: #e5f2ff; color: #0d75f5; }
body #view-today .overview-stat:nth-child(2) .overview-icon { background: #f0ebff; color: #755be9; }
body #view-today .overview-stat:nth-child(3) .overview-icon { background: #fff1e5; color: #d66d37; }
body #view-today .overview-stat:nth-child(4) .overview-icon { background: #e4fbf4; color: #168f74; }
body #view-today .day-card { border-top: 4px solid #5de4f5; }
body #view-today .appointment-card { border-top: 4px solid #a58aff; }
body #view-today .trend-card { border-top-color: #91efd2; }
body #view-today .tasks-card { border-top-color: #ffd96e; }
body #view-today .activity-card { border-top-color: #ff8b78; }
@media (max-width: 900px) {
  .hub-topbar { --topbar: 78px; height: var(--topbar); padding-inline: 15px; }
  .category-bar { top: 78px; padding-inline: 12px; }
  .category-bar-scroll { min-height: 56px; gap: 5px; }
  .category-bar-label { display: none; }
  .mobile-brand .brand-lockup { width: 158px; height: 65px; }
  .profile-trigger-name, .profile-trigger .chevron { display: none; }
  .profile-trigger { padding: 0; }
  .view-stack { width: calc(100% - 30px); }
}
@media (max-width: 620px) {
  .hub-topbar { height: 76px; gap: 6px; padding-inline: 9px; }
  .category-bar { top: 76px; padding-inline: 10px; }
  .category-bar-scroll { min-height: 54px; }
  .mobile-brand .brand-lockup { width: 142px; height: 62px; }
  .topbar-actions { gap: 5px; }
  .add-health-button { width: 39px; min-height: 39px; padding: 0; font-size: 0; }
  .add-health-button span { margin: 0; font-size: 16px; }
  .pro-button { min-height: 39px; padding-inline: 9px; }
  .profile-trigger { min-height: 39px; }
  .category-tab { min-height: 38px; padding-inline: 11px; font-size: 9px; }
  .category-more-menu { top: 136px; right: 10px; width: min(280px, calc(100vw - 20px)); }
  .view-stack { width: calc(100% - 24px); }
  .view { padding-top: 26px; }
  .page-heading h1, .today-heading h1 { font-size: clamp(32px, 10.4vw, 42px); }
  #view-today .overview-strip { border-radius: 18px; }
  #view-today .ask-prompt-card { border-radius: 20px; }
}

/* Full-colour concept — promoted from the approved private preview. */
body[data-hub-theme="today"] {
  --colour-cyan: #5de4f5;
  --colour-blue: #0d75f5;
  --colour-violet: #a58aff;
  --colour-coral: #ff8b78;
  --colour-mint: #57dfbd;
  --colour-yellow: #ffd85f;
  background:
    radial-gradient(circle at 12% 18%, rgba(93, 228, 245, .26), transparent 31rem),
    radial-gradient(circle at 88% 19%, rgba(165, 138, 255, .2), transparent 32rem),
    radial-gradient(circle at 84% 72%, rgba(255, 139, 120, .12), transparent 28rem),
    linear-gradient(180deg, #f8fbff 0%, #eef8ff 50%, #fffafa 100%);
}

#view-today { position: relative; }
.colour-hero-live {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(330px, .8fr);
  align-items: center;
  gap: clamp(38px, 6vw, 90px);
  min-height: 520px;
  padding: 44px 0 66px;
}
.colour-hero-copy { position: relative; z-index: 2; }
.colour-eyebrow {
  margin: 0 0 15px;
  color: #2a7297;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.colour-eyebrow span { color: var(--colour-coral); font-size: 14px; }
.colour-hero-live h1 {
  max-width: 720px;
  margin: 0;
  color: var(--navy);
  font-size: clamp(58px, 6.7vw, 94px);
  line-height: .94;
  letter-spacing: -.078em;
}
.colour-hero-live h1 em {
  color: #137cdc;
  font-family: Newsreader, Georgia, serif;
  font-weight: 500;
  letter-spacing: -.065em;
}
.colour-hero-subtitle {
  max-width: 550px;
  margin: 26px 0 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.65;
}
.colour-hero-live .trust-welcome {
  max-width: 550px;
  margin-top: 12px;
  color: #66849a;
  font-size: 10px;
}
.colour-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.colour-primary-action,
.colour-secondary-action {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 0 21px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}
.colour-primary-action {
  border: 1px solid var(--navy);
  background: var(--navy);
  color: #fff;
  box-shadow: 0 14px 28px rgba(7, 27, 54, .18);
}
.colour-primary-action span { color: var(--colour-cyan); }
.colour-secondary-action { border: 1px solid #b8d5e6; background: rgba(255,255,255,.72); color: var(--navy); }
.colour-secondary-action span { color: var(--colour-blue); }
.colour-primary-action:hover,
.colour-secondary-action:hover { transform: translateY(-2px); }
.colour-date { display: block; margin-top: 18px; color: #7893a7; font-size: 9px; }

.colour-orbit {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 445px;
  isolation: isolate;
}
.colour-orbit::before {
  content: "";
  position: absolute;
  width: 330px;
  height: 330px;
  border-radius: 50%;
  background: conic-gradient(from 20deg, rgba(93,228,245,.22), rgba(165,138,255,.18), rgba(255,139,120,.18), rgba(255,216,95,.22), rgba(87,223,189,.22), rgba(93,228,245,.22));
  filter: blur(28px);
  opacity: .9;
  z-index: -2;
}
.colour-orbit-ring {
  position: absolute;
  border: 1px solid rgba(13,117,245,.22);
  border-radius: 50%;
  pointer-events: none;
}
.colour-ring-one {
  width: 318px;
  height: 318px;
  transform: rotate(-18deg);
  border-top-color: var(--colour-coral);
  border-right-color: var(--colour-violet);
  animation: orbit-spin 26s linear infinite;
}
.colour-ring-two {
  width: 238px;
  height: 238px;
  transform: rotate(31deg);
  border-left: 3px solid var(--colour-cyan);
  border-bottom: 3px solid var(--colour-mint);
  animation: orbit-spin-reverse 19s linear infinite;
}
.colour-orbit-core {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 166px;
  height: 166px;
  padding: 20px;
  border: 8px solid rgba(255,255,255,.96);
  border-radius: 50%;
  background: radial-gradient(circle at 33% 27%, #fff 0 42%, #eafcff 76%, #dff5ff 100%);
  box-shadow: 0 28px 52px rgba(18,85,122,.25), inset 0 0 0 1px rgba(13,117,245,.12);
  color: var(--navy);
  text-align: center;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.orbit-core-glow {
  position: absolute;
  inset: -14px;
  border: 2px solid transparent;
  border-radius: inherit;
  opacity: 0;
  pointer-events: none;
}
.orbit-doctorai-mark {
  width: 112px;
  height: 112px;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
}
.colour-orbit-core small {
  position: absolute;
  bottom: 13px;
  color: #337692;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.colour-orbit-core.is-drop-active {
  transform: scale(1.07);
  border-color: #fff;
  box-shadow: 0 0 0 8px rgba(93,228,245,.22), 0 30px 58px rgba(13,117,245,.3);
}
.colour-orbit-core.is-drop-active .orbit-core-glow {
  border-color: var(--colour-cyan);
  opacity: 1;
  animation: orbit-drop-pulse .9s ease-in-out infinite alternate;
}
.orbit-action {
  --drag-x: 0px;
  --drag-y: 0px;
  --orbit-base-transform: translate(0, 0);
  position: absolute;
  z-index: 4;
  min-width: 112px;
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.86);
  border-radius: 17px;
  box-shadow: 0 14px 30px rgba(17,62,101,.16), inset 0 1px 0 rgba(255,255,255,.6);
  color: #123958;
  font-size: 10px;
  font-weight: 800;
  text-decoration: none;
  touch-action: none;
  user-select: none;
  transform: var(--orbit-base-transform) translate(var(--drag-x), var(--drag-y));
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  cursor: pointer;
  will-change: transform;
}
.orbit-action span { font-size: 17px; line-height: 1; }
.orbit-action:hover,
.orbit-action:focus-visible {
  filter: saturate(1.15) brightness(1.02);
  box-shadow: 0 18px 36px rgba(17,62,101,.22), inset 0 1px 0 rgba(255,255,255,.74);
}
.orbit-action:focus-visible { outline: 3px solid rgba(13,117,245,.35); outline-offset: 3px; }
.orbit-action.is-dragging {
  z-index: 8;
  cursor: grabbing;
  filter: saturate(1.2);
  box-shadow: 0 24px 44px rgba(17,62,101,.28);
  transition: box-shadow .12s ease, filter .12s ease;
}
.orbit-action[data-orbit-tone="cyan"] { background: linear-gradient(135deg, #d9fbff, #91edf7); }
.orbit-action[data-orbit-tone="blue"] { background: linear-gradient(135deg, #e4efff, #a9cdfd); }
.orbit-action[data-orbit-tone="violet"] { background: linear-gradient(135deg, #f0ebff, #cabaff); }
.orbit-action[data-orbit-tone="mint"] { background: linear-gradient(135deg, #dcfff7, #9aeed8); }
.orbit-action[data-orbit-tone="coral"] { background: linear-gradient(135deg, #fff0ec, #ffb8aa); }
.orbit-action[data-orbit-tone="yellow"] { background: linear-gradient(135deg, #fff9d9, #ffe580); }
.orbit-action-ask { top: 10px; left: 50%; --orbit-base-transform: translateX(-50%); }
.orbit-action-research { top: 82px; left: 0; }
.orbit-action-medicines { top: 82px; right: 0; }
.orbit-action-symptoms { bottom: 85px; left: 0; }
.orbit-action-appointments { bottom: 85px; right: 0; }
.orbit-action-health { bottom: 28px; left: 50%; --orbit-base-transform: translateX(-50%); }
.colour-orbit .orbit-action {
  left: 50% !important;
  top: 50% !important;
  right: auto !important;
  bottom: auto !important;
  --orbit-base-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%) translate(var(--orbit-x, 0px), var(--orbit-y, 0px)) translate(var(--drag-x), var(--drag-y));
  transition: transform 360ms cubic-bezier(.22,.8,.24,1), box-shadow .18s ease, filter .18s ease;
}
.colour-orbit .orbit-action.is-dragging {
  transition: box-shadow .12s ease, filter .12s ease;
}
.hub-ask-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: min(100%, 520px);
  margin: 8px auto 0;
  padding: 13px 14px 13px 17px;
  border: 1px solid #c7e6ef;
  border-radius: 18px;
  background: rgba(255,255,255,.82);
  box-shadow: 0 11px 25px rgba(23, 53, 80, .08);
}
.hub-ask-strip b, .hub-ask-strip span { display: block; }
.hub-ask-strip b { color: var(--navy); font-size: 13px; }
.hub-ask-strip span { margin-top: 4px; color: var(--muted); font-size: 9px; }
.hub-ask-button { min-height: 42px; padding: 0 13px; border: 0; border-radius: 12px; background: var(--navy); color: #fff; font-size: 9px; font-weight: 800; white-space: nowrap; }
.hub-ask-button span { display: inline; margin: 0 4px; color: #8deaf5; font-size: 13px; }
.hub-ask-button:hover { background: var(--blue-strong); transform: translateY(-1px); }
@media (max-width: 560px) {
  .hub-ask-strip { align-items: stretch; flex-direction: column; gap: 10px; }
  .hub-ask-button { width: 100%; }
}
.orbit-instruction {
  position: absolute;
  bottom: 0;
  left: 50%;
  z-index: 3;
  width: max-content;
  max-width: 100%;
  margin: 0;
  color: #55798f;
  font-size: 9px;
  font-weight: 700;
  transform: translateX(-50%);
}
.orbit-instruction span { color: #0d75f5; }
@keyframes orbit-spin { to { transform: rotate(342deg); } }
@keyframes orbit-spin-reverse { to { transform: rotate(-329deg); } }
@keyframes orbit-drop-pulse { to { transform: scale(1.08); opacity: .45; } }

/* Ask DoctorAI: a familiar, focused GPT-style conversation workspace. */
#view-ask {
  padding-top: 18px;
}
#view-ask .ask-layout {
  grid-template-columns: 248px minmax(0, 760px);
  justify-content: center;
  gap: 16px;
  max-width: 1040px;
  min-height: min(760px, calc(100svh - 165px));
  margin: 0 auto;
}
#view-ask .ask-sidebar {
  min-height: 680px;
  padding: 17px 14px 14px;
  border: 1px solid #d9e8ee;
  border-radius: 19px;
  background: rgba(255,255,255,.83);
  box-shadow: 0 16px 38px rgba(24, 77, 111, .09);
}
#view-ask .ask-sidebar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 2px 3px 17px;
  border-bottom: 1px solid var(--line-soft);
}
#view-ask .ask-sidebar-logo {
  width: 39px;
  height: 39px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 12px;
  background: #effaff;
  box-shadow: inset 0 0 0 1px #d5edf5;
}
#view-ask .ask-sidebar-logo img {
  width: 30px;
  height: 30px;
  object-fit: contain;
}
#view-ask .ask-sidebar-brand b,
#view-ask .ask-sidebar-brand small { display: block; }
#view-ask .ask-sidebar-brand b { color: var(--navy); font-size: 12px; letter-spacing: -.025em; }
#view-ask .ask-sidebar-brand small { margin-top: 3px; color: var(--muted-light); font-size: 8px; }
#view-ask .new-chat-button {
  width: 100%;
  min-height: 43px;
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 15px 0 24px;
  padding: 0 13px;
  border: 1px solid #c9dfea;
  border-radius: 11px;
  background: #fff;
  color: var(--navy);
  font-size: 10px;
  font-weight: 800;
  text-align: left;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
#view-ask .new-chat-button span { color: var(--blue-strong); font-size: 17px; font-weight: 400; }
#view-ask .new-chat-button:hover,
#view-ask .new-chat-button:focus-visible { border-color: #80c9e4; box-shadow: 0 8px 18px rgba(32, 116, 155, .1); transform: translateY(-1px); }
#view-ask .ask-sidebar-label {
  margin: 0 3px 8px;
  color: #7894a4;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .15em;
  text-transform: uppercase;
}
#view-ask .context-toggle-row {
  padding: 13px 3px 12px;
  border-top: 1px solid var(--line-soft);
}
#view-ask .context-toggle-row b { font-size: 10px; }
#view-ask .context-toggle-row small { font-size: 8px; }
#view-ask .context-list {
  gap: 8px;
  padding: 12px 3px 16px;
}
#view-ask .context-list span { font-size: 9px; }
#view-ask .rail-link { padding: 14px 3px; font-size: 9px; }
#view-ask .ask-sidebar-spacer { flex: 1; min-height: 70px; }
#view-ask .rail-safety { margin-top: 0; padding: 12px; border: 1px solid #ffe0db; }
#view-ask .rail-safety b { font-size: 9px; }
#view-ask .rail-safety p { font-size: 8px; }

#view-ask .conversation-panel {
  min-height: 680px;
  max-height: min(760px, calc(100svh - 165px));
  border: 1px solid #d5e6ed;
  border-radius: 21px;
  background: #fff;
  box-shadow: 0 20px 50px rgba(19, 68, 100, .12);
}
#view-ask .conversation-header {
  height: 74px;
  padding: 0 24px;
  background: rgba(255,255,255,.95);
}
#view-ask .assistant-mark {
  width: 38px;
  height: 38px;
  border-radius: 13px;
  background: #effaff;
  box-shadow: inset 0 0 0 1px #d7edf5;
}
#view-ask .assistant-mark .doctorai-head-icon { width: 29px; height: 29px; }
#view-ask .assistant-identity b { font-size: 12px; }
#view-ask .assistant-identity small { font-size: 8px; }
#view-ask .conversation-header-actions { display: flex; align-items: center; gap: 13px; }
#view-ask .conversation-header-actions .privacy-badge { padding: 6px 8px; font-size: 8px; }
#view-ask .conversation-header-actions .quiet-button {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--muted);
  font-size: 9px;
}
#view-ask .conversation-header-actions .quiet-button span { color: var(--blue-strong); font-size: 14px; }
#view-ask .conversation-scroll {
  min-height: 0;
  max-height: none;
  padding: 43px clamp(22px, 5vw, 70px) 25px;
  background: linear-gradient(180deg, #fbfeff 0%, #fff 35%);
}
#view-ask .chat-welcome { max-width: 490px; margin: 36px auto 34px; }
#view-ask .chat-welcome-icon {
  width: 63px;
  height: 63px;
  margin-bottom: 17px;
  border: 1px solid #d1edf5;
  border-radius: 20px;
  background: linear-gradient(145deg, #effcff, #e7f5ff);
  box-shadow: 0 12px 26px rgba(35, 133, 173, .1);
}
#view-ask .chat-welcome-icon .doctorai-head-icon { width: 43px; height: 43px; }
#view-ask .chat-welcome-kicker {
  margin: 0 0 9px;
  color: var(--blue-strong);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .17em;
}
#view-ask .chat-welcome h2 { font-size: clamp(23px, 3vw, 30px); letter-spacing: -.055em; }
#view-ask .chat-welcome p:last-child { max-width: 430px; font-size: 10px; line-height: 1.7; }
#view-ask .chat-messages { max-width: 720px; margin: 0 auto; gap: 25px; }
#view-ask .chat-message { max-width: 100%; align-items: flex-start; gap: 12px; }
#view-ask .chat-message-avatar {
  width: 31px;
  height: 31px;
  border-radius: 10px;
  background: #effaff;
  box-shadow: inset 0 0 0 1px #d7edf5;
}
#view-ask .chat-message-avatar .doctorai-head-icon { width: 24px; height: 24px; }
#view-ask .chat-message.user .chat-message-avatar { background: #e7f3fa; color: var(--blue-strong); }
#view-ask .chat-message-body small { margin: 2px 0 6px; font-size: 8px; }
#view-ask .chat-message-body p { padding: 12px 15px; border-radius: 14px 14px 14px 4px; font-size: 10px; line-height: 1.7; }
#view-ask .chat-message.user .chat-message-body { margin-left: auto; }
#view-ask .chat-message.user .chat-message-body p { border-radius: 16px 16px 4px 16px; padding: 12px 16px; }
#view-ask .quick-asks {
  align-items: center;
  gap: 7px;
  padding: 0 24px 14px;
}
#view-ask .quick-asks-label {
  width: 100%;
  margin-bottom: 1px;
  color: var(--muted-light);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
#view-ask .quick-asks button {
  min-height: 35px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 11px;
  border: 1px solid #d6e6ed;
  border-radius: 10px;
  background: #fff;
  color: #46667a;
  font-size: 8px;
  text-align: left;
}
#view-ask .quick-asks button:hover,
#view-ask .quick-asks button:focus-visible { border-color: #8ed3e8; background: #f1fbff; color: var(--blue-strong); }
#view-ask .quick-ask-icon { color: var(--blue); font-size: 13px; }
#view-ask .quick-asks button b { margin-left: 3px; color: var(--cyan); font-size: 12px; }
#view-ask .chat-composer {
  margin: 0 24px;
  border: 1px solid #bcd6e2;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(27, 91, 123, .1);
}
#view-ask .chat-composer:focus-within { border-color: var(--blue); box-shadow: 0 0 0 4px #e8f8fd, 0 8px 24px rgba(27, 91, 123, .1); }
#view-ask .chat-composer textarea { min-height: 65px; padding: 15px 16px 6px; font-size: 11px; }
#view-ask .composer-row { gap: 9px; padding: 6px 9px 8px 13px; }
#view-ask .composer-context { color: #7993a1; }
#view-ask .composer-context span { margin-right: 4px; color: var(--green); }
#view-ask .composer-row > span:nth-child(2) { margin-left: auto; }
#view-ask .composer-enter-hint { color: var(--muted-light); }
#view-ask .composer-row button { min-width: 66px; min-height: 34px; border-radius: 10px; background: var(--navy); }
#view-ask .chat-disclaimer { margin: 11px 22px 15px; font-size: 8px; line-height: 1.5; }
@media (max-width: 800px) {
  #view-ask { padding-top: 10px; }
  #view-ask .ask-layout { display: flex; flex-direction: column; gap: 11px; min-height: 0; }
  #view-ask .conversation-panel { order: 1; min-height: calc(100svh - 145px); max-height: none; border-radius: 17px; }
  #view-ask .ask-sidebar { order: 2; min-height: 0; padding: 13px; border-radius: 15px; }
  #view-ask .ask-sidebar-brand { padding-bottom: 12px; }
  #view-ask .new-chat-button { min-height: 39px; margin: 11px 0 15px; }
  #view-ask .ask-sidebar-spacer { display: none; }
  #view-ask .rail-safety { margin-top: 12px; }
  #view-ask .conversation-header { height: 62px; padding: 0 14px; }
  #view-ask .conversation-header-actions { gap: 6px; }
  #view-ask .conversation-header-actions .privacy-badge { display: none; }
  #view-ask .conversation-header-actions .quiet-button { font-size: 8px; }
  #view-ask .conversation-scroll { padding: 24px 15px 18px; }
  #view-ask .chat-welcome { margin: 25px auto 27px; }
  #view-ask .chat-welcome-icon { width: 55px; height: 55px; border-radius: 17px; }
  #view-ask .chat-welcome-icon .doctorai-head-icon { width: 38px; height: 38px; }
  #view-ask .chat-welcome h2 { font-size: 24px; }
  #view-ask .chat-welcome p:last-child { font-size: 9px; }
  #view-ask .chat-messages { gap: 20px; }
  #view-ask .quick-asks { flex-wrap: nowrap; overflow-x: auto; padding: 0 13px 12px; }
  #view-ask .quick-asks-label { flex: 0 0 auto; width: auto; margin: 0 3px 0 0; }
  #view-ask .quick-asks button { flex: 0 0 auto; min-height: 34px; }
  #view-ask .chat-composer { margin: 0 13px; }
  #view-ask .composer-enter-hint { display: none; }
  #view-ask .composer-row { padding-left: 11px; }
  #view-ask .chat-disclaimer { margin: 9px 14px 12px; }
}

#view-today .daily-insight {
  min-height: 70px;
  margin: 0 0 13px;
  padding: 15px 17px;
  border: 1px solid #b9e5ea;
  border-radius: 18px;
  background: linear-gradient(100deg, #e9fdff, rgba(255,255,255,.88) 54%, #fff4ee);
  box-shadow: 0 13px 30px rgba(19,73,105,.07);
}
#view-today .daily-insight .insight-icon { width: 34px; height: 34px; border-radius: 11px; background: #c8f7f1; color: #078aa3; }
#view-today .daily-insight b { font-size: 11px; }
#view-today .daily-insight p { margin-top: 4px; font-size: 9px; }
#view-today .daily-insight .insight-action { display: inline-flex; }

#view-today .overview-strip {
  margin-bottom: 15px;
  padding: 8px;
  gap: 8px;
  border: 1px solid rgba(179,213,231,.86);
  border-radius: 22px;
  background: rgba(255,255,255,.8);
  box-shadow: 0 18px 45px rgba(17,62,101,.08);
  backdrop-filter: blur(16px);
}
#view-today .overview-stat {
  min-height: 80px;
  padding: 13px 12px;
  border: 1px solid var(--line) !important;
  border-radius: 16px;
  background: #fff;
}
#view-today .overview-stat:hover { background: #f8fcff; transform: translateY(-1px); box-shadow: 0 9px 20px rgba(21,70,104,.08); }

#view-today .dashboard-grid {
  grid-template-columns: minmax(0, 1.08fr) minmax(290px, .92fr);
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(179,213,231,.82);
  border-radius: 30px;
  background: rgba(255,255,255,.76);
  box-shadow: 0 24px 60px rgba(17,62,101,.1);
  backdrop-filter: blur(18px);
}
#view-today .panel-card { border-radius: 22px; }
#view-today .ask-prompt-card {
  grid-column: auto;
  order: -10;
  min-height: 205px;
  align-items: center;
  padding: 26px;
  border: 0;
  background: linear-gradient(120deg, #0b2f54, #17577c 54%, #138ba8);
  box-shadow: 0 18px 38px rgba(9,55,83,.2);
}
#view-today .ask-prompt-card::after {
  content: "";
  position: absolute;
  width: 220px;
  height: 220px;
  top: -95px;
  right: -60px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(99,237,240,.7), transparent 68%);
  pointer-events: none;
}
#view-today .ask-prompt-card > * { position: relative; z-index: 1; }
#view-today .ask-prompt-card h2 { font-size: 27px; line-height: 1; }
#view-today .ask-prompt-card p:not(.card-kicker) { max-width: 390px; font-size: 10px; }
#view-today .day-card { order: -9; padding: 22px; border-top: 4px solid var(--colour-yellow); }
#view-today .appointment-card { order: -8; padding: 22px; border-top: 4px solid var(--colour-violet); }
#view-today .trend-card {
  order: -7;
  grid-column: 1 / -1;
  padding: 22px;
  border: 1px solid var(--line);
  border-top: 4px solid var(--colour-mint);
  border-radius: 22px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 10px 24px rgba(17,62,101,.06);
}
#view-today .tasks-card,
#view-today .activity-card {
  min-height: 180px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 10px 24px rgba(17,62,101,.06);
}
#view-today .tasks-card { border-top: 4px solid var(--colour-yellow); }
#view-today .activity-card { border-top: 4px solid var(--colour-coral); }
.today-research-card {
  position: relative;
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  min-height: 150px;
  overflow: hidden;
  padding: 25px;
  border: 1px solid #eadce2;
  border-radius: 22px;
  background: linear-gradient(110deg, #fff5d6, #ffeef0 46%, #f1ebff);
  color: var(--navy);
  text-decoration: none;
}
.today-research-card::after { content: ""; position: absolute; inset: auto 0 0; height: 4px; background: linear-gradient(90deg, var(--colour-cyan), var(--colour-blue), var(--colour-violet), var(--colour-coral), var(--colour-yellow), var(--colour-mint)); }
.today-research-card span > * { display: block; }
.today-research-card small { margin-bottom: 8px; color: #2a7297; font-size: 8px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.today-research-card b { font-size: 26px; line-height: 1; letter-spacing: -.055em; }
.today-research-card em { margin-top: 10px; color: #65758a; font-size: 10px; font-style: normal; }
.today-research-card strong { flex: 0 0 auto; padding: 14px 17px; border-radius: 999px; background: var(--navy); color: #fff; font-size: 9px; }
.today-research-card strong i { margin-left: 10px; color: var(--colour-yellow); font-style: normal; }

@media (max-width: 900px) {
  .colour-hero-live { grid-template-columns: 1fr; gap: 18px; min-height: 0; padding: 44px 0 48px; }
  .colour-hero-live h1 { font-size: clamp(55px, 12vw, 76px); }
  .colour-orbit { min-height: 410px; width: min(100%, 500px); margin: 0 auto; }
  .colour-ring-one { width: 286px; height: 286px; }
  .colour-ring-two { width: 214px; height: 214px; }
  .colour-orbit-core { width: 152px; height: 152px; }
  .orbit-doctorai-mark { width: 101px; height: 101px; }
  #view-today .dashboard-grid { grid-template-columns: 1fr; }
  #view-today .trend-card,
  .today-research-card { grid-column: auto; }
}

@media (max-width: 620px) {
  .colour-hero-live { padding: 38px 3px 42px; }
  .colour-eyebrow { font-size: 9px; }
  .colour-hero-live h1 { font-size: clamp(49px, 14vw, 60px); }
  .colour-hero-subtitle { margin-top: 22px; font-size: 13px; }
  .colour-hero-live .trust-welcome { font-size: 9px; }
  .colour-hero-actions { margin-top: 21px; }
  .colour-primary-action,
  .colour-secondary-action { flex: 1; min-width: 0; padding: 0 12px; font-size: 9px; }
  .colour-orbit { min-height: 380px; width: 100%; margin: 8px auto 0; }
  .colour-orbit::before { width: 255px; height: 255px; filter: blur(23px); }
  .colour-ring-one { width: 250px; height: 250px; }
  .colour-ring-two { width: 184px; height: 184px; }
  .colour-orbit-core { width: 132px; height: 132px; padding: 17px; border-width: 6px; }
  .orbit-doctorai-mark { width: 89px; height: 89px; }
  .colour-orbit-core small { bottom: 9px; font-size: 6px; }
  .orbit-action { min-width: 91px; min-height: 43px; gap: 6px; padding: 8px 10px; border-radius: 14px; font-size: 8px; }
  .orbit-action span { font-size: 14px; }
  .orbit-action-ask { top: 0; }
  .orbit-action-research { top: 65px; left: 0; }
  .orbit-action-medicines { top: 65px; right: 0; }
  .orbit-action-symptoms { bottom: 73px; left: 0; }
  .orbit-action-appointments { bottom: 73px; right: 0; }
  .orbit-action-health { bottom: 27px; }
  .orbit-instruction { bottom: 0; font-size: 8px; }
  #view-today .daily-insight { padding: 13px; }
  #view-today .daily-insight .insight-action { display: none; }
  #view-today .overview-strip { padding: 6px; gap: 6px; border-radius: 20px; }
  #view-today .overview-stat { min-height: 74px; padding: 10px 8px; }
  #view-today .dashboard-grid { padding: 11px; border-radius: 23px; }
  #view-today .ask-prompt-card { padding: 20px 17px; }
  #view-today .ask-prompt-card h2 { font-size: 23px; }
  #view-today .day-card,
  #view-today .appointment-card,
  #view-today .trend-card,
  #view-today .tasks-card,
  #view-today .activity-card { padding: 17px; }
  .today-research-card { display: block; padding: 20px; }
  .today-research-card b { font-size: 23px; }
  .today-research-card strong { display: inline-block; margin-top: 18px; }
}

@media (hover: hover) and (pointer: fine) {
  .orbit-instruction::after { content: " Click any shortcut"; }
  .orbit-instruction { font-size: 0; }
  .orbit-instruction::after { font-size: 9px; }
}

@media (prefers-reduced-motion: reduce) {
  .colour-ring-one,
  .colour-ring-two,
  .colour-orbit-core.is-drop-active .orbit-core-glow { animation: none; }
  .orbit-action,
  .colour-orbit-core { transition-duration: .01ms; }
}

/* Keep every mobile prompt and the composer controls inside the viewport. */
@media (max-width: 800px) {
  #view-ask .quick-asks {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 7px;
    overflow: visible;
    padding: 0 13px 12px;
  }
  #view-ask .quick-asks-label {
    grid-column: 1 / -1;
    width: auto;
    margin: 0 0 2px;
  }
  #view-ask .quick-asks button {
    width: 100%;
    min-width: 0;
    min-height: 43px;
    justify-content: flex-start;
    padding: 7px 9px;
    line-height: 1.25;
    white-space: normal;
  }
  #view-ask .quick-asks button b { margin-left: auto; }
  #view-ask .chat-composer .composer-row {
    position: relative;
    min-height: 49px;
    justify-content: center;
    padding: 7px 10px;
  }
  #view-ask .chat-composer .composer-context {
    position: absolute;
    left: 11px;
    top: 50%;
    margin: 0;
    transform: translateY(-50%);
    font-size: 8px;
  }
  #view-ask .chat-composer .composer-row > #chat-count { display: none; }
  #view-ask .chat-composer .composer-row > #chat-send {
    margin: 0 auto;
    min-width: 76px;
  }
}

/* Medication scanning: live package-code detection with an explicit photo/manual fallback. */
.medication-scan-button {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 7px 15px 7px 9px;
  text-align: left;
}
.medication-scan-button-icon {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 11px;
  background: linear-gradient(145deg, #e3faff, #dfeeff);
  color: var(--blue-strong);
}
.medication-scan-button-icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.medication-scan-button > span:last-child { display: grid; gap: 2px; font-size: 10px; line-height: 1.15; }
.medication-scan-button small { color: var(--muted); font-size: 8px; font-weight: 700; }
.medication-scanner-modal {
  width: min(520px, calc(100% - 28px));
  max-height: min(820px, calc(100dvh - 28px));
  padding: 0;
  overflow: auto;
  border: 1px solid #d4e5ee;
  border-radius: 22px;
  background: #fff;
  color: var(--navy);
  box-shadow: 0 32px 100px rgba(10, 38, 61, .3);
  overscroll-behavior: contain;
}
.medication-scanner-modal[open] { display: flex; flex-direction: column; }
.medication-scanner-modal .modal-header { flex-shrink: 0; padding: 18px 20px 14px; }
.medication-scanner-modal .modal-header .icon-button { width: 44px; height: 44px; flex-shrink: 0; font-size: 24px; }
.medication-scanner-modal::backdrop { background: rgba(7, 29, 48, .58); backdrop-filter: blur(5px); }
.medication-scanner-copy { display: grid; gap: 12px; min-height: 0; padding: 16px 20px; overflow-y: auto; }
.medication-scanner-intro { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.58; }
.medication-camera-stage {
  position: relative;
  height: clamp(170px, 32dvh, 300px);
  min-height: 170px;
  flex-shrink: 0;
  overflow: hidden;
  border: 1px solid #244d69;
  border-radius: 18px;
  background: radial-gradient(circle at 50% 42%, #214d6b, #081f32 72%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.05), 0 14px 32px rgba(9, 39, 63, .15);
}
.medication-camera-stage video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  background: #081f32;
  opacity: 0;
  transition: opacity .2s ease;
}
.medication-camera-stage[data-camera-state="scanning"] video,
.medication-camera-stage[data-camera-state="found"] video { opacity: 1; }
.medication-camera-placeholder {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 9px;
  color: #dff7ff;
  text-align: center;
}
.medication-camera-placeholder > span { width: 44px; height: 44px; opacity: .8; }
.medication-camera-placeholder svg, .medication-capture-button svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.medication-camera-placeholder b { font-size: 13px; }
.medication-camera-stage[data-camera-state="error"] { height: 130px; min-height: 130px; border-color: #dbeaf2; background: #eef8fc; box-shadow: none; }
.medication-camera-stage[data-camera-state="error"] .medication-camera-placeholder { color: #315e78; }
.medication-camera-stage[data-camera-state="reading"] { height: 150px; min-height: 150px; }
.medication-camera-stage[data-camera-state="scanning"] .medication-camera-placeholder,
.medication-camera-stage[data-camera-state="found"] .medication-camera-placeholder { display: none; }
.medication-scan-reticle {
  position: absolute;
  inset: 20% 12%;
  display: none;
  border: 2px solid rgba(148, 240, 255, .86);
  border-radius: 16px;
  box-shadow: 0 0 0 999px rgba(3, 18, 31, .22), 0 0 24px rgba(87, 226, 245, .22);
}
.medication-camera-stage[data-camera-state="scanning"] .medication-scan-reticle { display: block; }
.medication-scan-reticle::before {
  content: '';
  position: absolute;
  top: 50%;
  right: 8%;
  left: 8%;
  height: 2px;
  background: linear-gradient(90deg, transparent, #7aebf8, transparent);
  box-shadow: 0 0 12px #6fe8f5;
  animation: medication-scan-line 1.8s ease-in-out infinite alternate;
}
.medication-scan-reticle i { position: absolute; inset: -2px; border-radius: inherit; box-shadow: inset 22px 0 0 -20px #fff, inset -22px 0 0 -20px #fff; }
.medication-scan-reticle span { position: absolute; right: 0; bottom: -34px; left: 0; color: #fff; font-size: 11px; font-weight: 800; text-align: center; text-shadow: 0 2px 7px #000; }
.medication-scanner-status { min-height: 24px; margin: 0; color: #315e78; font-size: 12px; font-weight: 750; line-height: 1.5; }
.medication-camera-stage[data-camera-state="error"] + .medication-scanner-status { color: #8f3d37; }
.medication-scanner-actions { display: grid; grid-template-columns: 1fr 1fr; flex-shrink: 0; gap: 8px; padding: 12px 20px 18px; border-top: 1px solid var(--line-soft); background: #fff; }
.medication-scanner-actions .medication-capture-button { grid-column: 1 / -1; display: flex; justify-content: center; align-items: center; gap: 9px; font-size: 13px; }
.medication-capture-button svg { width: 20px; height: 20px; }
.medication-scanner-actions button:disabled { opacity: .5; cursor: not-allowed; }
.medication-scanner-actions .primary-button,
.medication-scanner-actions .secondary-button { min-height: 44px; }
.medication-scanner-safety { display: flex; align-items: flex-start; gap: 9px; margin: 0; padding: 12px 13px; border: 1px solid #d9e9f0; border-radius: 13px; background: #f5fbfe; color: #557286; font-size: 11px; line-height: 1.55; }
.medication-scanner-safety > span:first-child { width: 22px; height: 22px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid #a9d3e4; border-radius: 50%; color: #147daf; font-weight: 900; }
.medication-image-consent { display:flex; align-items:flex-start; gap:9px; margin:0; padding:11px 13px; border:1px solid #b8d8e7; border-radius:12px; background:#f2faff; color:#335e76; font-size:10px; line-height:1.5; }
.medication-image-consent input { width:16px; height:16px; flex:0 0 auto; margin:2px 0 0; accent-color:#157cab; }
.scan-result-note { display: grid; gap: 4px; margin: 18px 23px 0; padding: 12px 13px; border: 1px solid #bce3ed; border-radius: 12px; background: #effbfe; color: #3c657c; }
.scan-result-note b { color: var(--navy); font-size: 11px; }
.scan-result-note span { font-size: 10px; line-height: 1.5; }
.scan-result-note.scan-result-error { border-color: #edc6c1; background: #fff6f4; color: #8b4a44; }
.scan-result-note.scan-result-error b { color: #8a332d; }
@keyframes medication-scan-line { from { transform: translateY(-48px); } to { transform: translateY(48px); } }

@media (max-width: 620px) {
  #view-medications .page-heading-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
  #view-medications .page-heading-actions > button { width: 100%; }
  .medication-scanner-modal { width: calc(100% - 16px); max-height: calc(100dvh - 16px); border-radius: 19px; }
  .medication-scanner-modal .modal-header { padding: 17px 17px 13px; }
  .medication-scanner-modal .modal-header h2 { font-size: 22px; }
  .medication-scanner-copy { gap: 12px; padding: 15px 16px 18px; }
  .medication-scanner-intro { font-size: 12px; }
  .medication-camera-stage { border-radius: 15px; }
  .medication-scanner-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .medication-scanner-actions .primary-button { grid-column: 1 / -1; }
  .medication-scanner-actions button { width: 100%; }
  .medication-scanner-actions { padding: 12px 16px max(14px, env(safe-area-inset-bottom)); }
  .scan-result-note { margin: 15px 16px 0; }
}

@media (prefers-reduced-motion: reduce) {
  .medication-scan-reticle::before { animation: none; }
  .medication-camera-stage video { transition: none; }
}

/* Symptom Diary: private observations, designed to support care conversations rather than diagnosis. Tunes into the unified DoctorAI shell above. */
#view-symptoms .page-heading { margin-bottom: 18px; }
.symptom-safety-banner {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  margin-bottom: 16px;
  padding: 14px 16px;
  border: 1px solid #f1d8cf;
  border-radius: 15px;
  background: linear-gradient(105deg, #fff8f5, #fffdfb);
  box-shadow: 0 8px 24px rgba(121, 66, 51, .04);
}
.symptom-safety-icon {
  width: 29px;
  height: 29px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 10px;
  background: #ffe9e2;
  color: #a64f41;
  font-size: 13px;
  font-weight: 900;
}
.symptom-safety-banner b { display: block; color: #69352f; font-size: 12px; }
.symptom-safety-banner p { max-width: 920px; margin: 4px 0 0; color: #805d57; font-size: 10px; line-height: 1.55; }
.symptom-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 11px;
  margin-bottom: 15px;
}
.symptom-summary-card {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 78px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 8px 22px rgba(18, 66, 103, .055);
}
.symptom-summary-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 800;
}
.symptom-summary-icon.cyan { background: #e2f9fc; color: #0787a1; }
.symptom-summary-icon.coral { background: #fff0ec; color: #b85c4f; }
.symptom-summary-icon.blue { background: #e9f3ff; color: #166dcc; }
.symptom-summary-card b,
.symptom-summary-card small { display: block; min-width: 0; }
.symptom-summary-card b { overflow: hidden; color: var(--navy); font-size: 17px; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
.symptom-summary-card small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.symptom-diary-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr);
  gap: 15px;
  align-items: start;
}
.symptom-log-card,
.symptom-guide { padding: 22px; }
.symptom-mode-tabs {
  display: flex;
  width: max-content;
  max-width: 100%;
  gap: 3px;
  margin-top: 16px;
  padding: 3px;
  border: 1px solid #d8e7ef;
  border-radius: 11px;
  background: #f3f8fb;
}
.symptom-mode-tabs button {
  min-height: 34px;
  padding: 0 13px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  white-space: nowrap;
}
.symptom-mode-tabs button:hover { color: var(--blue-strong); background: #e8f6fb; }
.symptom-mode-tabs button.active { background: var(--navy); color: #fff; box-shadow: 0 4px 10px rgba(7, 35, 61, .16); }
.symptom-mode-tabs button:focus-visible { outline: 3px solid rgba(37, 177, 216, .35); outline-offset: 2px; }
.symptom-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 16px;
  padding: 6px 0 12px;
  border-bottom: 1px solid var(--line-soft);
}
.symptom-toolbar > span { display: inline-flex; align-items: center; gap: 6px; color: var(--muted-light); font-size: 9px; white-space: nowrap; }
.symptom-toolbar > span i { width: 6px; height: 6px; border-radius: 50%; background: #2da982; }
.symptom-list { display: grid; }
.symptom-triggers { min-width: 0; padding-top: 16px; }
.symptom-triggers-intro { display: flex; align-items: flex-start; gap: 10px; padding: 11px 12px; border: 1px solid #d5e8ef; border-radius: 12px; background: linear-gradient(110deg, #f2fbfd, #f8fbff); }
.symptom-trigger-mark,
.symptom-trigger-icon { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 11px; background: #e5f8fc; color: #0b82a2; }
.symptom-trigger-mark .symptom-icon-svg { width: 18px; height: 18px; }
.symptom-triggers-intro h3 { margin: 0; color: var(--navy); font-size: 12px; }
.symptom-triggers-intro p { margin: 4px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }
.symptom-trigger-list { display: grid; gap: 9px; margin-top: 11px; }
.symptom-trigger-item { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.92); box-shadow: 0 6px 16px rgba(18, 66, 103, .045); }
.symptom-trigger-icon { width: 34px; height: 34px; background: #eef7fc; color: var(--blue-strong); }
.symptom-trigger-icon .symptom-icon-svg { width: 17px; height: 17px; }
.symptom-trigger-copy { min-width: 0; }
.symptom-trigger-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.symptom-trigger-heading b { color: var(--navy); font-size: 10px; }
.symptom-trigger-heading small { flex: 0 0 auto; color: var(--muted-light); font-size: 8px; }
.symptom-trigger-copy p { margin: 5px 0 0; color: var(--navy); font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.symptom-trigger-meta { display: block; margin-top: 5px; color: var(--muted-light); font-size: 8px; line-height: 1.35; overflow-wrap: anywhere; }
.symptom-triggers-note { display: flex; align-items: flex-start; gap: 7px; margin: 12px 1px 0; color: var(--muted-light); font-size: 8px; line-height: 1.5; }
.symptom-triggers-note > span { width: 16px; height: 16px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid #bfdbe6; border-radius: 50%; color: var(--blue-strong); font-size: 9px; font-weight: 800; }
.symptom-triggers-empty { min-height: 250px; display: grid; place-items: center; align-content: center; padding: 26px 18px; color: var(--muted); text-align: center; }
.symptom-trigger-empty-icon { width: 46px; height: 46px; display: grid; place-items: center; margin-bottom: 12px; border-radius: 15px; background: #e7f8fc; color: #0b82a2; font-size: 20px; }
.symptom-triggers-empty h3 { margin: 0; color: var(--navy); font-size: 17px; }
.symptom-triggers-empty p { max-width: 380px; margin: 7px auto 16px; font-size: 10px; line-height: 1.55; }
.symptom-entry {
  display: grid;
  grid-template-columns: 67px minmax(0, 1fr);
  gap: 16px;
  padding: 18px 0;
  border-bottom: 1px solid var(--line-soft);
}
.symptom-entry:last-child { padding-bottom: 0; border-bottom: 0; }
.symptom-entry-date {
  align-self: start;
  min-height: 72px;
  display: grid;
  place-items: center;
  align-content: center;
  padding: 8px 5px;
  border: 1px solid #d8e8f1;
  border-radius: 14px;
  background: #f7fbfe;
  color: var(--muted);
  text-align: center;
}
.symptom-entry-date span { font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.symptom-entry-date b { margin: 2px 0; color: var(--navy); font-size: 22px; line-height: 1; }
.symptom-entry-date small { font-size: 7px; line-height: 1.25; }
.symptom-entry-content { min-width: 0; }
.symptom-entry-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.symptom-entry-heading h3 { margin: 0; color: var(--navy); font-size: 15px; line-height: 1.25; letter-spacing: -.025em; }
.symptom-entry-heading small { display: block; margin-top: 4px; color: var(--muted); font-size: 9px; }
.symptom-severity { display: grid; grid-template-columns: auto minmax(100px, 1fr); align-items: center; gap: 11px; margin-top: 12px; }
.symptom-severity > span:first-child { color: var(--muted); font-size: 9px; white-space: nowrap; }
.symptom-severity > span:first-child b { color: var(--navy); font-size: 10px; }
.symptom-severity-unknown { display: block; padding: 7px 9px; border-radius: 9px; background: #f4f8fb; }
.symptom-severity-meter { display: grid; grid-template-columns: repeat(10, minmax(4px, 1fr)); gap: 3px; max-width: 260px; }
.symptom-severity-meter i { height: 6px; border-radius: 999px; background: #e8f0f5; }
.severity-low .symptom-severity-meter i.active { background: #2ca484; }
.severity-moderate .symptom-severity-meter i.active { background: #d4a13f; }
.severity-high .symptom-severity-meter i.active { background: #cd6758; }
.symptom-context,
.symptom-notes { margin: 11px 0 0; color: var(--muted); font-size: 10px; line-height: 1.55; overflow-wrap: anywhere; }
.symptom-context { padding: 9px 11px; border-radius: 10px; background: #f4f9fc; }
.symptom-context b { margin-right: 7px; color: var(--navy); font-size: 8px; letter-spacing: .06em; text-transform: uppercase; }
.symptom-entry-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.symptom-entry-actions button {
  min-height: 34px;
  padding: 0 9px;
  border: 1px solid #d9e8f1;
  border-radius: 9px;
  background: #fff;
  color: var(--blue-strong);
  font-size: 9px;
  font-weight: 800;
}
.symptom-entry-actions button:first-child { border-color: #c3e7ee; background: #eefbfe; }
.symptom-entry-actions button:hover,
.symptom-entry-actions button:focus-visible { border-color: #8fcfe0; background: var(--sky); }
.symptom-entry-actions .delete-item { margin-left: auto; border-color: transparent; color: #9f5a52; }
.symptom-empty { min-height: 300px; display: grid; place-items: center; align-content: center; padding: 30px 18px; color: var(--muted); text-align: center; }
.symptom-empty > span { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 13px; border-radius: 16px; background: #e7f8fc; color: #0a88a3; font-size: 22px; }
.symptom-empty h3 { margin: 0; color: var(--navy); font-size: 18px; }
.symptom-empty p { max-width: 390px; margin: 7px auto 17px; font-size: 11px; line-height: 1.55; }
.symptom-empty.compact { min-height: 220px; }
.symptom-guide { position: sticky; top: 90px; overflow: hidden; }
.symptom-guide::after { content: ''; position: absolute; right: 0; top: -58px; width: 150px; height: 150px; border-radius: 50%; background: radial-gradient(circle, rgba(37,204,230,.14), transparent 67%); pointer-events: none; }
.symptom-guide-mark { width: 40px; height: 40px; display: grid; place-items: center; margin-bottom: 17px; border-radius: 13px; background: linear-gradient(145deg, #e4f9fd, #eef4ff); color: #0c7bb1; font-size: 18px; }
.symptom-guide h2 { max-width: 250px; margin: 3px 0 0; font-size: 21px; line-height: 1.12; letter-spacing: -.04em; }
.symptom-guide ol { display: grid; gap: 14px; margin: 21px 0; padding: 0; list-style: none; counter-reset: diary-step; }
.symptom-guide li { position: relative; min-height: 30px; padding-left: 39px; counter-increment: diary-step; }
.symptom-guide li::before { content: counter(diary-step); position: absolute; left: 0; top: 0; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 9px; background: #eef7fc; color: var(--blue-strong); font-size: 9px; font-weight: 900; }
.symptom-guide li b,
.symptom-guide li span { display: block; }
.symptom-guide li b { color: var(--navy); font-size: 10px; }
.symptom-guide li span { margin-top: 3px; color: var(--muted); font-size: 9px; line-height: 1.5; }
.symptom-guide .full-width { justify-content: center; width: 100%; min-height: 42px; }
.symptom-guide-note { margin: 12px 0 0; color: var(--muted-light); font-size: 8px; line-height: 1.55; text-align: center; }
.modal-form[data-modal-form="symptom"] .modal-actions { position: sticky; bottom: 0; z-index: 2; margin: 0 -2px; padding: 13px 2px 8px; border-top: 1px solid var(--line-soft); background: linear-gradient(to bottom, rgba(255,255,255,.94), #fff 20%); }

@media (max-width: 900px) {
  .symptom-diary-layout { grid-template-columns: 1fr; }
  .symptom-guide { position: static; }
  .symptom-guide h2 { max-width: none; }
  .symptom-guide ol { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  #view-symptoms.view { padding-bottom: 112px; }
  #view-symptoms .page-heading { gap: 15px; margin-bottom: 14px; }
  #view-symptoms .page-heading > .primary-button { width: 100%; }
  .symptom-safety-banner { gap: 10px; padding: 12px; }
  .symptom-safety-banner b { font-size: 11px; }
  .symptom-safety-banner p { font-size: 9px; }
  .symptom-summary { gap: 7px; }
  .symptom-summary-card { min-height: 72px; display: grid; justify-items: start; gap: 7px; padding: 10px; }
  .symptom-summary-icon { width: 28px; height: 28px; border-radius: 9px; font-size: 12px; }
  .symptom-summary-card b { max-width: 100%; font-size: 13px; }
  .symptom-summary-card small { font-size: 8px; line-height: 1.25; }
  .symptom-log-card,
  .symptom-guide { padding: 16px; }
  .symptom-toolbar { align-items: flex-start; flex-direction: column; gap: 8px; }
  .symptom-toolbar .filter-tabs { width: 100%; flex-wrap: nowrap; overflow-x: auto; }
  .symptom-toolbar .filter-tabs button { flex: 0 0 auto; min-height: 36px; }
  .symptom-toolbar .filter-tabs button { font-size: 9px; }
  .symptom-entry { grid-template-columns: 56px minmax(0, 1fr); gap: 11px; }
  .symptom-entry-date { min-height: 66px; }
  .symptom-entry-date b { font-size: 20px; }
  .symptom-severity { grid-template-columns: 1fr; gap: 6px; }
  .symptom-severity-meter { max-width: none; }
  .symptom-entry-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .symptom-entry-actions button { min-height: 44px; padding-inline: 5px; }
  .symptom-entry-actions .delete-item { margin-left: 0; }
  .symptom-guide ol { grid-template-columns: 1fr; }
  .modal-form[data-modal-form="symptom"] { gap: 10px; padding: 15px 16px 18px; }
  .modal-form[data-modal-form="symptom"] .modal-field textarea { min-height: 62px; }
  .modal-form[data-modal-form="symptom"] .modal-actions { bottom: 0; margin-inline: -1px; padding-bottom: 8px; }
}

@media (max-width: 380px) {
  .symptom-summary-card { padding: 8px; }
  .symptom-summary-icon { width: 25px; height: 25px; }
  .symptom-summary-card b { font-size: 11px; }
  .symptom-entry { grid-template-columns: 1fr; }
  .symptom-entry-date { min-height: 42px; display: flex; justify-content: flex-start; gap: 6px; padding: 8px 10px; text-align: left; }
  .symptom-entry-date b { order: -1; font-size: 17px; }
}

/* Final order-safe home layout: the wheel is the single, centred focal point. */
#view-today .colour-hero-live {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  gap: 12px;
  min-height: 0;
  padding: 24px 0 54px;
}
#view-today .colour-hero-copy {
  width: 100%;
  max-width: 720px;
  text-align: center;
}
#view-today .home-hero-logo-copy { min-height: 120px; }
#view-today .home-hero-logo {
  width: min(320px, 70vw);
  max-height: 130px;
}
#view-today .colour-orbit {
  width: min(100%, 650px);
  min-height: 468px;
  margin-inline: auto;
}
@media (max-width: 620px) {
  #view-today .colour-hero-live {
    gap: 6px;
    padding: 12px 0 42px;
  }
  #view-today .home-hero-logo-copy { min-height: 100px; }
  #view-today .home-hero-logo {
    width: min(270px, 72vw);
    max-height: 108px;
  }
  #view-today .colour-orbit {
    width: min(100%, 430px);
    min-height: 424px;
  }
}

/* Signature interaction system: a quiet pulse and a clear selected state. */
#view-today .colour-orbit {
  --orb-ease: cubic-bezier(.22, .8, .24, 1);
}
#view-today .colour-orbit::after {
  content: "";
  position: absolute;
  width: 178px;
  height: 178px;
  border: 1px solid rgba(37, 204, 230, .26);
  border-radius: 50%;
  opacity: 0;
  pointer-events: none;
}
#view-today .colour-orbit.is-pulsing::after {
  animation: health-pulse 900ms var(--orb-ease) both;
}
#view-today .colour-orbit.is-pulsing .colour-orbit-core {
  animation: core-pulse 900ms var(--orb-ease) both;
}
#view-today .orbit-action {
  transition: transform 260ms var(--orb-ease), box-shadow 260ms var(--orb-ease), filter 260ms var(--orb-ease), opacity 260ms ease;
}
#view-today .orbit-action.is-selected {
  border-color: rgba(7, 91, 192, .42);
  box-shadow: 0 17px 34px rgba(17, 62, 101, .22), 0 0 0 3px rgba(37, 204, 230, .2), inset 0 1px 0 rgba(255,255,255,.8);
  filter: saturate(1.12) brightness(1.02);
}
#view-today .colour-orbit[data-active-feature="ask"] .colour-ring-two { border-left-color: #25cce6; }
#view-today .colour-orbit[data-active-feature="health"] .colour-ring-two,
#view-today .colour-orbit[data-active-feature="documents"] .colour-ring-two { border-bottom-color: #57dfbd; }
#view-today .colour-orbit[data-active-feature="medications"] .colour-ring-one { border-right-color: #0d75f5; }
#view-today .colour-orbit[data-active-feature="appointments"] .colour-ring-one { border-right-color: #a58aff; }
#view-today .colour-orbit[data-active-feature="results"] .colour-ring-one { border-top-color: #ff8b78; }
#view-today .colour-orbit[data-active-feature="research"] .colour-ring-one { border-top-color: #ffd85f; }
@keyframes health-pulse {
  0% { opacity: .55; transform: scale(.72); }
  100% { opacity: 0; transform: scale(1.38); }
}
@keyframes core-pulse {
  0% { transform: scale(1); box-shadow: 0 28px 52px rgba(18,85,122,.25), inset 0 0 0 1px rgba(13,117,245,.12); }
  45% { transform: scale(1.035); box-shadow: 0 30px 58px rgba(18,85,122,.3), 0 0 0 8px rgba(93,228,245,.12), inset 0 0 0 1px rgba(13,117,245,.16); }
  100% { transform: scale(1); box-shadow: 0 28px 52px rgba(18,85,122,.25), inset 0 0 0 1px rgba(13,117,245,.12); }
}
@media (prefers-reduced-motion: reduce) {
  #view-today .colour-orbit.is-pulsing::after,
  #view-today .colour-orbit.is-pulsing .colour-orbit-core { animation: none; }
}

/* Phase 2 polish: clearer affordances, focus visibility, and comfortable tap targets. */
:where(a, button, input, textarea, select):focus-visible {
  outline: 3px solid rgba(25, 189, 219, .62);
  outline-offset: 3px;
}
:where(.panel-card, .day-card, .activity-card, .appointment-card, .library-card, .measurements-card, .memory-card, .history-card, .tasks-card, .trend-card, .result-list-card, .today-research-card, .refill-card, .info-card) {
  border-color: #c7e0ec;
  box-shadow: 0 12px 30px rgba(23, 53, 80, .08), inset 0 1px 0 rgba(255,255,255,.82);
}
:where(a, button, input, textarea, select) { -webkit-tap-highlight-color: transparent; }
.delete-item, .missed-button { min-height: 32px; padding: 6px 8px; }
@media (max-width: 800px) {
  .primary-button, .secondary-button, .add-health-button, .pro-button { min-height: 44px; }
  .nav-item, .category-tab { min-height: 44px; }
  .page-subtitle, .trust-welcome { font-size: 14px; }
  .empty-state, .empty-inline { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Final calm hub treatment: one clear alert, stronger readability, and a logo-only centre. */
#view-today .colour-hero-live { background: linear-gradient(145deg, #fbfdff 0%, #f4fbff 56%, #fffaf5 100%); border: 1px solid #d8e9f1; border-radius: 28px; }
#view-today .colour-hero-copy { margin-bottom: 2px; }
#view-today .home-hero-logo { width: min(300px, 68vw); max-height: 122px; }
#view-today .colour-orbit-core small { display: none; }
#view-today .orbit-instruction { font-size: 10px; color: #244b69; font-weight: 800; }
#view-today .orbit-action { min-height: 66px; border: 1px solid var(--orbit-border, #b9d8e7); background: var(--orbit-bg, #fff) !important; color: #173550; box-shadow: 0 10px 24px rgba(23,53,80,.10); }
#view-today .orbit-action b { font-size: 12px; color: #173550; }
#view-today .orbit-action span { font-size: 22px; }
#view-today .orbit-action {
  width: 176px;
  min-height: 78px;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  grid-template-rows: auto auto;
  justify-content: initial;
  align-content: center;
  gap: 3px 8px;
  padding: 12px 13px;
  text-align: left;
}
#view-today .orbit-action > span { grid-row: 1 / span 2; align-self: start; }
#view-today .orbit-action > small { grid-column: 2; color: #466a7f; font-size: 9px; font-weight: 600; line-height: 1.35; }
#view-today .orbit-action[data-orbit-tone="cyan"] { --orbit-border: #8bdce9; }
#view-today .orbit-action[data-orbit-tone="blue"] { --orbit-border: #9bbce9; }
#view-today .orbit-action[data-orbit-tone="violet"] { --orbit-border: #c0b0ee; }
#view-today .orbit-action[data-orbit-tone="mint"] { --orbit-border: #8edfc9; }
#view-today .orbit-action[data-orbit-tone="coral"] { --orbit-border: #f0aea3; }
#view-today .orbit-action[data-orbit-tone="yellow"] { --orbit-border: #e8cf78; }
#view-today .daily-insight,
#view-today .overview-strip,
#view-today .dashboard-grid > .trend-card,
#view-today .dashboard-grid > .tasks-card,
#view-today .dashboard-grid > .ask-prompt-card,
#view-today .dashboard-grid > .activity-card { display: none; }
.prescription-alert-home { width: min(100%, 980px); margin: -22px auto 26px; padding: 20px; border: 1px solid #c9dfea; border-radius: 22px; background: #fff; box-shadow: 0 12px 28px rgba(23,53,80,.08); }
.prescription-alert-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:14px; }
.prescription-alert-heading h2 { margin:2px 0 0; color:#173550; font-size:22px; }
.prescription-last-checked { color:#587287; font-size:12px; }
.prescription-alert-status { display:flex; align-items:center; gap:14px; padding:15px; border:1px solid; border-radius:16px; }
.prescription-alert-status > div { flex:1; }
.prescription-alert-status b,.prescription-alert-status p,.prescription-alert-status small { display:block; }
.prescription-alert-status b { font-size:16px; color:inherit; }
.prescription-alert-status p { margin:3px 0 0; color:inherit; font-size:14px; line-height:1.45; }
.prescription-alert-status small { margin-top:5px; color:inherit; opacity:1; font-size:12px; }
.prescription-alert-icon { width:34px; height:34px; display:grid; place-items:center; flex:0 0 auto; border-radius:50%; color:#fff; font-size:20px; font-weight:900; }
.prescription-alert-status button { min-height:42px; border:0; background:transparent; color:inherit; font-weight:800; white-space:nowrap; cursor:pointer; }
.status-clear { color:#176a4e; background:#effbf5; border-color:#b9e4d3; }
.status-clear .prescription-alert-icon { background:#249b72; }
.status-note { color:#24516f; background:#f0f7fb; border-color:#c4dce9; }
.status-note .prescription-alert-icon { background:#367a9f; }
.status-caution { color:#875722; background:#fff8ed; border-color:#f0d3a9; }
.status-caution .prescription-alert-icon { background:#c9842c; }
.status-danger { color:#8f2f2b; background:#fff1f0; border-color:#efb8b4; }
.status-danger .prescription-alert-icon { background:#d64c47; }
@media (max-width:620px) {
  #view-today .colour-hero-live { border-radius:22px; padding-top:18px; }
  #view-today .home-hero-logo { width:min(245px,70vw); max-height:100px; }
  #view-today .orbit-action { width: 132px; min-height: 78px; padding: 10px 9px; grid-template-columns: 24px minmax(0, 1fr); gap: 2px 6px; }
  #view-today .orbit-action b { font-size:11px; }
  #view-today .orbit-action > small { font-size: 8px; line-height: 1.28; }
  .prescription-alert-home { margin: -12px 0 20px; padding:16px; border-radius:18px; }
  .prescription-alert-heading { flex-direction:column; gap:5px; }
  .prescription-alert-heading h2 { font-size:20px; }
  .prescription-alert-status { align-items:flex-start; flex-wrap:wrap; }
  .prescription-alert-status button { margin-left:48px; padding:0; }
}

/* Shared reference layout: keep the website's wheel, but give it the same calm app-like hierarchy. */
#view-today .home-hero-logo-copy { display: none; }
#view-today .hub-hero-intro {
  width: min(100%, 980px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .9fr);
  align-items: center;
  gap: clamp(24px, 4vw, 58px);
  text-align: left;
}
#view-today .hub-hero-copy { width: 100%; min-width: 0; }
#view-today .hub-hero-greeting { margin: 0 0 9px; color: #607d91; font-size: 14px; font-weight: 700; }
#view-today .hub-hero-copy h1 { max-width: 480px; min-width: 0; margin: 0; color: #173550; font-size: clamp(42px, 5.2vw, 72px); line-height: .96; letter-spacing: -.07em; overflow-wrap: anywhere; text-wrap: balance; }
#view-today .hub-hero-copy h1 span { color: #1679e8; }
#view-today .hub-hero-subtitle { max-width: 350px; margin: 15px 0 0; color: #55728d; font-size: 15px; line-height: 1.55; }
#view-today .hub-ask-prompt {
  width: 100%;
  min-height: 94px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 17px;
  border: 1px solid #cfe2ed;
  border-radius: 21px;
  background: #fff;
  color: #173550;
  box-shadow: 0 14px 32px rgba(23,53,80,.09);
  text-align: left;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
#view-today .hub-ask-prompt:hover { transform: translateY(-2px); border-color: #9acbe1; box-shadow: 0 18px 38px rgba(23,53,80,.13); }
#view-today .hub-ask-prompt:focus-visible { outline: 3px solid rgba(22,121,232,.32); outline-offset: 3px; }
.hub-ask-prompt-icon { width: 40px; height: 40px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 13px; background: #e5faff; color: #1679e8; font-size: 21px; }
.hub-ask-prompt-copy { min-width: 0; flex: 1; }
.hub-ask-prompt-copy b, .hub-ask-prompt-copy small { display: block; }
.hub-ask-prompt-copy b { font-size: 14px; line-height: 1.25; }
.hub-ask-prompt-copy small { margin-top: 5px; color: #607d91; font-size: 11px; line-height: 1.4; }
.hub-ask-prompt-arrow { width: 36px; height: 36px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: #1679e8; color: #fff; font-size: 20px; font-weight: 800; }
#view-today .orbit-action[data-orbit-tone="cyan"] { --orbit-bg: #f0fbff; }
#view-today .orbit-action[data-orbit-tone="blue"] { --orbit-bg: #f3f7ff; }
#view-today .orbit-action[data-orbit-tone="violet"] { --orbit-bg: #faf7ff; }
#view-today .orbit-action[data-orbit-tone="mint"] { --orbit-bg: #f1fcfa; }
#view-today .orbit-action[data-orbit-tone="coral"] { --orbit-bg: #fff8f6; }
#view-today .orbit-action[data-orbit-tone="yellow"] { --orbit-bg: #fffdf3; }
@media (max-width: 900px) {
  #view-today .hub-hero-intro { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 15px; }
  #view-today .hub-hero-copy h1 { font-size: clamp(31px, 5.7vw, 48px); }
  #view-today .hub-hero-subtitle { font-size: 13px; }
  #view-today .hub-ask-prompt { min-height: 86px; padding: 12px; }
}
@media (max-width: 620px) {
  #view-today .colour-hero-live { padding: 22px 10px 40px; }
  #view-today .hub-hero-intro { width: 100%; gap: 10px; }
  #view-today .hub-hero-greeting { margin-bottom: 5px; font-size: 11px; }
  #view-today .hub-hero-copy h1 { font-size: clamp(27px, 7.5vw, 39px); line-height: .98; letter-spacing: -.06em; }
  #view-today .hub-hero-subtitle { margin-top: 9px; font-size: 11px; line-height: 1.4; }
  #view-today .hub-ask-prompt { min-height: 82px; gap: 7px; padding: 10px; border-radius: 17px; }
  .hub-ask-prompt-icon { width: 32px; height: 32px; border-radius: 10px; font-size: 16px; }
  .hub-ask-prompt-copy b { font-size: 10px; }
  .hub-ask-prompt-copy small { margin-top: 3px; font-size: 8px; line-height: 1.25; }
  .hub-ask-prompt-arrow { width: 29px; height: 29px; font-size: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  #view-today .hub-ask-prompt { transition: none; }
}

/* Final narrow-screen guardrail: keep the hero prompt and every orbit card inside the viewport. */
@media (max-width: 620px) {
  #view-today .hub-hero-intro {
    width: 100%;
    max-width: 100%;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }
  #view-today .hub-ask-prompt {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
  #view-today .colour-orbit {
    width: 100%;
    max-width: 360px;
    min-height: 420px;
  }
}
@media (max-width: 380px) {
  #view-today .colour-orbit { max-width: 340px; min-height: 408px; }
  #view-today .orbit-action { width: 116px; min-height: 74px; }
}

/* Narrow viewport lock: the homepage must never create a wider layout than the phone. */
#hub-shell,
#hub-shell .hub-main,
#hub-shell .view-stack,
#hub-shell #view-today,
#hub-shell #view-today .colour-hero-live {
  max-width: 100%;
  min-width: 0;
}
#hub-shell .hub-main,
#hub-shell #view-today,
#hub-shell #view-today .colour-hero-live {
  overflow-x: clip;
}
#hub-shell .mobile-menu-button,
#hub-shell .mobile-notifications-button,
.mobile-bottom-nav {
  display: none;
}
#hub-shell #view-today .colour-orbit {
  width: 100%;
  max-width: 690px;
  min-width: 0;
  margin-inline: auto;
  box-sizing: border-box;
}
#hub-shell #view-today .orbit-action {
  max-width: 186px;
}
@media (max-width: 620px) {
  #hub-shell .hub-topbar {
    width: 100%;
    max-width: 100vw;
    overflow: hidden;
  }
  #hub-shell .mobile-brand-wrap {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    align-items: center;
    gap: 4px;
  }
  #hub-shell .mobile-brand {
    min-width: 0;
    justify-self: center;
  }
  #hub-shell .mobile-brand .brand-lockup {
    min-width: 0;
    max-width: 100%;
    width: 146px;
    height: 62px;
  }
  #hub-shell .topbar-actions {
    display: none;
  }
  #hub-shell .mobile-menu-button,
  #hub-shell .mobile-notifications-button {
    position: relative;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    justify-self: center;
    padding: 0;
    border: 1px solid #e0ebf2;
    border-radius: 12px;
    background: #fff;
    color: #173550;
    box-shadow: 0 6px 15px rgba(23,53,80,.07);
  }
  #hub-shell .mobile-menu-button svg,
  #hub-shell .mobile-notifications-button svg {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  #hub-shell .mobile-notifications-button i {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 6px;
    height: 6px;
    border: 1.5px solid #fff;
    border-radius: 50%;
    background: #1679e8;
  }
  #hub-shell .mobile-menu-button:hover,
  #hub-shell .mobile-notifications-button:hover,
  #hub-shell .mobile-menu-button:focus-visible,
  #hub-shell .mobile-notifications-button:focus-visible {
    border-color: #9fd8e8;
    background: #f1fbff;
  }
  body[data-hub-theme="today"] .category-bar {
    display: none;
  }
  body[data-hub-theme="today"].mobile-category-open .category-bar {
    position: fixed;
    top: 72px;
    right: 0;
    left: 0;
    z-index: 45;
    display: block;
    padding-inline: 10px;
    border-bottom: 1px solid #d5e7f0;
    background: rgba(255,255,255,.98);
    box-shadow: 0 18px 32px rgba(23,53,80,.16);
  }
  .mobile-bottom-nav {
    position: fixed;
    right: 12px;
    bottom: max(12px, env(safe-area-inset-bottom));
    left: 12px;
    z-index: 40;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: center;
    min-height: 66px;
    padding: 7px 7px 8px;
    border: 1px solid #d6e5ee;
    border-radius: 22px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 16px 34px rgba(23,53,80,.16), inset 0 1px 0 rgba(255,255,255,.95);
    backdrop-filter: blur(16px);
  }
  .mobile-bottom-nav-item {
    min-width: 0;
    min-height: 50px;
    display: grid;
    place-items: center;
    gap: 2px;
    padding: 4px 2px;
    border: 0;
    border-radius: 14px;
    background: transparent;
    color: #61788a;
  }
  .mobile-bottom-nav-item span { font-size: 22px; line-height: 1; color: #173550; }
  .mobile-bottom-nav-item b { font-size: 10px; line-height: 1; }
  .mobile-bottom-nav-item.active { color: #075fbd; background: #eef9ff; }
  .mobile-bottom-nav-item.active span { color: #075fbd; }
  .mobile-bottom-nav-orb {
    width: 58px;
    height: 58px;
    justify-self: center;
    display: grid;
    place-items: center;
    padding: 10px;
    margin-top: -20px;
    border: 5px solid #fff;
    border-radius: 50%;
    background: #f3fbff;
    box-shadow: 0 7px 18px rgba(23,53,80,.17), 0 0 0 1px #cce5ef;
  }
  .mobile-bottom-nav-orb img { width: 100%; height: 100%; object-fit: contain; }
  #view-today.view { padding-bottom: 112px; }
  #view-ask.view, #view-health.view, #view-medications.view, #view-appointments.view, #view-results.view, #view-timeline.view, #view-documents.view { padding-bottom: 112px; }
  #hub-shell #view-today .colour-orbit {
    width: 100%;
    max-width: 360px;
    min-height: clamp(470px, 112vw, 548px);
  }
  #hub-shell #view-today .orbit-action {
    width: clamp(132px, 31vw, 176px);
    max-width: clamp(132px, 31vw, 176px);
  }
}
@media (max-width: 380px) {
  #hub-shell #view-today .colour-orbit {
    max-width: 340px;
    min-height: 500px;
  }
  #hub-shell #view-today .orbit-action {
    width: 132px;
    max-width: 132px;
  }
}

/* Homepage reference match: one calm hero, one signature wheel, one current alert. */
body[data-hub-theme="today"] {
  --paper: #f5faff;
  --navy: #173550;
  --navy-deep: #0d2945;
  --blue: #1679e8;
  --blue-strong: #075fbd;
  --cyan: #24bfdc;
  --line: #d5e7f0;
  --line-soft: #e9f2f7;
  --muted: #5e7487;
  --muted-light: #8095a5;
  background: radial-gradient(circle at 50% 14%, rgba(36,191,220,.13), transparent 29rem), linear-gradient(180deg, #f8fcff 0%, #f3f9fe 57%, #fbf9f6 100%);
}

#hub-shell .hub-topbar {
  border-top: 1px solid #d9edf4;
  border-bottom: 1px solid #d9e8f0;
  background: #fff;
  box-shadow: 0 8px 24px rgba(23, 53, 80, .06);
}
#hub-shell .mobile-brand .brand-lockup { width: 174px; height: 70px; border-radius: 0; }
#hub-shell .mobile-brand .brand-lockup img { object-fit: contain; object-position: center; }
#hub-shell .category-bar { background: rgba(255,255,255,.96); box-shadow: 0 5px 18px rgba(23,53,80,.04); }
#hub-shell .category-tab { color: #516b7f; }
#hub-shell .category-tab.active { background: #173550; color: #fff; }

#view-today.view {
  padding-top: 20px;
  padding-bottom: 42px;
}
#view-today .colour-hero-live {
  width: 100%;
  max-width: 1080px;
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: 1fr;
  justify-items: stretch;
  gap: 24px;
  margin: 0 auto 22px;
  padding: 36px clamp(20px, 4vw, 52px) 28px;
  border: 1px solid #d3e5ef;
  border-radius: 30px;
  background: linear-gradient(145deg, #fbfdff 0%, #f0f9fe 58%, #fffaf6 100%);
  box-shadow: 0 20px 56px rgba(23,53,80,.10), inset 0 1px 0 rgba(255,255,255,.94);
}
#view-today .hub-hero-intro {
  width: 100%;
  max-width: 980px;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  margin: 0 auto;
  text-align: left;
}
#view-today .hub-hero-copy { width: 100%; min-width: 0; }
#view-today .hub-hero-greeting {
  margin: 0 0 10px;
  color: #5d788d;
  font-size: 15px;
  font-weight: 700;
}
#view-today .hub-hero-copy h1 {
  max-width: none;
  margin: 0;
  color: #173550;
  font-size: clamp(38px, 6vw, 68px);
  line-height: .98;
  letter-spacing: -.065em;
  overflow-wrap: normal;
  text-wrap: balance;
}
#view-today .hub-hero-copy h1 span { color: #1679e8; }
#view-today .hub-hero-subtitle {
  max-width: 610px;
  margin: 15px 0 0;
  color: #5e7487;
  font-size: 16px;
  line-height: 1.55;
}
#view-today .hub-ask-prompt {
  width: 100%;
  min-width: 0;
  min-height: 108px;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 17px 19px;
  border: 1px solid #cbdfe9;
  border-radius: 22px;
  background: #fff;
  color: #173550;
  box-shadow: 0 14px 32px rgba(23,53,80,.09), inset 0 1px 0 rgba(255,255,255,.9);
}
#view-today .hub-ask-prompt:hover { border-color: #8fcde1; box-shadow: 0 18px 38px rgba(23,53,80,.13); }
#view-today .hub-ask-prompt-icon { width: 46px; height: 46px; border-radius: 15px; background: #e4faff; color: #1679e8; font-size: 24px; }
#view-today .hub-ask-prompt-copy b { color: #173550; font-size: 15px; }
#view-today .hub-ask-prompt-copy small { margin-top: 6px; color: #61788a; font-size: 12px; line-height: 1.4; }
#view-today .hub-ask-prompt-arrow { width: 42px; height: 42px; background: #1679e8; font-size: 23px; box-shadow: 0 8px 17px rgba(22,121,232,.22); }

#view-today .colour-orbit {
  width: min(100%, 690px);
  max-width: 100%;
  min-width: 0;
  justify-self: center;
  min-height: 574px;
  margin: 0 auto;
  padding: 0;
  overflow: visible;
}
#view-today .colour-orbit::before {
  width: min(430px, 72vw);
  height: min(430px, 72vw);
  filter: blur(30px);
  opacity: .56;
  background: conic-gradient(from 20deg, rgba(36,191,220,.18), rgba(115,137,244,.13), rgba(255,171,146,.10), rgba(255,215,102,.12), rgba(91,213,183,.16), rgba(36,191,220,.18));
}
#view-today .colour-ring-one { width: min(410px, 72vw); height: min(410px, 72vw); border-color: rgba(41,139,222,.22); border-top-color: rgba(255,164,141,.55); border-right-color: rgba(151,125,241,.55); animation-duration: 38s; }
#view-today .colour-ring-two { width: min(302px, 54vw); height: min(302px, 54vw); border-color: rgba(41,139,222,.17); border-left: 3px solid rgba(36,191,220,.64); border-bottom: 3px solid rgba(88,211,184,.62); animation-duration: 31s; }
#view-today .colour-orbit-core {
  width: clamp(154px, 31vw, 190px);
  height: clamp(154px, 31vw, 190px);
  padding: 19px;
  border: 8px solid rgba(255,255,255,.97);
  background: radial-gradient(circle at 34% 28%, #fff 0 45%, #f1fbff 78%, #e1f6fc 100%);
  box-shadow: 0 22px 45px rgba(23,83,122,.18), inset 0 0 0 1px rgba(13,117,245,.10);
}
#view-today .orbit-doctorai-mark { width: 100%; height: 100%; object-fit: contain; }
#view-today .orbit-action {
  width: clamp(140px, 31vw, 186px);
  min-width: 0;
  min-height: clamp(88px, 18vw, 122px);
  display: grid;
  grid-template-columns: 31px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-content: center;
  justify-content: initial;
  gap: 4px 9px;
  padding: 14px 13px;
  border: 1.5px solid var(--orbit-border, #bfd8e7);
  border-radius: 20px;
  background: var(--orbit-bg, #fff) !important;
  color: #173550;
  box-shadow: 0 12px 27px rgba(23,53,80,.11), inset 0 1px 0 rgba(255,255,255,.9);
}
#view-today .orbit-action > span { grid-row: 1 / span 2; align-self: start; font-size: 24px; line-height: 1; }
#view-today .orbit-action b { min-width: 0; color: #173550; font-size: clamp(13px, 2.2vw, 16px); line-height: 1.15; overflow-wrap: anywhere; }
#view-today .orbit-action > small { grid-column: 2; min-width: 0; margin: 0; color: #4d6679; font-size: clamp(10px, 1.65vw, 13px); font-weight: 600; line-height: 1.32; overflow-wrap: anywhere; }
#view-today .orbit-action[data-orbit-tone="cyan"] { --orbit-border: #8bd9e6; --orbit-bg: #f0fcff; }
#view-today .orbit-action[data-orbit-tone="blue"] { --orbit-border: #a7c4e7; --orbit-bg: #f5f8ff; }
#view-today .orbit-action[data-orbit-tone="violet"] { --orbit-border: #c8b9ec; --orbit-bg: #faf7ff; }
#view-today .orbit-action[data-orbit-tone="mint"] { --orbit-border: #8fdccc; --orbit-bg: #f1fcfa; }
#view-today .orbit-action[data-orbit-tone="coral"] { --orbit-border: #edb2a7; --orbit-bg: #fff8f6; }
#view-today .orbit-action[data-orbit-tone="yellow"] { --orbit-border: #e7d28b; --orbit-bg: #fffdf3; }
#view-today .orbit-action:hover, #view-today .orbit-action:focus-visible { transform: var(--orbit-base-transform) translate(var(--orbit-x, 0px), var(--orbit-y, 0px)) translate(var(--drag-x), var(--drag-y)) scale(1.035); }
#view-today .orbit-instruction {
  bottom: 4px;
  padding: 10px 17px;
  border: 1px solid #cfe3ec;
  border-radius: 999px;
  background: rgba(255,255,255,.94);
  color: #36566d;
  font-size: 12px;
  font-weight: 800;
  box-shadow: 0 8px 19px rgba(23,53,80,.08);
}
#view-today .orbit-instruction::after { content: none !important; }

#view-today > .daily-insight,
#view-today > .overview-strip,
#view-today > .dashboard-grid,
#view-today > .safety-note,
#view-today > .app-promo { display: none !important; }
#view-today .prescription-alert-home {
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
  padding: 25px clamp(18px, 3vw, 28px);
  border: 1px solid #cfe1eb;
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 16px 35px rgba(23,53,80,.08), inset 0 1px 0 rgba(255,255,255,.9);
}
#view-today .prescription-alert-heading { align-items: flex-end; margin-bottom: 17px; }
#view-today .prescription-alert-heading .card-kicker { margin-bottom: 9px; color: #267baa; font-size: 11px; }
#view-today .prescription-alert-heading h2 { margin: 0; color: #173550; font-size: clamp(24px, 3vw, 32px); letter-spacing: -.045em; }
#view-today .prescription-last-checked { color: #5e7487; font-size: 13px; }
#view-today .prescription-alert-status { min-height: 84px; padding: 17px; border-radius: 18px; }
#view-today .prescription-alert-status p { font-size: 15px; }
#view-today .prescription-alert-status small { font-size: 12px; }
#view-today .prescription-alert-status button { min-height: 42px; padding: 0 6px; }

@media (min-width: 980px) {
  #view-today .hub-hero-intro { grid-template-columns: minmax(0, 1fr) minmax(340px, .78fr); gap: 36px; }
}
@media (max-width: 800px) {
  #hub-shell .mobile-brand .brand-lockup { width: 154px; height: 64px; }
  #view-today.view { padding-top: 15px; }
  #view-today .colour-hero-live { gap: 18px; padding: 27px 18px 24px; border-radius: 25px; }
  #view-today .hub-hero-greeting { font-size: 14px; }
  #view-today .hub-hero-copy h1 { font-size: clamp(38px, 7.4vw, 58px); }
  #view-today .hub-hero-subtitle { font-size: 15px; }
  #view-today .hub-ask-prompt { min-height: 98px; }
  #view-today .colour-orbit { min-height: 500px; width: 100%; max-width: 620px; }
  #view-today .prescription-alert-heading { align-items: flex-start; flex-direction: column; gap: 7px; }
}
@media (max-width: 620px) {
  #hub-shell .hub-topbar { height: 72px; }
  #hub-shell .category-bar { top: 72px; }
  #hub-shell .mobile-brand .brand-lockup { width: 137px; height: 58px; }
  #hub-shell .pro-button { min-height: 40px; }
  #hub-shell .view-stack { width: calc(100% - 30px); }
  #view-today .colour-hero-live { gap: 16px; padding: 24px 14px 20px; border-radius: 23px; }
  #view-today .hub-hero-greeting { margin-bottom: 8px; font-size: 13px; }
  #view-today .hub-hero-copy h1 { font-size: clamp(36px, 9.8vw, 53px); line-height: 1; }
  #view-today .hub-hero-subtitle { margin-top: 11px; font-size: 14px; }
  #view-today .hub-ask-prompt { min-height: 92px; gap: 9px; padding: 13px; border-radius: 19px; }
  #view-today .hub-ask-prompt-icon { width: 38px; height: 38px; border-radius: 12px; font-size: 20px; }
  #view-today .hub-ask-prompt-copy b { font-size: 13px; }
  #view-today .hub-ask-prompt-copy small { margin-top: 4px; font-size: 10px; }
  #view-today .hub-ask-prompt-arrow { width: 36px; height: 36px; font-size: 20px; }
  #view-today .colour-orbit { min-height: clamp(470px, 95vw, 560px); width: 100%; }
  #view-today .colour-orbit-core { padding: 16px; }
  #view-today .orbit-action { grid-template-columns: 27px minmax(0, 1fr); gap: 3px 7px; padding: 11px 10px; border-radius: 17px; }
  #view-today .orbit-action > span { font-size: 20px; }
  #view-today .orbit-action b { font-size: 12px; }
  #view-today .orbit-action > small { font-size: 9px; line-height: 1.28; }
  #view-today .orbit-instruction { bottom: 2px; padding: 9px 14px; font-size: 11px; }
  #view-today .prescription-alert-home { padding: 21px 16px; border-radius: 22px; }
  #view-today .prescription-alert-heading h2 { font-size: 24px; }
  #view-today .prescription-last-checked { font-size: 12px; }
  #view-today .prescription-alert-status { align-items: flex-start; flex-wrap: wrap; gap: 11px; padding: 14px; }
  #view-today .prescription-alert-status > div { min-width: 0; }
  #view-today .prescription-alert-status button { width: 100%; margin-left: 45px; justify-content: flex-start; text-align: left; }
}
@media (max-width: 380px) {
  #view-today .colour-hero-live { padding-inline: 11px; }
  #view-today .colour-orbit { min-height: 510px; }
  #view-today .orbit-action { width: 136px; min-height: 84px; }
  #view-today .orbit-action > small { font-size: 8px; }
}

/* Mobile first-screen fit: keep the hub calm, compact and fully visible above the fixed nav. */
@media (max-width: 620px) and (min-height: 780px) {
  body[data-hub-theme="today"] {
    overflow: hidden;
  }
  #hub-shell {
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
  }
  #hub-shell .hub-main {
    height: 100%;
    min-height: 0;
    overflow: hidden;
  }
  #hub-shell .view-stack {
    height: calc(100dvh - 72px);
    min-height: 0;
    overflow: hidden;
  }
  #hub-shell #view-today.view {
    height: calc(100dvh - 72px);
    max-height: calc(100dvh - 72px);
    min-height: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 8px;
    overflow: hidden;
    padding: 8px 0 78px;
  }
  #view-today .colour-hero-live {
    flex: 1 1 auto;
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 6px;
    margin: 0;
    padding: 12px 14px 8px;
    border-radius: 20px;
    overflow: visible;
  }
  #view-today .hub-hero-intro {
    gap: 6px;
  }
  #view-today .hub-hero-greeting {
    margin-bottom: 4px;
    font-size: 12px;
  }
  #view-today .hub-hero-copy h1 {
    font-size: clamp(32px, 8vw, 44px);
    line-height: .96;
    letter-spacing: -.055em;
  }
  #view-today .hub-hero-subtitle {
    margin-top: 7px;
    font-size: 13px;
    line-height: 1.35;
  }
  #view-today .hub-ask-prompt {
    min-height: 70px;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 16px;
  }
  #view-today .hub-ask-prompt-icon {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    font-size: 18px;
  }
  #view-today .hub-ask-prompt-copy b { font-size: 12px; }
  #view-today .hub-ask-prompt-copy small { margin-top: 3px; font-size: 9px; }
  #view-today .hub-ask-prompt-arrow {
    width: 32px;
    height: 32px;
    font-size: 18px;
  }
  #hub-shell #view-today .colour-orbit {
    flex: 1 1 auto;
    width: 100%;
    max-width: 480px;
    min-height: 0;
    height: auto;
    align-self: stretch;
  }
  #view-today .colour-orbit::before {
    width: min(390px, 76vw);
    height: min(390px, 76vw);
    filter: blur(24px);
  }
  #view-today .colour-ring-one {
    width: min(370px, 72vw);
    height: min(370px, 72vw);
  }
  #view-today .colour-ring-two {
    width: min(275px, 54vw);
    height: min(275px, 54vw);
  }
  #view-today .colour-orbit-core {
    width: clamp(128px, 27vw, 158px);
    height: clamp(128px, 27vw, 158px);
    padding: 14px;
    border-width: 7px;
  }
  #hub-shell #view-today .orbit-action {
    width: clamp(118px, 26vw, 142px);
    max-width: clamp(118px, 26vw, 142px);
    min-height: 74px;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 3px 7px;
    padding: 9px 9px;
    border-radius: 16px;
  }
  #view-today .orbit-action > span { font-size: 20px; }
  #view-today .orbit-action b { font-size: 11px; line-height: 1.16; }
  #view-today .orbit-action > small { font-size: 8.5px; line-height: 1.25; }
  #view-today .orbit-instruction {
    bottom: -14px;
    padding: 7px 12px;
    font-size: 10px;
  }
  #view-today .prescription-alert-home {
    flex: 0 0 auto;
    margin: 0;
    padding: 12px 14px;
    border-radius: 18px;
  }
  #view-today .prescription-alert-heading {
    align-items: center;
    flex-direction: row;
    gap: 8px;
    margin-bottom: 7px;
  }
  #view-today .prescription-alert-heading .card-kicker {
    margin-bottom: 3px;
    font-size: 9px;
  }
  #view-today .prescription-alert-heading h2 { font-size: 19px; }
  #view-today .prescription-last-checked {
    flex: 0 0 auto;
    font-size: 10px;
    white-space: nowrap;
  }
  #view-today .prescription-alert-status {
    min-height: 62px;
    flex-wrap: nowrap;
    gap: 8px;
    padding: 10px;
    border-radius: 14px;
  }
  #view-today .prescription-alert-status > div { min-width: 0; }
  #view-today .prescription-alert-icon {
    width: 28px;
    height: 28px;
    font-size: 16px;
  }
  #view-today .prescription-alert-status b { font-size: 12px; }
  #view-today .prescription-alert-status p {
    margin-top: 2px;
    font-size: 11px;
    line-height: 1.25;
  }
  #view-today .prescription-alert-status small {
    margin-top: 3px;
    font-size: 8.5px;
    line-height: 1.2;
  }
  #view-today .prescription-alert-status button {
    width: auto;
    min-height: 32px;
    margin-left: auto;
    padding: 0 2px;
    font-size: 10px;
  }
}

@media (max-width: 380px) and (min-height: 780px) {
  #hub-shell #view-today.view {
    padding-inline: 0;
  }
  #view-today .colour-hero-live {
    padding-inline: 10px;
  }
  #hub-shell #view-today .colour-orbit {
    max-width: 360px;
  }
  #hub-shell #view-today .orbit-action {
    width: 118px;
    max-width: 118px;
    min-height: 70px;
    padding-inline: 8px;
  }
  #view-today .orbit-action > small { font-size: 8px; }
  #view-today .prescription-alert-heading h2 { font-size: 17px; }
  #view-today .prescription-last-checked { font-size: 9px; }
}

/* Narrow phones need a dependable reading order, not a compressed orbit. */
@media (max-width: 520px) {
  body[data-hub-theme="today"],
  #hub-shell,
  #hub-shell .hub-main,
  #hub-shell .view-stack,
  #hub-shell #view-today.view {
    height: auto;
    max-height: none;
    overflow: visible;
  }
  body[data-hub-theme="today"] { overflow-x: hidden; }
  #hub-shell #view-today.view {
    display: block;
    padding: 8px 0 96px;
  }
  #view-today .colour-hero-live {
    display: block;
    overflow: hidden;
    padding: 18px 13px 16px;
  }
  #view-today .hub-hero-intro { display: block; }
  #view-today .hub-ask-prompt { margin-top: 16px; }
  #hub-shell #view-today .colour-orbit {
    width: 100%;
    max-width: none;
    min-height: 0;
    height: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 16px;
    padding: 0;
  }
  #view-today .colour-orbit::before,
  #view-today .colour-orbit::after,
  #view-today .colour-orbit-ring,
  #view-today .colour-orbit-core,
  #view-today .orbit-instruction { display: none; }
  #hub-shell #view-today .colour-orbit .orbit-action {
    position: static;
    inset: auto;
    width: 100%;
    max-width: none;
    min-width: 0;
    min-height: 106px;
    transform: none !important;
    grid-template-columns: 26px minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    align-content: start;
    gap: 4px 7px;
    padding: 13px 11px;
    border-radius: 17px;
  }
  #view-today .colour-orbit .orbit-action > span { font-size: 20px; }
  #view-today .colour-orbit .orbit-action b { font-size: 12px; line-height: 1.22; }
  #view-today .colour-orbit .orbit-action > small { font-size: 9px; line-height: 1.35; }
  #view-today .prescription-alert-home { margin-top: 14px; }
}

@media (max-width: 340px) {
  #hub-shell #view-today .colour-orbit { grid-template-columns: 1fr; }
  #hub-shell #view-today .colour-orbit .orbit-action { min-height: 88px; }
}

/* Phone home: remove duplicate chrome and keep medication status above the nav. */
@media (max-width: 520px) {
  /* Keep the full navigation reachable from every mobile view, including Today. */
  body[data-hub-theme="today"] #hub-shell .hub-topbar { display: flex; }
  body[data-hub-theme="today"] #hub-shell .category-bar { display: none; }
  body[data-hub-theme="today"].mobile-category-open #hub-shell .category-bar { display: block; top: 72px; }
  body[data-hub-theme="today"] #hub-shell .view-stack { width: calc(100% - 20px); }
  body[data-hub-theme="today"] #hub-shell #view-today.view { padding-top: 10px; }

  #view-today .colour-hero-live {
    padding: 14px 12px 12px;
    border-radius: 19px;
  }
  #view-today .hub-hero-greeting,
  #view-today .hub-hero-subtitle { display: none; }
  #view-today .hub-hero-copy h1 {
    max-width: 330px;
    font-size: clamp(29px, 8.4vw, 36px);
    line-height: .98;
    letter-spacing: -.045em;
  }
  #view-today .hub-ask-prompt {
    min-height: 58px;
    margin-top: 11px;
    padding: 9px 10px;
    border-radius: 15px;
  }
  #view-today .hub-ask-prompt-copy small { display: none; }
  #view-today .hub-ask-prompt-arrow { width: 34px; height: 34px; }

  #hub-shell #view-today .colour-orbit {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 11px;
  }
  #hub-shell #view-today .colour-orbit .orbit-action {
    min-height: 76px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 9px 6px;
    text-align: center;
  }
  #view-today .colour-orbit .orbit-action > span { font-size: 19px; }
  #view-today .colour-orbit .orbit-action b { font-size: 10px; line-height: 1.18; }
  #view-today .colour-orbit .orbit-action > small { display: none; }

  #view-today .prescription-alert-home {
    margin-top: 10px;
    padding: 11px 12px;
    border-radius: 17px;
  }
  #view-today .prescription-alert-heading { margin-bottom: 6px; }
  #view-today .prescription-alert-heading h2 { font-size: 17px; }
  #view-today .prescription-alert-status { min-height: 58px; padding: 9px; }

  #storage-consent:not([hidden]) {
    position: fixed;
    z-index: 100;
    top: max(10px, env(safe-area-inset-top));
    right: 10px;
    left: 10px;
    display: block;
    padding: 13px;
    border: 1px solid #9dcfdf;
    border-radius: 17px;
    box-shadow: 0 18px 48px rgba(23,53,80,.22);
  }
  #storage-consent p { margin-top: 3px; font-size: 11px; line-height: 1.35; }
  #storage-consent .storage-consent-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px;
    margin-top: 10px;
  }
  #storage-consent .primary-button,
  #storage-consent .secondary-button { min-height: 42px; padding: 8px; font-size: 11px; }
  #storage-consent a { grid-column: 1 / -1; padding: 3px; text-align: center; }
}

@media (max-width: 340px) {
  #hub-shell #view-today .colour-orbit { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Home shortcuts are a compact dashboard above phone size; the old orbit was too tall. */
@media (min-width: 521px) {
  #view-today .colour-hero-live {
    display: block;
    padding: clamp(24px, 3vw, 40px);
    overflow: hidden;
  }
  #view-today .hub-hero-intro {
    width: 100%;
    grid-template-columns: minmax(0, 1fr) minmax(320px, .78fr);
    gap: clamp(24px, 4vw, 64px);
  }
  #view-today .hub-hero-copy h1 { font-size: clamp(43px, 4.8vw, 66px); }
  #hub-shell #view-today .colour-orbit {
    position: relative;
    width: 100%;
    max-width: none;
    min-height: 0;
    height: auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 28px 0 0;
    padding: 0;
  }
  #view-today .colour-orbit::before,
  #view-today .colour-orbit::after,
  #view-today .colour-orbit-ring,
  #view-today .colour-orbit-core,
  #view-today .orbit-instruction { display: none; }
  #hub-shell #view-today .colour-orbit .orbit-action {
    position: static;
    inset: auto;
    width: 100%;
    max-width: none;
    min-width: 0;
    min-height: 108px;
    transform: none !important;
    grid-template-columns: 28px minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    align-content: center;
    gap: 4px 9px;
    padding: 16px;
    border-radius: 18px;
  }
  #hub-shell #view-today .colour-orbit .orbit-action > span { font-size: 21px; }
  #hub-shell #view-today .colour-orbit .orbit-action b { font-size: 13px; line-height: 1.22; }
  #hub-shell #view-today .colour-orbit .orbit-action > small { font-size: 10px; line-height: 1.38; }
  #view-today .prescription-alert-home { margin: 18px auto 26px; }
}

@media (min-width: 1024px) {
  #hub-shell #view-today .colour-orbit { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  #hub-shell #view-today .colour-orbit .orbit-action {
    min-height: 132px;
    align-content: start;
  }
}

/* Final small-phone polish: readable labels, compact safety card, unobstructed navigation. */
@media (max-width: 520px) {
  body[data-hub-theme="today"] #hub-shell .hub-footer { display: none; }
  #view-today .colour-orbit .orbit-action b {
    width: 100%;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
  }
  #view-today .prescription-alert-heading {
    align-items: center;
    flex-direction: row;
    gap: 8px;
  }
  #view-today .prescription-last-checked {
    flex: 0 0 auto;
    margin-left: auto;
    font-size: 9px;
    white-space: nowrap;
  }
  #view-today .prescription-alert-status {
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
  }
  #view-today .prescription-alert-status > div { min-width: 0; }
  #view-today .prescription-alert-status p { font-size: 10.5px; line-height: 1.3; }
  #view-today .prescription-alert-status small { font-size: 8px; line-height: 1.3; }
  #view-today .prescription-alert-status button {
    width: auto;
    min-height: 36px;
    margin-left: auto;
    padding: 0 2px;
    flex: 0 0 auto;
    font-size: 9.5px;
    white-space: nowrap;
  }
  #storage-consent:not([hidden]) {
    top: 50%;
    transform: translateY(-50%);
    box-shadow: 0 0 0 100vmax rgba(16,48,74,.34), 0 22px 60px rgba(16,48,74,.28);
  }
  .toast { bottom: 92px; }
}

/* Premium phone home: one deliberate scale for shortcuts, status and navigation. */
.hub-ask-prompt-icon svg,
.orbit-action-icon svg,
.mobile-bottom-nav-item svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@media (max-width: 520px) {
  body[data-hub-theme="today"] {
    min-height: 100svh;
    background:
      radial-gradient(circle at 86% 8%, rgba(41, 178, 232, .12), transparent 30%),
      linear-gradient(180deg, #f5fbff 0%, #f8fbfd 56%, #fbfaf8 100%);
  }
  body[data-hub-theme="today"] #hub-shell .view-stack {
    width: calc(100% - 24px);
    max-width: 430px;
  }
  body[data-hub-theme="today"] #hub-shell #view-today.view {
    min-height: 100svh;
    padding: 12px 0 104px;
  }

  #view-today .colour-hero-live {
    padding: 18px 16px 16px;
    border-color: rgba(182, 213, 229, .76);
    border-radius: 26px;
    background:
      radial-gradient(circle at 88% 4%, rgba(36, 191, 220, .13), transparent 34%),
      linear-gradient(145deg, rgba(255,255,255,.98), rgba(245,251,255,.98) 58%, rgba(255,252,248,.96));
    box-shadow:
      0 18px 44px rgba(23, 53, 80, .09),
      0 2px 8px rgba(23, 53, 80, .04),
      inset 0 1px 0 #fff;
  }
  #view-today .hub-hero-copy h1 {
    max-width: 345px;
    font-size: clamp(34px, 9.6vw, 40px);
    line-height: .96;
    letter-spacing: -.052em;
  }
  #view-today .hub-ask-prompt {
    min-height: 60px;
    margin-top: 14px;
    gap: 10px;
    padding: 9px 10px 9px 11px;
    border-color: rgba(181, 208, 222, .8);
    border-radius: 18px;
    box-shadow: 0 9px 24px rgba(23,53,80,.08), inset 0 1px 0 #fff;
  }
  #view-today .hub-ask-prompt-icon {
    width: 36px;
    height: 36px;
    padding: 8px;
    flex: 0 0 auto;
    border-radius: 12px;
    background: linear-gradient(145deg, #e9fbff, #dff6fd);
    color: #0874db;
  }
  #view-today .hub-ask-prompt-copy b {
    font-size: 13px;
    letter-spacing: -.01em;
  }
  #view-today .hub-ask-prompt-arrow {
    width: 36px;
    height: 36px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: linear-gradient(145deg, #1788f4, #0867d3);
    box-shadow: 0 8px 16px rgba(22,121,232,.22);
  }

  #hub-shell #view-today .colour-orbit {
    gap: 9px;
    margin-top: 14px;
  }
  #hub-shell #view-today .colour-orbit .orbit-action {
    min-height: 88px;
    flex-direction: column;
    gap: 7px;
    padding: 10px 6px 9px;
    border-width: 1px;
    border-radius: 20px;
    box-shadow: 0 9px 22px rgba(23,53,80,.075), inset 0 1px 0 rgba(255,255,255,.96);
  }
  #view-today .colour-orbit .orbit-action-icon {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    flex: 0 0 30px;
    padding: 6px;
    border: 1px solid rgba(255,255,255,.85);
    border-radius: 10px;
    background: rgba(255,255,255,.72);
    color: #173f62;
    box-shadow: 0 4px 12px rgba(23,53,80,.06);
  }
  #view-today .colour-orbit .orbit-action b {
    max-width: 96px;
    font-size: 10.5px;
    font-weight: 800;
    line-height: 1.16;
    letter-spacing: -.012em;
  }
  #view-today .orbit-action[data-orbit-tone="cyan"] .orbit-action-icon { color: #087fa6; }
  #view-today .orbit-action[data-orbit-tone="blue"] .orbit-action-icon { color: #2866b3; }
  #view-today .orbit-action[data-orbit-tone="violet"] .orbit-action-icon { color: #7556ad; }
  #view-today .orbit-action[data-orbit-tone="mint"] .orbit-action-icon { color: #188d76; }
  #view-today .orbit-action[data-orbit-tone="coral"] .orbit-action-icon { color: #b85c4f; }
  #view-today .orbit-action[data-orbit-tone="yellow"] .orbit-action-icon { color: #927018; }

  #view-today .prescription-alert-home {
    margin-top: 13px;
    padding: 14px;
    border-color: rgba(185, 213, 226, .82);
    border-radius: 22px;
    box-shadow: 0 14px 34px rgba(23,53,80,.075), inset 0 1px 0 #fff;
  }
  #view-today .prescription-alert-heading {
    margin-bottom: 9px;
  }
  #view-today .prescription-alert-heading .card-kicker {
    margin-bottom: 4px;
    font-size: 9px;
    letter-spacing: .15em;
  }
  #view-today .prescription-alert-heading h2 {
    font-size: 18px;
    line-height: 1.1;
  }
  #view-today .prescription-alert-status {
    min-height: 64px;
    padding: 10px 11px;
    border: 1px solid rgba(112, 195, 162, .32);
    border-radius: 17px;
    background: linear-gradient(135deg, #effcf7, #e8f9f3);
  }
  #view-today .prescription-alert-icon {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    font-size: 19px;
    box-shadow: 0 6px 14px rgba(22,153,113,.18);
  }
  #view-today .prescription-alert-status b { font-size: 13px; }
  #view-today .prescription-alert-status button {
    min-height: 40px;
    font-size: 9.5px;
  }

  .mobile-bottom-nav {
    right: 14px;
    bottom: max(10px, env(safe-area-inset-bottom));
    left: 14px;
    min-height: 64px;
    padding: 6px 7px 7px;
    border-color: rgba(193, 215, 226, .88);
    border-radius: 24px;
    background: rgba(255,255,255,.92);
    box-shadow: 0 18px 42px rgba(23,53,80,.16), inset 0 1px 0 #fff;
    -webkit-backdrop-filter: blur(18px) saturate(1.25);
    backdrop-filter: blur(18px) saturate(1.25);
  }
  .mobile-bottom-nav-item {
    min-height: 48px;
    gap: 3px;
    border-radius: 15px;
  }
  .mobile-bottom-nav-item span {
    width: 21px;
    height: 21px;
    display: block;
    color: #27465f;
  }
  .mobile-bottom-nav-item b {
    font-size: 9px;
    font-weight: 800;
  }
  .mobile-bottom-nav-item.active {
    background: linear-gradient(145deg, #edf9ff, #e7f5fd);
    box-shadow: inset 0 0 0 1px rgba(171,218,236,.34);
  }
  .mobile-bottom-nav-orb {
    width: 52px;
    height: 52px;
    padding: 9px;
    margin-top: -18px;
    border-width: 4px;
    background: linear-gradient(145deg, #f8fdff, #edf9fe);
    box-shadow: 0 9px 22px rgba(23,53,80,.17), 0 0 0 1px #c9e2ed;
  }
}

@media (max-width: 360px), (max-width: 520px) and (max-height: 740px) {
  body[data-hub-theme="today"] #hub-shell #view-today.view { padding-top: 8px; }
  #view-today .colour-hero-live { padding: 14px 12px 12px; border-radius: 22px; }
  #view-today .hub-hero-copy h1 { font-size: 32px; }
  #view-today .hub-ask-prompt { min-height: 54px; margin-top: 10px; }
  #hub-shell #view-today .colour-orbit { gap: 7px; margin-top: 10px; }
  #hub-shell #view-today .colour-orbit .orbit-action { min-height: 78px; gap: 5px; padding-block: 7px; border-radius: 17px; }
  #view-today .colour-orbit .orbit-action-icon { width: 27px; height: 27px; flex-basis: 27px; padding: 5px; }
  #view-today .colour-orbit .orbit-action b { font-size: 9.5px; }
  #view-today .prescription-alert-home { margin-top: 9px; padding: 11px 12px; border-radius: 19px; }
  #view-today .prescription-alert-heading { margin-bottom: 6px; }
  #view-today .prescription-alert-heading h2 { font-size: 16px; }
  #view-today .prescription-alert-status { min-height: 58px; padding-block: 8px; }
}

/* Final phone audit: keep the chat composer above navigation and critical copy legible. */
@media (max-width: 520px) {
  #view-ask .conversation-panel {
    min-height: calc(100svh - 225px);
    max-height: calc(100svh - 225px);
  }
  #view-ask .conversation-header {
    height: 58px;
  }
  #view-ask .conversation-scroll {
    overflow-y: auto;
    padding: 10px 14px 6px;
  }
  #view-ask .chat-welcome {
    margin: 8px auto 10px;
  }
  #view-ask .chat-welcome-icon {
    width: 44px;
    height: 44px;
    margin-bottom: 8px;
    border-radius: 14px;
  }
  #view-ask .chat-welcome-icon .doctorai-head-icon {
    width: 31px;
    height: 31px;
  }
  #view-ask .chat-welcome-kicker {
    margin-bottom: 5px;
  }
  #view-ask .chat-welcome h2 {
    font-size: 22px;
    line-height: 1.08;
  }
  #view-ask .chat-welcome p:last-child {
    line-height: 1.5;
  }
  #view-ask .quick-asks {
    gap: 6px;
    padding-bottom: 8px;
  }
  #view-ask .quick-asks button {
    min-height: 42px;
    padding: 6px 8px;
  }
  #view-ask .chat-composer textarea {
    min-height: 52px;
    padding-top: 12px;
  }
  #view-ask .chat-disclaimer {
    margin-block: 7px 9px;
    font-size: 9px;
  }
  #view-today .prescription-last-checked {
    font-size: 9.5px;
  }
  #view-today .prescription-alert-status small {
    font-size: 9.5px;
    line-height: 1.25;
  }
  #view-today .prescription-alert-status button {
    font-size: 10px;
  }
  .mobile-bottom-nav-item b {
    font-size: 10px;
  }
}

@media (min-width: 350px) and (max-width: 520px) {
  #view-ask .quick-asks {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  #view-ask .quick-asks button {
    font-size: 7.5px;
  }
  #view-ask .quick-ask-icon {
    display: none;
  }
}

@media (max-width: 360px), (max-width: 520px) and (max-height: 740px) {
  #view-today .colour-orbit .orbit-action b {
    font-size: 10px;
  }
}

/* Chat quality pass: readable at a glance, calm under pressure, and easy to operate. */
#view-ask .conversation-panel[aria-busy="true"] .conversation-header { background: #fbfdff; }
#view-ask .assistant-identity b { font-size: 14px; }
#view-ask .assistant-identity small { font-size: 10px; }
#view-ask .conversation-header-actions .privacy-badge { font-size: 10px; }
#view-ask .chat-welcome { max-width: 540px; }
#view-ask .chat-welcome-kicker { font-size: 10px; }
#view-ask .chat-welcome h2 { font-size: clamp(27px, 3vw, 35px); line-height: 1.08; }
#view-ask .chat-welcome p:last-child { font-size: 14px; line-height: 1.65; }
#view-ask .chat-messages { gap: 22px; }
#view-ask .chat-message-body small { font-size: 10px; }
#view-ask .chat-message-body p { padding: 13px 16px; font-size: 14px; line-height: 1.65; }
#view-ask .chat-message-avatar { width: 36px; height: 36px; border-radius: 12px; }
#view-ask .chat-message-avatar .doctorai-head-icon { width: 27px; height: 27px; }
#view-ask .quick-asks-label { font-size: 10px; }
#view-ask .quick-asks button { min-height: 42px; padding-inline: 13px; font-size: 11px; }
#view-ask .quick-ask-icon { font-size: 15px; }
#view-ask .chat-composer textarea { min-height: 82px; padding: 16px 17px 8px; font-size: 15px; line-height: 1.5; }
#view-ask .composer-row { min-height: 49px; padding: 7px 10px 8px 14px; font-size: 11px; }
#view-ask .composer-context, #view-ask .composer-row > #chat-count, #view-ask .composer-enter-hint { font-size: 11px; }
#view-ask .composer-row button { min-width: 78px; min-height: 44px; font-size: 12px; }
#view-ask .chat-disclaimer { display: flex; align-items: flex-start; justify-content: center; gap: 6px; max-width: 690px; margin: 12px auto 17px; font-size: 11px; line-height: 1.5; }
#view-ask .chat-disclaimer > span { display: grid; width: 16px; height: 16px; flex: 0 0 auto; place-items: center; border: 1px solid #c9dce7; border-radius: 50%; color: var(--blue-strong); font-size: 10px; font-weight: 800; }
#view-ask .chat-message-actions { display: flex; gap: 7px; margin-top: 7px; }
#view-ask .chat-message-actions button { min-height: 30px; padding: 0 9px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--blue-strong); font-size: 10px; font-weight: 700; }
#view-ask .chat-message-actions button:hover, #view-ask .chat-message-actions button:focus-visible { border-color: #b9dce9; background: #f4fbfe; }
#view-ask .chat-message.chat-error .chat-message-body p { border: 1px solid #f1d4cf; background: #fff7f5; color: #8c4b45; }
#view-ask .chat-message.chat-error .chat-message-actions button { color: #a14941; }
#view-ask .chat-message.chat-error .chat-message-actions button:hover, #view-ask .chat-message.chat-error .chat-message-actions button:focus-visible { border-color: #edc2bb; background: #fff1ee; }

@media (max-width: 800px) {
  #view-ask .conversation-header { height: 62px; }
  #view-ask .assistant-identity b { font-size: 13px; }
  #view-ask .assistant-identity small { font-size: 9px; }
  #view-ask .conversation-scroll { padding: 16px 14px 10px; }
  #view-ask .chat-welcome { margin: 18px auto 22px; }
  #view-ask .chat-welcome-icon { width: 52px; height: 52px; margin-bottom: 12px; border-radius: 16px; }
  #view-ask .chat-welcome-icon .doctorai-head-icon { width: 36px; height: 36px; }
  #view-ask .chat-welcome h2 { font-size: 26px; line-height: 1.1; }
  #view-ask .chat-welcome p:last-child { font-size: 12px; line-height: 1.55; }
  #view-ask .chat-message { gap: 9px; }
  #view-ask .chat-message-avatar { width: 32px; height: 32px; border-radius: 10px; }
  #view-ask .chat-message-avatar .doctorai-head-icon { width: 24px; height: 24px; }
  #view-ask .chat-message-body small { font-size: 10px; }
  #view-ask .chat-message-body p { padding: 12px 14px; font-size: 14px; line-height: 1.55; }
  #view-ask .quick-asks { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 0 13px 12px; }
  #view-ask .quick-asks-label { grid-column: 1 / -1; margin: 0 0 2px; font-size: 10px; }
  #view-ask .quick-asks button { min-height: 52px; justify-content: flex-start; gap: 5px; padding: 8px 8px; font-size: 10px; line-height: 1.22; white-space: normal; }
  #view-ask .quick-ask-icon { display: grid; width: 17px; flex: 0 0 auto; place-items: center; font-size: 14px; }
  #view-ask .quick-asks button b { margin-left: auto; }
  #view-ask .chat-composer textarea { min-height: 72px; padding: 14px 15px 7px; font-size: 15px; }
  #view-ask .chat-composer .composer-row { min-height: 53px; justify-content: space-between; padding: 8px 10px 8px 11px; }
  #view-ask .chat-composer .composer-context { position: static; font-size: 10px; transform: none; }
  #view-ask .chat-composer .composer-row > #chat-count { display: inline; margin-left: auto; font-size: 10px; }
  #view-ask .composer-enter-hint { display: none; }
  #view-ask .composer-row button { min-width: 82px; min-height: 44px; font-size: 12px; }
  #view-ask .chat-disclaimer { max-width: 300px; margin: 9px auto 12px; font-size: 10.5px; line-height: 1.45; }
  #view-ask .chat-message-actions button { min-height: 34px; font-size: 11px; }
  #view-ask .ask-sidebar-label, #view-ask .context-list span { font-size: 10px; }
  #view-ask .context-toggle-row b { font-size: 12px; }
  #view-ask .context-toggle-row small, #view-ask .rail-safety p { font-size: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  #view-ask .thinking-dots i { animation: none; }
  #view-ask .chat-message-actions button, #view-ask .chat-composer, #view-ask .new-chat-button { transition: none; }
}

/* Home shortcut icon refresh: one polished duotone language across every feature. */
#view-today .orbit-action-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  flex: 0 0 36px;
  padding: 7px;
  border: 1px solid rgba(255,255,255,.88);
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(255,255,255,.62));
  box-shadow: 0 5px 12px rgba(23,53,80,.08), inset 0 1px 0 rgba(255,255,255,.96);
}
#view-today .orbit-action-icon svg { overflow: visible; }
#view-today .orbit-action-icon svg .icon-fill { fill: currentColor; stroke: none; opacity: .18; }
#view-today .orbit-action-icon svg .icon-solid { fill: currentColor; stroke: none; }
#view-today .orbit-action[data-orbit-tone="cyan"] .orbit-action-icon { box-shadow: 0 5px 12px rgba(8,127,166,.12), inset 0 0 0 1px rgba(111,224,239,.26); }
#view-today .orbit-action[data-orbit-tone="blue"] .orbit-action-icon { box-shadow: 0 5px 12px rgba(40,102,179,.12), inset 0 0 0 1px rgba(120,166,229,.26); }
#view-today .orbit-action[data-orbit-tone="violet"] .orbit-action-icon { box-shadow: 0 5px 12px rgba(117,86,173,.12), inset 0 0 0 1px rgba(185,160,245,.26); }
#view-today .orbit-action[data-orbit-tone="mint"] .orbit-action-icon { box-shadow: 0 5px 12px rgba(24,141,118,.12), inset 0 0 0 1px rgba(112,221,190,.26); }
#view-today .orbit-action[data-orbit-tone="coral"] .orbit-action-icon { box-shadow: 0 5px 12px rgba(184,92,79,.12), inset 0 0 0 1px rgba(239,170,158,.28); }
#view-today .orbit-action[data-orbit-tone="yellow"] .orbit-action-icon { box-shadow: 0 5px 12px rgba(146,112,24,.12), inset 0 0 0 1px rgba(236,211,121,.3); }

/* The shortcut presentation is now a static grid. Keep vertical gestures as
   native page scrolling while preserving normal tap activation. */
#hub-shell #view-today .colour-orbit .orbit-action { touch-action: pan-y; }

@media (min-width: 521px) {
  #hub-shell #view-today .colour-orbit .orbit-action { grid-template-columns: 36px minmax(0, 1fr); }
}
@media (max-width: 520px) {
  #view-today .colour-orbit .orbit-action-icon { width: 32px; height: 32px; flex-basis: 32px; padding: 6px; border-radius: 11px; }
}
@media (max-width: 340px) {
  #view-today .colour-orbit .orbit-action-icon { width: 30px; height: 30px; flex-basis: 30px; padding: 5px; }
}

/* Final chat composition: the same calm navy/cyan language as the phone home. */
body[data-hub-theme="ask"] {
  --navy: #071b36;
  --navy-deep: #041329;
  --blue: #0d75f5;
  --blue-strong: #075bc0;
  --cyan: #25cce6;
  --sky: #e9f8ff;
  --sky-deep: #d6f2fb;
  --paper: #f7fbff;
  --line: #d8e7f2;
  --line-soft: #e8f1f7;
  --muted: #55728d;
  --muted-light: #8097aa;
  background:
    radial-gradient(circle at 8% 8%, rgba(93, 228, 245, .2), transparent 24rem),
    radial-gradient(circle at 92% 12%, rgba(165, 138, 255, .13), transparent 27rem),
    linear-gradient(180deg, #f8fbff 0%, #eef8ff 58%, #fffafa 100%);
}
#view-ask .privacy-badge {
  border: 0;
  font-family: inherit;
  cursor: pointer;
}
#view-ask .privacy-badge:hover,
#view-ask .privacy-badge:focus-visible { background: #d9f7ed; }

@media (max-width: 520px) {
  body[data-hub-theme="ask"] #hub-shell .hub-topbar,
  body[data-hub-theme="ask"] #hub-shell .category-bar,
  body[data-hub-theme="ask"] #hub-shell .hub-footer { display: none; }
  body[data-hub-theme="ask"] #hub-shell .view-stack { width: calc(100% - 20px); }
  body[data-hub-theme="ask"] #hub-shell #view-ask.view { padding-top: 10px; padding-bottom: 0; }
  #view-ask .ask-layout { display: block; }
  #view-ask .ask-sidebar { display: none; }
  #view-ask .conversation-panel {
    min-height: calc(100svh - 96px);
    max-height: calc(100svh - 96px);
    border-color: rgba(179, 213, 231, .9);
    border-radius: 22px;
    box-shadow: 0 20px 48px rgba(17, 62, 101, .11);
  }
  #view-ask .conversation-header {
    flex: 0 0 58px;
    height: 58px;
    padding: 0 13px;
  }
  #view-ask .assistant-mark { width: 36px; height: 36px; border-radius: 12px; }
  #view-ask .assistant-identity { gap: 9px; }
  #view-ask .assistant-identity b { font-size: 13px; }
  #view-ask .assistant-identity small { margin-top: 2px; font-size: 9px; }
  #view-ask .conversation-header-actions .privacy-badge { display: none; }
  #view-ask .conversation-header-actions .quiet-button {
    min-height: 40px;
    padding: 0 7px;
    border-radius: 10px;
    font-size: 10px;
  }
  #view-ask .conversation-scroll {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    display: flex;
    flex-direction: column;
    padding: 16px 17px 10px;
    background: linear-gradient(180deg, rgba(239,250,255,.76), #fff 44%);
  }
  #view-ask .chat-welcome { max-width: 310px; margin: auto; padding-block: 14px; }
  #view-ask .chat-messages { width: 100%; }
  #view-ask .chat-welcome-icon { display: none; }
  #view-ask .chat-welcome-kicker { margin-bottom: 7px; font-size: 9px; letter-spacing: .14em; }
  #view-ask .chat-welcome h2 { font-size: clamp(25px, 7.6vw, 29px); line-height: 1.04; }
  #view-ask .chat-welcome p:last-child { max-width: 290px; margin-top: 10px; font-size: 12.5px; line-height: 1.5; }
  #view-ask .quick-asks {
    flex: 0 0 auto;
    display: flex;
    flex-wrap: nowrap;
    gap: 7px;
    overflow-x: auto;
    padding: 0 13px 10px;
    scrollbar-width: none;
  }
  #view-ask .quick-asks::-webkit-scrollbar { display: none; }
  #view-ask .quick-asks-label { display: none; }
  #view-ask .quick-asks button {
    width: auto;
    min-width: max-content;
    min-height: 44px;
    flex: 0 0 auto;
    gap: 7px;
    padding: 0 12px;
    border-radius: 12px;
    font-size: 10.5px;
    line-height: 1;
    white-space: nowrap;
  }
  #view-ask .quick-ask-icon { display: grid; width: 17px; flex: 0 0 17px; place-items: center; }
  #view-ask .quick-asks button b { margin-left: 2px; }
  #view-ask .chat-composer {
    flex: 0 0 auto;
    margin: 0 13px;
    border-radius: 17px;
  }
  #view-ask .chat-composer textarea {
    min-height: 58px;
    max-height: 120px;
    padding: 13px 14px 6px;
    font-size: 15px;
    resize: none;
  }
  #view-ask .chat-composer .composer-row {
    min-height: 48px;
    justify-content: space-between;
    padding: 5px 7px 7px 12px;
  }
  #view-ask .chat-composer .composer-context {
    position: static;
    transform: none;
    font-size: 9.5px;
  }
  #view-ask .chat-composer .composer-row > #chat-count,
  #view-ask .composer-enter-hint { display: none; }
  #view-ask .chat-composer .composer-row > #chat-send {
    min-width: 78px;
    min-height: 40px;
    margin: 0;
    border-radius: 11px;
    background: linear-gradient(135deg, var(--navy), #174b72);
    font-size: 11px;
  }
  #view-ask .chat-disclaimer {
    flex: 0 0 auto;
    max-width: 310px;
    margin: 8px auto 10px;
    color: var(--muted);
    font-size: 10px;
    line-height: 1.35;
  }
  #view-ask .chat-disclaimer > span { width: 15px; height: 15px; }
}

@media (max-width: 360px), (max-width: 520px) and (max-height: 740px) {
  #view-ask .chat-welcome { margin: auto; padding-block: 10px; }
  #view-ask .chat-welcome h2 { font-size: 25px; }
  #view-ask .chat-welcome p:last-child { font-size: 11.5px; }
}

/* Live-answer controls: clear choice, progressive feedback, no extra chat clutter. */
#view-ask .response-length-picker {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 10px 13px 0;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line-soft);
}
#view-ask .response-length-label {
  margin-right: auto;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}
#view-ask .response-length-picker label { position: relative; cursor: pointer; }
#view-ask .response-length-picker input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
#view-ask .response-length-picker label > span {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  border: 1px solid transparent;
  border-radius: 9px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
#view-ask .response-length-picker input:checked + span {
  border-color: #c7e5ef;
  background: var(--sky);
  color: var(--blue-strong);
  box-shadow: inset 0 0 0 1px rgba(13,117,245,.04);
}
#view-ask .response-length-picker input:focus-visible + span {
  outline: 3px solid rgba(13,117,245,.24);
  outline-offset: 1px;
}
#view-ask .conversation-panel.has-messages .quick-asks { display: none; }
#view-ask .chat-message.streaming .chat-message-body p::after {
  content: "";
  width: 2px;
  height: 1em;
  display: inline-block;
  margin-left: 3px;
  vertical-align: -.12em;
  border-radius: 2px;
  background: var(--blue);
  animation: chat-caret 1s steps(2, end) infinite;
}
@keyframes chat-caret { 50% { opacity: 0; } }

@media (max-width: 520px) {
  #view-ask .response-length-picker { margin: 8px 9px 0; padding-bottom: 7px; }
  #view-ask .response-length-label { display: none; }
  #view-ask .response-length-picker label { flex: 1; }
  #view-ask .response-length-picker label > span {
    width: 100%;
    min-height: 32px;
    padding: 0 7px;
    font-size: 10px;
  }
  #view-ask .conversation-panel.has-messages .conversation-scroll { padding-bottom: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  #view-ask .chat-message.streaming .chat-message-body p::after { animation: none; }
  #view-ask .response-length-picker label > span { transition: none; }
}

/* 2026 unified DoctorAI application shell. This final layer replaces older route-specific chrome. */
body[data-hub-theme] {
  --navy: #071b36;
  --navy-deep: #041329;
  --blue: #0d75f5;
  --blue-strong: #075bc0;
  --cyan: #25cce6;
  --sky: #e9f8ff;
  --sky-deep: #d6f2fb;
  --paper: #f7fbff;
  --line: #d8e7f2;
  --line-soft: #e8f1f7;
  --muted: #55728d;
  --muted-light: #8097aa;
  --shadow: 0 16px 44px rgba(18, 66, 103, .085);
}
.skip-link {
  position: fixed;
  top: 10px;
  left: 12px;
  z-index: 200;
  padding: 10px 13px;
  border-radius: 10px;
  background: var(--navy);
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
  transform: translateY(-150%);
}
.skip-link:focus { transform: none; }
.category-more-menu button.active { background: var(--sky); color: var(--blue-strong); box-shadow: inset 3px 0 0 var(--blue); }
.nav-icon svg, .category-tab > span:first-child svg, .category-more-menu button > span:first-child svg { width: 20px; height: 20px; display: block; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.category-tab > span:first-child svg { width: 17px; height: 17px; }
.category-more-menu button > span:first-child svg { width: 16px; height: 16px; }

@media (min-width: 1024px) {
  :root { --sidebar: 244px; }
  #hub-shell .sidebar {
    display: flex !important;
    width: var(--sidebar);
    padding: 18px 14px 14px;
    overflow-y: auto;
    border-right-color: rgba(211, 229, 239, .95);
    background: rgba(255,255,255,.94);
    box-shadow: 9px 0 30px rgba(20, 64, 96, .04);
  }
  #hub-shell .sidebar .brand-lockup { width: 156px; height: 72px; margin-inline: auto; }
  #hub-shell .sidebar-label { margin: 14px 12px 9px; }
  #hub-shell .primary-nav { gap: 3px; }
  #hub-shell .nav-item { min-height: 40px; border-radius: 11px; font-size: 11px; }
  #hub-shell .nav-item.active { background: #e9f8ff; box-shadow: inset 3px 0 0 #0d75f5; }
  #hub-shell .sidebar-bottom { gap: 8px; padding-top: 10px; }
  #hub-shell .upgrade-card, #hub-shell .memory-mini { padding-block: 9px; }
  #hub-shell .hub-main { width: calc(100% - var(--sidebar)); margin-left: var(--sidebar); }
  #hub-shell .hub-topbar { --topbar: 74px; height: var(--topbar); border-top-width: 0; }
  #hub-shell .mobile-brand-wrap { display: none; }
  #hub-shell .topbar-context { display: flex; }
  #hub-shell .category-bar { display: none; }
  #hub-shell .view-stack { width: min(1240px, calc(100% - 64px)); }
}

@media (max-width: 620px) {
  :root { --mobile-header-height: calc(72px + env(safe-area-inset-top)); }
  body.mobile-category-open { overflow: hidden; }
  body.mobile-category-open::before {
    content: '';
    position: fixed;
    inset: var(--mobile-header-height) 0 0;
    z-index: 44;
    background: rgba(4, 19, 41, .35);
    backdrop-filter: blur(2px);
  }
  #hub-shell .hub-topbar {
    height: var(--mobile-header-height);
    padding-top: env(safe-area-inset-top);
    border-top: 0;
  }
  #hub-shell .mobile-menu-button,
  #hub-shell .mobile-notifications-button { width: 44px; height: 44px; }
  #hub-shell .mobile-notifications-button i { display: none; }
  #hub-shell .category-bar { display: none !important; }
  body.mobile-category-open #hub-shell .category-bar {
    display: block !important;
    position: fixed;
    top: var(--mobile-header-height);
    right: 8px;
    left: 8px;
    z-index: 46;
    max-height: calc(100svh - var(--mobile-header-height) - 16px);
    padding: 10px;
    overflow-y: auto;
    border: 1px solid var(--line);
    border-radius: 0 0 20px 20px;
    background: rgba(255,255,255,.985);
    box-shadow: 0 22px 44px rgba(7,27,54,.2);
  }
  #hub-shell .category-bar-scroll {
    min-height: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    overflow: visible;
  }
  #hub-shell .category-bar-label {
    grid-column: 1 / -1;
    display: block;
    margin: 2px 4px 4px;
    color: var(--muted);
    font-size: 9px;
  }
  #hub-shell .category-tab,
  #hub-shell .category-more-menu button {
    width: 100%;
    min-width: 0;
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 9px;
    padding: 10px;
    border: 1px solid #dceaf2;
    border-radius: 13px;
    background: #fafdff;
    color: var(--navy);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.3;
    text-align: left;
    text-decoration: none;
    white-space: normal;
  }
  #hub-shell .category-tab > span:first-child,
  #hub-shell .category-more-menu button > span:first-child {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    flex: 0 0 32px;
    margin: 0;
    border: 1px solid #dceef5;
    border-radius: 10px;
    background: #eaf8fd;
    color: var(--blue-strong);
  }
  #hub-shell .category-tab > span:first-child svg,
  #hub-shell .category-more-menu button > span:first-child svg { width: 20px; height: 20px; }
  #hub-shell .category-tab.research-nav-highlight { background: #fafdff !important; border-color: #dceaf2 !important; color: var(--navy) !important; box-shadow: none; }
  #hub-shell .category-tab.research-nav-highlight::before { display: none; }
  #hub-shell .category-tab.active { background: var(--navy); color: #fff; }
  #hub-shell .category-tab.active > span:first-child,
  #hub-shell .category-more-menu button.active > span:first-child { background: #24435c; border-color: #36596e; color: #8ce8f4; }
  #hub-shell .category-tab:focus-visible,
  #hub-shell .category-more-menu button:focus-visible { outline: 3px solid #0d75f5; outline-offset: 2px; }
  #hub-shell .category-more { display: contents; }
  #hub-shell .category-more > [data-more-menu] { display: none; }
  #hub-shell .category-more-menu {
    position: static;
    grid-column: 1 / -1;
    width: auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  #hub-shell .category-more-menu button > span:last-child { min-width: 0; }
  #hub-shell .category-more-menu button b { font-size: 11px; }
  #hub-shell .category-more-menu button small { margin-top: 3px; font-size: 8px; line-height: 1.35; }
  #hub-shell .category-more-menu button.active { background: var(--navy); color: #fff; box-shadow: none; }
  #hub-shell .category-more-menu button.active small { color: #bed0de; }
  #hub-shell .hub-footer { display: none; }
  .mobile-bottom-nav-orb {
    width: auto;
    height: 54px;
    min-width: 0;
    display: grid;
    place-items: center;
    gap: 1px;
    margin: -13px 0 0;
    padding: 0 2px;
    border: 0;
    border-radius: 14px;
    background: transparent;
    box-shadow: none;
    color: var(--blue-strong);
  }
  .mobile-bottom-nav-orb > span {
    width: 43px;
    height: 43px;
    display: grid;
    place-items: center;
    border: 4px solid #fff;
    border-radius: 50%;
    background: linear-gradient(145deg, #0d75f5, #25cce6);
    color: #fff;
    box-shadow: 0 8px 20px rgba(13,117,245,.24), 0 0 0 1px #cce5ef;
  }
  .mobile-bottom-nav-orb svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
  .mobile-bottom-nav-orb b { font-size: 9px; line-height: 1; }
  #view-ask .conversation-panel { min-height: calc(100svh - 160px); max-height: calc(100svh - 160px); }
}

@media (max-width: 380px) {
  #hub-shell .category-tab,
  #hub-shell .category-more-menu button { gap: 7px; padding: 8px; font-size: 10px; }
  #hub-shell .category-tab > span:first-child,
  #hub-shell .category-more-menu button > span:first-child { width: 28px; height: 28px; flex-basis: 28px; }
  #hub-shell .category-more-menu button b { font-size: 10px; }
}

/* Unified mobile navigation: every view keeps the same header and can open the full category menu. */
@media (max-width: 520px) {
  #hub-shell .hub-topbar { display: flex !important; }
  #hub-shell .category-bar { display: none !important; }
  body.mobile-category-open #hub-shell .category-bar {
    display: block !important;
    position: fixed;
    top: var(--mobile-header-height);
    right: 0;
    left: 0;
    z-index: 45;
  }
  #hub-shell .view-stack { width: calc(100% - 20px); }
  #hub-shell .view { padding-top: 10px; }
  #view-ask .conversation-panel {
    min-height: calc(100svh - 160px);
    max-height: calc(100svh - 160px);
  }
}

/* Symptom Diary phone fit: keep the complete empty action above fixed navigation. */
@media (max-width: 620px) {
  #view-symptoms.view {
    padding-bottom: calc(120px + env(safe-area-inset-bottom));
  }
  #view-symptoms .page-heading {
    gap: 6px;
    margin-bottom: 8px;
  }
  #view-symptoms .page-heading h1 {
    font-size: 32px;
  }
  #view-symptoms .page-subtitle {
    margin-top: 9px;
    font-size: 12px;
    line-height: 1.5;
  }
  #view-symptoms .symptom-safety-banner {
    gap: 9px;
    margin-bottom: 8px;
    padding: 9px 11px;
  }
  #view-symptoms .symptom-safety-banner p {
    margin-top: 3px;
    line-height: 1.45;
  }
  #view-symptoms .symptom-summary {
    gap: 6px;
    margin-bottom: 8px;
  }
  #view-symptoms .symptom-summary-card {
    min-height: 58px;
    display: flex;
    gap: 7px;
    padding: 8px;
  }
  #view-symptoms .symptom-summary-icon {
    width: 27px;
    height: 27px;
    border-radius: 9px;
  }
  #view-symptoms .symptom-log-card {
    padding: 12px 16px 14px;
  }
  #view-symptoms .symptom-toolbar {
    margin-top: 7px;
    padding: 4px 0 6px;
    gap: 0;
  }
  #view-symptoms .symptom-toolbar > span {
    display: none;
  }
  #view-symptoms .symptom-toolbar .filter-tabs button {
    min-height: 44px;
  }
  #view-symptoms .symptom-mode-tabs {
    width: 100%;
    margin-top: 10px;
  }
  #view-symptoms .symptom-mode-tabs button {
    min-width: 0;
    min-height: 42px;
    flex: 1 1 0;
    padding: 0 8px;
    font-size: 9px;
  }
  #view-symptoms .symptom-triggers {
    padding-top: 12px;
  }
  #view-symptoms .symptom-triggers-intro {
    padding: 10px;
  }
  #view-symptoms .symptom-trigger-item {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 8px;
    padding: 10px;
  }
  #view-symptoms .symptom-trigger-icon {
    width: 32px;
    height: 32px;
  }
  #view-symptoms .symptom-triggers-empty {
    min-height: 210px;
    padding: 24px 6px;
  }
  #view-symptoms .symptom-empty {
    min-height: 0;
    grid-template-columns: 42px minmax(0, 1fr);
    place-items: start;
    align-content: start;
    column-gap: 10px;
    padding: 12px 0 0;
    text-align: left;
  }
  #view-symptoms .symptom-empty > span {
    grid-row: 1 / span 2;
    width: 42px;
    height: 42px;
    margin: 0;
    border-radius: 13px;
    font-size: 19px;
  }
  #view-symptoms .symptom-empty h3 {
    align-self: end;
    font-size: 16px;
  }
  #view-symptoms .symptom-empty p {
    align-self: start;
    max-width: none;
    margin: 4px 0 9px;
    font-size: 10px;
    line-height: 1.45;
  }
  #view-symptoms .symptom-empty .primary-button {
    grid-column: 1 / -1;
    width: 100%;
  }
}

/* Symptom Diary icon system: crisp vector marks stay legible at every size. */
.symptom-icon-svg {
  width: 20px;
  height: 20px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.symptom-safety-icon .symptom-icon-svg { width: 18px; height: 18px; }
.symptom-summary-icon .symptom-icon-svg { width: 19px; height: 19px; }
.symptom-guide-mark .symptom-icon-svg { width: 21px; height: 21px; }
.symptom-empty > span .symptom-icon-svg { width: 20px; height: 20px; }

@media (max-width: 620px) {
  #view-symptoms.view {
    padding-top: 14px;
    padding-bottom: calc(126px + env(safe-area-inset-bottom));
  }
  #view-symptoms .page-heading { gap: 11px; margin-bottom: 12px; }
  #view-symptoms .page-heading h1 { font-size: clamp(31px, 9vw, 38px); line-height: 1; }
  #view-symptoms .page-subtitle { max-width: 33em; margin-top: 7px; line-height: 1.45; }
  #view-symptoms .symptom-safety-banner { margin-bottom: 10px; }
  #view-symptoms .symptom-summary-card {
    min-height: 68px;
    min-width: 0;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    align-items: center;
    justify-items: stretch;
    gap: 7px;
    padding: 9px;
  }
  #view-symptoms .symptom-summary-card > div { min-width: 0; }
  #view-symptoms .symptom-summary-icon { width: 30px; height: 30px; border-radius: 10px; }
  #view-symptoms .symptom-summary-icon .symptom-icon-svg { width: 17px; height: 17px; }
  #view-symptoms .symptom-summary-card b { font-size: 12px; }
  #view-symptoms .symptom-summary-card small { font-size: 8px; }
  #view-symptoms #symptom-last-log {
    overflow: visible;
    font-size: 10px;
    line-height: 1.15;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  #view-symptoms .symptom-guide { margin-top: 10px; }
  #view-symptoms .symptom-guide-mark { width: 36px; height: 36px; margin-bottom: 11px; }
  #view-symptoms .symptom-guide h2 { font-size: 20px; }
}

/* Prevent touch swipes from moving the document sideways when a decorative child
   or a fixed surface paints beyond the phone edge. Intentional inner tab strips
   keep their own overflow-x:auto rules above. */
html,
body {
  overflow-x: clip;
}
#hub-shell,
#hub-shell .hub-main,
#hub-shell .view-stack,
#hub-shell #view-symptoms {
  max-width: 100%;
  min-width: 0;
  overflow-x: clip;
}

/* Symptom checker MVP: progressive detail capture and a non-diagnostic safety check. */
.symptom-page-actions { align-items: stretch; }
.symptom-page-actions .secondary-button,
.symptom-page-actions .primary-button { min-height: 42px; }
.symptom-page-actions .secondary-button { min-width: 142px; }
.symptom-more-details {
  grid-column: 1 / -1;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #f8fcfe;
}
.symptom-more-details summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 42px;
  padding: 0 12px;
  color: var(--blue-strong);
  cursor: pointer;
  font-size: 10px;
  font-weight: 800;
  list-style: none;
}
.symptom-more-details summary::-webkit-details-marker { display: none; }
.symptom-more-details summary::after { content: '+'; color: var(--cyan); font-size: 17px; font-weight: 400; }
.symptom-more-details[open] summary::after { content: '−'; }
.symptom-more-details summary span { margin-left: auto; color: var(--muted-light); font-size: 8px; font-weight: 600; }
.symptom-more-details .modal-form-grid { padding: 0 12px 13px; }
.symptom-entry-details {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px 12px;
  margin: 12px 0 0;
  padding: 10px 11px;
  border: 1px solid #e0edf2;
  border-radius: 10px;
  background: #f8fcfe;
}
.symptom-entry-details > div { min-width: 0; }
.symptom-entry-details dt { color: var(--muted-light); font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.symptom-entry-details dd { margin: 3px 0 0; color: var(--navy); font-size: 9px; line-height: 1.45; overflow-wrap: anywhere; }
.symptom-pattern-card {
  margin: 14px 0 18px;
  padding: 16px 18px;
  border-color: #cde5ef;
  background: linear-gradient(110deg, #f4fcfe, #fbfdff 65%, #f6f1ff);
}
.symptom-pattern-heading { display: flex; align-items: flex-start; gap: 11px; }
.symptom-pattern-icon,
.symptom-pattern-item-icon {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 11px;
  background: #e5f8fc;
  color: #0b82a2;
}
.symptom-pattern-icon { width: 34px; height: 34px; font-size: 16px; }
.symptom-pattern-heading h2 { margin: 2px 0 0; color: var(--navy); font-size: 17px; line-height: 1.15; }
.symptom-pattern-list { display: grid; gap: 8px; margin-top: 13px; }
.symptom-pattern-item { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; min-width: 0; padding: 11px 12px; border: 1px solid #d9ebf1; border-radius: 11px; background: rgba(255,255,255,.8); }
.symptom-pattern-item-icon { width: 34px; height: 34px; font-size: 17px; }
.symptom-pattern-item b { display: block; color: var(--navy); font-size: 10px; line-height: 1.35; }
.symptom-pattern-item p { margin: 4px 0 0; color: var(--muted); font-size: 9px; line-height: 1.45; }
.symptom-pattern-item small { display: block; margin-top: 5px; color: var(--muted-light); font-size: 8px; }
.symptom-pattern-empty { padding: 10px 12px; border: 1px dashed #c9e0e9; border-radius: 10px; background: rgba(255,255,255,.66); }
.symptom-pattern-empty b { display: block; color: var(--navy); font-size: 10px; }
.symptom-pattern-empty p { margin: 4px 0 0; color: var(--muted); font-size: 9px; line-height: 1.45; }
.symptom-pattern-note { display: flex; align-items: flex-start; gap: 7px; margin: 11px 1px 0; color: var(--muted-light); font-size: 8px; line-height: 1.45; }
.symptom-pattern-note > span { width: 16px; height: 16px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid #bfdbe6; border-radius: 50%; color: var(--blue-strong); font-size: 9px; font-weight: 800; }
.symptom-quick-picks { display: grid; gap: 7px; }
.symptom-quick-label { color: var(--muted); font-size: 9px; font-weight: 800; }
.symptom-quick-label small,
.modal-field > span small { margin-left: 4px; color: #536d80; font-size: 8px; font-weight: 600; }
.symptom-quick-chip-list { display: flex; flex-wrap: wrap; gap: 6px; }
.symptom-quick-chip { min-height: 32px; padding: 0 9px; border: 1px solid #cfe0e8; border-radius: 999px; background: #fff; color: var(--blue-strong); font-size: 9px; font-weight: 700; }
.symptom-quick-chip:hover,
.symptom-quick-chip:focus-visible { border-color: #8fcfe0; background: #eefbfe; }
/* Keep native dialogs out of the layout when closed; only the open dialog gets
   the flex/scroll treatment. This prevents a closed form from sitting behind
   the fixed mobile navigation. */
dialog.quick-modal:not([open]) { display: none; }
dialog.quick-modal[open] { display: flex; flex-direction: column; overflow: hidden; z-index: 90; }
dialog.quick-modal[open] > #modal-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding-bottom: max(84px, env(safe-area-inset-bottom)); }
#quick-modal #modal-eyebrow { color: #075ca8; }
.symptom-guidance-form { gap: 16px; }
.symptom-guidance-intro {
  padding: 13px 14px;
  border: 1px solid #f0c7c0;
  border-radius: 12px;
  background: #fff5f1;
  color: #80524d;
  font-size: 10px;
  line-height: 1.55;
}
.symptom-guidance-intro b { display: block; color: #69352f; font-size: 11px; }
.symptom-guidance-intro p { margin: 4px 0 0; }
.symptom-guidance-fieldset { min-inline-size: 0; margin: 0; padding: 0; border: 0; }
.symptom-guidance-fieldset legend { margin-bottom: 9px; color: var(--navy); font-size: 12px; font-weight: 800; line-height: 1.35; }
.symptom-guidance-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.symptom-guidance-option {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 43px;
  padding: 0 10px;
  border: 1px solid #cfe0e8;
  border-radius: 9px;
  background: #fff;
  color: var(--muted);
  cursor: pointer;
  font-size: 10px;
  font-weight: 700;
}
.symptom-guidance-option:focus-within { border-color: var(--blue); box-shadow: 0 0 0 3px #e2f5fc; }
.symptom-guidance-option input { width: 16px; height: 16px; margin: 0; accent-color: var(--blue); }
.symptom-guidance-option:has(input:checked) { border-color: #8bcfe0; background: #effbfe; color: var(--blue-strong); }
.symptom-guidance-result { padding: 13px 14px; border: 1px solid #cde5ef; border-radius: 12px; background: #f3fbfe; color: var(--navy); }
.symptom-guidance-result b { display: block; font-size: 12px; }
.symptom-guidance-result p { margin: 5px 0 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.symptom-guidance-result small { display: block; margin-top: 6px; color: var(--muted-light); font-size: 8px; line-height: 1.45; }
.symptom-guidance-result.emergency { border-color: #e8b8a3; background: #fff0e7; color: #69352f; }
.symptom-guidance-result.emergency p { color: #805d57; }
.symptom-guidance-result.urgent { border-color: #edd3a4; background: #fff8e9; color: #6f5318; }
.symptom-guidance-result.urgent p { color: #78643a; }
.symptom-guidance-result.monitor { border-color: #bce3ed; background: #effbfe; }

@media (max-width: 620px) {
  #view-symptoms .symptom-page-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  #view-symptoms .symptom-page-actions > button { width: 100%; min-width: 0; }
  #view-symptoms .symptom-more-details .modal-form-grid { grid-template-columns: 1fr; }
  #view-symptoms .symptom-entry-details { grid-template-columns: 1fr; }
  #view-symptoms .symptom-pattern-card { margin: 12px 0 15px; padding: 13px; }
  #view-symptoms .symptom-pattern-heading h2 { font-size: 15px; }
  #view-symptoms .symptom-pattern-item { padding: 10px; }
  #view-symptoms .symptom-quick-chip { min-height: 34px; padding-inline: 8px; }
  .symptom-guidance-options { gap: 6px; }
  .symptom-guidance-option { padding: 0 7px; font-size: 9px; }
}

@media (max-width: 380px) {
  #view-symptoms .symptom-page-actions { grid-template-columns: 1fr; }
  .symptom-guidance-options { grid-template-columns: 1fr; }
  .symptom-guidance-option { min-height: 40px; }
}

/* Profile shortcuts: a calm, editable home for the tools people use most. */
body[data-hub-theme="profile"] {
  /* Reuse the home screen's colour language for shortcut affordances. */
  --colour-cyan: #5de4f5;
  --colour-blue: #0d75f5;
  --colour-violet: #a58aff;
  --colour-coral: #ff8b78;
  --colour-mint: #57dfbd;
  --colour-yellow: #ffd85f;
  --blue: #1679e8;
  --blue-strong: #075fbd;
  --cyan: #24bfdc;
  --sky: #edf9ff;
  --sky-deep: #d9f2fb;
  --paper: #f6fbff;
  --line: #d7e8f1;
  --line-soft: #e8f2f7;
  --muted: #5e7487;
  --muted-light: #7e95a6;
  --shadow: 0 16px 38px rgba(23, 72, 106, .08);
  background:
    radial-gradient(circle at 8% 9%, rgba(93, 228, 245, .19), transparent 24rem),
    radial-gradient(circle at 94% 12%, rgba(165, 138, 255, .15), transparent 25rem),
    linear-gradient(180deg, #f8fcff 0%, #eef8ff 56%, #fffafa 100%);
}
.profile-view { display: grid; gap: 16px; }
.profile-page-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 25px 27px;
  background: linear-gradient(125deg, rgba(255,255,255,.96), rgba(240,250,255,.92) 58%, rgba(247,244,255,.92));
}
.profile-page-identity { display: flex; align-items: center; gap: 14px; min-width: 0; }
.profile-page-identity .avatar { width: 58px; height: 58px; border-radius: 18px; box-shadow: 0 8px 20px rgba(24, 102, 151, .12); }
.profile-page-identity .avatar img { width: 31px; height: 31px; }
.profile-page-identity > div { min-width: 0; }
.profile-page-identity .eyebrow { margin-bottom: 6px; }
.profile-page-identity h1 { margin: 0; color: var(--navy); font-size: clamp(28px, 4vw, 42px); line-height: 1; letter-spacing: -.06em; overflow-wrap: anywhere; }
.profile-page-email { margin: 7px 0 0; color: var(--muted); font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.profile-page-hero > .secondary-button { flex: 0 0 auto; }
.profile-shortcuts-card { padding: 25px 27px 27px; }
.profile-shortcuts-intro { max-width: 680px; margin: 8px 0 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.profile-shortcuts-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; margin-top: 19px; }
.profile-shortcut-item { position: relative; min-width: 0; }
.profile-shortcut-card,
.profile-shortcut-add {
  width: 100%;
  min-width: 0;
  min-height: 86px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  padding: 13px;
  border: 1px solid #d7e7f0;
  border-radius: 15px;
  background: rgba(255,255,255,.9);
  color: var(--navy);
  text-align: left;
  box-shadow: 0 8px 18px rgba(24, 87, 122, .045);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease;
}
.profile-shortcut-card:hover,
.profile-shortcut-card:focus-visible { border-color: #9bcee3; background: #fff; box-shadow: 0 12px 24px rgba(24, 87, 122, .1); transform: translateY(-1px); }
.profile-shortcut-card .profile-shortcut-icon,
.profile-shortcut-add > span:first-child,
.profile-trust-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 12px;
  font-size: 17px;
  font-weight: 700;
}
.profile-shortcut-icon svg {
  width: 100%;
  height: 100%;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  overflow: visible;
}
.profile-shortcut-icon svg .icon-fill { fill: currentColor; stroke: none; opacity: .18; }
.profile-shortcut-icon svg .icon-solid { fill: currentColor; stroke: none; }
.profile-shortcut-copy { min-width: 0; }
.profile-shortcut-copy b, .profile-shortcut-copy small { display: block; overflow-wrap: anywhere; }
.profile-shortcut-copy b { color: var(--navy); font-size: 11px; line-height: 1.25; }
.profile-shortcut-copy small { margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.35; }
.profile-shortcut-arrow { color: #79a6bf; font-size: 17px; }
.profile-shortcut-icon.tone-cyan, .profile-trust-icon.tone-cyan {
  background: linear-gradient(145deg, #e9fcff, #d8f7fc);
  color: #087fa6;
  box-shadow: 0 5px 12px rgba(8,127,166,.14), inset 0 0 0 1px rgba(93,228,245,.34);
}
.profile-shortcut-icon.tone-blue {
  background: linear-gradient(145deg, #edf5ff, #e0edff);
  color: #0d75f5;
  box-shadow: 0 5px 12px rgba(13,117,245,.14), inset 0 0 0 1px rgba(13,117,245,.22);
}
.profile-shortcut-icon.tone-coral {
  background: linear-gradient(145deg, #fff4f0, #ffebe6);
  color: #c65d4f;
  box-shadow: 0 5px 12px rgba(198,93,79,.14), inset 0 0 0 1px rgba(255,139,120,.32);
}
.profile-shortcut-icon.tone-violet, .profile-trust-icon.tone-violet {
  background: linear-gradient(145deg, #f4f0ff, #ebe5ff);
  color: #7556ad;
  box-shadow: 0 5px 12px rgba(117,86,173,.14), inset 0 0 0 1px rgba(165,138,255,.34);
}
.profile-shortcut-icon.tone-yellow {
  background: linear-gradient(145deg, #fffbed, #fff5d2);
  color: #927018;
  box-shadow: 0 5px 12px rgba(146,112,24,.14), inset 0 0 0 1px rgba(255,216,95,.42);
}
.profile-shortcut-icon.tone-mint {
  background: linear-gradient(145deg, #effdf8, #def9ef);
  color: #188d76;
  box-shadow: 0 5px 12px rgba(24,141,118,.14), inset 0 0 0 1px rgba(87,223,189,.34);
}
.profile-shortcut-icon.tone-purple {
  background: linear-gradient(145deg, #f5f1ff, #ebe5fb);
  color: #7458bf;
  box-shadow: 0 5px 12px rgba(116,88,191,.14), inset 0 0 0 1px rgba(165,138,255,.28);
}
.profile-shortcut-item:has(.profile-shortcut-remove) .profile-shortcut-card { padding-right: 42px; }
.profile-shortcut-remove {
  position: absolute;
  top: 7px;
  right: 7px;
  z-index: 1;
  width: 27px;
  height: 27px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid #f0c7c3;
  border-radius: 50%;
  background: #fff7f6;
  color: #b54f49;
  font-size: 18px;
  line-height: 1;
}
.profile-shortcut-remove:hover, .profile-shortcut-remove:focus-visible { border-color: #d98b85; background: #ffefed; }
.profile-shortcut-add {
  border-style: dashed;
  border-color: #9fcfe1;
  background: linear-gradient(135deg, #f4fcff, #fbfdff);
  color: var(--blue-strong);
}
.profile-shortcut-add:hover, .profile-shortcut-add:focus-visible { border-color: var(--blue); background: #eefaff; box-shadow: 0 12px 24px rgba(24, 119, 181, .11); transform: translateY(-1px); }
.profile-shortcut-add > span:first-child { background: #e3f8fd; color: var(--blue); font-size: 23px; font-weight: 400; }
.profile-shortcut-add b, .profile-shortcut-add small { display: block; }
.profile-shortcut-add b { font-size: 11px; }
.profile-shortcut-add small { margin-top: 4px; color: var(--muted); font-size: 9px; line-height: 1.35; }
.profile-shortcuts-empty { grid-column: 1 / -1; padding: 17px; border: 1px dashed #b8d8e6; border-radius: 13px; background: #f8fdff; color: var(--muted); font-size: 11px; line-height: 1.5; }
.profile-shortcuts-edit-note { display: flex; align-items: flex-start; gap: 8px; margin: 13px 1px 0; color: var(--muted); font-size: 10px; line-height: 1.45; }
.profile-shortcuts-edit-note > span { width: 17px; height: 17px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid #bdd9e6; border-radius: 50%; color: var(--blue-strong); font-size: 9px; font-weight: 800; }
.profile-trust-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.profile-trust-card { display: flex; align-items: flex-start; gap: 13px; padding: 22px 24px; }
.profile-trust-card > div { min-width: 0; }
.profile-trust-card h2 { margin: 0; color: var(--navy); font-size: 16px; line-height: 1.2; letter-spacing: -.035em; }
.profile-trust-card p:not(.card-kicker) { margin: 7px 0 13px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.profile-shortcut-picker { display: grid; gap: 8px; padding: 19px 23px 7px; }
.profile-shortcut-choice { width: 100%; min-height: 60px; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 11px; background: #fff; color: var(--navy); text-align: left; }
.profile-shortcut-choice:hover, .profile-shortcut-choice:focus-visible { border-color: #9bcee3; background: var(--sky); }
.profile-shortcut-choice .profile-shortcut-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; font-size: 15px; }
.profile-shortcut-choice b, .profile-shortcut-choice small { display: block; }
.profile-shortcut-choice b { font-size: 10px; }
.profile-shortcut-choice small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.profile-shortcut-choice > span:last-child { color: var(--blue); font-size: 17px; }
.profile-shortcut-picker-note { margin: 9px 23px 21px; color: var(--muted-light); font-size: 9px; line-height: 1.45; }

@media (max-width: 760px) {
  .profile-page-hero { align-items: flex-start; flex-direction: column; padding: 20px; }
  .profile-page-hero > .secondary-button { width: 100%; }
  .profile-shortcuts-card { padding: 20px; }
  .profile-trust-grid { grid-template-columns: 1fr; gap: 11px; }
}
@media (max-width: 620px) {
  #view-profile.view { padding-bottom: 112px; }
  .profile-view { gap: 12px; }
  .profile-page-hero { padding: 18px; border-radius: 20px; }
  .profile-page-identity .avatar { width: 50px; height: 50px; border-radius: 15px; }
  .profile-page-identity .avatar img { width: 26px; height: 26px; }
  .profile-page-identity h1 { font-size: 31px; }
  .profile-page-email { font-size: 11px; }
  .profile-shortcuts-card { padding: 18px 14px 20px; }
  .profile-shortcuts-card .card-heading { align-items: center; }
  .profile-shortcuts-card .card-heading h2 { font-size: 19px; }
  .profile-shortcuts-intro { font-size: 11px; }
  .profile-shortcuts-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 15px; }
  .profile-shortcut-card, .profile-shortcut-add { min-height: 91px; grid-template-columns: 31px minmax(0, 1fr); gap: 8px; padding: 11px 10px; border-radius: 13px; }
  .profile-shortcut-card .profile-shortcut-icon, .profile-shortcut-add > span:first-child { width: 31px; height: 31px; border-radius: 10px; font-size: 14px; }
  .profile-shortcut-copy b { font-size: 10px; }
  .profile-shortcut-copy small, .profile-shortcut-add small { font-size: 8px; }
  .profile-shortcut-arrow { display: none; }
  .profile-shortcut-item:has(.profile-shortcut-remove) .profile-shortcut-card { padding-right: 34px; }
  .profile-shortcut-remove { top: 5px; right: 5px; width: 25px; height: 25px; }
  .profile-trust-card { padding: 17px; }
  .profile-trust-card h2 { font-size: 15px; }
  .profile-trust-card p:not(.card-kicker) { font-size: 10px; }
}
@media (max-width: 360px) {
  .profile-shortcuts-grid { grid-template-columns: 1fr; }
}
/* My Health: compact, premium overview that follows the Today visual language. */
#view-health .health-page-heading {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 28px;
  margin-bottom: 20px;
  padding: 34px 36px;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: 28px;
  background: linear-gradient(120deg, #075ed9 0%, #0476c8 58%, #078cae 100%);
  box-shadow: 0 22px 54px rgba(8, 101, 223, .18);
}
#view-health .health-page-heading::after {
  content: '';
  position: absolute;
  z-index: -1;
  right: -82px;
  bottom: -122px;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  background: rgba(126, 236, 250, .18);
  box-shadow: -150px -86px 0 rgba(255,255,255,.055);
}
#view-health .health-page-heading .eyebrow { color: #c7f5ff; }
#view-health .health-page-heading h1 { margin-top: 7px; color: #fff; }
#view-health .health-page-heading .page-subtitle {
  max-width: 560px;
  margin-top: 12px;
  color: #e6f5ff;
  font-size: 16px;
  line-height: 1.55;
}
#view-health .health-page-actions {
  position: relative;
  display: grid;
  justify-items: end;
  gap: 13px;
}
#view-health .health-choice-note {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #e6f9ff;
  font-size: 12px;
  font-weight: 700;
}
#view-health .health-choice-note i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #79efd0;
  box-shadow: 0 0 0 5px rgba(121, 239, 208, .14);
}
body[data-hub-theme] #view-health .health-page-heading .primary-button {
  min-width: 194px;
  border: 1px solid rgba(255,255,255,.75);
  background: #fff;
  color: #0759b6;
  box-shadow: 0 12px 28px rgba(1, 42, 99, .18);
}
body[data-hub-theme] #view-health .health-page-heading .primary-button:hover { background: #f0fbff; color: #063f86; }
#view-health .health-overview-grid { gap: 18px; }
#view-health .health-snapshot,
#view-health .memory-card { min-height: 0; padding: 26px; border-radius: 24px; }
#view-health .health-snapshot { background: rgba(255,255,255,.96); }
#view-health .health-snapshot .card-heading h2,
#view-health .memory-card h2 { font-size: 24px; letter-spacing: -.045em; }
#view-health .health-card-edit {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 0 13px;
  border: 1px solid #cfe3f2;
  border-radius: 12px;
  background: #f7fbff;
  color: #0759b6;
  font-size: 14px;
  font-weight: 800;
}
#view-health .health-card-edit:hover { border-color: #98c8e8; background: #eef8ff; }
#view-health .profile-facts { gap: 10px; margin-top: 22px; }
#view-health .profile-fact {
  position: relative;
  min-width: 0;
  overflow: hidden;
  padding: 14px 14px 14px 17px;
  border: 1px solid #e1edf5;
  border-radius: 14px;
  background: #f8fbfe;
}
#view-health .profile-fact::before {
  content: '';
  position: absolute;
  top: 13px;
  bottom: 13px;
  left: 0;
  width: 4px;
  border-radius: 0 6px 6px 0;
  background: #25a5c2;
}
#view-health .profile-fact:nth-child(2)::before,
#view-health .profile-fact:nth-child(5)::before { background: #7460c6; }
#view-health .profile-fact:nth-child(3)::before,
#view-health .profile-fact:nth-child(6)::before { background: #248f70; }
#view-health .profile-fact:nth-child(4)::before { background: #d56658; }
#view-health .profile-fact small { color: #587083; font-size: 12px !important; font-weight: 700; }
#view-health .profile-fact-label { display: flex; align-items: center; gap: 7px; min-width: 0; }
#view-health .profile-fact-icon { width: 24px; height: 24px; flex: 0 0 24px; padding: 4px; border-radius: 7px; }
#view-health .profile-fact-icon svg { width: 100%; height: 100%; }
#view-health .profile-fact b {
  margin-top: 7px;
  color: #0a2340;
  font-size: 15px !important;
  line-height: 1.35;
}
#view-health .health-note {
  align-items: flex-start;
  margin-top: 16px;
  padding: 13px 14px;
  border: 1px solid #d8ecf6;
  border-radius: 13px;
  background: #eef9fd;
}
#view-health .health-note span {
  width: 22px;
  height: 22px;
  border: 0;
  background: #d8f3fa;
  font-size: 12px;
  font-weight: 800;
}
#view-health .health-note p { color: #476579; font-size: 13px !important; line-height: 1.55 !important; }
#view-health .memory-card {
  background: linear-gradient(145deg, #f5fcff, #eaf8fc);
  border-color: #cdeaf3;
}
#view-health .memory-large-icon {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: linear-gradient(145deg, #0a2340, #0759b6);
  color: #9df3ff;
  box-shadow: 0 9px 20px rgba(7, 89, 182, .16);
}
#view-health .memory-card > p { margin-top: 16px; font-size: 14px; line-height: 1.6; }
#view-health .memory-approved span { border-radius: 9px; font-size: 12px; }
#view-health .section-title-row { margin-top: 38px; }
#view-health .section-title-row h2 { font-size: 28px; }
#view-health .health-info-grid { gap: 16px; }
#view-health .info-card { padding: 22px; border-radius: 20px; }
#view-health .info-icon { width: 38px; height: 38px; border-radius: 12px; }
#view-health .info-card-heading h3 { font-size: 16px; }
#view-health .info-card-heading small { font-size: 12px; line-height: 1.45; }

@media (max-width: 800px) {
  #view-health.view { padding-top: 18px; }
  #view-health .health-page-heading {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-bottom: 16px;
    padding: 25px 23px 23px;
    border-radius: 24px;
  }
  #view-health .health-page-heading h1 { font-size: clamp(38px, 11vw, 47px); }
  #view-health .health-page-heading .page-subtitle { max-width: 32ch; font-size: 15px; }
  #view-health .health-page-actions { justify-items: stretch; gap: 15px; }
  #view-health .health-choice-note { padding-left: 4px; }
  body[data-hub-theme] #view-health .health-page-heading .primary-button { width: 100%; min-height: 50px; }
  #view-health .health-overview-grid { gap: 14px; }
  #view-health .health-snapshot,
  #view-health .memory-card { padding: 20px; border-radius: 22px; }
  #view-health .profile-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  #view-health .profile-fact { min-height: 88px; padding: 13px 12px 13px 16px; }
  #view-health .profile-fact b { overflow-wrap: anywhere; white-space: normal; }
  #view-health .memory-card-top { align-items: flex-start; }
  #view-health .memory-card-top .switch { margin-top: 5px; }
  #view-health .memory-card-actions { align-items: stretch; flex-direction: column; gap: 8px; }
  #view-health .memory-card-actions .secondary-button { width: 100%; }
  #view-health .memory-card-actions .text-button { min-height: 44px; justify-content: center; }
  #view-health .section-title-row { align-items: flex-start; margin-top: 30px; }
  #view-health .section-title-row h2 { font-size: 25px; }
}

@media (max-width: 360px) {
  #view-health .health-page-heading { padding: 22px 19px; }
  #view-health .health-snapshot,
  #view-health .memory-card { padding: 17px; }
  #view-health .health-snapshot .card-heading h2,
  #view-health .memory-card h2 { font-size: 21px; }
  #view-health .profile-fact { min-height: 84px; padding-right: 9px; }
}

#view-health .personal-overview-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  margin-top: 16px;
  padding: 21px 24px;
  border-color: #cce6f2;
  border-radius: 20px;
  background: linear-gradient(105deg, #f0faff 0%, #fff 75%);
}
#view-health .personal-overview-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid #c7eaf4;
  border-radius: 15px;
  background: #e4f8fc;
  color: #0876b8;
}
#view-health .personal-overview-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
#view-health .personal-overview-copy { min-width: 0; }
#view-health .personal-overview-copy .card-kicker { margin-bottom: 4px; }
#view-health .personal-overview-copy h2 { margin: 0; color: #0a2340; font-size: 20px; letter-spacing: -.035em; }
#view-health .personal-overview-copy > p:last-child { margin: 5px 0 0; color: #536e82; font-size: 13px; line-height: 1.5; }
#view-health .personal-overview-button {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 17px;
  border: 1px solid #b9dced;
  border-radius: 13px;
  background: #fff;
  color: #0759b6;
  font-size: 14px;
  font-weight: 800;
  white-space: nowrap;
}
#view-health .personal-overview-button:hover { background: #eaf8ff; border-color: #8dc9e8; }
#view-health .personal-overview-button:focus-visible { outline: 3px solid #26aacb; outline-offset: 3px; }

.personal-overview-dialog { display: grid; gap: 14px; }
.personal-overview-intro { margin: 0; color: #536e82; font-size: 14px; line-height: 1.6; }
.personal-overview-generated { margin: -7px 0 0; color: #526a7d; font-size: 12px; }
.personal-overview-sections { display: grid; gap: 11px; max-height: min(58vh, 590px); overflow: auto; padding: 2px 4px 2px 0; overscroll-behavior: contain; }
.personal-overview-section { padding: 15px 16px; border: 1px solid #deebf3; border-radius: 14px; background: #f9fcfe; }
.personal-overview-section h3 { margin: 0 0 10px; color: #173550; font-size: 15px; }
.personal-overview-section dl { display: grid; gap: 9px; margin: 0; }
.personal-overview-section dl > div { display: grid; grid-template-columns: minmax(105px, .42fr) minmax(0, 1fr); gap: 12px; padding-bottom: 8px; border-bottom: 1px solid #e6eff5; }
.personal-overview-section dl > div:last-child { padding-bottom: 0; border-bottom: 0; }
.personal-overview-section dt { color: #5c7488; font-size: 13px; font-weight: 700; }
.personal-overview-section dd { min-width: 0; margin: 0; color: #173550; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; white-space: pre-wrap; }
.personal-overview-section ul { display: grid; gap: 8px; margin: 0; padding-left: 19px; color: #173550; }
.personal-overview-section li { padding-left: 2px; font-size: 14px; line-height: 1.55; overflow-wrap: anywhere; }
.personal-overview-empty, .personal-overview-start > p { margin: 0; color: #5c7488; font-size: 13px; line-height: 1.5; }
.personal-overview-start .secondary-button { margin-top: 13px; }
.personal-overview-safety { margin: 0; padding: 12px 14px; border: 1px solid #d7eaf4; border-radius: 12px; background: #eef9fd; color: #476579; font-size: 12px; line-height: 1.55; }

@media (max-width: 800px) {
  #view-health .personal-overview-card { grid-template-columns: auto minmax(0, 1fr); gap: 12px; margin-top: 13px; padding: 17px; border-radius: 18px; }
  #view-health .personal-overview-icon { width: 42px; height: 42px; border-radius: 13px; }
  #view-health .personal-overview-copy h2 { font-size: 18px; }
  #view-health .personal-overview-copy > p:last-child { font-size: 12px; }
  #view-health .personal-overview-button { grid-column: 1 / -1; width: 100%; min-height: 48px; }
  .personal-overview-section dl > div { grid-template-columns: minmax(95px, .38fr) minmax(0, 1fr); gap: 9px; }
}

/* Chat and Profile: premium companions to the My Health experience. */
#view-ask .conversation-panel {
  overflow: hidden;
  border-color: #cfe4f1;
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 22px 54px rgba(8, 74, 126, .13);
}
#view-ask .conversation-header {
  position: relative;
  z-index: 2;
  border-bottom-color: rgba(255,255,255,.18);
  background: linear-gradient(115deg, #075ed9, #0787b8);
}
#view-ask .assistant-mark {
  border-color: rgba(255,255,255,.66);
  background: #fff;
  box-shadow: 0 8px 18px rgba(3, 41, 92, .18);
}
#view-ask .assistant-identity b { color: #fff; }
#view-ask .assistant-identity small { color: #dcf5ff; }
#view-ask .assistant-identity small i { background: #76edc7; box-shadow: 0 0 0 4px rgba(118,237,199,.14); }
#view-ask .conversation-header-actions .quiet-button {
  border: 1px solid rgba(255,255,255,.34);
  background: rgba(255,255,255,.12);
  color: #fff;
}
#view-ask .conversation-header-actions .quiet-button:hover { background: rgba(255,255,255,.2); }
#view-ask .conversation-header-actions .privacy-badge { background: #e7fbf4; color: #14775e; }
#view-ask .conversation-panel:not(.has-messages) .conversation-scroll {
  position: relative;
  isolation: isolate;
  overflow: hidden auto;
  background: linear-gradient(145deg, #075ed9 0%, #057ac3 62%, #0894ae 100%);
}
#view-ask .conversation-panel:not(.has-messages) .conversation-scroll::after {
  content: '';
  position: absolute;
  z-index: -1;
  right: -80px;
  bottom: -132px;
  width: 310px;
  height: 310px;
  border-radius: 50%;
  background: rgba(115, 235, 247, .17);
  box-shadow: -175px -105px 0 rgba(255,255,255,.05);
}
#view-ask .conversation-panel:not(.has-messages) .chat-welcome-kicker { color: #c7f5ff; }
#view-ask .conversation-panel:not(.has-messages) .chat-welcome h2 { color: #fff; }
#view-ask .conversation-panel:not(.has-messages) .chat-welcome p:last-child { color: #e5f5ff; }
#view-ask .conversation-panel:not(.has-messages) .chat-welcome-icon {
  border-color: rgba(255,255,255,.72);
  background: #fff;
  box-shadow: 0 13px 28px rgba(1, 39, 91, .2);
}
#view-ask .quick-asks {
  position: relative;
  z-index: 3;
  padding-top: 14px;
  background: #fff;
}
#view-ask .quick-asks button {
  border-radius: 13px;
  background: #f7fbff;
  box-shadow: 0 6px 14px rgba(16, 80, 119, .045);
}
#view-ask .quick-asks button:nth-of-type(1) { border-color: #ddcfee; background: #faf7ff; }
#view-ask .quick-asks button:nth-of-type(2) { border-color: #efd4ce; background: #fff8f5; }
#view-ask .quick-asks button:nth-of-type(3) { border-color: #c4d6ee; background: #f5f8ff; }
#view-ask .quick-asks button:nth-of-type(1) .quick-ask-icon { color: #7556ad; }
#view-ask .quick-asks button:nth-of-type(2) .quick-ask-icon { color: #b85c4f; }
#view-ask .quick-asks button:nth-of-type(3) .quick-ask-icon { color: #2866b3; }
#view-ask .chat-composer {
  border: 1px solid #c9dfed;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(15, 74, 111, .08);
}
#view-ask .response-length-picker { gap: 7px; padding: 7px 8px 10px; }
#view-ask .response-length-picker label > span { min-height: 38px; border-radius: 11px; font-size: 12px; }
#view-ask .response-length-picker input:checked + span {
  border-color: #9bd5e8;
  background: linear-gradient(135deg, #eaf9ff, #e5f2ff);
  color: #0759b6;
  box-shadow: 0 5px 13px rgba(8, 101, 223, .09);
}
#view-ask .chat-composer textarea { color: #0a2340; }
#view-ask .chat-composer textarea::placeholder { color: #8ba0b0; }
body[data-hub-theme] #view-ask .chat-composer #chat-send {
  background: linear-gradient(120deg, #075ed9, #0787b8);
  box-shadow: 0 9px 18px rgba(7, 94, 217, .2);
}
#view-ask .chat-disclaimer {
  padding: 9px 12px;
  border-radius: 12px;
  background: #f4f9fd;
}

#view-profile .profile-page-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 31px 34px;
  border-color: rgba(255,255,255,.34);
  border-radius: 28px;
  background: linear-gradient(120deg, #075ed9 0%, #0476c8 58%, #078cae 100%);
  box-shadow: 0 22px 54px rgba(8, 101, 223, .18);
}
#view-profile .profile-page-hero::after {
  content: '';
  position: absolute;
  z-index: -1;
  right: -78px;
  bottom: -134px;
  width: 310px;
  height: 310px;
  border-radius: 50%;
  background: rgba(126, 236, 250, .18);
  box-shadow: -160px -96px 0 rgba(255,255,255,.055);
}
#view-profile .profile-page-identity { gap: 17px; }
#view-profile .profile-page-identity .avatar {
  width: 68px;
  height: 68px;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 21px;
  background: #fff;
  box-shadow: 0 13px 28px rgba(1, 39, 91, .2);
}
#view-profile .profile-page-identity .eyebrow { color: #c7f5ff; }
#view-profile .profile-page-identity h1 { color: #fff; }
#view-profile .profile-page-email { color: #e5f5ff; font-size: 14px; }
body[data-hub-theme] #view-profile .profile-page-hero > .secondary-button {
  min-height: 48px;
  border-color: rgba(255,255,255,.72);
  background: #fff;
  color: #0759b6;
  box-shadow: 0 12px 28px rgba(1, 42, 99, .18);
}
#view-profile .profile-shortcuts-card { padding: 29px 30px 31px; border-radius: 24px; }
#view-profile .profile-shortcuts-card .card-heading h2 { font-size: 25px; letter-spacing: -.04em; }
#view-profile .profile-shortcuts-intro { max-width: 720px; font-size: 14px; }
#view-profile .profile-shortcuts-grid { gap: 13px; margin-top: 21px; }
#view-profile .profile-shortcut-card,
#view-profile .profile-shortcut-add {
  min-height: 102px;
  padding: 15px;
  border-radius: 17px;
}
#view-profile .profile-shortcut-card .profile-shortcut-icon,
#view-profile .profile-shortcut-add > span:first-child { width: 42px; height: 42px; border-radius: 13px; }
#view-profile .profile-shortcut-copy b,
#view-profile .profile-shortcut-add b { font-size: 14px; }
#view-profile .profile-shortcut-copy small,
#view-profile .profile-shortcut-add small { margin-top: 5px; font-size: 12px; }
#view-profile .profile-trust-card { padding: 24px; border-radius: 21px; }
#view-profile .profile-trust-card h2 { font-size: 19px; }
#view-profile .profile-trust-card p:not(.card-kicker) { font-size: 13px; }

@media (max-width: 620px) {
  #view-ask .conversation-panel {
    border-radius: 24px;
    box-shadow: 0 18px 42px rgba(8, 74, 126, .13);
  }
  #view-ask .conversation-header { flex-basis: 64px; height: 64px; padding-inline: 15px; }
  #view-ask .assistant-identity b { font-size: 15px; }
  #view-ask .assistant-identity small { font-size: 12px; }
  #view-ask .conversation-header-actions .quiet-button { min-height: 42px; font-size: 12px; }
  #view-ask .conversation-scroll { padding-inline: 20px; }
  #view-ask .conversation-panel:not(.has-messages) .chat-welcome { max-width: 320px; }
  #view-ask .conversation-panel:not(.has-messages) .chat-welcome h2 { font-size: clamp(28px, 8vw, 34px); }
  #view-ask .conversation-panel:not(.has-messages) .chat-welcome p:last-child { font-size: 14px; }
  #view-ask .quick-asks { gap: 8px; padding: 14px 13px 11px; }
  #view-ask .quick-asks button { min-height: 47px; padding-inline: 13px; font-size: 12px; }
  #view-ask .chat-composer { margin-inline: 13px; border-radius: 18px; }
  #view-ask .response-length-picker { margin: 8px 8px 0; }
  #view-ask .response-length-picker label > span { min-height: 38px; font-size: 13px; }
  #view-ask .chat-composer textarea { min-height: 64px; font-size: 16px; }
  #view-ask .chat-composer .composer-context { font-size: 12px; }
  #view-ask .chat-composer .composer-row > #chat-send { min-width: 84px; min-height: 44px; font-size: 13px; }
  #view-ask .chat-disclaimer { max-width: calc(100% - 28px); margin-block: 9px 11px; font-size: 12px; }

  #view-profile.view { padding-top: 18px; }
  #view-profile .profile-page-hero { gap: 23px; padding: 25px 23px 23px; border-radius: 24px; }
  #view-profile .profile-page-identity { align-items: flex-start; gap: 14px; }
  #view-profile .profile-page-identity .avatar { width: 58px; height: 58px; border-radius: 18px; }
  #view-profile .profile-page-identity h1 { font-size: clamp(34px, 9.5vw, 42px); }
  #view-profile .profile-page-email { font-size: 14px; }
  body[data-hub-theme] #view-profile .profile-page-hero > .secondary-button { width: 100%; min-height: 50px; }
  #view-profile .profile-shortcuts-card { padding: 22px 18px 23px; border-radius: 22px; }
  #view-profile .profile-shortcuts-card .card-heading { align-items: flex-start; }
  #view-profile .profile-shortcuts-card .card-heading h2 { font-size: 23px; }
  #view-profile .profile-shortcuts-intro { font-size: 14px; }
  #view-profile .profile-shortcuts-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  #view-profile .profile-shortcut-card,
  #view-profile .profile-shortcut-add {
    min-height: 124px;
    grid-template-columns: 1fr;
    align-content: start;
    gap: 10px;
    padding: 15px 13px;
    border-radius: 16px;
  }
  #view-profile .profile-shortcut-card .profile-shortcut-icon,
  #view-profile .profile-shortcut-add > span:first-child { width: 39px; height: 39px; }
  #view-profile .profile-shortcut-copy b,
  #view-profile .profile-shortcut-add b { font-size: 13px; }
  #view-profile .profile-shortcut-copy small,
  #view-profile .profile-shortcut-add small { font-size: 12px; }
  #view-profile .profile-trust-card { padding: 20px; }
  #view-profile .profile-trust-card h2 { font-size: 18px; }
  #view-profile .profile-trust-card p:not(.card-kicker) { font-size: 13px; }
}

@media (max-width: 340px) {
  #view-profile .profile-shortcuts-grid { grid-template-columns: 1fr; }
  #view-profile .profile-shortcut-card,
  #view-profile .profile-shortcut-add { min-height: 98px; grid-template-columns: 39px minmax(0, 1fr); align-content: center; }
}

/* Shared premium workspace system: every core health tool follows the same visual language. */
:is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) > .page-heading {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 24px;
  margin-bottom: 20px;
  padding: 30px 32px;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: 28px;
  background: linear-gradient(120deg, #075ed9 0%, #0476c8 58%, #078cae 100%);
  box-shadow: 0 22px 54px rgba(8, 101, 223, .18);
}
:is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) > .page-heading::after {
  content: '';
  position: absolute;
  z-index: -1;
  right: -86px;
  bottom: -148px;
  width: 330px;
  height: 330px;
  border-radius: 50%;
  background: rgba(126, 236, 250, .18);
  box-shadow: -166px -104px 0 rgba(255,255,255,.055);
}
:is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) > .page-heading .eyebrow {
  color: #c7f5ff;
}
:is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) > .page-heading h1 {
  margin-top: 7px;
  color: #fff;
  letter-spacing: -.045em;
}
:is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) > .page-heading .page-subtitle {
  max-width: 58ch;
  color: #e5f5ff;
  font-size: 15px;
}
body[data-hub-theme] :is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) > .page-heading .primary-button {
  min-height: 50px;
  border-color: rgba(255,255,255,.75);
  background: #fff;
  color: #0759b6;
  box-shadow: 0 12px 28px rgba(1, 42, 99, .18);
}
body[data-hub-theme] #view-symptoms > .page-heading .secondary-button,
body[data-hub-theme] #view-medications > .page-heading .secondary-button {
  min-height: 50px;
  border-color: rgba(255,255,255,.5);
  background: rgba(255,255,255,.13);
  color: #fff;
  box-shadow: none;
}
#view-medications > .page-heading .medication-scan-button small { color: #d8f7ff; }

:is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) .panel-card,
#view-documents .document-drop,
#view-timeline .timeline-toolbar {
  border-color: #d3e5ef;
  border-radius: 24px;
  background: rgba(255,255,255,.97);
  box-shadow: 0 17px 42px rgba(8, 74, 126, .085);
}
:is(#view-medications, #view-appointments, #view-results) .card-heading h2,
#view-symptoms .card-heading h2 { letter-spacing: -.025em; }
:is(#view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) .empty-inline {
  border-color: #cfe2ee;
  border-radius: 16px;
  background: linear-gradient(135deg, #f8fcff, #f2f9fd);
}
#view-timeline .timeline-toolbar { padding: 14px; }
#view-timeline .filter-tabs button,
#view-documents .document-filters button { border-radius: 12px; }
#view-timeline .filter-tabs button.active,
#view-documents .document-filters button.active {
  border-color: #a9d3ec;
  background: #eaf7ff;
  color: #0759b6;
  box-shadow: 0 7px 18px rgba(8, 101, 223, .08);
}
#view-documents .document-drop { border-style: solid; }
#view-documents .drop-icon { background: #e8f7ff; color: #075ed9; }
#view-symptoms .symptom-summary-card { border-radius: 20px; box-shadow: 0 13px 30px rgba(8, 74, 126, .07); }
#view-symptoms .symptom-safety-banner { border-radius: 20px; }

@media (max-width: 620px) {
  :is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents).view { padding-top: 18px; }
  :is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) > .page-heading {
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 18px;
    margin-bottom: 16px;
    padding: 24px 20px 22px;
    border-radius: 24px;
  }
  :is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) > .page-heading h1 {
    font-size: clamp(36px, 10.5vw, 44px);
    line-height: 1.03;
  }
  :is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) > .page-heading .page-subtitle {
    max-width: 34ch;
    font-size: 14px;
  }
  :is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) > .page-heading > button,
  :is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) > .page-heading .page-heading-actions,
  :is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) > .page-heading .page-heading-actions > button {
    width: 100%;
  }
  #view-symptoms > .page-heading .page-heading-actions,
  #view-medications > .page-heading .page-heading-actions { gap: 9px; }
  :is(#view-symptoms, #view-medications, #view-appointments, #view-results, #view-timeline, #view-documents) .panel-card,
  #view-documents .document-drop,
  #view-timeline .timeline-toolbar { border-radius: 21px; }
}

/* The introduction sizes to its content at every viewport. Only an active
   conversation uses the bounded, independently scrolling history area. */
@media (min-width: 1024px) {
  .storage-consent { margin-left: var(--sidebar); flex-wrap: wrap; }
}
#view-ask .conversation-panel:not(.has-messages) {
  height: auto;
  min-height: 0;
  max-height: none;
}
#view-ask .conversation-panel:not(.has-messages) .conversation-scroll {
  flex: 0 0 auto;
  min-height: 0;
  max-height: none;
  overflow: clip;
  padding: 26px clamp(18px, 3vw, 36px) 30px;
  touch-action: pan-y;
}
#view-ask .conversation-panel:not(.has-messages) .chat-welcome {
  flex: 0 0 auto;
  max-width: 580px;
  margin: 0 auto;
  padding: 0;
}
#view-ask .conversation-panel:not(.has-messages) .chat-welcome-icon { display: none; }
#view-ask .conversation-panel:not(.has-messages) .chat-welcome h2 {
  font-size: clamp(26px, 3vw, 34px);
  line-height: 1.15;
}
#view-ask .conversation-panel:not(.has-messages) .chat-welcome p:last-child {
  max-width: 52ch;
  margin: 12px auto 0;
  font-size: 14px;
  line-height: 1.55;
}
#view-ask .chat-brief-link {
  flex: 0 0 auto;
  align-self: center;
  max-width: calc(100% - 28px);
  min-height: 44px;
  padding: 8px 12px;
  margin: 0 0 8px;
  border: 0;
  border-radius: 10px;
  background: #eff8ff;
  color: #0759b6;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  white-space: normal;
}
#view-ask .conversation-panel.has-messages .chat-brief-link { display: none; }
#view-ask .chat-composer .composer-context { min-width: 0; white-space: normal; }
@media (max-width: 620px) {
  body[data-hub-theme="ask"] #hub-shell #view-ask.view {
    padding-bottom: calc(112px + env(safe-area-inset-bottom));
  }
  #view-ask .chat-composer .composer-context { flex: 1; line-height: 1.4; }
  #view-ask .chat-composer #chat-send { flex-shrink: 0; }
}

/* A medication concern stays prominent until the user explicitly responds. */
.medication-alert-modal {
  width: min(92vw, 520px);
  max-height: min(86vh, 680px);
  margin: auto;
  padding: clamp(24px, 5vw, 38px);
  overflow: auto;
  border: 1px solid #f0c8a5;
  border-radius: 28px;
  background: linear-gradient(155deg, #fff 0%, #fffaf4 100%);
  color: #173550;
  box-shadow: 0 28px 80px rgba(7, 27, 54, .28);
}
.medication-alert-modal::backdrop { background: rgba(7, 27, 54, .7); backdrop-filter: blur(7px); }
.medication-alert-modal[open] { animation: medication-alert-in .22s ease-out both; }
.medication-alert-modal[data-severity="critical"] { border-color: #e6a7a2; background: linear-gradient(155deg, #fff 0%, #fff5f4 100%); }
.medication-alert-mark { display: grid; place-items: center; width: 58px; height: 58px; margin-bottom: 20px; border-radius: 20px; background: #c9842c; color: #fff; font-size: 30px; font-weight: 900; box-shadow: 0 12px 28px rgba(201,132,44,.28); }
.medication-alert-modal[data-severity="critical"] .medication-alert-mark { background: #c7443f; box-shadow: 0 12px 28px rgba(199,68,63,.28); }
.medication-alert-modal .eyebrow { margin: 0 0 8px; color: #9a5c1f; }
.medication-alert-modal[data-severity="critical"] .eyebrow { color: #a83834; }
.medication-alert-modal h2 { margin: 0; color: #102b47; font-size: clamp(26px, 6vw, 36px); line-height: 1.08; letter-spacing: -.035em; }
.medication-alert-modal > p:not(.eyebrow) { margin: 14px 0 0; font-size: 16px; line-height: 1.55; }
.medication-alert-source { margin-top: 18px; padding: 12px 14px; border-radius: 13px; background: rgba(201,132,44,.09); color: #7b5528; font-size: 13px; font-weight: 750; }
.medication-alert-modal[data-severity="critical"] .medication-alert-source { background: rgba(199,68,63,.08); color: #8b3936; }
.medication-alert-safety { padding-top: 17px; border-top: 1px solid rgba(139,104,66,.18); color: #526b7e; }
.medication-alert-safety strong { color: #173550; }
.medication-alert-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 24px; }
.medication-alert-actions button { min-height: 48px; }
@keyframes medication-alert-in { from { opacity: 0; transform: translateY(16px) scale(.98); } to { opacity: 1; transform: none; } }
@media (max-width: 520px) {
  .medication-alert-modal { width: calc(100vw - 28px); padding: 23px 19px; border-radius: 23px; }
  .medication-alert-actions { display: grid; grid-template-columns: 1fr; }
  .medication-alert-actions .primary-button { order: -1; }
}
@media (prefers-reduced-motion: reduce) { .medication-alert-modal[open] { animation: none; } }

/* Today is centred on the person: one check-in and six useful health actions. */
#view-today .hub-ask-prompt {
  border-color: rgba(255,255,255,.24);
  background:
    radial-gradient(circle at 88% 12%, rgba(68,221,225,.38), transparent 34%),
    linear-gradient(135deg, #075ed1 0%, #0a87d7 56%, #13aeb8 100%);
  color: #fff;
  box-shadow: 0 16px 34px rgba(5,93,181,.24), inset 0 1px 0 rgba(255,255,255,.26);
  text-align: left;
}
#view-today .hub-ask-prompt:hover { border-color: rgba(255,255,255,.52); box-shadow: 0 20px 40px rgba(5,93,181,.3); }
#view-today .hub-ask-prompt:focus-visible { outline: 3px solid #0b426f; outline-offset: 3px; }
#view-today .hub-ask-prompt-icon { display: grid; place-items: center; flex: 0 0 auto; padding: 10px; background: rgba(255,255,255,.94); color: #0874db; }
#view-today .hub-ask-prompt-copy { min-width: 0; display: grid; gap: 5px; flex: 1; }
#view-today .hub-ask-prompt-copy b { color: #fff; font-size: clamp(17px, 2vw, 21px); letter-spacing: -.025em; }
#view-today .hub-ask-prompt-copy small { display: block; margin: 0; color: rgba(255,255,255,.9); font-size: 13px; }
#view-today .hub-ask-prompt-arrow { display: grid; place-items: center; flex: 0 0 auto; background: rgba(255,255,255,.96); color: #0869d1; box-shadow: 0 9px 20px rgba(0,45,111,.2); }

.quick-modal.today-plan-modal { width: min(620px, calc(100% - 28px)); overflow: auto; }
.today-plan-form { display: grid; gap: 18px; padding: 20px 23px 23px; }
.today-plan-lead { margin: 0; color: #506b80; font-size: 14px; line-height: 1.6; }
.today-plan-fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.today-plan-fieldset legend { margin-bottom: 10px; color: #173550; font-size: 14px; font-weight: 800; }
.today-plan-fieldset > p { margin: -3px 0 11px; color: #60798b; font-size: 12px; line-height: 1.5; }
.today-plan-fieldset select { width: 100%; min-height: 46px; padding: 9px 12px; border: 1px solid #c9dde8; border-radius: 11px; background: #fff; color: #173550; font: inherit; font-size: 14px; }
.today-plan-fieldset select:focus-visible { outline: 3px solid rgba(17,142,218,.22); border-color: #148cd7; }
.today-plan-options { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; }
.today-plan-options label { position: relative; min-width: 0; }
.today-plan-options input { position: absolute; opacity: 0; pointer-events: none; }
.today-plan-options span { min-height: 44px; display: grid; place-items: center; padding: 8px 5px; border: 1px solid #d6e5ed; border-radius: 11px; background: #f9fcfe; color: #466378; font-size: 12px; font-weight: 750; text-align: center; }
.today-plan-options input:checked + span { border-color: #5bb8e5; background: #e9f8ff; color: #075da8; box-shadow: inset 0 0 0 1px rgba(54,164,219,.16); }
.today-plan-options input:focus-visible + span { outline: 3px solid rgba(17,142,218,.25); outline-offset: 2px; }
.today-plan-sources { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.today-plan-source { min-width: 0; display: flex; align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid #dae8ef; border-radius: 12px; background: #fbfdff; }
.today-plan-source input { width: 18px; height: 18px; flex: 0 0 auto; accent-color: #087bd9; }
.today-plan-source span { min-width: 0; }
.today-plan-source b, .today-plan-source small { display: block; }
.today-plan-source b { color: #173550; font-size: 12px; }
.today-plan-source small { margin-top: 3px; color: #61798b; font-size: 10px; }
.today-plan-source.unavailable { opacity: .58; }
.today-plan-confirm { display: flex; align-items: flex-start; gap: 10px; color: #49667b; font-size: 12px; line-height: 1.5; }
.today-plan-confirm input { width: 18px; height: 18px; margin-top: 1px; flex: 0 0 auto; accent-color: #087bd9; }
.today-plan-warning { padding: 12px 14px; border: 1px solid #efcfbf; border-radius: 12px; background: #fff8f4; color: #7c554b; font-size: 12px; line-height: 1.5; }
.today-plan-warning b { color: #7f3f35; }

.today-dashboard { display: grid; gap: 14px; padding: 18px 20px 22px; }
.today-dashboard-summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 19px 20px; overflow: hidden; border-radius: 18px; background: linear-gradient(125deg, #075ed9, #0789b8); color: #fff; box-shadow: 0 14px 30px rgba(7,94,217,.17); }
.today-dashboard-summary p, .today-dashboard-heading p { margin: 0 0 4px; color: #477086; font-size: 10px; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; }
.today-dashboard-summary p { color: #c9f4ff; }
.today-dashboard-summary h3 { margin: 0; color: #fff; font-size: 21px; letter-spacing: -.035em; }
.today-dashboard-summary > div > span { display: block; margin-top: 6px; color: #e5f7ff; font-size: 12px; line-height: 1.45; }
.today-dashboard-summary-mark { width: 46px; height: 46px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid rgba(255,255,255,.65); border-radius: 15px; background: rgba(255,255,255,.14); font-size: 22px; font-weight: 900; }
.today-dashboard-section { min-width: 0; padding: 16px; border: 1px solid #d9e8f1; border-radius: 16px; background: #fbfdff; }
.today-dashboard-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.today-dashboard-heading h3 { margin: 0; color: #102e49; font-size: 17px; letter-spacing: -.025em; }
.today-dashboard-heading > span { padding: 5px 8px; border-radius: 999px; background: #e9f8f3; color: #17805f; font-size: 10px; font-weight: 800; }
.today-dashboard-heading button { min-height: 34px; padding: 0 9px; border: 1px solid #cfe1eb; border-radius: 9px; background: #fff; color: #13639c; font: inherit; font-size: 10px; font-weight: 800; cursor: pointer; }
.today-dashboard-heading button:hover { border-color: #8bc8e5; background: #effaff; }
.today-dashboard-heading button:focus-visible { outline: 3px solid rgba(20,140,215,.24); outline-offset: 2px; }
.today-dashboard-plan { border-color: #bfe0ee; background: linear-gradient(145deg, #f7fcff, #f1faff); }
.today-dashboard-plan ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin: 0; padding: 0; list-style: none; }
.today-dashboard-step { min-width: 0; display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: start; gap: 10px; padding: 11px; border: 1px solid #deebf2; border-radius: 12px; background: #fff; }
.today-dashboard-step > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; background: #e8f7ff; color: #076ec7; font-size: 12px; font-weight: 900; }
.today-dashboard-step.symptoms > span { background: #fff0ed; color: #b85b50; }
.today-dashboard-step.appointment > span { background: #f1ecff; color: #7054b2; }
.today-dashboard-step.tasks > span { background: #fff8df; color: #9a7110; }
.today-dashboard-step.wellbeing > span { background: #e9f8f3; color: #158163; }
.today-dashboard-step b { display: block; color: #173550; font-size: 12px; line-height: 1.35; }
.today-dashboard-step p { margin: 4px 0 0; color: #587286; font-size: 10px; line-height: 1.5; }
.today-dashboard-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.today-dashboard-list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.today-dashboard-list li { min-width: 0; display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 9px; padding-bottom: 8px; border-bottom: 1px solid #e6eff5; }
.today-dashboard-list li:last-child { padding-bottom: 0; border-bottom: 0; }
.today-dashboard-list-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; background: #e8f7ff; color: #0877c9; font-size: 15px; font-weight: 900; }
.today-dashboard-list-icon.symptom { background: #fff0ed; color: #b85b50; }
.today-dashboard-list b, .today-dashboard-list small, .today-dashboard-list em { display: block; min-width: 0; overflow-wrap: anywhere; }
.today-dashboard-list b { color: #173550; font-size: 12px; }
.today-dashboard-list small { margin-top: 3px; color: #5d7688; font-size: 10px; line-height: 1.45; }
.today-dashboard-list em { margin-top: 4px; color: #168060; font-size: 9px; font-style: normal; font-weight: 800; }
.today-dashboard-facts { display: grid; gap: 8px; margin: 0; }
.today-dashboard-facts > div { display: grid; grid-template-columns: 95px minmax(0, 1fr); gap: 9px; padding-bottom: 7px; border-bottom: 1px solid #e6eff5; }
.today-dashboard-facts > div:last-child { padding-bottom: 0; border-bottom: 0; }
.today-dashboard-facts dt { color: #62798b; font-size: 10px; font-weight: 750; }
.today-dashboard-facts dd { min-width: 0; margin: 0; color: #173550; font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; }
.today-dashboard-empty p, .today-dashboard-no-appointment { margin: 0; color: #60788a; font-size: 11px; line-height: 1.5; }
.today-dashboard-empty .secondary-button { min-height: 36px; margin-top: 9px; padding-inline: 11px; font-size: 10px; }
.today-dashboard-appointment { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 10px; }
.today-dashboard-appointment > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: #f1ecff; color: #7054b2; font-size: 17px; }
.today-dashboard-appointment b, .today-dashboard-appointment small { display: block; }
.today-dashboard-appointment b { color: #173550; font-size: 12px; }
.today-dashboard-appointment small { margin-top: 4px; color: #5c7487; font-size: 10px; line-height: 1.45; }
.today-dashboard-safety { margin: 0; padding: 12px 13px; border: 1px solid #ead8c9; border-radius: 12px; background: #fffaf5; color: #725f53; font-size: 10px; line-height: 1.55; }
.today-dashboard-safety strong { color: #75463b; }
.today-medication-guidance { border-color: #cfe8e1; background: linear-gradient(145deg, #f9fffd, #f2fbf8); }
.today-medication-guidance .today-dashboard-heading > span { background: #fff4dc; color: #8a650f; }
.today-medication-guidance-list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.today-medication-guidance-list li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 10px; padding: 11px; border: 1px solid #dceee9; border-radius: 12px; background: #fff; }
.today-medication-guidance-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; background: #e6f8f1; color: #168060; font-size: 14px; font-weight: 900; }
.today-medication-guidance-list b { display: block; color: #173550; font-size: 12px; }
.today-medication-guidance-list p { margin: 4px 0 0; color: #456478; font-size: 10px; line-height: 1.5; }
.today-medication-guidance-list small { display: block; margin-top: 7px; color: #6b7f8c; font-size: 9px; line-height: 1.5; }
.today-medication-guidance-note { margin: 10px 0 0; padding: 10px 11px; border-radius: 10px; background: #eaf7fb; color: #496879; font-size: 9px; line-height: 1.55; }
.today-medication-guidance-note strong { color: #145f80; }
.today-medication-empty { padding: 12px; border: 1px dashed #cfe1e8; border-radius: 11px; color: #60788a; font-size: 10px; line-height: 1.5; background: #fff; }
.today-verified-guidance { border-color: #cce5f2; background: linear-gradient(145deg, #fbfeff, #f3faff); }
.today-verified-guidance .today-dashboard-heading > span { background: #e5f8f1; color: #157559; }
.today-verified-grid { display: grid; gap: 10px; }
.today-verified-card { padding: 13px 14px; border: 1px solid #d9e8f1; border-radius: 13px; background: #fff; }
.today-verified-card > div b, .today-verified-card > div small { display: block; }
.today-verified-card > div b { color: #123551; font-size: 13px; }
.today-verified-card > div small { margin-top: 3px; color: #60788a; font-size: 10px; line-height: 1.45; }
.today-verified-card ul { display: grid; gap: 7px; margin: 10px 0 0; padding-left: 18px; color: #466478; }
.today-verified-card li { padding-left: 2px; font-size: 10px; line-height: 1.55; }
.today-verified-card a { display: inline-flex; gap: 5px; margin-top: 10px; color: #096ba9; font-size: 10px; font-weight: 800; text-decoration: none; }
.today-verified-card a:hover { text-decoration: underline; }
.today-verified-card.symptom { border-color: #f0d9d2; background: #fffaf8; }
.today-verified-card.urgent { border-color: #efc4bf; background: #fff4f2; }
.today-verified-card.urgent b { color: #8b302b; }
.today-ai-briefing { border-color: #bcdcec; background: linear-gradient(145deg, #f7fcff, #eef9fe); }
.today-ai-briefing .today-dashboard-heading > span { background: #e9efff; color: #385fb0; }
.today-ai-output { min-height: 86px; padding: 13px 14px; border: 1px solid #d6e9f2; border-radius: 13px; background: #fff; color: #35576e; font-size: 11px; line-height: 1.65; white-space: pre-line; overflow-wrap: anywhere; }
.today-ai-output.loading { display: flex; align-items: center; gap: 12px; }
.today-ai-output.loading p { margin: 0; }
.today-ai-output.error { border-color: #efcdc7; background: #fff8f6; color: #81534c; }
.today-ai-output .secondary-button { margin-top: 10px; }

@media (max-width: 520px) {
  #view-today .hub-ask-prompt-copy small { display: block; font-size: 11px; line-height: 1.35; }
  #view-today .hub-ask-prompt-copy b { font-size: 15px; }
  #view-today .hub-ask-prompt { min-height: 76px; }
  .quick-modal.today-plan-modal { max-height: calc(100svh - 24px); }
  .today-plan-form { gap: 16px; padding: 17px 17px 20px; }
  .today-plan-options { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .today-plan-sources { grid-template-columns: 1fr; }
  .today-plan-form .modal-actions { display: grid; grid-template-columns: 1fr; }
  .today-plan-form .modal-actions .primary-button { order: -1; min-height: 48px; }
  .today-dashboard { gap: 11px; padding: 14px 14px 18px; }
  .today-dashboard-summary { padding: 16px; border-radius: 16px; }
  .today-dashboard-summary h3 { font-size: 18px; }
  .today-dashboard-summary-mark { width: 40px; height: 40px; border-radius: 13px; }
  .today-dashboard-plan ol, .today-dashboard-grid { grid-template-columns: 1fr; }
  .today-dashboard-section { padding: 14px; border-radius: 14px; }
  .today-dashboard .modal-actions { display: grid; grid-template-columns: 1fr; }
  .today-dashboard .modal-actions .primary-button { order: -1; min-height: 48px; }
}

/* Medication database matching and review */
.clash-actions { display:flex; flex-wrap:wrap; gap:8px; margin:13px 0 10px; }
.clash-consent { display:flex; align-items:flex-start; gap:8px; padding:10px; border:1px solid #d9e8ef; border-radius:9px; background:#f7fbfd; color:var(--muted); font-size:10px; line-height:1.6; }
.clash-consent input, .safety-consent-field input, .safety-review-fieldset input { width:auto; flex:0 0 auto; margin-top:2px; }
.nzf-product-search { gap:7px; }
.nzf-product-search > label:first-child { color:var(--navy); font-size:9px; font-weight:800; }
.nzf-product-search > input { width:100%; min-height:40px; padding:9px 11px; border:1px solid #cfdee6; border-radius:9px; background:#fff; color:var(--navy); font:inherit; font-size:10px; }
.nzf-product-search > small { color:var(--muted); font-size:8px; line-height:1.5; }
.nzf-search-consent, .nzf-product-confirm { display:flex; align-items:flex-start; gap:8px; color:var(--muted); font-size:8px; line-height:1.5; }
.nzf-search-consent input, .nzf-product-confirm input { width:auto; flex:0 0 auto; margin:2px 0 0; }
.nzf-product-confirm { display:none; }
.nzf-product-confirm.is-visible { display:flex; }
.nzf-product-search-actions { display:grid; gap:5px; }
.nzf-product-search-actions > button { min-height:38px; }
.medication-match-choice.nzf-product-choice { min-height:44px; white-space:normal; line-height:1.45; }
.medication-db-result { display:grid; gap:9px; margin-top:11px; }
.medication-db-summary { margin:0; padding:10px 11px; border:1px solid #c4dce9; border-radius:9px; background:#f0f7fb; color:#24516f; font-size:9px; line-height:1.5; }
.medication-db-summary.is-incomplete, .medication-db-incomplete-note { border-color:#f0d3a9; background:#fff8ed; color:#875722; }
.medication-db-result > small { color:var(--muted-light); font-size:7px; }
.medication-db-group { display:grid; gap:7px; padding-top:9px; border-top:1px solid var(--line-soft); }
.medication-db-group h3 { margin:0; font-size:10px; }
.medication-db-group > p { margin:0; color:var(--muted); font-size:8px; line-height:1.5; }
.safety-result-alert { padding:9px 10px; border:1px solid #dce8ed; border-radius:8px; background:#fff; }
.safety-result-alert b { display:block; color:var(--navy); font-size:8px; line-height:1.45; }
.safety-result-alert p { margin:4px 0 0; color:var(--muted); font-size:8px; line-height:1.5; }
.safety-result-alert small { display:block; margin-top:5px; color:var(--muted-light); font-size:7px; line-height:1.45; }
.safety-result-alert ul { display:grid; gap:4px; margin:6px 0 0; padding-left:15px; color:var(--muted); font-size:7px; line-height:1.45; }
.medication-db-incomplete-note { margin:0; padding:9px 10px; border:1px solid; border-radius:8px; font-size:8px; line-height:1.5; }
.medication-match-results { display:grid; gap:8px; margin-top:8px; }
.medication-match-group { display:grid; gap:6px; padding:9px; border:1px solid #dce8ed; border-radius:9px; background:#f8fbfc; }
.medication-match-group > b { font-size:8px; }
.medication-match-group > p { margin:0; color:var(--muted); font-size:8px; line-height:1.45; }
.medication-match-choice { min-height:34px; padding:7px 9px; border:1px solid #cfe0e8; border-radius:7px; background:#fff; color:var(--blue-strong); font-size:8px; text-align:left; }
.medication-match-choice:hover, .medication-match-choice.is-selected { border-color:var(--blue); background:var(--sky); }
.safety-review-fieldset { display:grid; gap:9px; margin:0; padding:11px; border:1px solid #dce8ed; border-radius:9px; }
.safety-review-fieldset legend { padding:0 4px; color:var(--navy); font-size:9px; font-weight:700; }
.safety-review-fieldset label, .safety-consent-field { display:flex; align-items:flex-start; gap:8px; color:var(--muted); font-size:8px; line-height:1.5; }
.safety-mapping-list { display:grid; gap:5px; margin-top:9px; }
.safety-mapping-list h3 { margin:0; font-size:8px; }
.safety-mapping-list > p { margin:0; color:var(--muted-light); font-size:7px; }
.safety-mapping-row { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:7px 8px; border:1px solid #e0ebf0; border-radius:7px; background:#f8fbfc; color:var(--navy); font-size:8px; }
.safety-mapping-row button { border:0; background:transparent; color:var(--blue-strong); font-size:7px; font-weight:700; }
.safety-profile-reference { grid-column: 1 / -1; padding: 10px 12px; border: 1px solid #d9e8ef; border-radius: 12px; background: #f7fbfd; color: var(--muted); font-size: 12px; }
.safety-profile-reference b { display:block; margin-bottom:6px; color:var(--ink); }
.safety-profile-reference p { margin:4px 0; overflow-wrap:anywhere; }

.safety-result-references { margin-top: 8px; color: var(--muted); font-size: 12px; }
.safety-result-references summary { color: var(--blue, #0b76c5); cursor: pointer; font-weight: 650; text-decoration: underline; text-underline-offset: 2px; }
.safety-result-references ul { display: grid; gap: 5px; margin: 6px 0 0; padding-left: 18px; }
.safety-result-references a { color: var(--blue, #0b76c5); overflow-wrap: anywhere; }