/* Android browse screens (android.js): the Android wireframes' Home, Patients, Schedule, patient record, New patient, Settings,
   Account and Privacy & storage. Material 3 structure in DocVoc colours (tokens.css only, so dark mode follows), phones only
   (≤760px) with html.android. iOS and the wide layouts never see any of it.
   Owner, 16 Sept 2026: nothing scrolls. Each screen is a paged pane (paging.js) whose Android chrome is pinned — the filter
   chips, the Next up card, the search pill, the date strip, a patient's bar, header and tabs, the bottom actions — while the
   rows turn under a Material pager bar, with "21–40 of 63 · page 2 of 4" under it. The sheets and the New patient dialog page
   their own bodies the same way. */
#ad-fab,#ad-select-bar,#ad-today,.ad-search-avatar{display:none}
.ad-icon{width:24px;height:24px;fill:currentColor;flex-shrink:0}
@media(max-width:760px){
:root.android{--ad-tonal:var(--accent-surface);--ad-on-tonal:var(--accent-strong);--ad-surface:color-mix(in srgb,var(--accent) 5%,var(--app-bg));--ad-field:color-mix(in srgb,var(--accent) 7%,var(--app-bg));--ad-outline:color-mix(in srgb,var(--ink) 22%,transparent)}
:root.android[data-theme=dark]{--ad-surface:color-mix(in srgb,var(--accent) 9%,var(--app-bg));--ad-field:color-mix(in srgb,var(--accent) 12%,var(--app-bg));--ad-outline:color-mix(in srgb,var(--ink) 28%,transparent)}
/* ---- Shared parts: icon buttons, filled and outlined buttons, chips, 64px rows, the Material switch ---- */
:root.android .ad-icon-button{display:inline-grid;place-items:center;width:48px;height:48px;min-height:48px;padding:0;border:0;border-radius:50%;background:transparent;color:inherit;flex-shrink:0;text-decoration:none}
:root.android .ad-icon-button:hover{background:color-mix(in srgb,currentColor 8%,transparent)}
:root.android .ad-filled{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border:0;border-radius:24px;background:var(--accent);color:var(--on-accent);font-size:15px;font-weight:600;text-decoration:none}
:root.android .ad-filled:hover{background:var(--accent-hover)}
:root.android .ad-outlined{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border:1px solid var(--ad-outline);border-radius:24px;background:transparent;color:var(--ink);font-size:15px;font-weight:500;text-decoration:none}
:root.android .ad-outlined:hover{background:var(--accent-tint)}
:root.android .ad-outlined.danger{background:var(--danger-bg);border-color:var(--danger-border);color:var(--danger)}
:root.android .ad-outlined:disabled{opacity:.5}
:root.android .ad-chips,:root.android #home-page .filter-chips{display:flex;gap:8px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;flex-shrink:0;padding-block:8px;margin-block:-8px}
:root.android .ad-chip{position:relative;flex:0 0 auto;height:32px;min-height:32px;padding:0 16px;border:1px solid var(--ad-outline);border-radius:8px;background:transparent;color:var(--secondary);font-size:14px;font-weight:500;box-shadow:none}
:root.android .ad-chip::after{content:'';position:absolute;inset:-9px -4px}
:root.android .ad-chip.on{background:var(--accent);border-color:var(--accent);color:var(--on-accent);font-weight:600}
:root.android #home-page .filter-chips .ad-chip{min-height:32px}
:root.android #home-page .ad-chip.on{background:var(--ad-tonal);border-color:var(--ad-tonal);color:var(--ad-on-tonal)}
:root.android .ad-list{display:flex;flex-direction:column;margin:0 -16px;flex-shrink:0}
:root.android .ad-row{min-height:64px;padding:8px 16px;gap:16px;background:transparent;border-radius:0;transition:background var(--motion-fast) var(--ease)}
:root.android .ad-row:hover{background:var(--row-highlight)}
:root.android .ad-row::before{display:none}
:root.android .ad-avatar{width:40px;height:40px;flex:0 0 40px;border-radius:50%;display:grid;place-items:center;background:var(--accent-tint);color:var(--accent-strong);font-size:14px;font-weight:600;letter-spacing:.02em}
:root.android .ad-avatar.ad-large{width:56px;height:56px;flex-basis:56px;background:var(--accent);color:var(--on-accent);font-size:20px}
:root.android .ad-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
:root.android .ad-copy strong{font-size:16px;font-weight:500;line-height:1.4;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root.android .ad-copy small{font-size:14px;line-height:1.4;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root.android .ad-trail{flex-shrink:0;font-size:12px;color:var(--hint);font-variant-numeric:tabular-nums}
:root.android .ad-list .empty-state,:root.android .ad-panel .empty-state{margin:40px auto 0;padding:24px;gap:10px}
:root.android .ad-list .empty-state h2,:root.android .ad-panel .empty-state h2{font-size:20px;font-weight:600}
:root.android .ad-list .empty-state p,:root.android .ad-panel .empty-state p{font-size:15px;line-height:1.5;max-width:300px}
:root.android .ad-list .empty-state button{min-height:48px;margin-top:10px;padding:0 24px;border:0;border-radius:24px;background:var(--ad-tonal);color:var(--ad-on-tonal);font-size:14px;font-weight:600}
:root.android #dashboard-page .ad-list .empty-state .empty-mark{display:grid;place-items:center;width:64px;height:64px;margin-bottom:8px;border-radius:18px;border:0;background:var(--ad-tonal);color:var(--ad-on-tonal)}
:root.android #dashboard-page .ad-list .empty-state .empty-mark .ad-icon{width:32px;height:32px}
/* The count line used to be dropped on these screens (the wireframes have none). It is the paging readout now — "21–40 of 63
   patients · page 2 of 4" under the pager bar (owner, 16 Sept 2026) — so it stays, and only an empty one is hidden. */
:root.android .ph-end:empty{display:none}
/* The Material switch: an outlined track with a small thumb when off, a filled track with a large thumb when on. */
:root.android .ad-switch{position:relative;flex:0 0 52px;width:52px;height:32px;border-radius:16px;border:2px solid var(--hint);background:var(--ad-field);box-sizing:border-box;transition:background var(--motion-fast) var(--ease),border-color var(--motion-fast) var(--ease)}
:root.android .ad-switch::after{content:'';position:absolute;top:50%;left:6px;width:16px;height:16px;border-radius:50%;background:var(--hint);transform:translateY(-50%);transition:left var(--motion-fast) var(--ease),width var(--motion-fast) var(--ease),height var(--motion-fast) var(--ease)}
:root.android [aria-checked=true]>.ad-switch{background:var(--accent);border-color:var(--accent)}
:root.android [aria-checked=true]>.ad-switch::after{left:22px;width:24px;height:24px;background:var(--on-accent)}

/* ---- Top app bars: Home and Schedule keep the shared header, bare; the other screens draw their own ---- */
:root.android .workspace-header.ad-hidden{display:none}
:root.android .workspace-header:is([data-ad-view=home],[data-ad-view=schedule]){background:var(--app-bg);border-bottom:0;grid-template-rows:64px auto}
:root.android .workspace-header[data-ad-view=home] #phone-title{font-size:22px;font-weight:700;letter-spacing:-.01em}
:root.android .workspace-header[data-ad-view=home] #phone-more,:root.android .workspace-header[data-ad-view=schedule] #account-mobile,:root.android .workspace-header[data-ad-view=schedule] #phone-menu{display:none!important}
:root.android .workspace-header[data-ad-view=home] #account-mobile{width:40px;height:40px;font-size:14px;margin:0 8px 0 4px}
:root.android .workspace-header[data-ad-view=home] #account-mobile::after{inset:-4px}
:root.android .workspace-header[data-ad-view=schedule] #phone-title{font-size:22px;font-weight:600;padding-left:16px}
:root.android .workspace-header[data-ad-view=schedule] #ad-today{display:inline-grid;place-items:center;width:48px;height:48px;color:var(--ink)}
:root.android .ad-bar{position:sticky;top:0;z-index:6;display:flex;align-items:center;gap:0;min-height:calc(64px + var(--safe-top));padding:var(--safe-top) 4px 0;margin:0;background:var(--ad-tonal);color:var(--ink);flex-shrink:0}
:root.android .ad-bar h1{flex:1;min-width:0;margin:0 0 0 4px;font-size:22px;font-weight:600;line-height:1.3;letter-spacing:0;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root.android .ad-bar.ad-plain{background:var(--app-bg)}
:root.android .ad-bar .ad-bar-text{min-height:48px;padding:0 20px;margin-right:4px}
/* Sub-screens (a patient, Settings, Account, Privacy & storage) leave the bottom navigation out, as the wireframes do. */
:root.android.ad-subscreen{--tabbar:var(--safe-bottom)}
:root.android.ad-subscreen #phone-tabs{display:none}
:root.android #phone-tabs{background:var(--ad-surface);border-top:0}
:root.android #phone-tabs button.active .icon{background:var(--ad-tonal);color:var(--ad-on-tonal)}

/* ---- The extended FAB above the bottom nav: Record, Record 10:30, New patient ---- */
:root.android #ad-fab:not([hidden]){display:inline-flex;position:fixed;right:16px;bottom:calc(var(--tabbar) + 16px);z-index:11;align-items:center;gap:12px;height:56px;min-height:56px;padding:0 20px 0 16px;border:0;border-radius:16px;background:var(--accent);color:var(--on-accent);font-size:16px;font-weight:600;box-shadow:0 4px 10px color-mix(in srgb,#000 22%,transparent),0 1px 3px color-mix(in srgb,#000 16%,transparent);transition:padding var(--motion-fast) var(--ease),transform var(--motion-fast) var(--ease)}
:root.android #ad-fab:hover{background:var(--accent-hover)}
:root.android #ad-fab:active{transform:scale(.97)}
:root.android #ad-fab.small{padding:0 16px;gap:0}
:root.android #ad-fab.small .ad-fab-label{display:none}
:root.android body.recording #ad-fab,:root.android.ad-selecting #ad-fab{display:none}

/* ---- 01 Home: chips, Next up, the queue ---- */
:root.android #dashboard-page{padding:12px 16px calc(96px + 16px);gap:16px}
:root.android .ad-next{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;min-height:0;padding:18px 20px;border:0;border-radius:20px;background:var(--ad-tonal);color:var(--ad-on-tonal);text-align:left;font-weight:400;flex-shrink:0}
:root.android .ad-next:hover{background:color-mix(in srgb,var(--ad-tonal) 88%,var(--accent))}
:root.android .ad-eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ad-on-tonal)}
:root.android .ad-next strong{font-size:20px;font-weight:600;color:var(--ink);line-height:1.3}
:root.android .ad-next-line{font-size:15px;color:var(--secondary)}

/* ---- 05 Patients: the search pill with the avatar inside, sort chips, the list, the contextual app bar ---- */
:root.android #home-page{padding:0 16px calc(96px + 16px);gap:12px}
:root.android #home-page .page-heading{position:sticky;top:0;z-index:5;margin:0 -16px;padding:calc(var(--safe-top) + 12px) 16px 4px;background:var(--app-bg)}
:root.android.ad-selecting #home-page .page-heading{padding-top:calc(var(--safe-top) + 64px + 12px)}
:root.android #home-page .search-field{height:56px;border-radius:28px;background:var(--ad-field)}
:root.android #home-page #patient-search{height:56px;border:0;border-radius:28px;padding:0 100px 0 56px;background:transparent;font-size:16px;color:var(--ink);box-shadow:none}
:root.android #home-page .search-field>.search-icon{left:18px;width:24px;height:24px;color:var(--muted)}
:root.android #home-page .search-clear:not([hidden]){right:52px}
:root.android .ad-search-avatar{display:grid;place-items:center;position:absolute;right:8px;width:40px;height:40px;min-height:0;padding:0;border:0;border-radius:50%;background:var(--accent-surface);color:var(--accent-strong);font-size:14px;font-weight:600}
:root.android .ad-search-avatar::after{content:'';position:absolute;inset:-4px}
:root.android #home-page .patient-filters{gap:0}
:root.android #home-page .date-filter,:root.android #home-page #clear-filters{display:none!important}
:root.android #home-records{background:transparent;border:0;border-radius:0;gap:0;margin:0 -16px;overflow:visible}
:root.android #home-records .ad-row{border:0}
:root.android .ad-row.selected{background:var(--ad-tonal)}
:root.android .ad-row.selected .ad-avatar{background:var(--accent);color:var(--on-accent)}
:root.android .ad-row.selected .ad-avatar .ad-icon{width:22px;height:22px}
:root.android #ad-select-bar:not([hidden]){display:flex;position:fixed;top:0;left:0;right:0;z-index:12;align-items:center;gap:0;height:calc(64px + var(--safe-top));padding:var(--safe-top) 4px 0;background:var(--accent);color:var(--on-accent);animation:ad-in var(--motion-fast) var(--ease)}
:root.android #ad-select-bar h2{flex:1;min-width:0;margin:0 0 0 8px;font-size:22px;font-weight:600;color:inherit;letter-spacing:0}
@keyframes ad-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* ---- 09 Schedule: the date strip and the time gutter ---- */
:root.android #schedule-page{padding:0 16px calc(96px + 16px);gap:4px}
:root.android .ad-strip{display:grid;grid-template-columns:repeat(7,1fr);margin:0 -8px;padding:0 0 8px;touch-action:pan-y;flex-shrink:0}
:root.android .ad-day{display:flex;flex-direction:column;align-items:center;gap:4px;min-height:72px;padding:4px 0;border:0;border-radius:12px;background:transparent;color:var(--muted);font-size:13px;font-weight:500}
:root.android .ad-day:hover{background:transparent}
:root.android .ad-day strong{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;font-size:17px;font-weight:600;color:var(--ink);transition:background var(--motion-fast) var(--ease)}
:root.android .ad-day.busy strong{text-decoration:underline 2px color-mix(in srgb,var(--accent) 45%,transparent);text-underline-offset:6px}
:root.android .ad-day.today:not(.on) strong{color:var(--accent-text);box-shadow:inset 0 0 0 1px var(--accent)}
:root.android .ad-day.on strong{background:var(--accent);color:var(--on-accent);text-decoration:none}
:root.android .ad-slot{align-items:flex-start;gap:0;padding:12px 16px}
/* The time gutter keeps a time on one line: "09:45" or "09:45 AM" (the locale's clock), all rows the same width in the mono face. */
:root.android .ad-time{flex:0 0 auto;min-width:60px;padding:2px 12px 0 0;font-family:var(--font-mono);font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
:root.android .ad-dot{flex:0 0 10px;width:10px;height:10px;margin:8px 18px 0 0;border-radius:50%;background:var(--disabled)}
:root.android .ad-dot.signed{background:var(--hint)}
:root.android .ad-dot.review{background:var(--review-dot)}
:root.android .ad-dot.recording{background:var(--recording-dot)}
:root.android .ad-dot.now{background:var(--accent)}
:root.android .ad-dot.past{background:var(--input-border)}
:root.android .ad-slot.now{background:var(--ad-tonal)}
:root.android .ad-slot.now strong{font-weight:700}

/* ---- 10 and 22 The patient record: the tonal header, the bar, the tabs, About (the panel under them pages) ---- */
:root.android #patient-page.ad-record{padding:0 0 32px;gap:0}
/* Nothing scrolls (owner, 16 Sept 2026), so there is no scroll for the title to fade in on: the patient's name is in the bar
   from the first page, over the tonal header it repeats. */
:root.android .ad-record .ad-bar h1{opacity:1}
:root.android .ad-record.ad-about .ad-bar{background:var(--app-bg)}
:root.android .ad-record.ad-about .ad-head{display:none}
:root.android .ad-head{display:flex;flex-direction:column;gap:20px;padding:4px 16px 22px;background:var(--ad-tonal);flex-shrink:0}
:root.android .ad-who{display:flex;align-items:center;gap:20px;min-width:0}
:root.android .ad-who>div{min-width:0}
:root.android .ad-head h2{margin:0;font-size:28px;font-weight:600;line-height:1.2;letter-spacing:-.01em;color:var(--ink);overflow-wrap:anywhere}
:root.android .ad-head p{margin:4px 0 0;font-size:15px;line-height:1.4;color:var(--secondary)}
:root.android .ad-actions{display:flex;flex-wrap:wrap;gap:10px}
:root.android .ad-head .ad-outlined{border-color:color-mix(in srgb,var(--accent) 40%,transparent);color:var(--ad-on-tonal)}
:root.android .ad-tabs{position:sticky;top:calc(64px + var(--safe-top));z-index:5;display:grid;grid-template-columns:repeat(3,1fr);background:var(--app-bg);border-bottom:1px solid var(--border);flex-shrink:0}
:root.android .ad-tab{height:48px;min-height:48px;padding:0 8px;border:0;border-radius:0;background:transparent;color:var(--muted);font-size:16px;font-weight:500;position:relative}
:root.android .ad-tab:hover{background:var(--row-highlight)}
:root.android .ad-tab[aria-selected=true]{color:var(--accent-text);font-weight:600}
:root.android .ad-tab[aria-selected=true]::after{content:'';position:absolute;left:8px;right:8px;bottom:-1px;height:3px;border-radius:3px 3px 0 0;background:var(--accent)}
:root.android .ad-panel{display:flex;flex-direction:column;padding:0 16px}
:root.android .ad-panel .ad-list{margin:0 -16px}
:root.android .ad-visit{min-height:72px;padding:12px 16px}
:root.android .ad-status{flex-shrink:0;padding:5px 12px;border-radius:8px;font-size:13px;font-weight:600;background:var(--recording-bg);color:var(--recording-text)}
:root.android .ad-status.review{background:var(--review-bg);color:var(--review-text)}
:root.android .ad-status.signed{background:var(--signed-bg);color:var(--signed-text)}
:root.android .ad-panel .ad-doc{margin:0 -16px}
:root.android .ad-allergy{display:flex;align-items:center;gap:12px;margin:20px 0 0;padding:14px 18px;border:1px solid var(--danger-border);border-radius:20px;background:var(--danger-bg);color:var(--danger);font-size:16px;line-height:1.4}
:root.android .ad-allergy::before{content:'';flex:0 0 10px;width:10px;height:10px;border-radius:50%;background:var(--danger-fill)}
:root.android .ad-about-list{display:flex;flex-direction:column;gap:22px;margin:0;padding:22px 0 96px}
:root.android .ad-fact dt{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--hint)}
:root.android .ad-fact dd{margin:6px 0 0;font-size:17px;line-height:1.45;color:var(--ink);overflow-wrap:anywhere}
:root.android .ad-fact dd.none{color:var(--hint)}
:root.android .ad-bottom{position:fixed;left:0;right:0;bottom:0;z-index:9;display:flex;gap:12px;padding:12px 16px calc(12px + var(--safe-bottom));background:var(--app-bg)}
:root.android .ad-bottom .ad-filled{flex:1;height:56px;border-radius:28px;font-size:17px}
:root.android .ad-bottom .ad-round{flex:0 0 auto;min-width:72px;height:56px;border-radius:28px}

/* ---- 14 New patient: a full-screen dialog with X / SAVE, a step indicator and filled fields ---- */
:root.android dialog.ad-full{margin:0;width:100%;max-width:none;height:100dvh;max-height:none;padding:0;border:0;border-radius:0;background:var(--app-bg);color:var(--ink);box-shadow:none}
:root.android dialog.ad-full[open]{display:flex;animation:ad-rise var(--motion-base) var(--ease)}
:root.android dialog.ad-full::backdrop{background:transparent}
:root.android .ad-full form{display:flex;flex-direction:column;width:100%;height:100%;padding:var(--safe-top) 0 calc(16px + var(--safe-bottom))}
:root.android .ad-dialog-bar{display:flex;align-items:center;gap:4px;min-height:64px;padding:0 4px}
:root.android .ad-dialog-bar h2{flex:1;margin:0 0 0 8px;font-size:22px;font-weight:600;letter-spacing:0}
:root.android .ad-text-button{min-height:48px;padding:0 16px;border:0;border-radius:24px;background:transparent;color:var(--accent-text);font-size:15px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
:root.android .ad-progress{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:4px 16px 0}
:root.android .ad-progress i{height:4px;border-radius:2px;background:var(--input-border);transition:background var(--motion-base) var(--ease)}
:root.android .ad-progress i.on{background:var(--accent)}
:root.android .ad-step-label{margin:14px 16px 0;font-size:14px;color:var(--muted)}
:root.android .ad-full .ad-fields{flex:1;min-height:0;display:flex;flex-direction:column;gap:18px;padding:16px 16px 8px}
:root.android .ad-full .ad-fields[hidden]{display:none}
:root.android .ad-field{display:flex;flex-direction:column;gap:8px;min-width:0;font-size:14px;color:var(--muted)}
:root.android .ad-field:focus-within{color:var(--accent-text)}
:root.android .ad-field input,:root.android .ad-field select{width:100%;height:56px;padding:0 16px;border:0;border-bottom:1px solid var(--hint);border-radius:4px 4px 0 0;background:var(--ad-field);color:var(--ink);font-size:16px;box-shadow:none}
:root.android .ad-field input:focus,:root.android .ad-field select:focus{outline:0;border-bottom:2px solid var(--accent);padding-bottom:0}
:root.android .ad-pair{display:grid;grid-template-columns:minmax(0,1fr) 128px;gap:12px}
:root.android .ad-help{margin:0;font-size:14px;line-height:1.5;color:var(--muted)}
:root.android .ad-error{margin:0 16px;font-size:14px;color:var(--danger)}
:root.android .ad-error:empty{display:none}
:root.android .ad-full footer{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:12px 16px 0}
:root.android .ad-full footer button{height:56px;border-radius:28px;font-size:16px}
@keyframes ad-rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

/* ---- 08, 17, 18 Settings lists ---- */
:root.android #local-settings.ad-settings{padding:0 0 20px;gap:0}
:root.android .ad-large-title{margin:0 20px 6px;font-size:32px;font-weight:600;letter-spacing:-.02em;color:var(--ink)}
:root.android .ad-group{display:flex;flex-direction:column;padding:0 0 4px}
:root.android .ad-group-title{margin:12px 20px 2px;font-size:14px;font-weight:600;letter-spacing:.01em;color:var(--accent-text)}
:root.android .ad-item{display:flex;align-items:center;gap:16px;width:100%;min-height:64px;padding:10px 20px;border:0;border-radius:0;background:transparent;color:var(--ink);text-align:left;font-weight:400;text-decoration:none;justify-content:flex-start}
:root.android button.ad-item:hover,:root.android a.ad-item:hover{background:var(--row-highlight)}
:root.android .ad-item-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
:root.android .ad-item-copy strong{font-size:17px;font-weight:400;line-height:1.35;color:var(--ink)}
:root.android .ad-item-copy small{font-size:14px;line-height:1.4;color:var(--muted)}
:root.android .ad-item.danger strong{color:var(--danger)}
:root.android button.ad-item:disabled{opacity:.45}
:root.android button.ad-item:disabled:hover{background:transparent}
/* The app version and the one footnote that is not worth a row of its own. */
:root.android .ad-foot{display:flex;flex-direction:column;gap:2px;padding:14px 20px 0;color:var(--muted)}
:root.android .ad-foot strong{font-size:14px;font-weight:600;color:var(--muted)}
:root.android .ad-foot small{font-size:14px}
:root.android .ad-foot span{margin-top:6px;font-size:13px;line-height:1.5;color:var(--hint)}
:root.android .ad-chevron{color:var(--hint)}
:root.android .ad-profile{display:flex;align-items:center;gap:20px;padding:12px 20px 8px}
:root.android .ad-profile .ad-avatar{background:var(--accent-surface);color:var(--accent-strong)}
:root.android .ad-profile>div{display:flex;flex-direction:column;gap:2px;min-width:0}
:root.android .ad-profile strong{font-size:20px;font-weight:600;color:var(--ink)}
:root.android .ad-profile span{font-size:15px;color:var(--muted);overflow-wrap:anywhere}
:root.android .ad-seats{display:flex;flex-direction:column;align-items:flex-start;gap:4px;margin:8px 20px;padding:16px 20px;min-height:0;border:0;border-radius:16px;background:var(--ad-tonal);color:var(--ad-on-tonal);text-align:left;font-weight:400}
:root.android .ad-seats strong{font-size:17px;font-weight:600;color:var(--ink)}
:root.android .ad-seats span{font-size:15px}
/* 17 The cloud-hours meter: the number a clinician opens Account for, above the drill-down rows. */
:root.android .ad-hours{display:flex;flex-direction:column;align-items:stretch;gap:10px;margin:8px 20px;padding:16px 20px;min-height:0;border:0;border-radius:16px;background:var(--ad-tonal);color:var(--ink);text-align:left;font-weight:400}
:root.android .ad-hours .ad-storage-head strong{font-weight:600}
:root.android .ad-hours .ad-meter{height:8px;border-radius:4px;background:color-mix(in srgb,var(--ink) 12%,transparent)}
:root.android .ad-hours .ad-meter .used{width:0;background:var(--accent)}
:root.android .ad-hours.full .ad-meter .used{background:var(--review-dot)}
:root.android .ad-hours.unknown .ad-meter{display:none}
:root.android .ad-hours-foot{margin:0;font-size:14px;line-height:1.4;color:var(--secondary)}
:root.android .ad-storage{display:flex;flex-direction:column;gap:10px;padding:8px 20px 4px}
:root.android .ad-storage-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
:root.android .ad-storage-head strong{font-size:17px;font-weight:400;color:var(--ink)}
:root.android .ad-storage-total{font-size:15px;color:var(--muted);font-variant-numeric:tabular-nums}
:root.android .ad-meter{display:flex;height:12px;border-radius:6px;overflow:hidden;background:var(--ad-field)}
:root.android .ad-meter i{display:block;height:100%;min-width:0;transition:width var(--motion-slow) var(--ease)}
:root.android .ad-meter .kept{background:var(--accent)}
:root.android .ad-meter .pending{background:color-mix(in srgb,var(--accent) 45%,var(--ad-field))}
:root.android .ad-legend{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px;color:var(--muted)}
:root.android .ad-legend span{display:inline-flex;align-items:center;gap:8px}
:root.android .ad-legend span::before{content:'';width:10px;height:10px;border-radius:2px;background:var(--accent)}
:root.android .ad-legend .pending::before{background:color-mix(in srgb,var(--accent) 45%,var(--ad-field))}
:root.android .ad-queue{display:flex;align-items:center;gap:12px;margin:12px 20px 4px;padding:10px 8px 10px 18px;border-radius:16px;background:var(--review-bg);color:var(--review-text)}
:root.android .ad-queue::before{content:'';flex:0 0 10px;width:10px;height:10px;border-radius:50%;background:var(--review-dot)}
:root.android .ad-queue-copy{flex:1;font-size:15px;line-height:1.4}
:root.android .ad-queue-send{min-height:48px;padding:0 14px;border:0;border-radius:24px;background:transparent;color:var(--review-text);font-size:15px;font-weight:700}
:root.android .ad-note{margin:10px 20px 0;font-size:14px;line-height:1.5;color:var(--muted)}
/* Genie voice pins its strip over the top (android-visit.css): these screens move down beneath it instead of being covered. */
:root.android body.genie-strip :is(#dashboard-page,#schedule-page){padding-top:max(12px,calc(var(--genie-strip,64px) - 64px - var(--safe-top) + 12px))}
:root.android body.genie-strip :is(#patient-page,#local-settings){padding-top:calc(var(--genie-strip,64px) + 12px)}
:root.android body.genie-strip #home-page .page-heading{padding-top:calc(var(--genie-strip,64px) + 12px)}
/* Sheets opened by these screens (plan details, battery guidance). */
:root.android .ad-sheet .ad-sheet-copy{margin:0;font-size:15px;line-height:1.5;color:var(--secondary)}
:root.android .ad-sheet-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;margin-top:8px}

/* ---- Paging (owner, 16 Sept 2026): nothing scrolls; what cannot fit is paged (paging.js) ----
   The screen is the paged pane and its Android chrome is pinned, so the chips, the search pill, the date strip, a patient's
   bar, header and tabs and the count line stay put while the rows turn. The pager bar sits between them, the count line
   ("Showing 21–40 of 63") under it. Flex order puts them back in that order whatever order pinning left them in. */
:root.android .screen.pg-pane>.pg-viewport{order:1}
:root.android .screen.pg-pane>.pager{order:2}
:root.android .screen.pg-pane>.ph-end{order:3}
:root.android #home-page #patients-table{min-height:0}
:root.android .ph-end{flex:0 0 auto;margin:0;padding:6px 0 2px;font-size:12.5px;line-height:1.3;color:var(--hint);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root.android .ph-end:empty{display:none}
/* Material pager bar: Previous and Next are 48dp targets on the left, the page count reads on the right, clear of the FAB. */
:root.android .pager{display:flex;align-items:center;gap:8px;flex:0 0 auto;margin:0;padding:6px 16px 4px;border-top:1px solid var(--border);background:var(--app-bg)}
:root.android :is(#dashboard-page,#home-page,#schedule-page)>.pager{margin-inline:-16px}
:root.android .pager button{order:1;min-height:48px;min-width:96px;padding:0 18px;border:1px solid var(--ad-outline);border-radius:24px;background:transparent;color:var(--accent-text);font-size:14px;font-weight:600}
:root.android .pager button:disabled{opacity:.4}
:root.android .pager-count{order:2;margin:0 0 0 auto;font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;color:var(--secondary);white-space:nowrap}
/* On a list the count line under the bar already says "Showing 21–40 of 63 · page 2 of 4": the bar's own copy would repeat it. */
:root.android .screen.pg-pane:has(>.ph-end.ad-range)>.pager>.pager-count{display:none}
/* A paged screen no longer needs the old run-off under the floating action button: the bar and the count line end the screen. */
:root.android :is(#dashboard-page,#home-page,#schedule-page).pg-paged{padding-bottom:6px}
/* The extended FAB floats over the bottom right: on a paged screen it rises above the pager bar and the count line, so both
   stay readable and the FAB keeps its label (New patient, Record 10:30). */
:root.android.ad-paged #ad-fab:not([hidden]){bottom:calc(var(--tabbar) + 84px)}
:root.android #patient-page.ad-record{padding-inline:0}
:root.android #patient-page.pg-paged>.pager{margin-inline:0;padding-inline:16px}
/* 22 About pages inside the panel, above the fixed Start visit bar. */
:root.android #patient-page.ad-about{padding-bottom:calc(80px + var(--safe-bottom))}
:root.android .ad-about-list{padding-bottom:0}
/* The access gate, sign-in and request access: one screenful inside the safe area, and what does not fit is paged, not lost. */
:root.android .entry{height:100dvh;overflow:hidden}
:root.android .entry-form{min-height:0;height:100%;overflow:hidden}
:root.android .auth-card.pg-pane{flex:1 1 auto;min-height:0;width:100%}
:root.android .auth-card.pg-pane>.pager{margin:0;padding:6px 0 0;border-top:1px solid var(--border);background:transparent}
:root.android .auth-card.pg-pane>.pager button{min-height:48px;min-width:96px;padding:0 18px;border:1px solid var(--ad-outline);border-radius:24px;background:transparent;color:var(--accent-text);font-size:14px;font-weight:600}
:root.android .auth-card.pg-pane>.auth-heading{order:0}
:root.android .auth-card.pg-pane>.pg-viewport{order:1}
:root.android .auth-card.pg-pane>.pager{order:2}
/* Sheets, the drawer and the menus page too: nothing in them scrolls either. Flex order keeps the grabber and title above the
   paged body and the buttons that finish the job below it. */
:root.android dialog.ph-sheet,:root.android dialog.ph-drawer,:root.android dialog.ph-menu{overflow:hidden}
/* #ad-sheet keeps its classes between openings (phone.js's own sheet clears them), and dialog.ph-sheet's display:flex beats the
   browser's display:none for a closed dialog: without this the closed sheet still lays itself out below the fold. */
:root.android dialog:is(.ph-sheet,.ph-drawer,.ph-menu):not([open]){display:none}
:root.android .ph-choices{max-height:none;overflow:visible}
:root.android dialog.pg-pane>:is(.ph-grabber,.ph-drawer-brand){order:0}
:root.android dialog.pg-pane>h2{order:1}
:root.android dialog.pg-pane>.pg-viewport{order:2}
:root.android dialog.pg-pane>.pager{order:3}
:root.android dialog.pg-pane>:is(.ad-sheet-actions,.ph-sheet-secondary,#phone-template-rewrite,.ph-done,.ph-discard){order:4}
:root.android dialog.pg-pane>.pager{margin:0;padding:4px 0 0;border-top:1px solid var(--border);background:transparent}
:root.android dialog.ph-menu.pg-pane>.pager{padding:4px 8px}
}
@media(prefers-reduced-motion:reduce){
  :root.android #ad-fab,:root.android .ad-switch,:root.android .ad-switch::after,:root.android .ad-meter i,:root.android .ad-record .ad-bar h1{transition:none}
  :root.android #ad-select-bar,:root.android dialog.ad-full[open]{animation:none}
}
/* ---- 14 Languages in New patient / Edit details (clinical.js languageEditor): filled fields, an in-flow menu, M3 input chips ---- */
:root.android .lang-android{display:flex;flex-direction:column;gap:18px}
:root.android .lang-android>.lang-field{margin-top:16px}:root.android .lang-android .ad-field>span{margin:0;font-size:14px;font-weight:400;color:inherit}
:root.android .lang-android .lang-combo,:root.android .lang-android .lang-others{display:flex;flex-direction:column;gap:8px;min-width:0}
:root.android .lang-android .lang-options{list-style:none;margin:0;padding:8px 0;max-height:280px;overflow:hidden;border-radius:4px;background:var(--ad-surface);box-shadow:0 2px 6px color-mix(in srgb,#000 18%,transparent),0 1px 2px color-mix(in srgb,#000 12%,transparent)}
:root.android .lang-android .lang-options[hidden]{display:none}
:root.android .lang-android .lang-option{display:flex;align-items:center;flex-wrap:wrap;gap:2px 10px;min-height:48px;padding:6px 16px;color:var(--ink);font-size:16px;cursor:pointer}
:root.android .lang-android .lang-option.active,:root.android .lang-android .lang-option:hover{background:color-mix(in srgb,var(--ink) 8%,transparent)}
:root.android .lang-android .lang-option[aria-selected=true]{color:var(--accent-text);font-weight:600}
:root.android .lang-android .lang-native{color:var(--muted)}:root.android .lang-android .lang-flag{margin-left:auto;font-size:12px;color:var(--review-text)}
:root.android .lang-android .lang-chips{display:flex;flex-wrap:wrap;gap:16px 8px;list-style:none;margin:0;padding:0}:root.android .lang-android .lang-chips[hidden]{display:none}
:root.android .lang-android .lang-chip{display:inline-flex;align-items:center;gap:6px;min-height:32px;max-width:100%;padding:0 0 0 12px;border:1px solid var(--ad-outline);border-radius:8px;color:var(--ink);font-size:14px;font-weight:500}
:root.android .lang-android .lang-chip .lang-native{font-weight:400}
:root.android .lang-android .lang-chip-remove{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;min-height:0;margin:-8px -4px -8px -10px;padding:0;border:0;border-radius:24px;background:transparent;color:var(--muted);font-size:18px;line-height:1}
:root.android .lang-android .lang-note{margin:-6px 0 0;font-size:14px;line-height:1.5;color:var(--review-text)}:root.android .lang-android .lang-note:empty{display:none}
:root.android .lang-android .lang-field[hidden]{display:none}
:root.android .av-pick .av-patient-copy strong{font-size:16px;font-weight:inherit}