/* ══════════════════════════════════════════════════════════════════════════════
   ROUND 35 — THE PHONE KIT AND THE PHONE SHELL (rules 163–168)

   Linked after dashboard.css and settings-workspace.css (app.html), so a rule here wins a tie.
   Two halves:
     1. The kit: `pk-` classes, a port of PhoneUI/PhoneDesignSystem.swift. Usable at every width;
        Builder B's hubs consume these names exactly (contract §3).
     2. The shell: everything under html[data-shell="phone"] (js/components/shell-mode.js) — the
        bottom tabs, the large-title header, sheets, fields and targets, safe areas.
   Only theme.css tokens. Phone-local custom properties derive from them.
   ══════════════════════════════════════════════════════════════════════════════ */

:root{
  --pk-gutter:var(--size-destination-margin-compact);   /* PhoneUI.gutter 16 */
  --pk-hairline:1px;
  --ph-tabbar-h:56px;                                   /* the floating capsule */
  --ph-tabbar-gap:10px;
  --ph-safe-t:env(safe-area-inset-top,0px);
  --ph-safe-b:env(safe-area-inset-bottom,0px);
  --ph-tabbar-bottom:max(var(--ph-tabbar-gap),var(--ph-safe-b));
  --ph-tabbar-room:calc(var(--ph-tabbar-h) + var(--space-lg) + var(--ph-tabbar-bottom));
  --pk-face-count:3;                                    /* set per row by pkFace / hub-host */
  --pk-band-count:4;                                    /* set per band by pkBand */
  --ph-avatar-bg:var(--c-accent-brown);                 /* set per person (identity colour) */
}
/* PhoneUI.gutter(for:) — 12 at ≤340 */
@media (max-width:340px){:root{--pk-gutter:var(--size-destination-margin-narrow)}}

/* ── 1. Kit ─────────────────────────────────────────────────────────────── */

/* Tones: brand · success · warning · danger · info · neutral */
.pk-tone--brand{color:var(--c-brand-primary)}
.pk-tone--success{color:var(--c-success)}
.pk-tone--warning{color:var(--c-warning)}
.pk-tone--danger{color:var(--c-danger)}
.pk-tone--info{color:var(--c-info)}
.pk-tone--neutral{color:inherit}
.pk-tile--brand{background:var(--c-brand-tint);color:var(--c-brand-primary)}
.pk-tile--success{background:var(--c-success-tint);color:var(--c-success)}
.pk-tile--warning{background:var(--c-warning-tint);color:var(--c-warning)}
.pk-tile--danger{background:var(--c-danger-tint);color:var(--c-danger)}
.pk-tile--info{background:var(--c-info-tint);color:var(--c-info)}
.pk-tile--neutral{background:var(--c-control-fill);color:var(--c-text-secondary)}

/* PhoneSurface :366-381 */
.pk-surface{padding:var(--space-lg);border-radius:var(--radius-card);background:var(--c-card-background-solid,var(--c-card-background));border:var(--pk-hairline) solid var(--c-card-border)}
.pk-largetitle{margin:0;font-size:var(--text-display);font-weight:700;letter-spacing:-.02em;line-height:1.15;color:var(--c-text-primary)}

/* PhoneFaceSwitcher :34-71 — equal width, never scrolls, the selected face a tinted pill */
.pk-face{display:grid;grid-template-columns:repeat(var(--pk-face-count,3),minmax(0,1fr));gap:var(--space-xs);padding:var(--space-xs);margin:0 0 var(--space-md);border:var(--pk-hairline) solid var(--c-card-border);border-radius:var(--radius-lg);background:var(--c-card-background);overflow:hidden}
.pk-face__item,.pk-face .seg__tab{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs-sm);min-width:0;min-height:38px;padding:0 var(--space-sm);border:0;border-radius:var(--radius-md);background:none;color:var(--c-text-secondary);font:inherit;font-size:var(--text-subhead);font-weight:600;text-decoration:none;white-space:nowrap;cursor:pointer}
.pk-face__item::before,.pk-face .seg__tab::before{content:'';position:absolute;inset:-3px 0}   /* hit 44 */
.pk-face__item[aria-selected="true"],.pk-face .seg__tab[aria-selected="true"]{background:var(--c-brand-tint);color:var(--c-brand-primary)}
.pk-face__item svg,.pk-face .seg__tab svg{width:var(--size-icon-sm);height:var(--size-icon-sm);flex:none}
.pk-face__label,.pk-face .seg__label{overflow:hidden;text-overflow:ellipsis}
.pk-face__count,.pk-face .seg__badge{position:absolute;top:2px;right:6px}
/* The hub host's lens row wearing the face (Jobs): the underline row's own rules stand down. */
.seg.pk-face{gap:var(--space-xs);overflow:hidden}
.seg.pk-face::after,.pk-face .seg__tab::after{display:none}
.pk-face .seg__tab--active{color:var(--c-brand-primary)}

/* FlatSegmentTabs (compact) — a scrolling underline row inside a hub */
.pk-seg{display:flex;gap:var(--space-md);overflow-x:auto;scrollbar-width:none;border-bottom:var(--pk-hairline) solid var(--c-separator);margin:0 0 var(--space-md)}
.pk-seg::-webkit-scrollbar{display:none}
.pk-seg__item{position:relative;flex:none;display:inline-flex;align-items:center;gap:var(--space-xs);min-height:44px;padding:0;border:0;background:none;color:var(--c-text-secondary);font:inherit;font-size:var(--text-footnote);font-weight:600;text-decoration:none;white-space:nowrap;cursor:pointer}
.pk-seg__item[aria-selected="true"]{color:var(--c-text-primary)}
.pk-seg__item[aria-selected="true"]::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--c-brand-primary)}
.pk-seg__count{color:var(--c-text-tertiary);font-variant-numeric:tabular-nums}

/* PhoneFilterChip :530-546 — capsule, min-h 38 (hit 44), 15px, on = brand fill, count after */
.pk-chips{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none;padding:3px 0;margin:0 0 var(--space-sm)}
.pk-chips::-webkit-scrollbar{display:none}
.pk-chip{position:relative;flex:none;display:inline-flex;align-items:center;gap:5px;min-height:38px;padding:0 var(--space-md-lg);border:0;border-radius:var(--radius-pill);background:var(--c-control-fill);color:var(--c-text-secondary);font:inherit;font-size:var(--text-subhead);font-weight:600;white-space:nowrap;cursor:pointer}
.pk-chip::after{content:'';position:absolute;inset:-3px 0}
.pk-chip[aria-pressed="true"]{background:var(--c-brand-primary);color:var(--c-on-brand)}
.pk-chip__count{font-variant-numeric:tabular-nums;opacity:.85}

/* HubMetricBand — 2×2 on a phone, one row of four from 560 of content */
.pk-band{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:var(--pk-hairline) solid var(--c-card-border);border-radius:var(--radius-lg);background:var(--c-card-background);overflow:hidden;margin:0 0 var(--space-md)}
.pk-band__cell{display:flex;flex-direction:column;gap:2px;min-width:0;min-height:76px;padding:var(--space-md) var(--space-lg);border:0;background:none;color:inherit;font:inherit;text-align:left;text-decoration:none;box-shadow:inset -1px 0 0 var(--c-separator),inset 0 -1px 0 var(--c-separator)}
.pk-band__cell--link{cursor:pointer}
.pk-band__label{font-size:var(--text-caption2);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--c-text-secondary)}
.pk-band__value{font-size:var(--text-headline);font-weight:700;font-variant-numeric:tabular-nums;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pk-band__sub{font-size:var(--text-caption);color:var(--c-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@container content (min-width:560px){.pk-band{grid-template-columns:repeat(var(--pk-band-count,4),minmax(0,1fr))}}

/* SectionCardHeader — the kicker INSIDE the card */
.pk-section{display:flex;align-items:baseline;gap:var(--space-sm);padding:0 0 var(--space-sm-md);margin:0 0 var(--space-xs);border-bottom:var(--pk-hairline) solid var(--c-separator)}
.pk-section__kicker{font-size:var(--text-caption2);font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.pk-section__count{font-size:var(--text-caption2);font-weight:700;color:var(--c-text-tertiary);font-variant-numeric:tabular-nums}
.pk-section__verb{margin-left:auto;display:inline-flex;align-items:center;min-height:44px;margin-block:-14px;padding:0;border:0;background:none;color:var(--c-brand-primary);font:inherit;font-size:var(--text-footnote);font-weight:600;text-decoration:none;cursor:pointer}

/* PhoneStatusPill :385-403 */
.pk-pill{display:inline-flex;align-items:center;flex:none;min-height:28px;padding:0 var(--space-sm-md);border-radius:var(--radius-pill);font-size:var(--text-footnote);font-weight:600;white-space:nowrap;background:color-mix(in srgb,currentColor 12%,transparent)}
.pk-pill.pk-tone--neutral{color:var(--c-text-secondary)}

/* Verbs */
.pk-verb{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs-sm);min-height:44px;padding:0 var(--space-md-lg);border:var(--pk-hairline) solid var(--c-card-border);border-radius:var(--radius-md);background:var(--c-card-background);color:var(--c-brand-primary);font:inherit;font-size:var(--text-subhead);font-weight:600;text-decoration:none;white-space:nowrap;cursor:pointer}
.pk-verb--primary{background:var(--c-brand-primary);border-color:var(--c-brand-primary);color:var(--c-on-brand)}
.pk-verb__icon{display:inline-flex}.pk-verb__icon svg{width:17px;height:17px}

/* PhoneDisclosureRow :552-567 */
.pk-row{display:flex;align-items:center;gap:var(--space-md);width:100%;min-height:52px;padding:var(--space-sm) 0;border:0;border-bottom:var(--pk-hairline) solid var(--c-separator);background:none;color:inherit;font:inherit;text-align:left;text-decoration:none;cursor:pointer}
.pk-row:last-child{border-bottom:0}
.pk-row__icon{flex:none;display:grid;place-items:center;width:var(--size-list-icon);height:var(--size-list-icon);border-radius:var(--radius-md);background:var(--c-control-fill);color:var(--c-brand-primary)}
.pk-row__icon svg{width:17px;height:17px}
.pk-row__copy{flex:1;min-width:0;display:flex;flex-direction:column}
.pk-row__title{font-size:var(--text-headline);font-weight:600;color:var(--c-text-primary);line-height:1.3}
.pk-row__sub{font-size:var(--text-footnote);color:var(--c-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pk-row__trailing{flex:none;font-size:var(--text-subhead);font-weight:600;font-variant-numeric:tabular-nums;color:var(--c-text-primary)}
.pk-row__count{flex:none}
.pk-row__chevron{flex:none;display:inline-flex;color:var(--c-text-tertiary)}
.pk-row__chevron svg{width:13px;height:13px}

/* The catalog row — min-h 72, 40px symbol box */
.pk-catalog{display:flex;align-items:center;gap:var(--space-md);width:100%;min-height:72px;padding:var(--space-sm-md) 0;border:0;border-bottom:var(--pk-hairline) solid var(--c-separator);background:none;color:inherit;font:inherit;text-align:left;text-decoration:none;cursor:pointer}
.pk-catalog:last-child{border-bottom:0}
.pk-catalog__icon{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:var(--radius-card)}
.pk-catalog__icon svg{width:20px;height:20px}
.pk-catalog__copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.pk-catalog__title{font-size:var(--text-headline);font-weight:600;color:var(--c-text-primary);line-height:1.3}
.pk-catalog__line{font-size:var(--text-caption);color:var(--c-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pk-catalog__trailing{flex:none;font-size:var(--text-subhead);font-weight:600;font-variant-numeric:tabular-nums}

/* PhoneJobCollectionCard :636-676 */
.pk-jobcard{display:flex;flex-direction:column;gap:var(--space-md);margin:0 0 var(--space-md)}
.pk-jobcard__open{display:flex;align-items:flex-start;gap:var(--space-md);padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;text-decoration:none;cursor:pointer}
.pk-jobcard__copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.pk-jobcard__title{font-size:var(--text-headline);font-weight:600;color:var(--c-text-primary);line-height:1.3}
.pk-jobcard__line{font-size:var(--text-subhead);color:var(--c-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pk-jobcard__foot{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-md)}
.pk-jobcard__verb{display:inline-flex;align-items:center;gap:var(--space-xs-sm);min-height:44px;padding:0 var(--space-md-lg);border:0;border-radius:var(--radius-md);background:var(--c-card-background);color:var(--c-brand-primary);font:inherit;font-size:var(--text-subhead);font-weight:600;text-decoration:none;cursor:pointer}
.pk-jobcard__verb--primary{background:var(--c-brand-primary);color:var(--c-on-brand)}
.pk-jobcard__verb svg{width:17px;height:17px}
.pk-jobcard__more{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:none;color:var(--c-text-secondary);cursor:pointer}
.pk-jobcard__more svg{width:24px;height:24px}

/* MoneyRecordRow :93-128 */
.pk-money{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;align-items:center;gap:var(--space-sm-md);width:100%;min-height:60px;padding:var(--space-sm-md) 0;border:0;border-bottom:var(--pk-hairline) solid var(--c-separator);background:none;color:inherit;font:inherit;text-align:left;text-decoration:none;cursor:pointer}
.pk-money:last-child{border-bottom:0}
.pk-money__icon{display:grid;place-items:center;width:34px;height:34px;border-radius:var(--radius-md)}
.pk-money__icon svg{width:17px;height:17px}
.pk-money__copy,.pk-money__figures{display:flex;flex-direction:column;min-width:0}
.pk-money__figures{align-items:flex-end}
.pk-money__title,.pk-money__amount{font-size:var(--text-subhead);font-weight:600;color:var(--c-text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pk-money__amount{font-variant-numeric:tabular-nums}
.pk-money__sub,.pk-money__status{font-size:var(--text-footnote);color:var(--c-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pk-money__status.pk-tone--danger{color:var(--c-danger);font-weight:600}

/* PhoneQueueCard :577-625 */
.pk-queue{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md) 0;border-bottom:var(--pk-hairline) solid var(--c-separator)}
.pk-queue:last-child{border-bottom:0}
.pk-queue__open{flex:1;min-width:0;display:flex;align-items:flex-start;gap:var(--space-md);padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;text-decoration:none;cursor:pointer}
.pk-queue__icon{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%}
.pk-queue__icon svg{width:19px;height:19px}
.pk-queue__copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pk-queue__headline{font-size:var(--text-headline);font-weight:600;color:var(--c-text-primary);line-height:1.3}
.pk-queue__subhead{font-size:var(--text-subhead);color:var(--c-text-secondary)}
.pk-queue__caption{font-size:var(--text-footnote);color:var(--c-text-tertiary)}
.pk-queue__verb{flex:none;display:inline-flex;align-items:center;min-height:44px;padding:0 var(--space-md);border:var(--pk-hairline) solid var(--c-card-border);border-radius:var(--radius-md);background:var(--c-card-background);color:var(--c-brand-primary);font:inherit;font-size:var(--text-subhead);font-weight:600;text-decoration:none;white-space:nowrap;cursor:pointer}

/* GuidedSteps footer :596-605 — pinned, into the bottom safe area */
.pk-foot{position:sticky;bottom:0;z-index:5;display:flex;gap:var(--space-sm-md);padding:var(--space-sm-md) var(--pk-gutter) calc(var(--space-sm) + var(--ph-safe-b));border-top:var(--pk-hairline) solid var(--c-separator);background:var(--c-card-background)}
.pk-foot__back,.pk-foot__next{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 var(--space-lg);border:0;border-radius:var(--radius-md);font:inherit;font-size:var(--text-subhead);font-weight:600;text-decoration:none;cursor:pointer}
.pk-foot__back{background:var(--c-control-fill);color:var(--c-text-primary)}
.pk-foot__next{flex:1;background:var(--c-brand-primary);color:var(--c-on-brand)}

/* Loading and empty */
.pk-skeleton{display:grid;gap:var(--space-sm)}
.pk-skeleton__row{display:block;height:56px;border-radius:var(--radius-card);background:var(--c-control-fill);animation:pk-pulse 1.2s ease-in-out infinite alternate}
@keyframes pk-pulse{to{opacity:.55}}
.pk-empty{display:grid;justify-items:start;gap:var(--space-sm)}
.pk-empty p{margin:0;font-size:var(--text-subhead);color:var(--c-text-secondary)}

/* Tables become rows at phone width (rule 165): pkLabelTables() writes data-label on each cell. */
html[data-shell="phone"] table.pk-stack,html[data-shell="phone"] table.pk-stack tbody{display:block;width:100%}
html[data-shell="phone"] table.pk-stack thead{display:none}
html[data-shell="phone"] table.pk-stack tr{display:grid;gap:2px;padding:var(--space-sm-md) 0;border-bottom:var(--pk-hairline) solid var(--c-separator)}
html[data-shell="phone"] table.pk-stack td{display:flex;justify-content:space-between;gap:var(--space-md);padding:2px 0;border:0;font-size:var(--text-subhead);min-width:0}
html[data-shell="phone"] table.pk-stack td[data-label]::before{content:attr(data-label);flex:none;color:var(--c-text-secondary);font-size:var(--text-footnote)}
html[data-shell="phone"] table.pk-stack td:empty{display:none}

/* ── 2. The phone shell ─────────────────────────────────────────────────── */

/* No hamburger, no drawer (rule 163). Hidden in the rail shell: the tab bar and the bar's phone controls. */
.ph-tabbar,.ph-back,.ph-circle,.ph-avatar{display:none}
html[data-shell="phone"] .rail,
html[data-shell="phone"] .dash-sidebar-backdrop,
html[data-shell="phone"] .dash-topbar__hamburger,
html[data-shell="phone"] .dash-topbar__settings-back,
html[data-shell="phone"] .dash-topbar__settings-icon,
html[data-shell="phone"] .dash-topbar .dash-trial-pill{display:none!important}
html[data-shell="phone"] .rail__fold-slot{display:none}

/* The page: gutters 16 (12 at ≤340), room under it for the floating tab bar */
html[data-shell="phone"] .dash-content{padding:var(--space-sm) var(--pk-gutter) var(--ph-tabbar-room);scroll-padding-bottom:var(--ph-tabbar-room)}
html[data-shell="phone"][data-form="open"] .dash-content{padding-bottom:calc(var(--space-lg) + var(--ph-safe-b))}
/* Walk 2026-10-30: a guided flow's footer IS the bottom edge (GuidedSteps.swift:596-605). The pane above
   clips with overflow:clip, not hidden: hidden made the pane the sticky footer's scroll container, so the
   footer sat at the end of the form instead of pinned. */
html[data-shell="phone"][data-form="open"] .dash-content:has(.pf-foot,.ac-file__foot,.pk-foot){padding-bottom:0}
/* Help lives behind "?" (PhoneShell.swift:277-284): the teach strip leaves the page. */
html[data-shell="phone"] .dash-content .tip-strip{display:none}
html[data-bar-help] .dash-content .hub-help,html[data-bar-help] .dash-content .hub-help-row{display:none}

/* Header (PhoneShell.swift:248-311): large title at a tab root, chevron + 17/700 when pushed. */
html[data-shell="phone"] .dash-topbar{flex-wrap:wrap;height:auto;min-height:0;padding:calc(var(--ph-safe-t) + var(--space-sm)) var(--pk-gutter) var(--space-xs);gap:var(--space-sm);background:var(--c-card-background);border-bottom:var(--pk-hairline) solid transparent;position:relative;z-index:60;transition:border-color var(--motion-fast)}
html[data-shell="phone"] .dash-topbar.is-collapsed,html[data-shell="phone"] .dash-topbar.is-pushed{border-bottom-color:var(--c-separator)}
html[data-shell="phone"] .dash-topbar__title{order:1;flex:1 1 auto;min-width:0;max-width:none;margin:0;font-size:var(--text-display);font-weight:700;letter-spacing:-.02em;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:font-size var(--motion-fast)}
html[data-shell="phone"] .dash-topbar.is-collapsed .dash-topbar__title,
html[data-shell="phone"] .dash-topbar.is-pushed .dash-topbar__title{font-size:var(--text-headline);letter-spacing:0;line-height:44px}
html[data-shell="phone"] .ph-back{order:0;display:none;place-items:center;flex:none;width:44px;height:44px;margin-left:calc(var(--space-sm) * -1);padding:0;border:0;background:none;color:var(--c-brand-primary);cursor:pointer}
html[data-shell="phone"] .dash-topbar.is-pushed .ph-back{display:grid}
.ph-back svg{width:22px;height:22px}
html[data-shell="phone"] .ph-circle{order:3;position:relative;display:grid;place-items:center;flex:none;width:34px;height:34px;padding:0;border:var(--pk-hairline) solid var(--c-card-border);border-radius:50%;background:var(--c-card-background);color:var(--c-text-primary);cursor:pointer}
html[data-shell="phone"] .ph-circle::after{content:'';position:absolute;inset:-6px}
html[data-shell="phone"] .ph-avatar::after{content:'';position:absolute;inset:-7px}
.ph-circle svg{width:17px;height:17px}
html[data-shell="phone"] .dash-topbar__help{order:2}
html[data-shell="phone"] .dash-topbar__help .hub-help__btn{position:relative;width:34px;height:34px;border-radius:50%;font-size:var(--text-headline)}
html[data-shell="phone"] .dash-topbar__help .hub-help__btn::after{content:'';position:absolute;inset:-5px}
html[data-shell="phone"] .dash-topbar__crumb{display:none!important}
html[data-shell="phone"] .dash-topbar__heading{order:1;flex:1 1 0;min-width:0;max-width:none;display:flex;flex-direction:column}
html[data-shell="phone"] .dash-topbar__subtitle{display:none}
/* A view's own bar verbs (New lead, Take a call, Add person…) get their own row under the title, as
   native keeps the title row to title + circles (PhoneShell.swift:248-295). */
html[data-shell="phone"] .dash-topbar__actions{order:20;flex:1 0 100%;justify-content:flex-start;flex-wrap:wrap;margin-left:0;gap:var(--space-sm);padding-top:var(--space-xs)}
html[data-shell="phone"] .dash-topbar__actions:empty{display:none}
html[data-shell="phone"] .dash-topbar__actions .btn{min-height:44px;height:44px;padding:0 var(--space-md-lg);font-size:var(--text-subhead)}
html[data-shell="phone"] .dash-topbar__actions .section-add__label,
html[data-shell="phone"] .dash-topbar__actions .section-add__caret{display:none}
html[data-shell="phone"] .dash-topbar__new{order:5;margin-left:0;position:relative}
html[data-shell="phone"] .dash-topbar__new .btn{position:relative;width:34px;height:34px;min-width:34px;min-height:34px;padding:0;gap:0;border-radius:50%;justify-content:center}
html[data-shell="phone"] .dash-topbar__new .btn::after{content:'';position:absolute;inset:-5px}
html[data-shell="phone"] .dash-topbar__new .section-add__label,html[data-shell="phone"] .dash-topbar__new .section-add__caret{display:none}
html[data-shell="phone"] .dash-topbar__new .btn>svg{width:17px;height:17px}
/* + is hidden on records and forms (PhoneShell.swift:358-370) */
html[data-shell="phone"] .dash-topbar.is-record .dash-topbar__new,html[data-shell="phone"][data-form="open"] .dash-topbar__new{display:none}
/* The New menu, anchored, in native order */
html[data-shell="phone"] .dash-topbar__new .section-add__menu{min-width:240px;border-radius:var(--radius-xl);padding:var(--space-xs) 0}
html[data-shell="phone"] .dash-topbar__new .section-add__menu .dropdown__item{min-height:44px;font-size:var(--text-headline);padding-inline:var(--space-lg)}
html[data-shell="phone"] .ph-avatar{order:6;position:relative;display:grid;place-items:center;flex:none;width:30px;height:30px;padding:0;border:0;border-radius:50%;background:var(--ph-avatar-bg,var(--c-accent-brown));color:var(--c-on-brand);font:inherit;font-size:var(--text-caption);font-weight:700;cursor:pointer}

/* Search sheet: the command palette in a full-height bottom sheet, input autofocused at 17 */
.cmdbar__grabber,.cmdbar__cancel{display:none}
html[data-shell="phone"] .dash-topbar .cmdbar{display:none}
html.ph-search-open[data-shell="phone"] .dash-topbar{z-index:1100}
html.ph-search-open[data-shell="phone"] .dash-topbar::before{content:'';position:fixed;inset:0;background:var(--c-scrim);z-index:-1}
html.ph-search-open[data-shell="phone"] .dash-topbar .cmdbar{order:9;display:flex;flex-direction:column;align-items:stretch;gap:var(--space-sm);position:fixed;left:0;right:0;top:calc(var(--crm-viewport-top,0px) + var(--ph-safe-t) + var(--space-md));height:calc(var(--crm-viewport-height,100dvh) - var(--ph-safe-t) - var(--space-md));max-width:none;margin:0;padding:var(--space-sm) var(--pk-gutter) var(--ph-safe-b);border-radius:var(--radius-sheet) var(--radius-sheet) 0 0;background:var(--c-card-background);animation:ph-sheet-up 200ms ease-out}
html.ph-search-open[data-shell="phone"] .cmdbar__grabber{display:block;align-self:center;width:36px;height:5px;border-radius:3px;background:var(--c-border-strong);margin-bottom:var(--space-xs)}
html.ph-search-open[data-shell="phone"] .cmdbar__field{gap:var(--space-sm)}
html.ph-search-open[data-shell="phone"] .dash-topbar .cmdbar__input{flex:1;height:44px;font-size:var(--text-headline);padding-left:36px}
html.ph-search-open[data-shell="phone"] .dash-topbar .cmdbar__icon{left:12px}
html.ph-search-open[data-shell="phone"] .cmdbar__cancel{display:inline-flex;align-items:center;min-height:44px;padding:0 var(--space-xs);border:0;background:none;color:var(--c-brand-primary);font:inherit;font-size:var(--text-headline);cursor:pointer}
html.ph-search-open[data-shell="phone"] .dash-topbar .cmdbar__results{position:static;flex:1;max-height:none;border:0;border-radius:0;overflow-y:auto;padding:0}
html.ph-search-open[data-shell="phone"] .cmdbar__hit{min-height:52px}
html.ph-search-open[data-shell="phone"] .cmdbar__hit-title{font-size:var(--text-headline)}
html.ph-search-open[data-shell="phone"] .cmdbar__hit-sub{font-size:var(--text-footnote)}
html.ph-search-open .ph-tabbar{visibility:hidden}

/* The tab bar: a floating glass capsule (PhoneDesignSystem.swift:73-77) */
html[data-shell="phone"] .ph-tabbar{display:flex;position:fixed;z-index:900;left:calc(var(--ph-tabbar-gap) + env(safe-area-inset-left,0px));right:calc(var(--ph-tabbar-gap) + env(safe-area-inset-right,0px));bottom:var(--ph-tabbar-bottom);height:var(--ph-tabbar-h);padding:3px;gap:2px;border:var(--pk-hairline) solid var(--c-card-border);border-radius:28px;background:color-mix(in srgb,var(--c-card-background) 94%,transparent);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6);box-shadow:0 6px 24px color-mix(in srgb,var(--c-text-primary) 10%,transparent)}
html[data-shell="phone"][data-form="open"] .ph-tabbar{display:none}
.ph-tab{position:relative;flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border:0;border-radius:25px;background:none;color:var(--c-text-primary);font:inherit;font-size:10px;font-weight:500;line-height:1.2;text-decoration:none;-webkit-tap-highlight-color:transparent;cursor:pointer}
.ph-tab[aria-current="page"]{color:var(--c-brand-primary);background:var(--c-control-fill)}
.ph-tab__icon{position:relative;display:block;width:22px;height:22px}
.ph-tab__icon svg{width:22px;height:22px;stroke-width:2}
.ph-tab__label{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ph-tab__badge{position:absolute;top:-6px;left:13px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--c-badge);color:var(--c-on-badge,#fff);font-size:var(--text-caption2);font-weight:700;line-height:18px;text-align:center;font-variant-numeric:tabular-nums}
.ph-tab__badge[hidden]{display:none}

/* Toasts ride above the tab bar */
html[data-shell="phone"] #toast-root{left:var(--pk-gutter);right:var(--pk-gutter);bottom:calc(var(--ph-tabbar-room) - var(--space-sm))}
html[data-shell="phone"][data-form="open"] #toast-root{bottom:calc(var(--space-md) + var(--ph-safe-b))}

/* Sheets (rule 166): every modal host aligns to the bottom, radius 30 at the top, a grabber. */
html[data-shell="phone"] .modal-backdrop:not(.cas-backdrop){align-items:flex-end;justify-content:stretch;padding:calc(var(--ph-safe-t) + var(--space-md)) 0 0}
html[data-shell="phone"] .modal-backdrop .modal{width:100%;max-width:100%;max-height:calc(var(--crm-viewport-height,100dvh) - var(--ph-safe-t) - var(--space-md));border-radius:var(--radius-sheet) var(--radius-sheet) 0 0;border-bottom:0;padding-bottom:var(--ph-safe-b);overscroll-behavior:contain;animation:ph-sheet-up 200ms ease-out}
html[data-shell="phone"] .modal-backdrop .modal::before{content:'';position:sticky;top:0;z-index:3;display:block;width:36px;height:5px;margin:6px auto -11px;border-radius:3px;background:var(--c-border-strong)}
html[data-shell="phone"] .modal-backdrop .modal__header{padding-top:var(--space-lg);touch-action:none}
html[data-shell="phone"] .modal-backdrop .modal__footer{position:sticky;bottom:calc(var(--ph-safe-b) * -1);background:var(--c-card-background);padding-bottom:calc(var(--space-md) + var(--ph-safe-b))}
html[data-shell="phone"] :is(.li-sheet-host,.gbp-sheet-host){place-items:end stretch;align-items:flex-end;padding:var(--ph-safe-t) 0 0}
html[data-shell="phone"] :is(.li-sheet,.gbp-sheet){width:100%;max-width:100%;border-radius:var(--radius-sheet) var(--radius-sheet) 0 0;padding-bottom:var(--ph-safe-b)}
@keyframes ph-sheet-up{from{transform:translateY(24px);opacity:.4}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){
  html[data-shell="phone"] .modal-backdrop .modal,html.ph-search-open .dash-topbar .cmdbar{animation:none}
}
/* A sheet being dragged (sheet-drag.js) follows the finger; it springs back when released short. */
.modal.is-dragging{transition:none;animation:none}
.modal.is-settling{transition:transform 180ms ease-out}

/* Question dialogs stay centred (MTThemedDialog.swift): max 380, radius 20, padding 28, margin 40. */
html[data-shell="phone"] .mt-dialog-scrim{padding-inline:var(--space-xxl)}
html[data-shell="phone"] .mt-dialog{max-width:var(--dialog-card-max-width,380px);border-radius:var(--radius-xxl);padding:var(--dialog-card-padding,28px)}
html[data-shell="phone"] .mt-dialog__buttons .btn{min-height:44px;font-size:var(--text-callout)}

/* The More & account sheet (PhoneMoreView.swift:37-60) */
.ph-more .modal__body{padding-top:0}
html[data-shell="phone"] .modal-backdrop .modal.ph-more{height:calc(var(--crm-viewport-height,100dvh) - var(--ph-safe-t) - var(--space-md));background:var(--c-background-secondary)}
.ph-more__id{display:flex;align-items:center;gap:var(--space-md);margin:0 0 var(--space-lg);color:inherit;text-decoration:none}
.ph-more__avatar{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:var(--radius-md);background:var(--ph-avatar-bg,var(--c-accent-brown));color:var(--c-on-brand);font-size:var(--text-headline);font-weight:700}
.ph-more__who{min-width:0;display:flex;flex-direction:column;gap:2px}
.ph-more__name{font-size:var(--text-headline);font-weight:600;color:var(--c-text-primary)}
.ph-more__email{font-size:var(--text-footnote);color:var(--c-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ph-more__chips{display:flex;align-items:center;gap:var(--space-sm);flex-wrap:wrap}
.ph-more__company{font-size:var(--text-footnote);color:var(--c-text-secondary)}
.ph-more__find{position:relative;margin:0 0 var(--space-lg)}
.ph-more__find svg{position:absolute;left:12px;top:50%;width:17px;height:17px;transform:translateY(-50%);color:var(--c-text-tertiary);pointer-events:none}
.ph-more__find input{width:100%;min-height:44px;padding:0 var(--space-md) 0 38px;border:0;border-radius:var(--radius-card);background:var(--c-control-fill);color:var(--c-text-primary);font:inherit;font-size:var(--text-headline)}
.ph-more__group{margin:0 0 var(--space-lg)}
.ph-more__kicker{margin:0 0 var(--space-sm);font-size:var(--text-caption2);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--c-text-secondary)}
.ph-more__list{padding:0 var(--space-lg)}
.ph-more__list .pk-row__sub{white-space:nowrap}
.ph-more__pins{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-sm)}
.ph-more__pin{display:flex;flex-direction:column;align-items:center;gap:var(--space-xs);min-height:72px;padding:var(--space-sm);border:var(--pk-hairline) solid var(--c-card-border);border-radius:var(--radius-card);background:var(--c-card-background);color:var(--c-text-primary);font-size:var(--text-caption);text-align:center;text-decoration:none}
.ph-more__pin svg{width:22px;height:22px;color:var(--c-brand-primary)}
.ph-more__trial{display:flex;justify-content:center;margin:var(--space-sm) 0 var(--space-lg)}
.ph-more__signout{width:100%}
.ph-more [hidden]{display:none}

/* Fields and targets (rule 166): ≥16px and 44 tall at phone width OR on any touch screen (the
   layout census holds a narrow laptop window to the same floor). */
:is(html[data-shell="phone"],html[data-touch="1"]) body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]),select,textarea){font-size:var(--text-callout);min-height:44px}
:is(html[data-shell="phone"],html[data-touch="1"]) body :is(.form-input,.form-select,.form-textarea,.filter-select,.filter-bar__search input,[class*="search"] input){font-size:var(--text-callout);min-height:44px}
:is(html[data-shell="phone"],html[data-touch="1"]) body :is(.btn,.seg__tab,.chip,.filter-chip,.dropdown__item,.modal__close,.hub-help__btn,.tip-strip__close,.tip-strip__more,.dash-topbar__icon-btn,[class*="__more"]:is(button,a),[class*="-more"]:is(button,a)){min-height:44px;min-width:44px}
html[data-shell="phone"] body .btn{font-size:var(--text-subhead)}

/* Home Screen app (P1411): the header paints the status-bar band; insets on every pinned surface. */
@media (display-mode:standalone){
  html[data-shell="phone"] .dash-topbar{padding-top:calc(var(--ph-safe-t) + var(--space-sm))}
  html[data-shell="phone"] body{background:var(--c-card-background)}
}
html[data-shell="phone"] :is(.pf-foot,.ac-file__foot,.pl-bulk,.sa-draft-bar){padding-bottom:calc(var(--space-sm-md) + var(--ph-safe-b))}
html[data-shell="phone"]:not([data-form="open"]) :is(.pf-foot,.ac-file__foot,.pl-bulk,.sa-draft-bar){bottom:calc(var(--ph-tabbar-room) - var(--space-lg))}

/* Forms (P1426, P1427): an editor or form takes the whole height on a phone, its header a nav bar
   (title 20/700) and its footer pinned with Save. A view that runs its own full-page form sets
   html[data-form="open"], which hides the tab bar (PhoneShell.swift:118-120). */
html[data-shell="phone"] .modal-backdrop .modal:is(.modal--wide,.modal--record,.modal--page,.modal--picker){height:calc(var(--crm-viewport-height,100dvh) - var(--ph-safe-t) - var(--space-md))}
html[data-shell="phone"] .modal-backdrop .modal__title{font-size:var(--text-title3);font-weight:700}
html[data-shell="phone"] .modal-backdrop .modal__close{width:44px;height:44px}
html[data-shell="phone"] .modal-backdrop .modal__footer .btn--primary{min-height:44px;font-size:var(--text-subhead);font-weight:700}

/* Money's four totals stay one row at every width (MoneyHubView+Phone.swift). */
.pk-band.pk-band--totals{grid-template-columns:repeat(var(--pk-band-count,4),minmax(0,1fr))}
.jmoney__nextrow>span:nth-child(2){display:flex;flex-direction:column;gap:var(--space-xxs);min-width:0}
.jmoney__nextrow strong{font-size:var(--text-subhead);font-weight:600}

/* ══════════════════════════════════════════════════════════════════════════════
   ROUND 35 — THE RAIL SHELL MEASURES ITS CONTENT COLUMN (rules 168, 169; P1439–P1447)
   (Kept in phone.css, after the shell: dashboard.css's last block must stay the canvas AI's, which
   test/canvas-ai.test.mjs reads to the end of the file.) Layouts inside the content column ask the
   column (`@container content`), never the window, so a folded rail (64) and an open one (212)
   lay the same page out by the room it actually has (AppRail.swift:88-91).
   ══════════════════════════════════════════════════════════════════════════════ */
.dash-content{container-type:inline-size;container-name:content}

/* ── The bar names what is open (P1440, Shell.swift:283-312) and New stands down on a record (P1441) ── */
.dash-topbar__heading{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}
.dash-topbar__heading .dash-topbar__title{flex:none;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dash-topbar.is-record .dash-topbar__title{font-size:var(--text-title3);font-weight:700}
.dash-topbar__subtitle{font-size:var(--text-caption);color:var(--c-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dash-topbar__subtitle[hidden]{display:none}
.dash-topbar__crumb{display:inline-flex;align-items:center;gap:var(--space-xs);flex:none;min-height:var(--size-touch-min);color:var(--c-brand-primary);font-size:var(--text-subhead);font-weight:600;text-decoration:none;white-space:nowrap}
.dash-topbar__crumb[hidden]{display:none}
.dash-topbar__crumb-sep{color:var(--c-text-tertiary)}
.dash-topbar__help{display:flex;align-items:center;flex:none}
.dash-topbar__help:empty{display:none}
.dash-topbar.is-record .dash-topbar__new{display:none}

/* ── Jobs (P1415, P1442): face · search · tiles · chips · sort · count · cards; the table from 1050 ── */
#hub-chrome-jobs .seg.pk-face{margin-bottom:var(--space-md)}
.jhub-bar{display:flex;flex-direction:column;align-items:stretch}
.jhub-bar>.jhub-top{display:contents}
.jhub-bar .jhub-search{order:1;flex:none;max-width:none;width:100%;position:relative}
.jhub-bar .jhub-search>svg{position:absolute;left:12px;pointer-events:none}
.jhub-bar .jhub-search .form-input{padding-left:36px;min-height:var(--size-control-medium);border-radius:var(--radius-card)}
.jhub-bar .jhub-tiles{order:2}
.jhub-bar .jhub-vchips{order:3;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:5px;padding:3px 0}
.jhub-bar .jhub-vchips::-webkit-scrollbar{display:none}
.jhub-bar .jhub-filters-anchor{order:4;align-self:flex-start}
.jhub-bar .cust-more-wrap{order:4}
.jhub-bar .jhub-chips{order:5}
.jhub-bar .jhub-vchip{position:relative;flex:none;min-height:38px;padding:0 var(--space-md-lg);border:0;background:var(--c-control-fill);font-size:var(--text-subhead);font-weight:600;white-space:nowrap}
.jhub-bar .jhub-vchip::after{content:'';position:absolute;inset:-3px 0}
.jhub-bar .jhub-vchip.is-on{background:var(--c-brand-primary);color:var(--c-on-brand)}
.jhub-bar .jhub-vchip--add{background:none;color:var(--c-text-tertiary)}
.jhub-tile__label{order:-1}
.jhub-cards__count{margin:0 0 var(--space-sm);font-size:var(--text-footnote);color:var(--c-text-secondary)}
.jhub-cards .pk-jobcard__open{width:100%}
/* Cards or table: measured on the list itself (container `jhublist`, below), so a record beside it
   turns the list back into cards. The table's native slot widths: */
@container jhublist (min-width:1050px){
  .jhub-table{table-layout:fixed;width:100%}
  /* JobsHubTable: Job flexible · Step 170 · When 190 · Crew 150 · Value 96 · Next 220 (JobsHubRowViews.swift:235-243) */
  .jhub-table th.col-name{width:auto}.jhub-table th.col-name+th.col-text{width:170px}
  .jhub-table th.col-meta{width:190px}.jhub-table th.col-meta+th.col-text{width:150px}
  .jhub-table th.col-amount{width:96px}.jhub-table th.col-badge{width:220px}
}
/* Native Jobs has no explainer and no caption at any size: both live behind the bar's "?" (P1440). */
#hub-chrome-jobs>.tip-strip,#hub-sub-jobs{display:none}

/* ── Today (P1414, P1444): ONE split, main + 340 from 860 of content (TodayView.swift:8-14) ── */
.td-page--wide .td-cols{grid-template-columns:minmax(0,1fr) 340px}
.td-page--wide .td-rail{position:sticky}
html[data-shell="phone"] .td-head__sub{font-size:var(--text-headline)}
html[data-shell="phone"] .td-head__btn{width:44px;height:44px;background:none}
html[data-shell="phone"] .td-next{background:var(--c-card-background);border:1px solid var(--c-card-border);border-left-width:1px;padding:var(--space-lg) var(--space-lg) 0;overflow:hidden}
html[data-shell="phone"] .td-next .jf-next__title{font-size:var(--text-headline);font-weight:600}
html[data-shell="phone"] .td-next .jf-next__why{font-size:var(--text-subhead)}
html[data-shell="phone"] .td-next__acts{justify-content:space-between;margin:var(--space-md) calc(var(--space-lg) * -1) 0;padding:var(--space-md) var(--space-lg);background:var(--c-brand-tint)}
html[data-shell="phone"] .jf-next--warn .td-next__acts{background:var(--c-warning-tint)}
html[data-shell="phone"] .jf-next--error .td-next__acts{background:var(--c-warning-tint)}
/* hub grammar: the move row is amber when money is owed (warn/error tones), brand tint otherwise; the
   kicker follows it — never the danger pink (native-today.jpg). */
html[data-shell="phone"] .td-next.jf-next--error .jf-next__k,html[data-shell="phone"] .td-next.jf-next--warn .jf-next__k{color:var(--c-warning)}
html[data-shell="phone"] .td-next__acts .btn{min-height:44px;font-size:var(--text-subhead)}
html[data-shell="phone"] .td-work{min-height:44px;font-size:var(--text-subhead)}
html[data-shell="phone"] .td-row{align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);flex-wrap:nowrap}
html[data-shell="phone"] .td-row .jf-li__tx b{font-size:var(--text-headline);font-weight:600;line-height:1.3}
html[data-shell="phone"] .td-row .jf-li__tx span{font-size:var(--text-subhead)}
html[data-shell="phone"] .td-ico{width:34px;height:34px}
html[data-shell="phone"] .td-row .td-verb{min-height:44px;font-size:var(--text-subhead);background:var(--c-card-background);border:1px solid var(--c-card-border);color:var(--c-brand-primary)}
html[data-shell="phone"] .td-more{width:44px;height:44px}
html[data-shell="phone"] .jf-sec__k{font-size:var(--text-caption2);letter-spacing:.06em}

/* ── Money (P1404, P1417): one list, no card in a card, no box that scrolls inside the page ── */
.jmoney{padding:0;border:0;background:none}
.pk-band--totals{grid-template-columns:repeat(4,minmax(0,1fr))}
.pk-band--totals .pk-band__cell{align-items:center;justify-content:center;text-align:center;min-height:0;padding:var(--space-md) var(--space-xs)}
.pk-band--totals .pk-band__value{font-size:var(--text-headline)}
.pk-band--totals .pk-band__label{order:2;text-transform:none;letter-spacing:0;font-size:var(--text-footnote);font-weight:400;white-space:normal;line-height:1.25}
.pk-band--totals .pk-band__sub{order:3;white-space:normal}
.jmoney__heading{margin:var(--space-sm) 0 0;font-size:var(--text-headline);font-weight:600;color:var(--c-text-primary)}
.jmoney__head--list{margin-bottom:var(--space-xs)}
.asks__row.jmoney__nextrow{grid-template-columns:24px minmax(0,1fr) auto;gap:var(--space-md);padding:var(--space-sm) 0;border-top:0}
.jmoney__next-icon{display:inline-flex;color:var(--c-text-secondary)}.jmoney__next-icon svg{width:20px;height:20px}
.jmoney__next-verb{min-height:36px;border-radius:var(--radius-pill);padding:0 var(--space-lg)}
.asks__row.pk-money{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;padding:var(--space-sm-md) 0;border-top:0;border-bottom:1px solid var(--c-separator)}
.asks__row.pk-money:hover{background:none}
html[data-shell="phone"] .money-register-rows{max-height:none;overflow:visible}

/* ── Customers (P1416, P1443): the peek goes; tiles read as chips; the ledger from 760 of content ── */
.cust-peek,.cust-peek:not([hidden]){display:none}
.chub-bar .jhub-tiles{order:3;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:5px}
.chub-bar .jhub-vchips{order:2}
.chub-bar .jhub-tile{flex:none;display:inline-flex;flex-direction:row;align-items:center;gap:5px;min-width:0;min-height:38px;padding:0 var(--space-md-lg);border:0;border-radius:var(--radius-pill);background:var(--c-control-fill);color:var(--c-text-secondary);font-size:var(--text-subhead);font-weight:600}
.chub-bar .jhub-tile .jhub-tile__value{order:2;font-size:inherit;font-weight:inherit;color:inherit}
.chub-bar .jhub-tile.is-on{background:var(--c-brand-primary);color:var(--c-on-brand)}
html[data-shell="phone"] #cust-add-topbar{display:none}
html[data-shell="phone"] .chub-row{grid-template-columns:minmax(0,1fr) var(--size-touch-min);margin:0 0 var(--space-md);padding:var(--space-lg);border:1px solid var(--c-card-border);border-radius:var(--radius-card);background:var(--c-card-background)}
html[data-shell="phone"] .chub-row__main{grid-column:1}
html[data-shell="phone"] .chub-row__name strong{font-size:var(--text-headline)}
html[data-shell="phone"] .chub-row__line{font-size:var(--text-subhead)}
html[data-shell="phone"] .chub-row__money,html[data-shell="phone"] .chub-row__move{grid-column:1 / -1}
html[data-shell="phone"] .chub-row__money{justify-items:start;padding-top:var(--space-sm);border-top:1px solid var(--c-separator)}
html[data-shell="phone"] .chub-row .cust-row__more{grid-column:2;grid-row:1}
html[data-shell="phone"] .cust-move{min-height:44px;font-size:var(--text-subhead)}
/* The ledger (P1443, CustomerListView.swift:526-550): Customer · Reach · Relationship · Money · Next move,
   from 760 of content. Below it the row is the card and Reach / Relationship stay folded into it. */
.chub-row__reach,.chub-row__rel{display:none}
.chub-ledger-head{display:none}
@container content (min-width:760px){
  .chub-ledger-head,html[data-shell="rail"] .chub-row:not(.chub-card){display:grid;grid-template-columns:28px minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr) 128px 150px var(--size-touch-min);gap:var(--space-sm);align-items:center}
  .chub-ledger-head{padding:var(--space-sm) var(--space-md);font-size:var(--text-caption2);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--c-text-secondary);border-bottom:1px solid var(--c-separator)}
  html[data-shell="rail"] .chub-row:not(.chub-card)>.cust-select-box{grid-column:1}
  html[data-shell="rail"] .chub-row:not(.chub-card)>.chub-row__main{grid-column:2}
  html[data-shell="rail"] .chub-row:not(.chub-card)>.chub-row__reach{grid-column:3;display:grid;gap:2px;min-width:0;font-size:var(--text-caption);color:var(--c-text-secondary)}
  .chub-row__reach>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  html[data-shell="rail"] .chub-row:not(.chub-card)>.chub-row__rel{grid-column:4;display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-xs);min-width:0}
  html[data-shell="rail"] .chub-row:not(.chub-card)>.chub-row__money{grid-column:5}
  html[data-shell="rail"] .chub-row:not(.chub-card)>.chub-row__move{grid-column:6}
  html[data-shell="rail"] .chub-row:not(.chub-card)>.cust-row__more{grid-column:7}
  html[data-shell="rail"] .chub-row:not(.chub-card) .chub-row__name .cust-status,
  html[data-shell="rail"] .chub-row:not(.chub-card) .chub-row__main .chub-row__tags{display:none}
}

/* ── Record columns (P1444): job = main + 360 side from 760 of content; customer = main ≥480 + 320 ── */
@container content (min-width:760px){
  .ch--job .ch__grid{grid-template-columns:minmax(0,1fr) 360px;gap:var(--space-xl)}
}
@container content (min-width:824px){
  .ch--customer .ch__grid{grid-template-columns:minmax(480px,1fr) 320px;gap:var(--space-xl)}
}
@container content (max-width:759.98px){
  .ch--job .ch__grid{grid-template-columns:minmax(0,1fr)}
}
@container content (max-width:823.98px){
  .ch--customer .ch__grid{grid-template-columns:minmax(0,1fr)}
}

/* ── Touch tablets get the iPad scale (P1445, rule 169); laptops keep the Mac's 13 ── */
html[data-shell="rail"][data-touch="1"] body{font-size:var(--text-headline)}
html[data-shell="rail"][data-touch="1"] :is(.sec-head__verdict,.jf-li__tx span,.chub-row__line,.jhub-cards__count){font-size:var(--text-subhead)}
html[data-shell="rail"][data-touch="1"] :is(.cmdbar__input,.form-input,.form-select,.form-textarea,.filter-select,.filter-bar__search input){min-height:var(--size-touch-min);font-size:var(--text-callout)}
html[data-shell="rail"][data-touch="1"] :is(.dash-topbar__icon-btn,.jl__sort,.td-verb,.td-more,.td-head__btn,.rail__header,.btn,.hub-help__btn){min-height:var(--size-touch-min)}
html[data-shell="rail"][data-touch="1"] :is(.dash-topbar__icon-btn,.td-more,.td-head__btn,.hub-help__btn){min-width:var(--size-touch-min)}

/* ── The folded rail peeks on a swipe (P1446): the page dims 6% behind it ── */
.rail-peek-dim{position:fixed;inset:0;z-index:150;background:color-mix(in srgb,var(--c-text-primary) 6%,transparent);animation:fadeIn 150ms ease}
.rail-peek-dim--pass{pointer-events:none}

/* ── Page sheets (P1447): 800×900, wide 1140×900, for editors and forms on the rail shell ≥1024 ── */
@media (min-width:1024px){
  html[data-shell="rail"] :is(.modal--page,.modal--record:not(:has(.cedit))){width:min(800px,100%);max-width:800px;height:min(900px,calc(var(--crm-viewport-height,100dvh) - 48px));max-height:none}
  html[data-shell="rail"] .modal--page.modal--wide{width:min(1140px,100%);max-width:1140px}
}

/* ── Records (P1422, P1423, P1440): the bar carries Back and the crumb, so the page's own "← …" goes ── */
.ch--job>.ch__back,.ch--customer>.ch__back{display:none}

/* The verb sheet (components/confirm-sheet.js) wears the themed dialog's card: MTThemedDialog.swift —
   radius 20, the dialog padding, 44px buttons at 16px. Inline, centred in its panel, max 380. */
.csheet{max-width:var(--dialog-card-max-width,380px);margin:0 auto;padding:var(--dialog-card-padding,28px);border:1px solid var(--c-card-border);border-radius:var(--radius-xxl);background:var(--c-card-background);display:grid;gap:var(--space-sm-md)}
.csheet--danger{border-color:var(--c-danger)}
.csheet__note{font-size:var(--text-subhead);color:var(--c-text-primary);line-height:1.4}
.csheet__field{width:100%;min-height:44px;font-size:var(--text-callout)}
.csheet__field--danger{border-color:var(--c-danger)}
.csheet__buttons{display:grid;gap:var(--space-sm);margin-top:var(--space-xs)}
.csheet__buttons .btn{min-height:44px;font-size:var(--text-callout);justify-content:center}

/* Section verbs ("Visits", "Schedule", "See all") keep their size and gain a 44px hit area (rule 166). */
:is(html[data-shell="phone"],html[data-touch="1"]) :is(.jf-sec__verb,.pk-section__verb,.sec-head__verbs a,.jmoney__help summary){position:relative}
:is(html[data-shell="phone"],html[data-touch="1"]) :is(.jf-sec__verb,.sec-head__verbs a)::after{content:'';position:absolute;left:-4px;right:-4px;min-width:44px;top:50%;height:44px;transform:translateY(-50%)}

/* Jobs table cells stay table cells (P1442, JobsHubRowViews.swift:236-257). `.jhub-job{display:grid}`
   and `.jhub-step{display:flex}` turned the two <td>s into non-cells, which the table wrapped into ONE
   anonymous cell — the step slid under the title and every later column moved one to the left. */
.jhub-table td.jhub-job,.jhub-table td.jhub-step,.jhub-table td.jhub-next{display:table-cell}
.jhub-table td.jhub-job>span{display:block;min-width:0}
.jhub-table td.jhub-job .jhub-job__label{font-weight:600}
.jhub-table td.jhub-job .jhub-job__sub{font-size:var(--text-caption);color:var(--c-text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jhub-table td.jhub-step>*{margin-right:var(--space-xs)}
.jhub-table td.jhub-step .jhub-step__label{display:block}
.jhub-table td.jhub-next{text-align:right}

/* Money at phone width (P1404, P1417): "Updated for you" first; the register's own totals strip and
   its Work register repeat what the band and the list above already say — hub grammar, no fact twice. */
.jmoney__updates{margin:0 0 var(--space-md);padding-block:var(--space-sm)}
.jmoney__update{min-height:52px}
.jmoney__dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--c-badge)}
html[data-shell="phone"] #money-workspace :is(.money-strip,.money-register){display:none}

/* ── Customers at phone width (P1416): band · duplicate card · search · [view · sort · filter · ⋯] ·
   chips · "Needs you" · cards (native-customers.jpg) ── */
.chub-bar--phone .jhub-search{order:0}
.chub-band{margin:0 0 var(--space-md)}
.chub-band .pk-band__value{font-size:var(--text-title3)}
.chub-phone-row{display:flex;align-items:center;gap:var(--space-sm)}
.chub-phone-row__pick select{min-height:44px;padding:0 var(--space-md);border:0;border-radius:var(--radius-card);background:var(--c-control-fill);color:var(--c-text-primary);font:inherit;font-size:var(--text-callout);font-weight:600}
.chub-phone-row .jhub-filters-anchor{margin-left:auto}
.chub-phone-row__icon{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:none;color:var(--c-text-secondary);cursor:pointer}
html[data-shell="phone"] .chub-list{border:0;background:none;padding:0;box-shadow:none}
html[data-shell="phone"] .chub-rows{padding:0;margin:0;list-style:none}
.chub-group{display:flex;justify-content:space-between;padding:var(--space-lg) var(--space-xs) var(--space-sm);font-size:var(--text-subhead);color:var(--c-text-secondary);list-style:none}
html[data-shell="phone"] .chub-row.chub-card{display:block;margin:0 0 var(--space-md);padding:var(--space-lg);border:1px solid var(--c-card-border);border-radius:var(--radius-card);background:var(--c-card-background)}
.chub-card__main{display:grid;grid-template-columns:40px minmax(0,1fr) auto;column-gap:var(--space-md);row-gap:var(--space-sm);align-items:center;width:100%;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.chub-card__mono{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--radius-md);color:var(--c-on-brand);font-size:var(--text-subhead);font-weight:700}
.chub-card__who{display:flex;flex-direction:column;min-width:0}
.chub-card__who strong{font-size:var(--text-title3);font-weight:600;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chub-card__who small{font-size:var(--text-footnote);color:var(--c-text-secondary)}
.chub-card__chev{color:var(--c-text-tertiary)}
.chub-card__line{grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);font-size:var(--text-subhead);color:var(--c-text-secondary)}
.chub-card__meta{display:inline-flex;align-items:center;gap:var(--space-sm);min-width:0}
.chub-card__foot{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--c-separator)}
.chub-card__reach{display:flex;flex-direction:column;gap:2px;min-width:0;font-size:var(--text-subhead);color:var(--c-text-secondary)}
.chub-card__owed{color:var(--c-text-primary);font-weight:700}
.chub-card__move{flex:none;min-height:44px;padding:0 var(--space-xs);border:0;background:none;color:var(--c-brand-primary);font:inherit;font-size:var(--text-subhead);font-weight:600;cursor:pointer}
.dup-radar__title{display:none}
html[data-shell="phone"] .dup-radar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-sm) var(--space-md);padding:var(--space-lg);border:1px solid var(--c-card-border);border-radius:var(--radius-card);background:var(--c-card-background)}
html[data-shell="phone"] .dup-radar>svg{color:var(--c-warning)}
html[data-shell="phone"] .dup-radar__title{display:block;flex:1;font-size:var(--text-headline);font-weight:600;color:var(--c-warning)}
html[data-shell="phone"] .dup-radar__text{flex-basis:100%;font-size:var(--text-footnote);color:var(--c-text-secondary);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html[data-shell="phone"] .dup-radar__text strong,html[data-shell="phone"] .dup-radar__text b{font-weight:400}
html[data-shell="phone"] .dup-radar :is(#dup-compare,.dup-radar__dismiss){min-height:44px;padding:0 var(--space-lg);border-radius:var(--radius-md);font-size:var(--text-subhead);font-weight:600}
html[data-shell="phone"] .dup-radar .dup-radar__dismiss{border:0;background:var(--c-brand-tint);color:var(--c-brand-primary)}

/* ── Forms as full pages on a phone (P1426, GlassNavigationPage.swift:205-267) ── */
html[data-shell="phone"] .modal-backdrop:has(> .modal.is-page){padding:0}
html[data-shell="phone"] .modal-backdrop .modal.is-page{height:var(--crm-viewport-height,100dvh);max-height:none;border-radius:0;padding-bottom:var(--ph-safe-b);animation:ph-page-in 200ms ease-out}
html[data-shell="phone"] .modal-backdrop .modal.is-page::before{display:none}
html[data-shell="phone"] .modal.is-page>.modal__header{position:sticky;top:0;z-index:4;display:flex;align-items:center;gap:var(--space-sm);padding:calc(var(--ph-safe-t) + var(--space-sm)) var(--pk-gutter) var(--space-sm);background:var(--c-card-background);border-bottom:var(--pk-hairline) solid var(--c-separator);touch-action:auto}
html[data-shell="phone"] .modal.is-page .modal__close{order:-1;display:grid;place-items:center;width:44px;height:44px;margin-left:calc(var(--space-sm) * -1);color:var(--c-brand-primary)}
html[data-shell="phone"] .modal.is-page .modal__close svg{display:none}
html[data-shell="phone"] .modal.is-page .modal__close::before{content:'';width:11px;height:11px;margin-left:5px;border-left:2.5px solid currentColor;border-bottom:2.5px solid currentColor;transform:rotate(45deg)}
html[data-shell="phone"] .modal.is-page .modal__title{flex:1;min-width:0;font-size:var(--text-title3);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ph-form-save{display:none}
html[data-shell="phone"] .modal.is-page .ph-form-save{display:inline-flex;align-items:center;min-height:44px;padding:0 var(--space-xs);border:0;background:none;color:var(--c-brand-primary);font:inherit;font-size:var(--text-subhead);font-weight:700;cursor:pointer}
@keyframes ph-page-in{from{transform:translateX(24px);opacity:.5}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){html[data-shell="phone"] .modal-backdrop .modal.is-page{animation:none}}
html[data-shell="phone"][data-form="open"] .dash-topbar__new{display:none}

/* The verb sheet ("More ▾" on a phone, components/verb-sheet.js) */
.verb-sheet{display:grid}
.verb-sheet__row--danger .pk-row__title{color:var(--c-danger)}

/* ── Records (P1422, P1423): the native job page at phone width (native-job.jpg) ── */
html[data-shell="phone"] .ch--job .ch-hero{display:grid;grid-template-columns:60px minmax(0,1fr);gap:var(--space-md);padding:var(--space-lg);align-items:center}
html[data-shell="phone"] .ch--job .ch-hero__mono{width:60px;height:60px;border-radius:var(--radius-card)}
html[data-shell="phone"] .ch--job .ch-hero__name{font-size:var(--text-title3);font-weight:700;letter-spacing:0;line-height:1.25}
html[data-shell="phone"] .ch--job .ch-hero>:not(.ch-hero__mono):not(.ch-hero__id){grid-column:1 / -1}
html[data-shell="phone"] .ch--job .jf-hero .jf-bar{display:flex;align-items:center;gap:4px}
html[data-shell="phone"] .ch--job .jf-hero__status{margin-top:0;font-size:var(--text-footnote);font-weight:600;color:var(--c-text-primary)}
html[data-shell="phone"] .ch--job .jf-flow{font-size:var(--text-footnote)}
/* Next action: a white card led by a warning rule, its icon tile and ONE filled button. */
html[data-shell="phone"] .ch--job .jf-next,.ch--next-in-side .is-in-side .jf-next{height:auto;background:var(--c-card-background);border:1px solid var(--c-card-border);border-left:4px solid var(--c-brand-primary);border-radius:var(--radius-card);padding:var(--space-lg)}
html[data-shell="phone"] .ch--job .jf-next--warn,.ch--next-in-side .is-in-side .jf-next--warn{border-left-color:var(--c-warning)}
html[data-shell="phone"] .ch--job .jf-next--error,.ch--next-in-side .is-in-side .jf-next--error{border-left-color:var(--c-danger)}
html[data-shell="phone"] .ch--job .jf-next__k{font-size:var(--text-caption2);letter-spacing:.06em;color:var(--c-warning)}
html[data-shell="phone"] .ch--job .jf-next__title{font-size:var(--text-headline);font-weight:600}
html[data-shell="phone"] .ch--job .jf-next__why{font-size:var(--text-subhead)}
html[data-shell="phone"] .ch--job .jf-next__go{align-self:center;min-height:44px;margin-top:var(--space-md);padding:0 var(--space-xl);font-size:var(--text-subhead)}
/* The action grid: one card, two columns of tinted-icon tiles (Call · Message · Log today · Change order ·
   Upload a file · More); "More ▾" opens a bottom sheet. */
html[data-shell="phone"] .jf-tiles .jdeck,html[data-shell="phone"] .ch-deck .jdeck{margin:0;padding:var(--space-md);border:1px solid var(--c-card-border);border-radius:var(--radius-card);background:var(--c-card-background)}
html[data-shell="phone"] .jdeck .jdeck__tile{min-height:52px;padding:var(--space-sm) var(--space-md);gap:var(--space-sm-md)}
html[data-shell="phone"] .jdeck .jdeck__icon{width:32px;height:32px;border-radius:var(--radius-md);background:color-mix(in srgb,var(--jdeck-tint) 14%,transparent);color:var(--jdeck-tint)}
html[data-shell="phone"] .jdeck .jdeck__title{font-size:var(--text-subhead);font-weight:600}
html[data-shell="phone"] .jf-tabs{position:sticky;top:0;z-index:3;background:var(--c-background)}

/* ── P1444: the Next action leads the side column on the rail shell (components/record-columns.js) ── */
.ch--next-in-side .jf-top{grid-template-columns:minmax(0,1fr)}
.ch__side>.is-in-side{margin:0}
.ch__side>.is-in-side .jf-next{height:auto}

/* ── P1442: the job beside the list from 1100 of content. The list is its own container, so beside a
   record it draws cards (its column is under 1050), as JobsHubList.swift does. ── */
.jhub-split{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-lg);align-items:start}
.jhub-split.is-beside{grid-template-columns:minmax(340px,0.8fr) minmax(0,1.2fr)}
.jhub-list{container:jhublist / inline-size}
.jhub-beside{container:content / inline-size;min-width:0;position:sticky;top:0;max-height:calc(var(--crm-viewport-height,100dvh) - var(--d-topbar-h,56px) - var(--space-xxl));overflow:auto}
.jhub-beside[hidden]{display:none}
.is-picked{outline:2px solid var(--c-brand-primary);outline-offset:-2px}
@container jhublist (max-width:1049.98px){
  .jhub-table-wrap,.jhub-foot>span:first-child{display:none}
}
@container jhublist (min-width:1050px){
  .jhub-cards{display:none}
}
.csheet__go,.csheet__cancel{width:100%}
.chub-card__phone{font-variant-numeric:tabular-nums}
.verb-sheet__row{min-height:52px;padding-inline:var(--space-xs)}
.jmoney__list{display:grid}

/* Round 35 walk (2026-10-29): the 44px floor on the hub chips, record tabs and menu buttons the census
   found at 36–40px (rule 166). Chips stay capsules; only their height grows to the touch minimum. */
:is(html[data-shell="phone"],html[data-touch="1"]) body :is(.hub-band__empty-verb,.jf-tab,.jhub-vchip){min-height:var(--size-touch-min)}
:is(html[data-shell="phone"],html[data-touch="1"]) body :is(.jb-custline__menu){min-width:var(--size-touch-min)}
/* Customers' view row fits the phone width: the two menus share what is left after the two icons. */
html[data-shell="phone"] .chub-phone-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) var(--size-touch-min) var(--size-touch-min);gap:var(--space-xs);align-items:center}
html[data-shell="phone"] .chub-phone-row > *{min-width:0}
/* The 38px capsules (native chip :530-546) keep their look; a ::after reaches the 44px hit. */
:is(html[data-shell="phone"],html[data-touch="1"]) body :is(.chip,.people-chip,.xp-chip){position:relative}
:is(html[data-shell="phone"],html[data-touch="1"]) body :is(.chip,.people-chip,.xp-chip)::after{content:'';position:absolute;left:0;right:0;top:50%;height:var(--size-touch-min);transform:translateY(-50%)}
/* Job record (walk 2026-10-29): the Work/Money/Docs tabs, the punch "Add" verb and the visit's Reschedule menu. */
:is(html[data-shell="phone"],html[data-touch="1"]) body .jf-tab{min-width:var(--size-touch-min)}
:is(html[data-shell="phone"],html[data-touch="1"]) body .jb-visit__move > summary{display:flex;align-items:center;min-height:var(--size-touch-min)}
:is(html[data-shell="phone"],html[data-touch="1"]) body .jb-visit__move button{min-height:var(--size-touch-min)}
/* Walk 2026-10-29: the title takes what is left (flex-basis 0) so the circles never wrap under it, and the
   bar's "?" is a 34px circle like search (its 44px floor comes from a ::after, not from its box). */
html[data-shell="phone"] .dash-topbar .hub-help__btn{position:relative;width:34px;height:34px;min-width:34px;min-height:34px;padding:0}
html[data-shell="phone"] .dash-topbar .hub-help__btn::after{content:'';position:absolute;inset:-6px}
/* Walk 2026-10-29: a form opened as a phone page is ONE column. A field placed in column 2 on the
   desktop grid made an implicit track and squeezed column 1 to 0 (labels drew over the inputs). */
html[data-shell="phone"] .modal .form-grid{grid-template-columns:minmax(0,1fr)}
html[data-shell="phone"] .modal .form-grid > *{grid-column:1/-1 !important}/* beats the inline "span 2" */
/* A checkbox / radio row is its label: the label is the 44px target (rule 166). */
:is(html[data-shell="phone"],html[data-touch="1"]) body label:has(> input:is([type="checkbox"],[type="radio"])){display:inline-flex;align-items:center;gap:var(--space-sm);min-height:var(--size-touch-min)}
:is(html[data-shell="phone"],html[data-touch="1"]) body .setup-card__dismiss{position:relative}
:is(html[data-shell="phone"],html[data-touch="1"]) body .setup-card__dismiss::after{content:'';position:absolute;left:50%;top:50%;width:var(--size-touch-min);height:var(--size-touch-min);transform:translate(-50%,-50%)}
/* The fold chevron stays 28 like native (AppRail.swift:210); on touch its hit reaches 44. */
html[data-touch="1"] .rail__fold{position:relative}
html[data-touch="1"] .rail__fold::after{content:'';position:absolute;left:50%;top:50%;width:var(--size-touch-min);height:var(--size-touch-min);transform:translate(-50%,-50%)}
/* Customers on a touch tablet (walk 2026-10-29): the duplicate card's buttons and the tile chips reach 44. */
html[data-touch="1"] :is(.dup-radar__dismiss,.dup-radar__compare,.jhub-tile){min-height:var(--size-touch-min)}
/* Walk 2026-10-29 (laptop): one door per fact and verb. The page-named New pill ("New customer") already
   adds a customer, so the bar's second "Add Customer" button stands down; Money's totals strip under the
   rows repeats the band at the top (hub grammar: no fact twice). */
.dash-topbar:has(.dash-topbar__new:not(:empty)) #cust-add-topbar,
.dash-topbar:has(.dash-topbar__new:not(:empty)) .dash-topbar__actions:has(> #cust-add-topbar:only-child){display:none}
#money-now:not(:empty) ~ #money-workspace .money-strip{display:none}

/* Walk 2026-10-29 (Builder A): A RECORD PANE IS A PUSHED PAGE ON A PHONE (components/topbar.js
   syncPanePage). The hub around it and the pane's own head stand down; the bar carries ‹ and the title;
   the pane takes the full width; its fields are 16px/44 and its verbs 44; its footer rides above the tab bar. */
html[data-shell="phone"] [data-pane-sibling]{display:none!important}
html[data-shell="phone"] .rpane__head,html[data-shell="phone"] .rpane__keys{display:none}
html[data-shell="phone"] .rpane{width:100%;max-width:none;max-height:none;margin:0;border:0;border-radius:0;background:transparent;overflow:clip}
html[data-shell="phone"] .rpane__body{overflow:visible;padding:0}
html[data-shell="phone"] .rec-split__pane:not([hidden]){display:block;width:100%}
html[data-shell="phone"] .rpane :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]),select,textarea){font-size:var(--text-callout)!important;min-height:44px}
html[data-shell="phone"] .rpane :is(.record__action,.btn,button:not(.pk-chip)){min-height:44px}
html[data-shell="phone"] .rpane__foot{position:sticky;bottom:calc(var(--ph-tabbar-room) - var(--space-lg));z-index:4;padding:var(--space-sm-md) 0;background:var(--c-background)}
/* Guided flows: a kit footer rides above the tab bar too; a guided flow is a form, so html[data-form]
   (components/form-page.js) hides the bar and the footer drops into the home-bar safe area. */
html[data-shell="phone"]:not([data-form="open"]) .pk-foot{bottom:calc(var(--ph-tabbar-room) - var(--space-lg))}
html[data-shell="phone"][data-form="open"] :is(.pf-foot,.ac-file__foot,.pk-foot){bottom:0;padding-bottom:calc(var(--space-sm-md) + var(--ph-safe-b))}
/* A hub's other segment (Money › Sell) is a pushed page: the bar carries ‹ and its name (topbar.js
   openHubSegment), so the in-page "‹ Money" stands down. */
html[data-shell="phone"] .hub-back{display:none}
/* Sell desk on a phone (follow-up): the metric band spans the row as the app's 2×2 (HubMetricBand
   compact, DestinationHubKit.swift:18-57), and the sort control sits beside its direction, one row
   under the search, instead of three stacked full-width controls. */
html[data-shell="phone"] .stat-grid:has(> .hub-band){grid-template-columns:minmax(0,1fr)}
html[data-shell="phone"] .stat-grid > .hub-band{grid-template-columns:repeat(2,minmax(0,1fr))}
html[data-shell="phone"] .filter-bar:has(> .filter-select){flex-direction:row;flex-wrap:wrap;gap:var(--space-sm)}
html[data-shell="phone"] body .dash-content .filter-bar:has(> .filter-select) > .filter-bar__search{flex:1 0 100%;width:100%}
html[data-shell="phone"] body .dash-content .filter-bar:has(> .filter-select) > :is(.filter-select,.btn){flex:1 1 0;min-width:0;width:auto}

/* ══════════════════════════════════════════════════════════════════════════════
   Round 37 console — the owner console in the kit grammar (rules 205, 207, 208, 211)
   One block. The console's pages are pk-band · pk-section cards · pk-row rows; what the kit does not
   have is here under `adm-` (pages), `fsheet` (the one confirm sheet) and the console rail's badge.
   No inline style in views/admin sets layout or colour: a value that varies per row rides a custom
   property (`--v` on a bar) and these rules read it.
   ══════════════════════════════════════════════════════════════════════════════ */
.adm{display:grid;gap:var(--space-md);min-width:0;max-width:1180px}
.adm-head{display:grid;gap:var(--space-xxs);min-width:0}
.adm-head__sub{margin:0;font-size:var(--text-subhead);color:var(--c-text-secondary);line-height:1.4}
html[data-shell="phone"] .adm-head .pk-largetitle{display:none}
.adm-head .pk-seg{margin:var(--space-sm) 0 0}
.adm-asof{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-sm);font-size:var(--text-footnote);color:var(--c-text-secondary)}
.adm-asof .pk-verb{min-height:36px}
.adm-card{display:grid;gap:var(--space-xs);min-width:0}
.adm-card > .pk-band{margin:0}
.adm-line{margin:0;font-size:var(--text-footnote);line-height:1.45;color:var(--c-text-secondary);overflow-wrap:anywhere}
.adm-line--warn{color:var(--c-warning)}
.adm-line--bad{color:var(--c-danger)}
.adm-line--good{color:var(--c-success)}
.adm-callout{margin:0;padding:var(--space-sm-md) var(--space-md);border-radius:var(--radius-md);background:var(--c-warning-tint);color:var(--c-text-primary);font-size:var(--text-footnote);line-height:1.45}
.adm-callout--bad{background:var(--c-danger-tint)}
.adm-callout--info{background:var(--c-info-tint)}
.adm-callout--good{background:var(--c-success-tint)}
.adm-verbs{display:flex;flex-wrap:wrap;gap:var(--space-sm);padding:var(--space-xs) 0 0}
.adm-verbs .pk-verb{flex:0 1 auto}
.adm-verb--danger{color:var(--c-danger)}
.adm-kv{display:grid;min-width:0}
.adm-kv__row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);min-height:44px;padding:var(--space-xs) 0;border-bottom:var(--pk-hairline) solid var(--c-separator)}
.adm-kv__row:last-child{border-bottom:0}
.adm-kv__k{flex:none;max-width:45%;font-size:var(--text-subhead);color:var(--c-text-secondary)}
.adm-kv__v{min-width:0;font-size:var(--text-subhead);font-weight:600;color:var(--c-text-primary);text-align:right;overflow-wrap:anywhere}
.adm-qrow{display:flex;align-items:center;gap:var(--space-md);min-height:60px;padding:var(--space-sm) 0;border-bottom:var(--pk-hairline) solid var(--c-separator)}
.adm-qrow:last-child{border-bottom:0}
.adm-qrow__bar{flex:none;align-self:stretch;width:4px;border-radius:var(--radius-pill);background:var(--c-danger)}
.adm-qrow__bar--warn{background:var(--c-warning)}
.adm-qrow__open{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;color:inherit;text-decoration:none}
.adm-qrow .pk-verb{flex:none}
.adm-avatar{flex:none;display:grid;place-items:center;width:var(--size-list-icon);height:var(--size-list-icon);border-radius:50%;background:var(--adm-id,var(--c-accent-brown));color:var(--c-on-brand);font-size:var(--text-caption);font-weight:700}
.adm-avatar--lg{width:44px;height:44px;font-size:var(--text-subhead)}
.adm-id0{--adm-id:var(--c-identity-0)}.adm-id1{--adm-id:var(--c-identity-1)}.adm-id2{--adm-id:var(--c-identity-2)}
.adm-id3{--adm-id:var(--c-identity-3)}.adm-id4{--adm-id:var(--c-identity-4)}.adm-id5{--adm-id:var(--c-identity-5)}
.adm-hero{display:flex;align-items:center;gap:var(--space-md);min-width:0}
.adm-hero__copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.adm-hero__name{margin:0;font-size:var(--text-title3);font-weight:700;color:var(--c-text-primary);overflow-wrap:anywhere}
.adm-hero__sub{font-size:var(--text-footnote);color:var(--c-text-secondary)}
.adm-hero .pk-verb{margin-left:auto}
.adm-filter{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-sm);min-width:0}
.adm-filter .pk-chips{margin:0;flex:1 1 auto;min-width:0}
.adm-codechip{text-decoration:none}
.adm-search{display:flex;gap:var(--space-sm);min-width:0}
.adm-search .form-input{flex:1;min-width:0;min-height:44px}
.adm-split{display:grid;gap:var(--space-md);min-width:0;align-items:start}
.adm-split--open > .adm-split__list{display:none}
@container content (min-width:860px){
  .adm-split--open{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
  .adm-split--open > .adm-split__list{display:grid}
}
html[data-shell="phone"] .adm-split--open > .adm-split__list{display:none}
.adm-split__list,.adm-split__record{display:grid;gap:var(--space-md);min-width:0}
.adm-table-wrap{overflow-x:auto;min-width:0}
.adm-table-wrap table{width:100%}
.adm-pre{margin:0;padding:var(--space-sm);border-radius:var(--radius-md);background:var(--c-control-fill);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--text-caption);white-space:pre-wrap;overflow-wrap:anywhere;max-height:240px;overflow:auto}
.adm-mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--text-footnote);overflow-wrap:anywhere}
.adm-form{display:grid;gap:var(--space-sm);min-width:0}
.adm-form--row{grid-template-columns:repeat(auto-fit,minmax(min(160px,100%),1fr));align-items:end}
.adm-field{display:grid;gap:var(--space-xxs);min-width:0;font-size:var(--text-footnote);font-weight:600;color:var(--c-text-secondary)}
.adm-field :is(.form-input,select,textarea){width:100%;min-height:44px}
.adm-field textarea{min-height:120px}
.adm-check{display:flex;align-items:center;gap:var(--space-sm);min-height:44px;font-size:var(--text-subhead);color:var(--c-text-primary)}
.adm-bars{--v:0%;display:flex;align-items:flex-end;gap:2px;height:72px;min-width:0;overflow:hidden}
.adm-bars__bar{flex:1 1 0;min-width:1px;height:var(--v,0%);border-radius:var(--radius-xs-sm) var(--radius-xs-sm) 0 0;background:var(--c-brand-primary)}
.adm-bars__bar--bad{background:var(--c-danger)}
.adm-bars__bar--warn{background:var(--c-warning)}
.adm-meter{--v:0%;height:6px;border-radius:var(--radius-pill);background:var(--c-control-fill);overflow:hidden}
.adm-meter__fill{height:100%;width:var(--v,0%);background:var(--c-brand-primary)}
.adm-meter__fill--bad{background:var(--c-danger)}
.adm-num{font-variant-numeric:tabular-nums}
.adm-muted{color:var(--c-text-secondary)}
.adm-tags{display:flex;flex-wrap:wrap;gap:var(--space-xs)}
.adm-details > summary{display:flex;align-items:center;min-height:44px;cursor:pointer;font-size:var(--text-subhead);font-weight:600;color:var(--c-brand-primary)}
.adm-refused{display:grid;justify-items:center;gap:var(--space-sm);max-width:460px;margin:var(--space-xxxl) auto;text-align:center}
.adm-refused__title{margin:0;font-size:var(--text-title3);font-weight:700;color:var(--c-text-primary)}
.adm-refused p{margin:0;font-size:var(--text-subhead);line-height:1.5;color:var(--c-text-secondary)}
.adm-more{justify-self:start}
/* The console rail: the amber badge folds to its dot (rail-fold rule), the footer names the level. */
.admin-rail__scope-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rail--folded:not(.rail--peeking) .admin-rail__scope{justify-content:center;padding-inline:0}
.rail--folded:not(.rail--peeking) .admin-rail__scope-text{display:none}
/* The avatar sheet in the console: the amber badge under the name. */
.adm-sheet-badge{display:inline-flex;align-items:center;gap:var(--space-xs-sm);min-height:28px;padding:0 var(--space-sm-md);border-radius:var(--radius-pill);background:var(--c-warning-tint);color:var(--c-warning);font-size:var(--text-caption2);font-weight:700;letter-spacing:.05em}
.adm-sheet-badge i{width:6px;height:6px;border-radius:50%;background:var(--c-warning)}
/* The one confirm sheet (components/confirm-sheet.js): preview · reason · phrase · apply. */
.fsheet{display:grid;gap:var(--space-sm-md);min-width:0}
.fsheet__note{margin:0;font-size:var(--text-subhead);line-height:1.4;color:var(--c-text-primary)}
.fsheet__prev{display:grid;gap:var(--space-xs);padding:var(--space-sm-md) var(--space-md);border-radius:var(--radius-md);background:var(--c-brand-tint)}
.fsheet__prev--refused{background:var(--c-warning-tint)}
.fsheet--danger .fsheet__prev:not(.fsheet__prev--refused){background:var(--c-danger-tint)}
.fsheet__k{font-size:var(--text-footnote);font-weight:700;color:var(--c-text-secondary)}
.fsheet__list{display:grid;gap:2px;margin:0;padding:0;list-style:none;font-size:var(--text-subhead);color:var(--c-text-primary)}
.fsheet__change{overflow-wrap:anywhere}
.fsheet__who{font-weight:600}
.fsheet__same,.fsheet__more{font-size:var(--text-footnote);color:var(--c-text-tertiary)}
.fsheet__label{display:grid;gap:var(--space-xxs);font-size:var(--text-footnote);font-weight:600;color:var(--c-text-secondary)}
.fsheet__req{color:var(--c-danger)}
.fsheet__field{width:100%;min-height:44px;font-size:var(--text-callout)}
.fsheet__field--danger{border-color:var(--c-danger)}
.fsheet__reach{display:flex;align-items:flex-start;gap:var(--space-sm);margin:0;font-size:var(--text-footnote);color:var(--c-text-secondary)}
.fsheet__reach svg{flex:none;width:17px;height:17px;color:var(--c-success)}
.fsheet__reach--done{font-size:var(--text-subhead);color:var(--c-text-primary)}
.fsheet__error{margin:0;font-size:var(--text-footnote);color:var(--c-danger)}
.fsheet__buttons{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--space-sm)}
.fsheet__buttons .pk-verb{width:100%}
.fsheet__buttons .pk-verb:disabled{opacity:.55;cursor:default}
.fsheet__go--danger{background:var(--c-danger);border-color:var(--c-danger);color:var(--c-on-brand)}
/* Customers: the open record's row, and on a phone a record is the page (the hub frame stands down). */
.pk-row[data-current="true"]{background:var(--c-brand-tint)}
html[data-shell="phone"] [data-admin-console]:has(.adm-split--open) > .adm-head{display:none}
/* View as (P1584): the console's sheet with the loud amber frame (law D7: inset 0 0 0 4px). */
.adm-viewas-modal{box-shadow:inset 0 0 0 4px var(--c-warning)}
.adm-viewas{display:grid;gap:var(--space-md);min-width:0}
.adm-viewas__bar{position:sticky;top:0;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-sm-md);padding:var(--space-sm-md) var(--space-md);border-radius:var(--radius-md);background:var(--c-warning);color:var(--c-on-brand)}
.adm-viewas__title{flex:1 1 200px;font-size:var(--text-subhead);font-weight:700}
.adm-viewas__clock{font-size:var(--text-title3);font-weight:700;font-variant-numeric:tabular-nums}
/* Health hub (Round 37): the delivery chart's date axis, a release note's tagged line, two previews
   side by side (release note app/web, audit before/after), one audit entry (row + its details). */
.adm-health-axis{display:flex;justify-content:space-between;gap:var(--space-sm);font-size:var(--text-caption2);color:var(--c-text-tertiary)}
.adm-health-tagged{display:flex;align-items:flex-start;gap:var(--space-sm);padding:var(--space-xxs) 0;font-size:var(--text-subhead);line-height:1.45;color:var(--c-text-primary)}
.adm-health-previews{display:grid;gap:var(--space-md);grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));min-width:0}
.adm-health-entry{display:grid;min-width:0;border-bottom:var(--pk-hairline) solid var(--c-separator)}
.adm-health-entry:last-of-type{border-bottom:0}
.adm-health-entry > .pk-row{border-bottom:0}
/* Growth hub (views/admin/acquisition.js, inflight.js) */
.adm-growth-rank .adm-kv__k{flex:1 1 40%;min-width:0;max-width:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adm-growth-rank__meter{flex:1 1 30%;min-width:var(--space-xxl)}
.adm-growth-rank .adm-kv__v{flex:none;min-width:var(--space-xxl)}
.adm-growth-bar--empty{opacity:.15}
.adm-growth-axis{display:flex;justify-content:space-between;gap:var(--space-sm);font-size:var(--text-caption);color:var(--c-text-secondary)}
.adm-growth-place{min-height:36px;padding:0 var(--space-sm);font-size:var(--text-footnote)}
.adm-growth-notes{padding:var(--space-sm-md) 0 var(--space-md);border-bottom:var(--pk-hairline) solid var(--c-separator)}