/* DESIGN.md — open lists, restrained chrome, navy dark surfaces. */
.task-range, .travel-tools, .workspace-save-status { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-sm); }
.task-range { margin-block: var(--space-sm); }
.task-range button, .travel-tools button, .travel-stop-controls button, .travel-companion button, .quick-task-suggestion,
.workspace-save-status button { min-height: 44px; padding: var(--space-sm) var(--space-md); border: 0; border-radius: var(--radius-pill); background: var(--surface); color: var(--text-muted); font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-body-lh) var(--font-ui); cursor: pointer; }
.task-range button[aria-pressed=true] { background: var(--primary); color: var(--on-primary); }
body.todo-mobile .task-view-picker { position: relative; margin: 0; }
body.todo-mobile .task-view-picker > summary { display: flex; align-items: center; gap: var(--space-sm); width: fit-content; min-height: 44px; padding: var(--space-xs) 0; color: var(--text-muted); list-style: none; cursor: pointer; font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
body.todo-mobile .task-view-picker > summary::-webkit-details-marker { display: none; }
body.todo-mobile .task-view-picker > summary::after { content: '⌄'; flex-shrink: 0; color: var(--text-muted); }
body.todo-mobile .task-view-picker[open] > summary::after { transform: rotate(180deg); }
body.todo-mobile .task-view-options { position: absolute; z-index: 20; inset-inline-start: 0; top: 100%; width: min(22rem, calc(100vw - var(--space-md) * 2)); box-sizing: border-box; padding: var(--space-md); border: 1px solid var(--quiet-line); border-radius: var(--radius-md); background: var(--panel-surface); box-shadow: var(--shadow-pop); }
body.todo-mobile .task-view-options .task-range { display: flex; flex-wrap: nowrap; margin: 0 0 var(--space-sm); gap: var(--space-sm); }
body.todo-mobile .task-view-options .task-range button { flex: 1; min-width: 0; padding-inline: var(--space-sm); }
body.todo-mobile .task-view-options label { display: flex; flex-direction: column; gap: var(--space-sm); color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
body.todo-mobile .task-view-options input { width: 100%; min-width: 0; min-height: 44px; padding: var(--space-sm); border: 1px solid var(--quiet-line); border-radius: var(--radius-sm); background: var(--surface); color: var(--text); font: var(--phone-body-weight) var(--phone-body-size)/var(--phone-body-lh) var(--font-ui); }
body.todo-mobile .m-task-controls { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-sm); min-width: 0; }
body.todo-mobile .m-task-controls .m-task-tabs { flex: 1; min-width: 0; gap: var(--space-md); }
body.todo-mobile .m-task-controls .task-selection-head { flex: 0 0 auto; margin: 0; }
body.todo-mobile .m-task-controls .task-selection-head button { padding-inline: var(--space-sm); }
body.todo-mobile.task-selecting .m-task-controls .m-task-tabs { display: none; }
body.todo-mobile.task-selecting .m-task-controls .task-selection-head { flex: 1; min-width: 0; }
.workspace-save-status { height: 44px; min-height: 44px; margin: 0; flex-wrap: nowrap; color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.workspace-save-status > span { min-width: 0; max-height: 100%; overflow-y: auto; overflow-wrap: anywhere; }
.workspace-save-status > button { flex-shrink: 0; }
.auth-conflict-actions { display: grid; gap: var(--space-sm); }
.auth-conflict-actions[hidden] { display: none; }
.auth-conflict-actions button { min-height: 44px; }
body .auth-modal { padding: max(var(--space-md), env(safe-area-inset-top, 0px)) var(--space-md) max(var(--space-md), env(safe-area-inset-bottom, 0px)); }
body .auth-modal .auth-card { width: min(100%, 28rem); min-height: 0; max-height: calc(100dvh - max(var(--space-md), env(safe-area-inset-top, 0px)) - max(var(--space-md), env(safe-area-inset-bottom, 0px))); overflow-y: auto; overscroll-behavior: contain; }
body .auth-card .auth-title { margin-inline-end: calc(var(--space-xl) + var(--space-sm)); }
.workspace-save-status[hidden], .workspace-save-status button[hidden], .task-range[hidden], .quick-task-suggestion[hidden], .travel-companion[hidden], .travel-task-status[hidden] { display: none; }
/* Keep the same status slot before and after a save, including Retry states. */
.workspace-save-status[hidden] { display: flex; visibility: hidden; pointer-events: none; }
body :is(.sidebar-page-link, .sidebar-more-summary) { min-height: calc(var(--space-xl) + var(--space-sm)); box-sizing: border-box; }
body.calendar-page .calendar-task-open { min-height: 44px; cursor: pointer; border-radius: var(--radius-sm); }
body.calendar-page .calendar-task-open:focus-visible { outline: 2px solid var(--text); outline-offset: var(--space-xs); }
@media (max-width: 819px) {
  body.calendar-page .task-desktop-editor { align-items: end; height: var(--workspace-sheet-height, 100dvh); top: var(--workspace-sheet-top, 0px); bottom: auto; }
  body.calendar-page .task-desktop-panel { width: 100%; max-height: 100%; border-radius: var(--radius-lg) var(--radius-lg) 0 0; padding-bottom: env(safe-area-inset-bottom, 0px); }
}
body.has-bento-rail .guest-save-banner { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-sm); margin: 0; padding: var(--space-sm) 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
body.has-bento-rail .guest-save-title, body.has-bento-rail .guest-save-kicker { display: none; }
body.has-bento-rail .guest-save-hint { margin: 0; font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
body.has-bento-rail .guest-save-actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); }
body.has-bento-rail .guest-save-actions .btn { min-height: 44px; width: auto; min-width: 0; margin: 0; font-size: var(--phone-meta-size); padding: var(--space-sm) var(--space-sm); }
.quick-task-suggestion { text-align: left; margin-block: var(--space-sm); }
.quick-task-time { min-height: 44px; font: inherit; color: var(--text); background: var(--surface); border: 1px solid var(--quiet-line); border-radius: var(--radius-sm); padding: var(--space-sm); }
.travel-tools { margin-block: var(--space-sm); }
.travel-stop-controls { display: flex; flex-wrap: wrap; gap: var(--space-xs); grid-column: 1 / -1; }
.travel-stop-controls button { padding-inline: var(--space-sm); }
.travel-task-status { color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.travel-task-status a { display: inline-flex; min-height: 44px; align-items: center; color: var(--text); }
body.travel-page.travel-has-trip .travel-view-switch { display: flex; gap: var(--space-sm); flex-wrap: wrap; margin-block: var(--space-md); }
body.travel-page .travel-view-switch button { min-height: 44px; border: 0; border-radius: var(--radius-pill); padding: var(--space-sm) var(--space-md); background: var(--surface); color: var(--text-muted); font: inherit; cursor: pointer; }
body.travel-page .travel-view-switch button[aria-pressed=true] { background: var(--primary); color: var(--on-primary); }
body.travel-day-view .travel-workspace { display: none; }
.travel-companion { max-width: 48rem; margin-inline: auto; padding-bottom: var(--space-xl); }
.travel-companion header { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-sm); }
.travel-companion h2 { width: 100%; font: var(--phone-title-weight) var(--phone-title-size)/var(--phone-title-lh) var(--font-ui); margin: var(--space-md) 0; overflow-wrap: anywhere; }
.travel-companion h3 { margin: var(--space-lg) 0 var(--space-sm); font: var(--phone-task-weight) var(--phone-task-size)/var(--phone-task-lh) var(--font-ui); }
.travel-companion select, .travel-tools-body select { max-width: 100%; min-height: 44px; font: var(--phone-body-weight) var(--phone-body-size)/var(--phone-body-lh) var(--font-ui); padding: var(--space-sm); color: var(--text); background: var(--surface); border: 1px solid var(--quiet-line); border-radius: var(--radius-sm); }
.travel-companion a { display: inline-flex; align-items: center; min-height: 44px; color: var(--text); font: inherit; overflow-wrap: anywhere; }
.travel-day-stops { padding: 0; list-style: none; }
.travel-day-stops li { display: flex; gap: var(--space-sm); justify-content: space-between; align-items: center; padding-block: var(--space-md); border-bottom: 1px solid var(--quiet-line); }
.travel-day-stops li > div { min-width: 0; overflow-wrap: anywhere; }
.travel-day-stops p, .travel-day-booking p { margin-block: var(--space-xs); color: var(--text-muted); }
.travel-day-stops button { flex-shrink: 0; }
.travel-day-booking { padding-block: var(--space-sm); }
.travel-tools-sheet .travel-sheet-panel { max-height: 100%; overflow-y: auto; }
body.travel-page .travel-tools-sheet .travel-search-bar { display: grid; position: static; width: 100%; max-width: 100%; margin-top: var(--space-md); padding: 0; border: 0; background: transparent; box-shadow: none; }
.travel-tools-sheet .travel-tools-body { min-width: 0; }
.travel-tools-sheet textarea { width: 100%; box-sizing: border-box; min-height: 72px; font: inherit; color: var(--text); background: var(--surface); border: 1px solid var(--quiet-line); border-radius: var(--radius-sm); padding: var(--space-sm); }
body.todo-mobile #todo-list .todo-item { flex-wrap: nowrap; touch-action: pan-y pinch-zoom; }
body.todo-mobile #todo-list .todo-item.task-swipe-ready { overflow: hidden; }
body.todo-mobile #todo-list .todo-item.task-swipe-ready > :not(.task-swipe-actions) { transform: translateX(var(--task-swipe-offset, 0px)); transition: transform 160ms ease-out; }
body.todo-mobile #todo-list .todo-item.is-swiping > :not(.task-swipe-actions) { transition: none; }
.task-swipe-actions { position: absolute; z-index: 1; inset-block: 0; inset-inline-end: 0; display: flex; align-items: center; gap: var(--space-xs); width: max-content; max-width: calc(100% - 44px); clip-path: inset(0 0 0 calc(100% - var(--task-swipe-reveal, 0px))); transition: clip-path 160ms ease-out; }
.is-swiping > .task-swipe-actions { transition: none; }
body.todo-mobile #todo-list .todo-item[data-swipe=open] > .task-swipe-actions { transition: none; }
.task-swipe-actions button { flex-shrink: 0; min-width: 44px; min-height: 44px; padding: var(--space-sm); color: var(--text); background: var(--surface); border: 0; border-radius: var(--radius-sm); font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); cursor: pointer; }
body.todo-mobile #todo-list .todo-item[data-swipe=complete]::after { content: '✓'; position: absolute; inset-inline-start: var(--space-sm); top: 50%; transform: translateY(-50%); color: var(--success); }
body.todo-mobile #todo-list .todo-item.is-leaving { min-height: 0; }
@media (prefers-reduced-motion: reduce) {
  body.todo-mobile #todo-list .todo-item.task-swipe-ready > :not(.task-swipe-actions), .task-swipe-actions { transition: none; }
}
:root {
  --bg: #f3f5f9;
  --neutral: var(--bg);
  --surface: #eef2f8;
  --surface-muted: #e7edf7;
  --surface-hover: var(--surface-muted);
  --text: #172640;
  --secondary: #647189;
  --text-muted: color-mix(in srgb, var(--secondary) 88%, var(--text));
  --primary: #365cad;
  --on-primary: #ffffff;
  --primary-hover: #2c4d96;
  --accent: var(--primary);
  --accent-hover: var(--primary-hover);
  --accent-soft: var(--surface-muted);
  --content-surface: var(--surface);
  --panel-surface: #ffffff;
  --light-backdrop: linear-gradient(165deg, var(--bg) 0%, var(--panel-surface) 100%);
  --content-fill: var(--content-surface);
  --panel-fill: var(--panel-surface);
  --quiet-line: color-mix(in srgb, var(--text) 8%, transparent);
  --border: var(--quiet-line);
  --border-soft: var(--quiet-line);
  --glass-border: var(--quiet-line);
  --glass: var(--surface);
  --glass-strong: var(--surface-muted);
  --inner-light: 0 0 0 transparent;
  --shadow: none;
  --shadow-soft: none;
  --shadow-pop: 0 12px 36px color-mix(in srgb, var(--text) 12%, transparent);
  --overlay-ink: #000000; /* colors.overlay-ink, stable across themes */
  --modal-scrim: color-mix(in srgb, var(--overlay-ink) 42%, transparent);
  --glow: none;
  --radius: 18px;
  --radius-sm: 12px;
  --radius-md: var(--radius);
  --radius-lg: 28px;
  --font-display: var(--phone-font);
  --font-ui: var(--phone-font);
  --font-family: var(--phone-font);
  --type-display-size: var(--phone-display-size);
  --type-title-size: var(--phone-title-size);
  --type-body-size: var(--phone-body-size);
  --type-label-size: var(--phone-meta-size);
  --type-display-lh: var(--phone-display-lh);
  --type-body-lh: var(--phone-body-lh);
  --type-display-tracking: 0;
  --type-title-tracking: 0;
  --type-body-tracking: 0;
  --type-label-tracking: 0;
}

/* Legacy content stays solid; workspace material uses its own paint layer. */
:root, :root[data-theme="dark"] {
  --tertiary: #e5c235;
  --tertiary-deep: #c9a91c;
  --tertiary-hover: var(--tertiary-deep);
  --on-tertiary: #171717;
  --highlight: var(--tertiary);
  --danger: #a64b45;
  --success: #5a6b58;
  --liquid-sheen: none;
  --liquid-fill: var(--surface);
  --liquid-fill-strong: var(--surface-muted);
  --liquid-edge: var(--quiet-line);
  --liquid-shadow: none;
  --liquid-blur: none;
}
:root[data-theme="dark"] {
  --modal-scrim: color-mix(in srgb, var(--overlay-ink) 64%, transparent);
  --bg: #070d19;
  --neutral: var(--bg);
  --surface: #111e35;
  --surface-muted: #172640;
  --surface-hover: var(--surface-muted);
  --text: #e8eefb;
  --text-muted: #a5b4d0;
  --primary: #8baaff;
  --primary-hover: #b3c7ff;
  --on-primary: var(--bg);
  --secondary: #a5b4d0;
  --accent: var(--primary);
  --accent-hover: var(--text);
  --accent-soft: var(--surface-muted);
  --border: var(--quiet-line);
  --border-soft: var(--quiet-line);
  --glass-border: var(--quiet-line);
  --glass: var(--surface);
  --glass-strong: var(--surface-muted);
  --inner-light: 0 0 0 transparent;
  --panel-surface: #172640;
  --dark-horizon: #172846;
  --dark-depth: #03060d;
  --dark-backdrop: linear-gradient(165deg, var(--dark-horizon) 0%, var(--bg) 58%, var(--dark-depth) 100%);
  --danger: #dfa6a1;
  --success: #a4bca1;
  --shadow: none;
  --shadow-soft: none;
  --shadow-pop: 0 12px 36px color-mix(in srgb, var(--neutral) 40%, transparent);
  --glow: none;
}
html { background: var(--bg); }
body,
:root[data-theme="dark"] body { background: var(--bg); font-family: var(--font-ui); letter-spacing: 0; }
body::before,
body::after,
:root[data-theme="dark"] body::before,
:root[data-theme="dark"] body::after { display: none; }
/* Fixed paint only: long phone lists do not enlarge the gradient or blur. */
:root[data-theme="dark"] body::before {
  display: block;
  content: '';
  position: fixed;
  inset: 0;
  z-index: -2;
  background: var(--dark-backdrop);
  filter: none;
  transform: none;
  opacity: 1;
  pointer-events: none;
}

h1, h2, .title, .planner-title, .calendar-title, .tally-heading {
  font-family: var(--font-ui);
  font-weight: var(--phone-display-weight);
  letter-spacing: 0;
}
.app-greeting-title { color: var(--text); font-size: var(--type-title-size); }
.app-greeting-time { color: var(--text-muted); text-shadow: none; }
.tally-overview-label { color: var(--text-muted); }
body.calendar-page.calendar-week-workspace {
  --cal-accent: var(--primary);
  --cal-on-accent: var(--on-primary);
}
body.planner-page.planner-kanban {
  --pl-accent: var(--primary);
  --pl-on-accent: var(--on-primary);
  --pl-progress: var(--text-muted);
}
[class*="-kicker"], .teamwork-eyebrow { color: var(--text-muted); font-family: var(--font-ui); text-transform: none; }
.btn,
.sidebar-page-link,
.filter-btn,
.todo-category-pill { letter-spacing: 0; text-transform: none; }
.btn { font-size: var(--phone-action-size); font-weight: var(--phone-action-weight); }
.btn-primary,
.btn-category-submit,
.tally-fab,
.tally-empty-cta {
  background: var(--primary);
  color: var(--on-primary);
  border-color: transparent;
  box-shadow: none;
}
.btn-primary:hover,
.btn-category-submit:hover,
.tally-fab:hover,
.tally-empty-cta:hover { background: var(--primary-hover); color: var(--on-primary); box-shadow: none; }
.btn:hover,
.category-btn:hover,
.sidebar-page-link:hover,
.filter-btn:hover { transform: none; box-shadow: none; }
.todo-input:focus { transform: none; box-shadow: none; outline: 2px solid var(--text); outline-offset: 2px; }
.todo-agent-fab:hover,
body.has-bento-rail .todo-agent-fab-rail:hover { transform: none; box-shadow: none; }
.teamwork-title:focus,
.teamwork-copy:focus,
.teamwork-card-title:focus,
.teamwork-inline-input:focus,
.teamwork-form-input:focus,
.teamwork-member-input:focus,
.teamwork-task-input:focus {
  animation: none;
  transform: none;
  box-shadow: none;
  outline: 2px solid var(--text);
  outline-offset: 2px;
}
.teamwork-member-row:focus-within,
.teamwork-task-item:focus-within { transform: none; box-shadow: none; }
.teamwork-workspace-panel,
.teamwork-workspace-panel:hover { border-color: var(--quiet-line); background: transparent; transform: none; box-shadow: none; }
:where(button, input, select, textarea, a):focus-visible {
  outline: 2px solid var(--text);
  outline-offset: 3px;
}

/* Space and type separate reading sections instead of nested panels. */
body.todo-bento .today-tasks,
.mail-card,
.teamwork-card,
.tally-overview-card,
.tally-record-group-card,
.cal-shell .cal-composer,
.planner-shell {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.mail-hero.mail-card:hover,
.teamwork-hero.teamwork-card:hover,
.mail-connect-panel:hover,
.mail-inbox-panel:hover,
.planner-card:hover { transform: none; filter: none; box-shadow: none; }
.mail-message-item,
.planner-card { background: var(--surface); border-color: transparent; box-shadow: none; border-radius: var(--radius-sm); }
.planner-card.is-due-focus { border-color: var(--text-muted); }
.cal-shell .cal-week { background: var(--surface); border-color: var(--quiet-line); box-shadow: none; }
.m-task-panel,
.tally-sheet-panel,
.mail-booking-panel,
.travel-sheet-panel,
.todo-agent-panel,
.sidebar-inner { background: var(--panel-fill); border-color: var(--quiet-line); }
.m-task-backdrop { background: color-mix(in srgb, var(--neutral) 60%, transparent); }
.m-task-title,
.m-task-fields input,
.m-task-fields select,
#m-task-date { background: var(--surface); border-color: transparent; border-radius: var(--radius-sm); }
.m-task-title:focus { outline-color: var(--text); }
.m-date-chip { background: var(--surface); border-color: transparent; }
.m-date-chip[aria-pressed="true"] { color: var(--text); border-color: var(--text-muted); background: var(--surface-muted); }

body.todo-bento .today-tasks .todo-item,
body.todo-mobile .todo-item {
  background: transparent;
  border-color: transparent;
  border-radius: 0;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body.todo-bento .today-tasks .todo-item:hover,
body.todo-bento .today-tasks .todo-item.is-editing,
body.todo-mobile .todo-item:hover { background: var(--surface); }
.todo-category-pill { padding: 0; background: transparent; border: 0; color: var(--text-muted); font-weight: 400; }
.todo-travel-tag {
  display: inline-flex;
  align-self: flex-start;
  width: fit-content;
  padding: 0 var(--space-sm);
  border-radius: var(--radius-pill);
  background: var(--surface-muted);
  color: var(--text-muted);
  font-size: var(--phone-meta-size);
  font-weight: var(--phone-meta-weight);
  line-height: var(--phone-meta-lh);
}
.todo-main { gap: var(--space-xs); }
body.todo-mobile .todo-item { padding: var(--space-sm) 0; min-height: 4.5rem; gap: var(--space-sm); }
body.todo-mobile .todo-main.is-task-action { padding-block: var(--space-xs); border-radius: var(--radius-sm); }
body.todo-mobile .todo-item .todo-due { margin-top: 0; }
body.todo-mobile .todo-item .todo-due.is-overdue { color: var(--danger); }
body.todo-mobile .m-todo-list { gap: var(--space-sm); }
body.todo-mobile .todo-item input.todo-check[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 1.35rem;
  height: 1.35rem;
  margin: 0;
  border: 1.5px solid var(--text-muted);
  border-radius: 50%;
  background: transparent;
  display: grid;
  place-content: center;
}
body.todo-mobile .todo-item input.todo-check[type="checkbox"]:checked { background: var(--primary); border-color: var(--primary); }
body.todo-mobile .todo-item input.todo-check[type="checkbox"]:checked::after {
  content: "";
  width: var(--space-xs);
  height: var(--space-sm);
  border: solid var(--on-primary);
  border-width: 0 1.5px 1.5px 0;
  transform: translateY(-1px) rotate(45deg);
}
body.todo-mobile .m-shell { gap: var(--space-lg); padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 12rem); }
body.todo-mobile .m-top { align-items: flex-start; }
body.todo-mobile .m-greet { font-size: var(--phone-title-size); margin: 0 0 var(--space-sm); }
body.todo-mobile .m-page-date { color: var(--text-muted); }
body.todo-mobile .m-page-count { margin-top: var(--space-xs); }
body.todo-mobile .m-agent-toggle,
.todo-agent-fab,
.todo-agent-inline-trigger {
  background: var(--surface);
  border: 1px solid var(--quiet-line);
  box-shadow: none;
  border-radius: var(--radius-pill);
  color: var(--text);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.m-task-tabs {
  display: flex;
  gap: var(--space-md);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.m-task-tabs button { min-width: 2.75rem; min-height: 2.75rem; padding: var(--space-sm) 0; border-radius: 0; font-weight: 400; border-bottom: 2px solid transparent; }
.m-task-tabs button[aria-selected="true"] { background: transparent; color: var(--text); border-bottom-color: var(--text); box-shadow: none; }
.m-task-tabs button:focus-visible,
body.todo-mobile .todo-main.is-task-action:focus-visible,
.m-date-chip:focus-visible { outline-color: var(--text); }
.m-add-bar { left: auto; right: max(var(--space-md), calc((100vw - 28rem) / 2 + var(--space-md))); width: auto; transform: none; }
.m-add-task { padding-inline: var(--space-md); min-height: 2.75rem; gap: var(--space-sm); }

/* Quiet navigation surfaces; yellow remains confined to the identity mark. */
body.has-bento-rail { --bento-rail-bg: var(--surface); --bento-rail-fg: var(--text); }
:root[data-theme="dark"] body.has-bento-rail { --bento-rail-bg: var(--surface); --bento-rail-fg: var(--text); }
body.has-bento-rail .bento-rail { border: 1px solid var(--quiet-line); box-shadow: none; }
body.has-bento-rail .bento-rail-link { color: var(--text-muted); }
body.has-bento-rail .bento-rail-link.is-current,
body.has-bento-rail .bento-rail-link[aria-current="page"],
body.has-bento-rail .bento-rail-link[aria-expanded="true"] { color: var(--text); background: var(--surface-muted); }
body.has-bento-rail .bento-rail-link:hover,
body.has-bento-rail .bento-rail-link:focus-visible { color: var(--text); background: var(--surface-muted); }
body.has-bento-rail .bento-rail-link:focus-visible { outline: 2px solid var(--text); outline-offset: 2px; }
body.has-bento-rail .bento-rail-lens { display: none; }
body.todo-bento .today-status-pill { background: transparent; border: 0; box-shadow: none; backdrop-filter: none; }
body.todo-bento .today-status-pill.has-alert .daily-loop-pill-count { color: var(--danger); }
body.todo-bento .today-status-pill.is-empty#daily-loop-pill-overdue .daily-loop-pill-count { color: var(--text-muted); }
body.todo-bento .today-kicker { color: var(--text-muted); }

@media (min-width: 820px) {
  body.has-bento-rail .layout,
  body.planner-page.has-bento-rail .layout { width: min(1120px, 92vw); max-width: min(1120px, 92vw); margin-inline: auto; gap: var(--space-lg); }
  body.todo-bento .app.bento-shell.today-shell { width: min(48rem, 100%); max-width: min(48rem, 100%); padding: var(--space-lg) 0 var(--space-xl); gap: var(--space-lg); }
  body.todo-bento .today-hero { padding: 0; align-items: center; }
  body.todo-bento .today-title { font-size: var(--type-display-size); font-weight: var(--phone-display-weight); letter-spacing: 0; }
  body.todo-bento .today-tasks { padding: 0; }
  body.todo-bento .today-tasks .todo-list { gap: var(--space-sm); }
  body.todo-bento .today-tasks .todo-item { padding: var(--space-sm) 0; border-bottom-color: var(--quiet-line); }
  body.todo-bento .add-form-row { border-color: var(--quiet-line); }
  .calendar-app { padding: var(--space-lg) 0 var(--space-xl); }
  .tally-app { width: min(48rem, 100%); padding: var(--space-lg) 0 var(--space-xl); }
  .mail-page .main-area,
  .teamwork-page .main-area { padding: var(--space-lg) 0; }
  .mail-app { width: min(48rem, 100%); align-content: start; gap: var(--space-lg); }
  .teamwork-app { width: 100%; padding-top: 0; gap: var(--space-lg); }
  .mail-hero,
  .teamwork-hero,
  .mail-connect-panel,
  .mail-inbox-panel,
  .mail-manage-panel { padding: var(--space-md) 0; }
}
@media (max-width: 819px) {
  body.has-bento-rail .bento-rail { border: 0; }
  .tally-page .app-greeting,
  .planner-page .app-greeting,
  .mail-page .app-greeting,
  .teamwork-page .app-greeting { display: none; }
  body.has-bento-rail .bento-rail-link svg { width: 20px; height: 20px; }
  body.has-bento-rail .bento-rail-sr { font-size: var(--phone-meta-size); }
  body.calendar-page .calendar-list-item { background: transparent; border-color: transparent; border-radius: 0; box-shadow: none; backdrop-filter: none; }
  body.calendar-page .cal-composer { background: transparent; border-radius: 0; }
  body.calendar-page .cal-range { background: var(--surface); color: var(--text); }
  body.calendar-page .cal-week-day.is-selected { background: var(--surface); border-color: transparent; box-shadow: none; }
  body.calendar-page .cal-week-day.is-selected .cal-week-day-num { background: var(--primary); color: var(--on-primary); }
  body.calendar-page .reminder-form,
  .tally-quick { background: var(--surface); border-color: transparent; box-shadow: none; backdrop-filter: none; }
  .tally-overview-card { background: transparent; }
  .tally-empty-panel { background: transparent; border-color: transparent; box-shadow: none; }
  .tally-progress span { background: var(--text-muted); }
  .tally-progress span.is-over { background: var(--danger); }
  .mail-card,
  .teamwork-card { padding: var(--space-md) 0; border-radius: 0; }
  .tally-view-switch { background: transparent; border-color: transparent; }
  .tally-view-switch button.is-active { background: var(--surface); }
}
@media (hover: none) {
  body.todo-mobile .todo-item:hover { background: transparent; }
}

/* Luma-inspired frosted dock, including the explicit phone shell on wide screens. */
body.has-mobile-dock {
  --dock-fill: var(--surface);
  --dock-blur: blur(28px) saturate(1.15);
  --dock-edge: color-mix(in srgb, var(--text) 14%, transparent);
  --dock-tint: color-mix(in srgb, var(--text) 6%, transparent);
  --dock-selection: color-mix(in srgb, var(--neutral) 56%, transparent);
  --dock-muted: var(--text-muted);
}
:root[data-theme="dark"] body.has-mobile-dock {
  --dock-muted: color-mix(in srgb, var(--text-muted) 70%, var(--text));
}
@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
  body.has-mobile-dock {
    --dock-fill: color-mix(in srgb, var(--surface) 72%, transparent);
  }
}
/* Keep the tint and blur on the same fixed surface. */
body.has-mobile-dock.has-bento-rail .bento-rail {
  height: auto;
  max-height: none;
  pointer-events: auto;
  touch-action: pan-y pinch-zoom;
  background: linear-gradient(180deg, var(--dock-tint), transparent), var(--dock-fill);
  border: 1px solid var(--dock-edge);
  border-radius: var(--radius-pill);
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--text) 8%, transparent),
    0 8px 24px color-mix(in srgb, var(--on-tertiary) 12%, transparent);
  backdrop-filter: var(--dock-blur);
  -webkit-backdrop-filter: var(--dock-blur);
}
body.has-mobile-dock.has-bento-rail .bento-rail-nav {
  background: transparent;
  border: 0;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  padding: var(--space-xs);
  touch-action: pan-y pinch-zoom;
  user-select: none;
  -webkit-user-select: none;
}
body.has-mobile-dock.has-bento-rail .bento-rail-link {
  flex: 1 1 0;
  width: auto;
  -webkit-touch-callout: none;
  -webkit-user-drag: none;
  color: var(--dock-muted);
}
body.has-mobile-dock.has-bento-rail .bento-rail-link.is-current,
body.has-mobile-dock.has-bento-rail .bento-rail-link[aria-current="page"],
body.has-mobile-dock.has-bento-rail .bento-rail-link[aria-expanded="true"],
body.has-mobile-dock.has-bento-rail .bento-rail-link:focus-visible {
  color: var(--text);
  background: var(--dock-selection);
}
body.has-mobile-dock.has-bento-rail .bento-rail-nav.dock-ready .bento-rail-link {
  background: transparent;
  color: var(--dock-muted);
  -webkit-user-drag: none;
}
body.has-mobile-dock.has-bento-rail .bento-rail-nav.dock-ready .bento-rail-link[data-dock-active] {
  color: var(--text);
}
body.has-mobile-dock.has-bento-rail .bento-rail-lens {
  display: block;
  left: 0;
  top: var(--dock-active-y, 0px);
  width: var(--dock-active-width, 0px);
  height: var(--dock-active-height, 0px);
  transform: translate3d(var(--dock-active-x, 0px), 0, 0);
  opacity: var(--dock-active-visible, 0);
  background: var(--dock-selection);
  border-radius: var(--radius-pill);
  box-shadow: none;
  transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1), width 220ms ease, height 220ms ease;
}
body.has-mobile-dock.has-bento-rail .is-dragging .bento-rail-lens,
body.has-mobile-dock.has-bento-rail .dock-instant .bento-rail-lens { transition: none; }
@media (prefers-reduced-motion: reduce) {
  body.has-mobile-dock { --dock-blur: blur(16px); }
  body.has-mobile-dock.has-bento-rail .bento-rail-lens { transition: none; }
}
@media (prefers-reduced-transparency: reduce) {
  body.has-mobile-dock { --dock-fill: var(--surface); --dock-blur: none; }
  body.has-mobile-dock.has-bento-rail .bento-rail { background: var(--dock-fill); }
}

/* Mail: open inbox rows, optional selection, and a thumb-friendly reader. */
body.mail-page { --mail-batch-bottom: calc(env(safe-area-inset-bottom, 0px) + 6.5rem); }
body.mail-page .app-greeting { display: none; }
body.mail-page .mail-app { min-height: auto; padding: 0 0 var(--space-xl); gap: var(--space-lg); }
body.mail-page .mail-hero { padding: 0; gap: var(--space-xs); }
body.mail-page .mail-heading-row,
body.mail-page .mail-header-actions,
body.mail-page .mail-list-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); }
body.mail-page .mail-title { font-size: var(--type-display-size); font-weight: var(--phone-display-weight); }
body.mail-page .mail-icon-button { display: inline-flex; align-items: center; justify-content: center; width: 44px; min-height: 44px; padding: 0; border: 0; border-radius: var(--radius-pill); background: var(--surface); color: var(--text); cursor: pointer; list-style: none; }
body.mail-page .mail-icon-button::-webkit-details-marker { display: none; }
body.mail-page .mail-header-actions { position: relative; }
body.mail-page .mail-header-actions .notif-root { position: static; inset: auto; }
body.mail-page .mail-header-actions .notif-bell { width: 44px; height: 44px; border: 0; background: var(--surface); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
body.mail-page .mail-header-actions .notif-bell:focus-visible { outline: 2px solid var(--text); outline-offset: 3px; }
body.mail-page .mail-header-actions .notif-panel { z-index: 41; top: calc(100% + var(--space-sm)); width: min(22rem, calc(100vw - var(--space-md) * 2)); max-height: min(34rem, 65dvh); box-sizing: border-box; background: var(--panel-fill); border-radius: var(--radius-md); backdrop-filter: none; -webkit-backdrop-filter: none; }
body.mail-page .mail-icon-button[hidden],
body.mail-page .mail-message-check[hidden],
body.mail-page .mail-tool-action[hidden],
body.mail-page .mail-detail-sheet[hidden],
body.mail-page .mail-digest-actions[hidden] { display: none !important; }
body.mail-page .mail-icon-button:disabled { opacity: 0.5; cursor: wait; }
body.mail-page .mail-icon-button.is-loading svg { animation: mail-refresh-turn 1s linear infinite; }
body.mail-page .mail-account-picker { max-width: 100%; width: fit-content; min-height: 44px; padding: var(--space-sm) var(--space-md) var(--space-sm) 0; border: 0; border-radius: var(--radius-sm); background: var(--neutral); color: var(--text-muted); font: inherit; font-size: var(--phone-body-size); text-overflow: ellipsis; cursor: pointer; }
body.mail-page .mail-account-picker.is-single { appearance: none; }
body.mail-page .mail-refresh-meta { margin: 0; color: var(--text-muted); font-size: var(--phone-meta-size); font-variant-numeric: tabular-nums; }
body.mail-page .mail-tools { position: relative; }
body.mail-page .mail-tools-panel { position: absolute; right: 0; top: calc(100% + var(--space-sm)); z-index: 40; width: min(22rem, calc(100vw - var(--space-md) * 2)); max-height: min(34rem, 65dvh); overflow: auto; overscroll-behavior: contain; padding: var(--space-md); border: 1px solid var(--quiet-line); border-radius: var(--radius-md); background: var(--panel-fill); box-shadow: 0 8px 28px color-mix(in srgb, var(--on-tertiary) 12%, transparent); }
body.mail-page .mail-tools-heading { margin: 0 0 var(--space-sm); font-size: var(--phone-meta-size); font-weight: var(--phone-action-weight); color: var(--text-muted); }
body.mail-page .mail-tool-action { display: flex; align-items: center; min-height: 44px; padding: var(--space-sm) 0; border: 0; background: transparent; color: var(--text); font: inherit; font-size: var(--phone-action-size); cursor: pointer; text-align: left; }
body.mail-page .mail-manage-panel { padding: var(--space-md) 0 0; background: transparent; box-shadow: none; }
body.mail-page .mail-account-row { grid-template-columns: 1fr; padding: var(--space-sm) 0; border-radius: 0; background: transparent; box-shadow: none; border-top: 1px solid var(--quiet-line); }
body.mail-page .mail-account-provider { color: var(--text-muted); }
body.mail-page .mail-account-email { font-size: var(--phone-body-size); font-weight: var(--phone-task-weight); }
body.mail-page .mail-account-meta { font-size: var(--phone-meta-size); }
body.mail-page .mail-disconnect,
body.mail-page .mail-reauth-btn { min-height: 44px; box-shadow: none; font-size: var(--phone-meta-size); }
body.mail-page .mail-oauth-btn { min-height: 44px; box-shadow: none; font-size: var(--phone-action-size); background: var(--surface); border-color: transparent; }
body.mail-page .mail-oauth-btn:focus-visible { outline: 2px solid var(--text); outline-offset: 3px; }
body.mail-page .mail-connect-panel { padding: var(--space-lg) 0; box-shadow: none; }
body.mail-page .mail-connect-panel h2 { margin: 0; font-size: var(--type-title-size); font-weight: var(--phone-title-weight); }
body.mail-page .mail-connect-hint { font-size: var(--phone-body-size); line-height: var(--phone-body-lh); letter-spacing: 0; margin: var(--space-sm) 0 var(--space-md); }
body.mail-page .mail-signin-space { width: auto; min-height: 48px; padding-inline: var(--space-lg); margin: 0; }
body.mail-page.mail-connect-view .mail-app { min-height: calc(100dvh - var(--space-xl) * 2); grid-template-rows: auto 1fr; align-content: stretch; padding-bottom: 0; }
body.mail-page.mail-connect-view .mail-connect-panel:not([hidden]) { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; min-width: 0; padding: var(--space-md) 0 var(--space-xl); }
body.mail-page .mail-connect-mark { display: grid; place-items: center; flex-shrink: 0; width: calc(var(--space-lg) * 2); height: calc(var(--space-lg) * 2); margin-bottom: var(--space-md); border-radius: var(--radius-pill); background: var(--surface); color: var(--text-muted); }
body.mail-page .mail-connect-mark svg { width: var(--space-lg); height: var(--space-lg); }
body.mail-page .mail-connect-panel .mail-connect-hint { max-width: 34ch; margin: var(--space-sm) 0 var(--space-lg); }
body.mail-page .mail-connect-panel .mail-oauth-quick { width: auto; max-width: 100%; margin: 0; }
body.mail-page .mail-connect-panel .mail-oauth-btn { justify-content: center; min-height: 48px; padding-inline: var(--space-lg); }
@media (max-width: 819px) {
  body.mail-page.mail-connect-view .mail-app { min-height: calc(100dvh - 7rem - env(safe-area-inset-bottom, 0px) - var(--space-md) * 2); }
}
@media (max-width: 819px) and (max-height: 520px) {
  body.mail-page.mail-connect-view .mail-app { gap: var(--space-md); }
  body.mail-page.mail-connect-view .mail-connect-panel:not([hidden]) { padding: var(--space-sm) 0 var(--space-md); }
  body.mail-page .mail-connect-mark { width: var(--space-xl); height: var(--space-xl); margin-bottom: var(--space-sm); }
  body.mail-page .mail-connect-panel .mail-connect-hint { margin-bottom: var(--space-md); }
}
body.mail-page .mail-inbox-panel { padding: 0; }
body.mail-page .mail-digest-section { padding: 0 0 var(--space-md); margin: 0 0 var(--space-md); border-bottom: 1px solid var(--quiet-line); }
body.mail-page .mail-digest-section > summary { display: flex; align-items: center; justify-content: space-between; min-height: 44px; list-style: none; cursor: pointer; font-size: var(--phone-body-size); font-weight: var(--phone-task-weight); }
body.mail-page .mail-digest-section > summary::-webkit-details-marker { display: none; }
body.mail-page .mail-digest-chevron { color: var(--text-muted); transition: transform 160ms ease; }
body.mail-page .mail-digest-section[open] .mail-digest-chevron { transform: rotate(180deg); }
body.mail-page .mail-digest { margin: var(--space-sm) 0; padding: 0; border: 0; background: transparent; font-size: var(--phone-body-size); line-height: var(--phone-body-lh); letter-spacing: 0; }
body.mail-page .mail-digest ul { margin: 0; padding-inline-start: var(--space-md); }
body.mail-page .mail-digest li { padding-block: var(--space-xs); overflow-wrap: anywhere; }
body.mail-page .mail-digest-rest summary { min-height: 44px; display: flex; align-items: center; color: var(--text-muted); cursor: pointer; font-size: var(--phone-meta-size); }
body.mail-page .mail-digest-rest p { white-space: pre-wrap; overflow-wrap: anywhere; font-size: var(--phone-body-size); }
body.mail-page .mail-ai-banner { margin: var(--space-sm) 0; padding: 0; border: 0; background: transparent; color: var(--text-muted); font-size: var(--phone-meta-size); }
body.mail-page .mail-digest-actions .btn { min-height: 44px; font-size: var(--phone-action-size); letter-spacing: 0; }
body.mail-page .mail-list-head h2 { margin: 0; font-size: var(--phone-body-size); font-weight: var(--phone-task-weight); }
body.mail-page .mail-select-toggle { min-height: 44px; padding: var(--space-sm); border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--text-muted); font: inherit; font-size: var(--phone-action-size); cursor: pointer; }
body.mail-page .mail-select-toggle[aria-pressed="true"] { color: var(--text); }
body.mail-page .mail-message-list { gap: 0; margin: var(--space-sm) 0 0; }
body.mail-page .mail-message-item { grid-template-columns: minmax(0, 1fr); align-items: center; gap: var(--space-sm); padding: 0; background: transparent; border: 0; border-bottom: 1px solid var(--quiet-line); border-radius: 0; box-shadow: none; }
body.mail-page.mail-selecting .mail-message-item { grid-template-columns: 44px minmax(0, 1fr); }
body.mail-page .mail-message-check { min-height: 44px; width: 44px; justify-content: center; align-items: center; padding: 0; }
body.mail-page input[type="checkbox"] { accent-color: var(--text); width: var(--space-md); height: var(--space-md); cursor: pointer; }
body.mail-page .mail-message-main { width: 100%; min-height: 88px; padding: var(--space-md) 0; gap: var(--space-xs); border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--text); text-align: left; font: inherit; cursor: pointer; }
body.mail-page .mail-row-meta { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-md); min-width: 0; }
body.mail-page .mail-message-from { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: var(--phone-meta-weight); font-size: var(--phone-meta-size); color: var(--text-muted); }
body.mail-page .mail-message-time { flex-shrink: 0; font-size: var(--phone-meta-size); font-weight: var(--phone-meta-weight); font-variant-numeric: tabular-nums; }
body.mail-page .mail-message-main strong { font-size: var(--phone-task-size); font-weight: var(--phone-task-weight); line-height: var(--phone-task-lh); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
body.mail-page .mail-message-summary { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--phone-meta-size); font-weight: var(--phone-meta-weight); line-height: var(--phone-meta-lh); letter-spacing: 0; color: var(--text-muted); }
body.mail-page .mail-added-label { font-size: var(--phone-meta-size); font-weight: var(--phone-meta-weight); color: var(--success); }
body.mail-page .mail-status,
body.mail-page .mail-inline-status { font-size: var(--phone-meta-size); line-height: var(--phone-meta-lh); margin: var(--space-sm) 0; }
body.mail-page .mail-retry-btn { min-height: 44px; margin-inline-start: var(--space-sm); padding-inline: var(--space-md); letter-spacing: 0; }
body.mail-page .mail-today-link { color: var(--text); }
body.mail-page .mail-batch-bar { position: sticky; bottom: var(--space-md); z-index: 35; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--space-sm); align-items: center; margin: var(--space-md) 0 0; padding: var(--space-sm) var(--space-md); background: var(--panel-fill); border: 1px solid var(--quiet-line); border-radius: var(--radius-md); box-shadow: 0 4px 18px color-mix(in srgb, var(--on-tertiary) 8%, transparent); }
body.mail-page .mail-batch-select-all { min-height: 44px; gap: var(--space-sm); font-size: var(--phone-meta-size); color: var(--text); }
body.mail-page #mail-selected-count { color: var(--text-muted); font-size: var(--phone-meta-size); text-align: center; }
body.mail-page .mail-batch-add { min-height: 44px; font-size: var(--phone-action-size); padding-inline: var(--space-md); }
body.mail-page .mail-detail-sheet { position: fixed; inset: 0; z-index: 320; display: grid; place-items: center; padding: var(--space-md); }
body.mail-page .mail-detail-backdrop { position: absolute; inset: 0; border: 0; background: var(--modal-scrim); }
body.mail-page .mail-detail-panel { position: relative; width: min(40rem, 100%); max-height: calc(100dvh - var(--space-xl)); display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--quiet-line); border-radius: var(--radius-lg); background: var(--panel-fill); box-shadow: 0 8px 28px color-mix(in srgb, var(--on-tertiary) 14%, transparent); animation: mail-reader-in 160ms ease-out; }
body.mail-page .mail-detail-head { flex-shrink: 0; display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-sm); padding: var(--space-md) var(--space-md) var(--space-sm); }
body.mail-page .mail-detail-head h2 { margin: 0; max-height: 28dvh; overflow: auto; overflow-wrap: anywhere; font-size: var(--type-title-size); font-weight: var(--phone-title-weight); line-height: var(--phone-title-lh); }
body.mail-page .mail-detail-head .mail-icon-button { flex-shrink: 0; }
body.mail-page .mail-detail-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: var(--space-sm) var(--space-md) var(--space-md); }
body.mail-page .mail-detail-body .mail-detail-from,
body.mail-page .mail-detail-body .mail-detail-time { color: var(--text-muted); font-size: var(--phone-meta-size); line-height: var(--phone-meta-lh); overflow-wrap: anywhere; }
body.mail-page .mail-detail-body .mail-detail-time { margin-top: var(--space-xs); font-variant-numeric: tabular-nums; }
body.mail-page .mail-detail-body section { margin-block: var(--space-lg); }
body.mail-page .mail-detail-body h3 { margin: 0 0 var(--space-sm); font-size: var(--phone-meta-size); font-weight: var(--phone-action-weight); color: var(--text-muted); }
body.mail-page .mail-detail-body p { margin: 0; color: var(--text); font-size: var(--phone-body-size); line-height: var(--phone-body-lh); white-space: pre-wrap; overflow-wrap: anywhere; }
body.mail-page #mail-detail-original { display: flex; align-items: center; min-height: 44px; color: var(--text-muted); font-size: var(--phone-meta-size); }
body.mail-page #mail-detail-original[hidden] { display: none; }
body.mail-page .mail-detail-body .mail-detail-status { margin-top: var(--space-sm); font-size: var(--phone-meta-size); color: var(--text-muted); }
body.mail-page .mail-detail-body .mail-detail-status.is-error { color: var(--danger); }
body.mail-page .mail-detail-footer { flex-shrink: 0; padding: var(--space-md); padding-bottom: max(var(--space-md), env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--quiet-line); }
body.mail-page .mail-detail-footer .btn { width: 100%; min-height: 52px; }
body.mail-detail-open .bento-rail,
body.mail-booking-open .bento-rail { visibility: hidden; pointer-events: none; }
body.mail-page .mail-booking-sheet { z-index: 340; }
body.mail-page .mail-booking-panel { backdrop-filter: none; -webkit-backdrop-filter: none; }
body.mail-page .mail-booking-close { min-width: 44px; min-height: 44px; }
@keyframes mail-reader-in { from { opacity: 0; transform: translateY(var(--space-md)); } to { opacity: 1; transform: translateY(0); } }
@keyframes mail-refresh-turn { to { transform: rotate(360deg); } }
@media (max-width: 819px) {
  body.mail-page.has-bento-rail .layout { padding: 0; }
  body.mail-page .main-area { padding: max(var(--space-md), env(safe-area-inset-top, 0px)) var(--space-md) calc(env(safe-area-inset-bottom, 0px) + 7rem); }
  body.mail-page.mail-selecting .main-area { padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 13rem); }
  body.mail-page .mail-app { width: 100%; }
  body.mail-page .mail-batch-bar { position: fixed; left: 50%; transform: translateX(-50%); bottom: var(--mail-batch-bottom); width: min(48rem, calc(100vw - var(--space-md) * 2)); box-sizing: border-box; padding: var(--space-sm); }
  body.mail-page .mail-detail-sheet { place-items: end center; padding: 0; }
  body.mail-page .mail-detail-panel { width: 100%; max-height: 88dvh; border-bottom: 0; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
}
@media (max-width: 360px) {
  body.mail-page .mail-batch-bar { grid-template-columns: auto 1fr; }
  body.mail-page .mail-batch-add { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  body.mail-page .mail-detail-panel,
  body.mail-page .mail-icon-button.is-loading svg { animation: none; }
  body.mail-page .mail-digest-chevron { transition: none; }
}

/* Shared page hierarchy: title, quiet context and one action cluster. */
body .workspace-page-header { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-md); padding: 0; background: transparent; border: 0; box-shadow: none; }
.workspace-page-header > :first-child { min-width: 0; }
body .workspace-page-header h1,
body .workspace-page-title { margin: 0; font-family: var(--font-ui); font-size: var(--phone-display-size); font-weight: var(--phone-display-weight); line-height: var(--phone-display-lh); letter-spacing: 0; }
body .workspace-page-meta,
body .workspace-page-header .teamwork-copy-static { margin: var(--space-sm) 0 0; color: var(--text-muted); font-size: var(--phone-meta-size); font-weight: var(--phone-meta-weight); line-height: var(--phone-meta-lh); overflow-wrap: anywhere; }
body .page-action-cluster { position: relative; display: flex; align-items: center; justify-content: flex-end; gap: var(--space-sm); flex-shrink: 0; }
body .workspace-icon-button { display: inline-flex; align-items: center; justify-content: center; width: 44px; min-height: 44px; padding: 0; border: 0; border-radius: var(--radius-pill); background: var(--surface); color: var(--text); font: inherit; cursor: pointer; list-style: none; }
.workspace-icon-button::-webkit-details-marker { display: none; }
body .page-action-cluster .notif-root { position: static; inset: auto; }
body .page-action-cluster .notif-bell { width: 44px; height: 44px; border: 0; background: var(--surface); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
body .page-action-cluster .notif-bell:focus-visible { outline: 2px solid var(--text); outline-offset: 3px; }
body .page-action-cluster .notif-panel { z-index: 41; top: calc(100% + var(--space-sm)); width: min(22rem, calc(100vw - var(--space-md) * 2)); max-height: min(34rem, 65dvh); box-sizing: border-box; background: var(--panel-fill); border-radius: var(--radius-md); backdrop-filter: none; -webkit-backdrop-filter: none; }
.workspace-page-menu { position: relative; }
.workspace-menu-panel { position: absolute; right: 0; top: calc(100% + var(--space-sm)); z-index: 40; width: min(18rem, calc(100vw - var(--space-md) * 2)); box-sizing: border-box; padding: var(--space-sm); background: var(--panel-fill); border: 1px solid var(--quiet-line); border-radius: var(--radius-md); box-shadow: 0 8px 28px color-mix(in srgb, var(--on-tertiary) 12%, transparent); }
.workspace-menu-panel button { display: block; width: 100%; min-height: 44px; padding: var(--space-sm) var(--space-md); background: transparent; border: 0; border-radius: var(--radius-sm); color: var(--text); text-align: left; font: inherit; font-size: var(--phone-action-size); cursor: pointer; }
.workspace-menu-panel [hidden], body .due-day-filter-bar[hidden] { display: none !important; }
body .app-greeting { display: none; }
body .guest-save-banner { display: flex; justify-content: space-between; align-items: center; gap: var(--space-md); margin: var(--space-md) 0; padding: var(--space-md); border-radius: var(--radius-md); background: var(--surface); }
body .guest-save-kicker { display: none; }
body .guest-save-title { margin: 0; font-size: var(--phone-action-size); font-weight: var(--phone-action-weight); line-height: var(--phone-action-lh); }
body .guest-save-hint { margin: var(--space-xs) 0 0; font-size: var(--phone-meta-size); line-height: var(--phone-meta-lh); }
body .guest-save-actions { display: flex; gap: var(--space-xs); flex-shrink: 0; }
body .guest-save-actions .btn { min-height: 44px; font-size: var(--phone-meta-size); padding: var(--space-sm) var(--space-md); }
body .today-hero-hint { display: none; }
body .m-top-actions .m-agent-toggle { width: 44px; height: 44px; border-radius: var(--radius-pill); background: var(--surface); }
body .planner-header { margin-bottom: var(--space-lg); }
body .planner-heading-row { align-items: flex-start; }
body .planner-toolbar { margin-top: var(--space-md); }
body #planner-tools .workspace-menu-panel { right: calc(-44px - var(--space-sm)); max-height: calc(100dvh - var(--space-xl) * 3); overflow-y: auto; }
body #planner-tools .planner-search { display: flex; width: 100%; min-width: 0; box-sizing: border-box; margin-bottom: var(--space-sm); }
body #planner-tools .planner-search input { width: 100%; min-width: 0; }
body .teamwork-hero { grid-template-columns: minmax(0, 1fr) auto; }
body .teamwork-title-static { max-width: none; }
body .teamwork-app { gap: var(--space-lg); }
body .travel-app > .workspace-page-header { margin-bottom: var(--space-lg); }
body .travel-empty-greeting { font-size: var(--phone-title-size); font-weight: var(--phone-title-weight); }
body .travel-preview-banner { font-size: var(--phone-meta-size); line-height: var(--phone-meta-lh); }
.workspace-target { outline: 2px solid var(--text-muted); outline-offset: var(--space-xs); border-radius: var(--radius-sm); scroll-margin-block: var(--space-xl); }
.workspace-target-status { margin: var(--space-md) 0; color: var(--text-muted); font-size: var(--phone-meta-size); line-height: var(--phone-meta-lh); }
body .command-palette { z-index: 380; }
body .command-palette-panel { background: var(--panel-fill); border-radius: var(--radius-lg); max-height: calc(100dvh - var(--space-xl)); overflow: auto; }
body .command-palette-input { font-size: var(--phone-body-size); }
body .command-palette-item { min-height: 56px; padding: var(--space-sm) var(--space-md); border-radius: var(--radius-sm); }
body .command-palette-label { font-size: var(--phone-task-size); font-weight: var(--phone-task-weight); }
body .command-palette-hint { font-size: var(--phone-meta-size); }

/* Calendar: date navigation and agenda remain visible; creation opens a sheet on phones. */
body.calendar-page .cal-top { display: block; }
body.calendar-page .cal-top-main { margin: 0 0 var(--space-md); }
body.calendar-page .calendar-meta { font-size: var(--phone-meta-size); }
body.calendar-page .cal-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-sm); }
body.calendar-page .cal-range-nav,
body.calendar-page .cal-range-pill,
body.calendar-page .cal-view-btn { min-height: 44px; }
body.calendar-page .cal-upcoming { margin-top: var(--space-sm); }
body.calendar-page .cal-search-disclosure { margin-top: var(--space-sm); }
body.calendar-page .cal-search-disclosure > summary { display: flex; align-items: center; min-height: 44px; width: fit-content; color: var(--text-muted); cursor: pointer; font-size: var(--phone-meta-size); }
body.calendar-page .cal-search { margin: var(--space-sm) 0; }
body.calendar-page .cal-day-kicker { margin: 0 0 var(--space-sm); color: var(--text-muted); font-size: var(--phone-meta-size); font-weight: var(--phone-action-weight); }
body.calendar-page .calendar-item-text { font-size: var(--phone-task-size); font-weight: var(--phone-task-weight); }
body.calendar-page .calendar-item-sub { font-size: var(--phone-meta-size); }
body.calendar-page .calendar-item-delete,
body.calendar-page .todo-delete { min-width: 44px; min-height: 44px; }
body.calendar-page .calendar-editor-sheet { position: fixed; inset: 0; top: var(--workspace-sheet-top, 0); height: var(--workspace-sheet-height, 100dvh); z-index: 320; display: grid; place-items: center; padding: var(--space-md); box-sizing: border-box; }
body.calendar-page .calendar-editor-sheet[hidden] { display: none !important; }
.calendar-editor-backdrop { position: absolute; inset: 0; border: 0; background: var(--modal-scrim); }
.calendar-editor-panel { position: relative; display: flex; flex-direction: column; width: min(40rem, 100%); max-height: 100%; background: var(--panel-fill); border: 1px solid var(--quiet-line); border-radius: var(--radius-lg); overflow: hidden; animation: mail-reader-in 160ms ease-out; }
.calendar-editor-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); padding: var(--space-md); flex-shrink: 0; }
.calendar-editor-head h2 { margin: 0; font-size: var(--phone-title-size); font-weight: var(--phone-title-weight); line-height: var(--phone-title-lh); }
.calendar-editor-body { padding: 0 var(--space-md) var(--space-md); min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.calendar-editor-tabs { display: flex; gap: var(--space-sm); margin-block: var(--space-md); }
.calendar-editor-tabs button { flex: 1; min-height: 44px; border: 0; border-radius: var(--radius-pill); background: var(--surface); color: var(--text-muted); font: inherit; font-size: var(--phone-action-size); cursor: pointer; }
.calendar-editor-tabs button[aria-pressed="true"] { background: var(--primary); color: var(--on-primary); }
body.calendar-page .calendar-editor-body form { display: grid; gap: var(--space-md); padding: 0; border: 0; background: transparent; box-shadow: none; }
body.calendar-page .calendar-editor-body input { font-size: var(--phone-body-size); min-height: 48px; box-sizing: border-box; }
body.calendar-page .calendar-editor-body .day-task-row { display: block; }
body.calendar-page .calendar-editor-body .reminder-time-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-md); }
body.calendar-page .calendar-editor-body .reminder-priority-field { grid-column: 1 / -1; }
body.calendar-page .calendar-editor-body form button[type="submit"] { display: none; }
.calendar-editor-footer { padding: var(--space-md); padding-bottom: max(var(--space-md), env(safe-area-inset-bottom, 0px)); flex-shrink: 0; border-top: 1px solid var(--quiet-line); }
.calendar-editor-footer .btn { width: 100%; min-height: 52px; }
body .calendar-capture-bar { display: none; }
body.calendar-editor-open .bento-rail,
body.tally-sheet-open .bento-rail { visibility: hidden; pointer-events: none; }

/* Tally: today's amount and recent records, with insights and tools folded. */
body.tally-page .tally-intro { margin: 0; padding: 0; }
body.tally-page .tally-app { gap: var(--space-md); }
body.tally-page .tally-heading { margin: 0; }
body.tally-page .tally-topbar { margin: 0; justify-content: flex-start; }
body.tally-page .tally-today-strip { display: grid; gap: var(--space-xs); margin: var(--space-sm) 0; padding: 0; }
body.tally-page .tally-today-total { font-size: var(--phone-display-size); font-weight: var(--phone-display-weight); line-height: var(--phone-display-lh); color: var(--text); font-variant-numeric: tabular-nums; }
body.tally-page .tally-overview-label { margin: 0; font-size: var(--phone-meta-size); color: var(--text-muted); }
body.tally-page .tally-insights > summary,
body.tally-page .tally-quick-options > summary { display: flex; align-items: center; min-height: 44px; color: var(--text-muted); font-size: var(--phone-meta-size); cursor: pointer; }
body.tally-page .tally-overview-card { padding: var(--space-sm) 0; background: transparent; }
body.tally-page .tally-records-head h2 { font-size: var(--phone-body-size); font-weight: var(--phone-task-weight); }
body.tally-page .tally-records-head { align-items: center; gap: var(--space-sm); padding: 0; }
body.tally-page .tally-records-title { min-width: 0; display: grid; gap: var(--space-xs); }
body.tally-page .tally-records-title > span { font-size: var(--phone-meta-size); color: var(--text-muted); overflow-wrap: anywhere; }
body.tally-page .tally-layout-switch { display: flex; flex-shrink: 0; width: fit-content; gap: var(--space-xs); margin: 0; padding: var(--space-xs); border-radius: var(--radius-pill); background: var(--surface); }
body.tally-page .tally-layout-switch button { min-width: 44px; min-height: 44px; padding: var(--space-sm) var(--space-md); border: 0; border-radius: var(--radius-pill); color: var(--text-muted); background: transparent; cursor: pointer; font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); }
body.tally-page .tally-layout-switch button[aria-pressed=true] { color: var(--on-primary); background: var(--primary); }
body.tally-page .tally-month-view { min-width: 0; margin-top: var(--space-sm); }
body.tally-page .tally-month-hint { margin: var(--space-sm) 0; color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
body.tally-page .tally-month-weekdays, body.tally-page .tally-month-grid { display: grid; grid-template-columns: repeat(7, minmax(44px, 1fr)); gap: var(--space-xs) 0; }
body.tally-page .tally-month-weekdays { padding-block: var(--space-sm); color: var(--text-muted); text-align: center; font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
body.tally-page .tally-month-day { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-xs); min-width: 0; min-height: calc(var(--space-xl) + var(--space-md)); padding: var(--space-xs); border: 1px solid transparent; border-radius: var(--radius-sm); background: transparent; color: var(--text); cursor: pointer; font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); font-variant-numeric: tabular-nums; }
body.tally-page .tally-month-day.has-spend { background: color-mix(in srgb, var(--primary) 8%, transparent); }
body.tally-page .tally-month-day[aria-current=date] { border-color: var(--primary); }
body.tally-page .tally-month-amount { color: var(--text-muted); white-space: nowrap; }
body.tally-page .tally-month-day.has-spend .tally-month-amount { color: var(--accent); }
body.tally-page .tally-month-day[aria-pressed=true] { color: var(--on-primary); background: var(--primary); border-color: var(--primary); }
body.tally-page .tally-month-day[aria-pressed=true] .tally-month-amount { color: inherit; }
body.tally-page .tally-month-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-md); margin: var(--space-md) 0 0; padding-top: var(--space-md); border-top: 1px solid var(--quiet-line); }
body.tally-page .tally-month-stats dt { color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
body.tally-page .tally-month-stats dd { margin: var(--space-xs) 0 0; color: var(--text); overflow-wrap: anywhere; font: var(--phone-task-weight) var(--phone-task-size)/var(--phone-task-lh) var(--font-ui); font-variant-numeric: tabular-nums; }
body.tally-page .tally-day-summary { display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); margin-top: var(--space-lg); }
body.tally-page .tally-day-summary > div { min-width: 0; }
body.tally-page .tally-day-summary h3 { margin: 0; color: var(--text); font: var(--phone-task-weight) var(--phone-task-size)/var(--phone-task-lh) var(--font-ui); }
body.tally-page .tally-day-summary p { margin: var(--space-xs) 0 0; color: var(--text-muted); overflow-wrap: anywhere; font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); font-variant-numeric: tabular-nums; }
body.tally-page #tally-day-add { flex-shrink: 0; min-width: 44px; min-height: 44px; padding: var(--space-sm); border: 0; border-radius: var(--radius-pill); background: var(--surface); color: var(--text); cursor: pointer; font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); }
body.tally-page :is(.tally-layout-switch button, .tally-month-day, #tally-day-add):focus-visible { outline: 2px solid var(--text); outline-offset: 2px; }
body.tally-page :is(.tally-month-view, .tally-day-summary, .tally-today-strip, .tally-record-list, .tally-empty-cta)[hidden] { display: none; }
@media (max-width: 819px) {
  body.tally-page .tally-month-day { scroll-margin-block: var(--space-md) calc(env(safe-area-inset-bottom, 0px) + 13rem); }
}
@media (max-width: 360px) {
  /* Seven full-size touch targets still fit a 320px phone. */
  body.tally-page .tally-month-weekdays, body.tally-page .tally-month-grid { margin-inline: calc(var(--space-xs) - var(--space-md)); }
}
body.tally-page .tally-sheet { height: var(--workspace-sheet-height, 100dvh); top: var(--workspace-sheet-top, 0); bottom: auto; box-sizing: border-box; }
body.tally-page .tally-sheet-panel { display: flex; flex-direction: column; padding: 0; max-height: 100%; overflow: hidden; background: var(--panel-fill); }
body.tally-page .tally-sheet-head { padding: var(--space-md); flex-shrink: 0; }
body.tally-page .tally-sheet-close { min-width: 44px; min-height: 44px; }
body.tally-page .tally-form { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 var(--space-md) var(--space-md); }
body.tally-page .tally-form input,
body.tally-page .tally-form select { font-size: var(--phone-body-size); min-height: 48px; }
body.tally-page .tally-sheet-footer { padding: var(--space-md); padding-bottom: max(var(--space-md), env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--quiet-line); flex-shrink: 0; }
body.tally-page .tally-sheet-footer button { width: 100%; min-height: 52px; }
body.tally-page .tally-form-error { margin: 0 0 var(--space-sm); color: var(--danger); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); overflow-wrap: anywhere; }
body.tally-page .tally-form-error[hidden] { display: none; }
body.tally-page .tally-person-check span { display: flex; align-items: center; min-height: 44px; }
body.tally-page .tally-person-check input:focus-visible + span { outline: 2px solid var(--text); outline-offset: 2px; }
@media (min-width: 820px) {
  body.todo-bento .today-tasks { gap: var(--space-sm); }
  body.todo-bento .today-tasks .add-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; margin: 0; }
  body.todo-bento .today-tasks .add-form-row { min-width: 0; }
  body.todo-bento .today-tasks .add-form-deadline { max-width: calc(var(--space-xl) * 5); }
  body.todo-bento .today-tasks .deadline-trigger { min-height: 44px; padding-block: var(--space-sm); }
  body.todo-bento .today-tasks .toolbar { margin: 0; padding-block: var(--space-sm); border: 0; gap: var(--space-sm); }
  body.todo-bento .today-tasks .todo-source-switch { flex: 0 1 auto; border: 0; padding: 0; box-shadow: none; background: transparent; }
  body.todo-bento .today-tasks .todo-source-btn { flex: none; }
  body.todo-bento .today-tasks .filters { margin-left: auto; border: 0; box-shadow: none; background: transparent; }
  body.todo-bento .today-list-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-sm); }
  body.todo-bento .today-list-actions .task-selection-head { flex: 1; margin: 0; }
  body.todo-bento .today-tasks > .daily-loop { margin-top: var(--space-lg); }
  body.todo-bento .today-tasks > .daily-loop:not(:has(.daily-loop-reminders:not([hidden]))) { display: none; }
  body.tally-page .tally-quick { display: flex; }
  body.tally-page .tally-add-fab { width: auto; padding-inline: var(--space-md); font-size: var(--phone-action-size); }
}
@media (max-width: 819px) {
  body.has-bento-rail .layout { padding-inline: 0; }
  body.has-bento-rail .main-area { padding-inline: var(--space-md); }
  body .workspace-page-header { gap: var(--space-sm); }
  body .workspace-page-header .page-action-cluster { gap: var(--space-xs); }
  body .guest-save-banner { padding: var(--space-sm); flex-wrap: wrap; gap: var(--space-sm); }
  body .guest-save-actions { flex-wrap: wrap; }
  body .guest-save-title { font-size: var(--phone-meta-size); }
  body.calendar-page .cal-add-btn { display: none; }
  body.calendar-page .cal-composer { margin-bottom: 0; padding: var(--space-md) 0; }
  body.calendar-page .cal-day-block { margin-top: var(--space-md); }
  body.calendar-page .cal-day-block .day-task-form,
  body.calendar-page .cal-day-block .reminder-form { display: none; }
  body.calendar-page .calendar-alerts-btn { font-size: var(--phone-meta-size); min-height: 44px; }
  body.calendar-page .calendar-editor-sheet { padding: 0; place-items: end center; }
  body.calendar-page .calendar-editor-panel { width: 100%; max-height: 92%; border-radius: var(--radius-lg) var(--radius-lg) 0 0; border-bottom: 0; }
  body.calendar-page .calendar-capture-bar { display: flex; position: fixed; z-index: 45; bottom: calc(env(safe-area-inset-bottom, 0px) + 6.5rem); left: var(--space-md); right: var(--space-md); pointer-events: none; }
  body.calendar-page .calendar-capture-bar .btn { width: 100%; min-height: 48px; pointer-events: auto; }
  body.calendar-editor-open .calendar-capture-bar { display: none; }
  body.calendar-page .calendar-app { padding-bottom: var(--space-xl); }
  body.tally-page .tally-add-fab { display: flex; align-items: center; justify-content: center; gap: var(--space-sm); left: var(--space-md); right: var(--space-md); width: auto; height: 48px; min-height: 48px; bottom: calc(env(safe-area-inset-bottom, 0px) + 6.5rem); border-radius: var(--radius-pill); font-size: var(--phone-action-size); background: var(--primary); color: var(--on-primary); }
  body.tally-page .tally-sheet { padding: 0; }
  body.tally-page .tally-sheet-panel { max-height: 92%; width: 100%; border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
  body.tally-sheet-open .tally-add-fab { display: none; }
  body.calendar-page .main-area,
  body.tally-page .main-area { padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 13rem); }
  body.tally-page .tally-empty-cta { background: var(--surface); color: var(--text); }
  body .command-palette { align-items: flex-start; padding-top: max(var(--space-md), env(safe-area-inset-top, 0px)); }
}
@media (max-width: 360px) {
  body .workspace-page-header .page-action-cluster { flex-wrap: wrap; max-width: 144px; }
  body .guest-save-banner { display: block; }
  body .guest-save-actions { margin-top: var(--space-sm); }
}
@media (prefers-reduced-motion: reduce) {
  .calendar-editor-panel { animation: none; }
}

/* Override the older page-specific heading sizes and stacked header rows. */
body.has-bento-rail .workspace-page-header h1 { font-size: var(--phone-display-size); font-weight: var(--phone-display-weight); line-height: var(--phone-display-lh); text-align: left; letter-spacing: 0; }
body.calendar-page .cal-shell .cal-top-main { flex-direction: row; align-items: flex-start; justify-content: space-between; }
body.calendar-page .cal-shell .cal-top-copy { flex: 1; min-width: 0; }
body.calendar-page .cal-shell .calendar-title { max-width: none; width: auto; text-align: left; }
body.tally-page .tally-app { min-height: auto; padding: 0; }
@media (max-width: 819px) {
  body.calendar-page .calendar-app { max-width: none; padding: max(var(--space-md), env(safe-area-inset-top, 0px)) 0 var(--space-xl); }
  body.calendar-page .cal-board { padding: 0; }
  body.calendar-page .cal-range { width: auto; flex: 1; }
  body.calendar-page .cal-toolbar { flex-wrap: nowrap; }
  body.calendar-page .cal-week-head { gap: var(--space-xs); }
  body.calendar-page .cal-week-day { flex: 1; min-width: 0; min-height: 56px; padding-inline: var(--space-xs); }
  body.calendar-page .calendar-meta { line-height: var(--phone-meta-lh); }
  body.todo-mobile .main-area { padding-inline: 0; }
  body.todo-mobile .m-shell { padding-inline: var(--space-md); }
}
body.calendar-page .cal-shell .cal-composer .todo-item { padding: var(--space-sm) 0; border: 0; border-bottom: 1px solid var(--quiet-line); border-radius: 0; box-shadow: none; background: transparent; }
body.calendar-page .cal-shell .cal-composer .todo-label { font-size: var(--phone-task-size); font-weight: var(--phone-task-weight); }
body.calendar-page .cal-search-chip.is-active { background: var(--surface-muted); border-color: var(--text-muted); color: var(--text); }
body.calendar-page .cal-upcoming-kicker { color: var(--text-muted); }
body.tally-page .tally-today-strip { margin: var(--space-md) 0; border: 0; }
@media (max-width: 819px) {
  body.tally-page .main-area { padding-top: max(var(--space-md), env(safe-area-inset-top, 0px)); }
  body.calendar-page #calendar-open-todo { display: none; }
  body.calendar-page .cal-shell .cal-week-head { min-width: 0; width: 100%; box-sizing: border-box; }
}
body.travel-page .travel-preview-banner { position: static; inset: auto; z-index: auto; margin: var(--space-sm) 0 var(--space-md); padding: 0; border: 0; background: transparent; color: var(--text-muted); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
body.travel-page .travel-info > summary { min-height: 44px; display: flex; align-items: center; color: var(--text-muted); font-size: var(--phone-meta-size); cursor: pointer; }
body.travel-page .travel-app > .workspace-page-header { position: relative; z-index: 40; }
body.tally-page .tally-sheet-panel { margin: 0; }
body.travel-page .travel-preview-banner { transform: none; width: auto; text-align: left; }
body.travel-page .travel-app,
body.travel-page.travel-has-trip .travel-app { display: block; padding: 0; min-height: auto; height: auto; overflow: visible; }
body.travel-page .travel-workspace { position: relative; inset: auto; min-height: 28rem; height: max(28rem, calc(100dvh - 12rem)); width: 100%; border-radius: var(--radius-lg); overflow: hidden; z-index: 0; }
body.travel-page .travel-view-switch { display: none; }
@media (min-width: 820px) {
  body.travel-page.has-bento-rail .layout { width: min(1120px, 92vw); max-width: min(1120px, 92vw); margin-inline: auto; gap: var(--space-lg); padding: 0; }
  body.travel-page .main-area { padding-top: var(--space-lg); }
  body.travel-page .travel-side { left: var(--space-md); top: var(--space-md); bottom: var(--space-md); }
  body.travel-page .travel-search-bar { top: var(--space-md); right: var(--space-md); }
}
@media (max-width: 819px) {
  body.calendar-page .cal-shell .cal-toolbar .cal-range { flex: 1 1 auto; width: auto; max-width: none; min-width: 0; }
  body.calendar-page .cal-shell .cal-toolbar .cal-range-pill { white-space: nowrap; flex: 1; min-width: 0; width: auto; }
  body.travel-page .main-area {
    padding-top: max(var(--space-md), env(safe-area-inset-top, 0px));
    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + var(--space-xl) * 3);
  }
  body.travel-page .travel-workspace { position: relative; height: auto; min-height: 0; border-radius: 0; overflow: visible; }
  body.travel-page .travel-overlay { position: static; height: auto; pointer-events: auto; display: block; }
  body.travel-page .travel-map { display: none; position: relative; inset: auto; height: 22rem; border-radius: var(--radius-md); overflow: hidden; }
  body.travel-page .travel-side { position: static; width: 100%; max-height: none; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
  body.travel-page .travel-search-bar { display: none; position: static; width: 100%; box-sizing: border-box; margin-top: var(--space-md); }
  body.travel-page.travel-map-view .travel-map { display: block; }
  body.travel-page.travel-map-view .travel-side { display: none; }
  body.travel-page.travel-map-view .travel-search-bar { display: grid; }
  body.travel-page.travel-has-trip .travel-view-switch { display: flex; gap: var(--space-sm); margin: var(--space-md) 0; }
  body.travel-page .travel-view-switch button { min-height: 44px; flex: 1; border: 0; border-radius: var(--radius-pill); background: var(--surface); color: var(--text-muted); font: inherit; font-size: var(--phone-action-size); cursor: pointer; }
  body.travel-page .travel-view-switch button[aria-pressed="true"] { background: var(--primary); color: var(--on-primary); }
  body.travel-page .travel-trip-select-wrap select,
  body.travel-page .travel-add-btn { min-height: 44px; }
  body.travel-page .travel-map .leaflet-bottom.leaflet-left { left: var(--space-sm); bottom: var(--space-md); }
  body.travel-page .travel-map .leaflet-control-zoom a { width: 44px; height: 44px; line-height: 44px; }
}
body.calendar-page .calendar-meta { text-transform: none; letter-spacing: 0; line-height: var(--phone-meta-lh); }
@media (max-width: 819px) {
  body.calendar-page .cal-shell .cal-composer { margin-top: var(--space-md); padding: 0; }
  body.calendar-page .cal-shell .selected-day-head { margin: 0 0 var(--space-md); padding: 0; }
  body.calendar-page .cal-shell .cal-day-block { margin: var(--space-md) 0 0; padding: 0; }
  body.calendar-page .cal-shell .cal-day-kicker { margin: 0 0 var(--space-sm); }
  body.calendar-page .cal-shell .cal-composer .todo-item { min-height: 72px; }
}
body.travel-page:not(.travel-has-trip) .travel-app { display: block; padding: 0; min-height: auto; }
@media (max-width: 819px) {
  body.has-bento-rail .layout { padding: 0; }
  body.planner-page.has-bento-rail .main-area,
  body.teamwork-page .main-area { padding: max(var(--space-md), env(safe-area-inset-top, 0px)) var(--space-md) calc(env(safe-area-inset-bottom, 0px) + 7rem); justify-content: flex-start; }
  body.planner-page .planner-view-root,
  body.planner-page .planner-shell { padding: 0; }
  body.teamwork-page .teamwork-app { width: 100%; min-height: auto; padding: 0 0 var(--space-xl); }
}

/* Task depth is disclosed; batch controls appear only after explicit selection. */
.task-detail-meta { display: block; color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.task-details-open { min-width: 44px; min-height: 44px; border: 0; background: transparent; color: var(--text-muted); font: inherit; border-radius: var(--radius-sm); }
.task-detail-fields { margin: var(--space-md) 0; }
.task-detail-fields summary, .task-batch-options summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; color: var(--text-muted); font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); }
.task-detail-fields label, .task-desktop-body label { display: flex; flex-direction: column; gap: var(--space-sm); color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.task-detail-fields textarea, .task-detail-fields input[type=text], .task-desktop-body input, .task-desktop-body select, .task-batch-choices input, .task-batch-choices select { width: 100%; min-width: 0; min-height: 44px; box-sizing: border-box; padding: var(--space-sm); border: 1px solid color-mix(in srgb, var(--text) 12%, transparent); border-radius: var(--radius-sm); background: var(--surface); color: var(--text); font: var(--phone-body-weight) var(--phone-body-size)/var(--phone-body-lh) var(--font-ui); }
.task-detail-fields textarea { resize: vertical; }
.task-subtasks { margin-top: var(--space-sm); }
.task-subtask-row { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; gap: var(--space-xs); align-items: center; margin-bottom: var(--space-sm); }
.task-subtask-row .task-subtask-check, .task-batch-check, .task-select-all { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.task-subtask-row input[type=checkbox], .task-batch-check input, .task-select-all input { width: 20px; height: 20px; accent-color: var(--primary); }
.task-detail-fields button, .task-snooze-actions button, .task-selection-head button, .task-batch-bar button, .task-desktop-panel header button { min-height: 44px; padding: var(--space-sm); border: 0; border-radius: var(--radius-sm); background: var(--surface); color: var(--text); font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); cursor: pointer; }
.task-source-link { display: inline-flex; align-items: center; min-height: 44px; color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.task-snooze-actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-sm); }
.task-selection-head { display: flex; align-items: center; justify-content: space-between; min-height: 44px; margin: var(--space-sm) 0; }
.task-select-all { justify-content: flex-start; gap: var(--space-sm); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.task-selection-head button { margin-left: auto; background: transparent; color: var(--text-muted); }
.task-batch-check { display: none; flex-shrink: 0; }
.task-selecting #todo-list .task-batch-check { display: flex; }
.task-selecting #todo-list .todo-check-target, .task-selecting #todo-list .todo-delete, .task-selecting #todo-list .todo-repeat, .task-selecting #todo-list .task-details-open, .task-selecting #todo-list .todo-block-handle { display: none !important; }
.task-selecting #todo-list .task-is-selected { background: var(--surface); border-radius: var(--radius-sm); }
.task-batch-bar { position: fixed; z-index: 70; bottom: var(--space-md); left: 50%; transform: translateX(-50%); width: min(480px, calc(100vw - 2 * var(--space-md))); box-sizing: border-box; padding: var(--space-sm); border-radius: var(--radius-md); background: var(--panel-surface); border: 1px solid color-mix(in srgb, var(--text) 12%, transparent); box-shadow: 0 4px 24px color-mix(in srgb, var(--text) 8%, transparent); }
.task-batch-primary { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: var(--space-sm); align-items: center; }
.task-batch-count { padding: var(--space-sm); color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.task-batch-primary button:first-of-type { color: var(--on-primary); background: var(--primary); }
.task-batch-bar button:disabled { opacity: .45; cursor: default; }
.task-batch-choices { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: var(--space-sm); }
body.task-selecting .app { padding-bottom: 250px; }
body.task-selecting .m-add-bar { display: none !important; }
.task-desktop-editor { position: fixed; inset: 0; z-index: 320; display: grid; place-items: center; }
.task-desktop-backdrop { position: absolute; inset: 0; border: 0; background: color-mix(in srgb, var(--text) 32%, transparent); }
.task-desktop-panel { position: relative; width: min(540px, calc(100vw - 2 * var(--space-md))); max-height: calc(var(--workspace-sheet-height, 100dvh) - 2 * var(--space-md)); display: flex; flex-direction: column; border-radius: var(--radius-lg); background: var(--panel-surface); color: var(--text); overflow: hidden; }
.task-desktop-panel header { display: flex; justify-content: space-between; align-items: center; padding: var(--space-md); gap: var(--space-sm); }
.task-desktop-panel h2 { margin: 0; font: var(--phone-title-weight) var(--phone-title-size)/var(--phone-title-lh) var(--font-ui); }
.task-desktop-panel header button { min-width: 44px; }
.task-desktop-form { display: flex; flex-direction: column; min-height: 0; }
.task-desktop-body { overflow-y: auto; padding: 0 var(--space-md) var(--space-md); }
.task-desktop-dates, .task-desktop-options { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--space-sm); margin-top: var(--space-md); }
.task-desktop-save { min-height: 44px; margin: var(--space-md); flex-shrink: 0; }
.task-desktop-delete { min-height: 44px; min-width: 44px; margin-top: var(--space-md); padding: var(--space-sm); border: 0; border-radius: var(--radius-sm); color: var(--danger); background: transparent; font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); cursor: pointer; }
body.todo-bento .today-tasks .todo-delete { display: none; }
.task-draft-status { color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.task-desktop-editor[hidden], .task-source-link[hidden], .task-snooze-actions[hidden], .task-selection-head[hidden], .task-select-all[hidden], .task-batch-bar[hidden] { display: none !important; }
@media (max-width: 640px) {
  .task-batch-bar { bottom: calc(86px + env(safe-area-inset-bottom, 0px)); }
  body.task-selecting .m-shell { padding-bottom: calc(320px + env(safe-area-inset-bottom, 0px)); }
}
body.todo-mobile .task-batch-bar { bottom: calc(86px + env(safe-area-inset-bottom, 0px)); }
@media (prefers-reduced-motion: no-preference) {
  .task-desktop-panel { animation: task-detail-enter 160ms ease-out; }
  @keyframes task-detail-enter { from { opacity: 0; translate: 0 8px; } to { opacity: 1; translate: 0 0; } }
}

/* One shared assistant entry, anchored to the header's trailing corner. */
body .page-action-cluster.has-workspace-agent { min-height: 44px; padding-inline-end: calc(44px + var(--space-sm)); box-sizing: border-box; flex-direction: row; align-items: flex-start; }
body .page-action-cluster .workspace-agent-button { position: absolute; inset: 0 0 auto auto; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; min-width: 44px; flex-shrink: 0; margin: 0; padding: 0; border: 0; border-radius: var(--radius-pill); color: var(--text); background: var(--surface); box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; transform: none; }
body .page-action-cluster .workspace-agent-button:focus-visible { outline: 2px solid var(--text); outline-offset: 3px; }
body .page-action-cluster .workspace-agent-button .todo-agent-fab-ghost { width: var(--space-lg); height: var(--space-lg); object-fit: contain; pointer-events: none; }
body .todo-agent.todo-agent-header-host { position: static; inset: auto; width: 0; height: 0; z-index: auto; }
.reminder-settings { margin: var(--space-md) 0; color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.reminder-settings summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; }
.reminder-settings button { min-height: 44px; padding: var(--space-sm) var(--space-md); background: var(--surface); color: var(--text); border: 0; border-radius: var(--radius-sm); font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); }
body.todo-mobile .task-detail-fields { margin: 0; flex-shrink: 0; }
body.todo-mobile .task-source-link, body.todo-mobile .task-snooze-actions { flex-shrink: 0; }
body.task-selecting #todo-list .task-batch-check input { accent-color: var(--primary); }
/* Templates and data tools use the same compact sheets as task capture. */
.workspace-tool-sheet { position: fixed; z-index: 400; inset: auto 0; top: var(--workspace-sheet-top, 0px); height: min(var(--workspace-sheet-height, 100dvh), 100dvh); display: grid; place-items: center; padding: var(--space-md); box-sizing: border-box; }
.workspace-tool-sheet[hidden] { display: none !important; }
.workspace-tool-backdrop { position: absolute; inset: 0; border: 0; background: color-mix(in srgb, var(--text) 32%, transparent); }
.workspace-tool-panel { position: relative; width: min(540px, 100%); max-height: 100%; min-height: 0; display: flex; flex-direction: column; overflow: hidden; border-radius: var(--radius-lg); background: var(--panel-surface); color: var(--text); box-shadow: var(--shadow-pop); }
.workspace-tool-panel header { display: flex; justify-content: space-between; align-items: center; gap: var(--space-sm); padding: var(--space-md); flex-shrink: 0; }
.workspace-tool-panel h2 { margin: 0; font: var(--phone-title-weight) var(--phone-title-size)/var(--phone-title-lh) var(--font-ui); }
.workspace-tool-panel button, .workspace-task-shortcuts button, .auth-data-tools { min-height: 44px; min-width: 44px; border: 0; border-radius: var(--radius-sm); padding: var(--space-sm); background: var(--surface); color: var(--text); font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); cursor: pointer; }
.workspace-tool-panel button:disabled { opacity: .45; cursor: default; }
.workspace-tool-panel .btn-primary { background: var(--primary); color: var(--on-primary); }
.workspace-tool-body { min-height: 0; padding: 0 var(--space-md); overflow: auto; overscroll-behavior: contain; font: var(--phone-body-weight) var(--phone-body-size)/var(--phone-body-lh) var(--font-ui); }
.workspace-tool-body p, .workspace-tool-status { color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.workspace-tool-body label { display: grid; gap: var(--space-sm); margin: var(--space-md) 0; color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.workspace-tool-body input, .workspace-tool-body select, .workspace-tool-body textarea { width: 100%; min-height: 44px; min-width: 0; padding: var(--space-sm); box-sizing: border-box; border-radius: var(--radius-sm); border: 1px solid var(--border); background: var(--surface); color: var(--text); font: var(--phone-body-weight) var(--phone-body-size)/var(--phone-body-lh) var(--font-ui); }
.workspace-tool-body textarea { resize: vertical; }
.workspace-tool-body input[type=file] { overflow: hidden; }
.workspace-template-row { display: flex; gap: var(--space-sm); align-items: center; border-bottom: 1px solid var(--border); padding: var(--space-sm) 0; }
.workspace-template-row button:first-child { flex: 1; text-align: left; background: transparent; }
.workspace-template-row button[aria-pressed=true] { background: var(--surface-muted); color: var(--text); }
.workspace-template-preview { padding-left: var(--space-md); color: var(--text-muted); }
.workspace-template-preview li { margin: var(--space-sm) 0; }
.workspace-tool-footer { display: flex; gap: var(--space-sm); flex-wrap: wrap; padding: var(--space-md) var(--space-md) calc(var(--space-md) + env(safe-area-inset-bottom, 0px)); flex-shrink: 0; }
.workspace-tool-footer .btn-primary { flex: 1; }
.workspace-tool-status { margin: var(--space-sm) var(--space-md) 0; max-height: 72px; overflow: auto; flex-shrink: 0; }
.workspace-tool-status:empty { display: none; }
.workspace-import-preview { padding: var(--space-sm) 0; }
.workspace-tool-body summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; color: var(--text-muted); }
.workspace-task-shortcuts { display: flex; flex-wrap: wrap; gap: var(--space-sm); min-width: 0; }
.workspace-task-shortcuts button { color: var(--text-muted); background: transparent; }
.task-selection-head { gap: var(--space-sm); }
body.task-selecting .workspace-task-shortcuts { display: none; }
.auth-data-tools { display: block; width: 100%; margin-top: var(--space-sm); }
body.workspace-tool-open .bento-rail, body.workspace-tool-open .m-add-bar, body.workspace-tool-open .task-batch-bar, body.workspace-tool-open #tally-add-open { visibility: hidden; }
.trip-expenses { margin: var(--space-md) 0; color: var(--text); }
.trip-expenses[hidden] { display: none; }
.trip-expenses > summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); }
.trip-expense-note, .tally-record-trip { color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.trip-expense-budget { display: grid; gap: var(--space-sm); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.trip-expense-budget input { min-height: 44px; min-width: 0; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); color: var(--text); padding: var(--space-sm); font: var(--phone-body-weight) var(--phone-body-size)/var(--phone-body-lh) var(--font-ui); }
.trip-expense-list { list-style: none; padding: 0; margin: var(--space-md) 0; }
.trip-expense-list li { display: flex; justify-content: space-between; gap: var(--space-sm); padding: var(--space-sm) 0; }
.trip-expense-records a, .trip-expenses > a { display: flex; align-items: center; min-height: 44px; color: var(--text); text-decoration: none; font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
.trip-expenses .trip-expense-add { font-size: var(--phone-action-size); font-weight: var(--phone-action-weight); }
.tally-trip-filter { min-height: 44px; padding: var(--space-sm); margin-bottom: var(--space-md); border: 0; border-radius: var(--radius-pill); color: var(--text-muted); background: var(--surface); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
@media (max-width: 819px) {
  .workspace-tool-sheet { padding: var(--space-md) 0 0; place-items: end center; }
  .workspace-tool-panel { border-radius: var(--radius-lg) var(--radius-lg) 0 0; width: min(100%, 540px); }
  .workspace-task-shortcuts { flex: 1; }
  .trip-expense-records a { overflow-wrap: anywhere; }
}
.workspace-tool-body p, .workspace-template-preview li, .workspace-template-row button { overflow-wrap: anywhere; }
.trip-expense-history > summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
body.tally-page .tally-submit-btn { background: var(--primary); color: var(--on-primary); border-color: var(--primary); font-size: var(--phone-action-size); font-weight: var(--phone-action-weight); }
body.tally-page .tally-submit-btn:hover { background: var(--primary-hover); }
body.tally-page #tally-sheet-eyebrow { color: var(--text-muted); }
body.tally-page .tally-category-suggestions button { background: var(--surface); color: var(--text); border-color: var(--border); }

/* Capture has one primary action; occasional tools stay alongside it. */
.workspace-task-shortcuts button { min-height: 44px; padding: var(--space-sm) var(--space-md); border: 0; border-radius: var(--radius-pill); color: var(--text-muted); background: var(--surface); font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); cursor: pointer; }
.m-add-bar { display: flex; align-items: center; gap: var(--space-sm); max-width: calc(100vw - var(--space-md) * 2); }
.m-add-bar .m-add-task { width: auto; flex-shrink: 0; }
.m-add-bar .workspace-task-shortcuts { flex: 0 1 auto; }
.workspace-template-row button[data-template-id] { display: flex; align-items: center; gap: var(--space-sm); min-width: 0; }
.workspace-template-row button[data-template-id]::after { content: ''; flex-shrink: 0; margin-left: auto; width: var(--space-md); height: var(--space-md); border: 1px solid var(--text-muted); border-radius: var(--radius-pill); }
.workspace-template-row button[data-template-id][aria-pressed=true]::after { content: '✓'; display: grid; place-items: center; color: var(--on-primary); background: var(--primary); border-color: var(--primary); font-size: var(--phone-meta-size); }
.workspace-tool-panel .workspace-template-create { margin-top: var(--space-sm); background: transparent; color: var(--text-muted); }

/* Amount, category and date are sufficient for everyday capture. */
body.tally-page .tally-form { gap: var(--space-md); }
body.tally-page .tally-form label { font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); gap: var(--space-sm); }
body.tally-page .tally-form input, body.tally-page .tally-form select { font-weight: var(--phone-body-weight); }
.tally-extra-options { grid-column: 1 / -1; min-width: 0; border-top: 1px solid var(--border); }
.tally-extra-fields { display: grid; gap: var(--space-md); padding-top: var(--space-sm); }
.tally-extra-fields .tally-shared-fields { padding: 0; background: transparent; border: 0; }

:is(.workspace-tool-body, .task-detail-fields, .task-batch-options, .trip-expenses, .trip-expense-history, .tally-extra-options) > summary { display: flex; align-items: center; gap: var(--space-sm); min-height: 44px; list-style: none; cursor: pointer; color: var(--text-muted); font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); }
.workspace-tool-body details > summary { display: flex; list-style: none; }
:is(.workspace-tool-body details, .task-detail-fields, .task-batch-options, .trip-expenses, .trip-expense-history, .tally-extra-options) > summary::-webkit-details-marker { display: none; }
:is(.workspace-tool-body details, .task-detail-fields, .task-batch-options, .trip-expenses, .trip-expense-history, .tally-extra-options) > summary::after { content: '›'; margin-left: auto; color: var(--text-muted); transform: rotate(0deg); }
:is(.workspace-tool-body details, .task-detail-fields, .task-batch-options, .trip-expenses, .trip-expense-history, .tally-extra-options)[open] > summary::after { transform: rotate(90deg); }

.workspace-tool-backdrop, body.tally-page .tally-sheet-backdrop, .m-task-backdrop, #calendar-editor-backdrop, .task-desktop-backdrop { background: var(--modal-scrim); backdrop-filter: none; -webkit-backdrop-filter: none; }
.workspace-sheet-motion.is-closing { pointer-events: none; }
@keyframes workspace-sheet-enter { from { opacity: 0; transform: translateY(var(--space-md)); } to { opacity: 1; transform: translateY(0); } }
@keyframes workspace-sheet-exit { from { opacity: 1; transform: translateY(0); } to { opacity: 0; transform: translateY(var(--space-md)); } }
@keyframes workspace-scrim-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes workspace-scrim-exit { from { opacity: 1; } to { opacity: 0; } }
@media (prefers-reduced-motion: no-preference) {
  .workspace-sheet-motion [data-sheet-panel] { animation: workspace-sheet-enter 180ms ease-out both; }
  .workspace-sheet-motion [data-sheet-backdrop] { animation: workspace-scrim-enter 180ms ease-out both; }
  .workspace-sheet-motion.is-closing [data-sheet-panel] { animation: workspace-sheet-exit 160ms ease-in both; }
  .workspace-sheet-motion.is-closing [data-sheet-backdrop] { animation: workspace-scrim-exit 160ms ease-in both; }
  :is(.workspace-tool-body details, .task-detail-fields, .task-batch-options, .trip-expenses, .trip-expense-history, .tally-extra-options) > summary::after { transition: transform 160ms ease-out; }
}

/* Shared roles take precedence over the older individual page treatments. */
body { font-size: var(--phone-body-size); line-height: var(--phone-body-lh); }
body :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]), select, textarea) {
  min-height: 44px;
  font-family: var(--font-ui);
  font-size: var(--phone-body-size);
  font-weight: var(--phone-body-weight);
  line-height: var(--phone-body-lh);
  letter-spacing: 0;
}
body :is(.btn, .filter-btn, .category-btn, .todo-delete, .todo-edit, .todo-deadline, .todo-source-btn,
  .todo-agent-close, .auth-close, .shortcuts-sheet-close) { min-height: 44px; min-width: 44px; }
body :is(.filter-btn, .todo-source-btn) { border-radius: var(--radius-pill); font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); }
body .filter-btn.is-active { background: var(--surface-muted); color: var(--text); border-color: transparent; }
body .add-form-notion .add-form-row { border-color: var(--quiet-line); border-radius: var(--radius-sm); background: var(--surface); }
body .add-form-notion .add-form-row:focus-within { border-color: var(--text-muted); box-shadow: none; }
body .composer-hint { text-transform: none; }
body .todo-agent-input:focus { border-color: var(--text-muted); box-shadow: none; }
body .todo-check-target { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; min-width: 44px; min-height: 44px; }
body .todo-check-target .todo-check { margin: 0; }
body .todo-block-handle { min-width: 44px; min-height: 44px; }
body .todo-block-handle:focus-visible { outline: 2px solid var(--text); outline-offset: var(--space-xs); }
body :is(.todo-repeat, .daily-loop-pill, #daily-loop-focus) { min-height: 44px; }
body #daily-loop-focus:not(.workspace-agent-button) { padding: var(--space-sm); border: 0; border-radius: var(--radius-pill); background: var(--surface); color: var(--text); font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); }
body.calendar-page :is(.cal-range-nav, .cal-search-input, .cal-search-chip) { min-height: 44px; min-width: 44px; }
body.calendar-page .calendar-todo-link { display: inline-flex; align-items: center; min-height: 44px; }
body.tally-page :is(.tally-nav-btn, .tally-period-btn, .tally-view-switch button, .tally-quick input) { min-height: 44px; min-width: 44px; }
body.tally-page .tally-bar-fill { background: var(--text-muted); box-shadow: none; border-radius: var(--radius-sm) var(--radius-sm) 0 0; }
body.planner-page :is(.planner-search input, .planner-column-title-input) { min-height: 44px; }
body.travel-page .travel-search input { min-height: 44px; }
body.travel-page .travel-map .leaflet-control-zoom a { width: 44px; height: 44px; line-height: 44px; }
body.travel-page :is(.travel-search-day, .travel-stop-index) { color: var(--text-muted); }
body.travel-page .travel-share a { display: inline-flex; align-items: center; min-height: 44px; color: var(--text); }
body.calendar-page .cal-shell :is(.cal-range-pill, .cal-view-btn, .cal-search-chip),
body.tally-page :is(.tally-period-btn, .tally-nav-btn, .tally-view-switch button),
body :is(.deadline-trigger, .deadline-clear-btn, .todo-source-btn) { font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); letter-spacing: 0; text-transform: none; }
body.calendar-page .cal-shell .selected-day-title { font: var(--phone-title-weight) var(--phone-title-size)/var(--phone-title-lh) var(--font-ui); letter-spacing: 0; }
body.tally-page .tally-record-group-title { font: var(--phone-task-weight) var(--phone-task-size)/var(--phone-task-lh) var(--font-ui); }
body.tally-page :is(.tally-meta, .tally-bar-value, .tally-bar-day) { font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
body.travel-page .travel-kicker { font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); color: var(--text-muted); }
body.has-bento-rail :is(.bento-rail-brand, .bento-rail-link, .bento-rail-theme, .bento-rail-lang) { font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); letter-spacing: 0; }
body :is(.cal-range-nav, .todo-delete), body.travel-page .travel-map .leaflet-control-zoom a { font: var(--phone-title-weight) var(--phone-title-size)/var(--phone-title-lh) var(--font-ui); }
body :is(.todo-agent-close, .auth-close, .tally-sheet-close, .planner-card-delete) { font: var(--phone-title-weight) var(--phone-title-size)/var(--phone-title-lh) var(--font-ui); }
body .sidebar { background: var(--panel-fill); }
body :is(.category-btn.is-active, .sidebar-page-link.is-current, .sidebar-page-link.is-active, .sidebar-page-link[aria-current=page]) { background: var(--surface-muted); color: var(--text); border-color: var(--quiet-line); box-shadow: none; }
body :is(.sidebar-heading, .sidebar-auth-hint, .sidebar-auth-sync) { font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); letter-spacing: 0; text-transform: none; }
body :is(.sidebar-auth-label, .sidebar-page-link) { font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); }
body .sidebar-auth-entry:hover { transform: none; box-shadow: none; }
body.tally-page .tally-sheet-head h2 { font: var(--phone-title-weight) var(--phone-title-size)/var(--phone-title-lh) var(--font-ui); }
body.tally-page #tally-sheet-eyebrow { font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
body.tally-page .tally-category-suggestions button { min-height: 44px; border-radius: var(--radius-pill); padding: var(--space-sm); }
body.tally-page :is(.tally-record-category, .tally-record-amount) { font: var(--phone-task-weight) var(--phone-task-size)/var(--phone-task-lh) var(--font-ui); }
body.tally-page :is(.tally-record-note, .tally-record-amount small) { font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
body.planner-page :is(.planner-card-title, .planner-card-tags, .planner-card-toggle, .planner-card-delete) { min-height: 44px; }
body.planner-page :is(.planner-card-toggle, .planner-card-delete) { min-width: 44px; }
body.planner-page .planner-card-face-title { font: var(--phone-task-weight) var(--phone-task-size)/var(--phone-task-lh) var(--font-ui); }
body.planner-page .planner-card-check-target { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; flex-shrink: 0; cursor: pointer; }
body.planner-page .planner-card-check { margin: 0; }
body.travel-page .travel-preview-banner a { display: inline-flex; align-items: center; min-height: 44px; color: var(--text); }
body.travel-page .travel-stop-title { font: var(--phone-task-weight) var(--phone-task-size)/var(--phone-task-lh) var(--font-ui); }
body.travel-page .travel-stop-delete { min-width: 44px; min-height: 44px; }
body.calendar-page .cal-shell .cal-range-nav { font: var(--phone-title-weight) var(--phone-title-size)/var(--phone-title-lh) var(--font-ui); }
body.calendar-page .calendar-todo-link { font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
body.has-bento-rail .bento-rail :is(.bento-rail-theme, .bento-rail-lang) { font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); }
body.has-mobile-dock.has-bento-rail .bento-rail-link { min-width: 44px; min-height: 44px; }
body.travel-page .travel-map .leaflet-control-attribution { background: var(--surface); color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); }
body.travel-page .travel-map .leaflet-control-attribution a { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; color: var(--text); }

body :is(.auth-modal-backdrop, .shortcuts-sheet-backdrop, .command-palette-backdrop, .todo-agent-backdrop,
  .mail-detail-backdrop, .mail-booking-backdrop, .travel-sheet-backdrop) { background: var(--modal-scrim); }
body :is(.auth-card, .shortcuts-sheet-panel, .todo-agent-panel, .mail-booking-panel, .travel-sheet-panel) {
  background: var(--panel-fill); border-radius: var(--radius-lg); box-shadow: var(--shadow-pop);
}
body :is(.auth-title, .shortcuts-sheet-title, .todo-agent-title, .mail-booking-title, .travel-sheet-title) {
  font: var(--phone-title-weight) var(--phone-title-size)/var(--phone-title-lh) var(--font-ui); letter-spacing: 0;
}
body :is(.auth-kicker, .shortcuts-sheet-kicker, .shortcuts-group-title, .todo-agent-kicker) {
  color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); letter-spacing: 0; text-transform: none;
}
body :is(.todo-agent-msg, .auth-copy, .auth-provider, .auth-guest) {
  font: var(--phone-body-weight) var(--phone-body-size)/var(--phone-body-lh) var(--font-ui); letter-spacing: 0;
}

/* Status selection is monochrome on every page. */
body.planner-page .planner-status-chip,
body.planner-page .planner-add-card { min-height: 44px; padding: var(--space-sm) var(--space-md); border: 0; border-radius: var(--radius-pill); background: var(--surface); color: var(--text-muted); font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); box-shadow: none; }
body.planner-page .planner-status-chip.is-selected { background: var(--primary); color: var(--on-primary); }
body.planner-page .planner-status-chip.is-selected .planner-status-chip-count { color: inherit; font-weight: var(--phone-action-weight); }
body.planner-page .planner-status-strip { gap: var(--space-sm); padding: var(--space-xs) 0; }
body.planner-page .planner-add-card:hover { background: var(--surface-hover); color: var(--text); }
body.planner-page .planner-card { background: var(--surface); border-radius: var(--radius-sm); padding: var(--space-sm); box-shadow: none; }
body.planner-page .planner-card:hover { transform: none; filter: none; box-shadow: none; }
body.planner-page .planner-column { border-radius: var(--radius-md); }
body.planner-page .planner-column-status[data-status="progress"] { background: var(--surface); border-color: var(--text); border-style: dashed; }
body.planner-page :is(.planner-tool-btn, .planner-card-open-cal, .planner-card-to-todo, .planner-card-due-chip,
  .planner-column-add, .planner-column-delete, .planner-move-select) { min-height: 44px; min-width: 44px; }
body.planner-page :is(.planner-column-title-input, .planner-card-title) { font: var(--phone-task-weight) var(--phone-task-size)/var(--phone-task-lh) var(--font-ui); letter-spacing: 0; }

body.teamwork-page .teamwork-planner-link { color: var(--text); background: var(--surface); }
body.teamwork-page :is(.teamwork-workspace-panel, .teamwork-personal-body) { padding: var(--space-md) 0; }
body.teamwork-page .teamwork-personal-draft { border: 0; border-top: 1px dashed var(--text-muted); background: transparent; }
body.teamwork-page .teamwork-personal-summary { position: relative; min-height: 44px; padding: var(--space-md) var(--space-lg) var(--space-md) 0; gap: var(--space-xs); }
body.teamwork-page .teamwork-personal-summary::after { position: absolute; right: 0; top: 50%; translate: 0 -50%; }
body.teamwork-page .teamwork-personal-summary-title { font: var(--phone-title-weight) var(--phone-title-size)/var(--phone-title-lh) var(--font-ui); }
body.teamwork-page :is(.teamwork-kicker, .teamwork-personal-summary-note, .teamwork-workspace-status,
  .teamwork-workspace-hint, .teamwork-invite-link, .teamwork-draft-banner) { color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); letter-spacing: 0; text-transform: none; }
body.teamwork-page .teamwork-section-title { font: var(--phone-title-weight) var(--phone-title-size)/var(--phone-title-lh) var(--font-ui); }
body.teamwork-page :is(.teamwork-form-input, .teamwork-inline-input, .teamwork-member-input, .teamwork-task-input, .teamwork-delete-btn) { min-height: 44px; box-sizing: border-box; }
body.teamwork-page :is(.teamwork-add-form, .teamwork-add-task-form):focus-within .teamwork-form-input { border-color: var(--text-muted); }

body.travel-page :is(.travel-day-chip, .travel-route-btn, .travel-search-btn, .travel-icon-btn, .travel-sheet-close,
  .travel-stop-remove, .travel-share button) { min-height: 44px; min-width: 44px; font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); letter-spacing: 0; }
body.travel-page .travel-day-chip { padding: var(--space-sm); }
body.travel-page .travel-days { gap: var(--space-sm); margin-bottom: var(--space-md); }
body.travel-page .travel-day-chip.is-active,
body.travel-page .travel-route-btn { background: var(--primary); color: var(--on-primary); }
body.travel-page .travel-route-btn:hover { background: var(--primary-hover); }
body.travel-page :is(.travel-stop, .travel-desktop-stop) { background: transparent; border-radius: 0; border: 0; border-bottom: 1px solid var(--quiet-line); box-shadow: none; }
body.travel-page :is(.travel-stop, .travel-desktop-stop).is-active { background: var(--surface); box-shadow: none; }
body.travel-page .travel-share { background: transparent; border: 0; border-radius: 0; padding: var(--space-md) 0; margin-inline: 0; }
body.travel-page :is(.travel-trip-title, .travel-stop-name) { font: var(--phone-task-weight) var(--phone-task-size)/var(--phone-task-lh) var(--font-ui); letter-spacing: 0; }
body.travel-page :is(.travel-trip-meta, .travel-side-subtitle, .travel-stops-empty, .travel-share-hint) { font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); letter-spacing: 0; }

/* Every disclosure keeps its direction visible, including the secondary tools. */
:is(.tally-quick-options, .tally-insights, .cal-search-disclosure, .travel-info, .reminder-settings, .teamwork-personal-draft, .m-task-details, .mail-digest-rest) > summary { min-height: 44px; list-style: none; cursor: pointer; gap: var(--space-sm); }
:is(.tally-quick-options, .tally-insights, .cal-search-disclosure, .travel-info, .reminder-settings, .teamwork-personal-draft, .m-task-details, .mail-digest-rest) > summary::-webkit-details-marker { display: none; }
:is(.tally-quick-options, .tally-insights, .cal-search-disclosure, .travel-info, .reminder-settings, .teamwork-personal-draft, .m-task-details, .mail-digest-rest) > summary::after { content: '›'; display: inline-block; margin-left: auto; color: var(--text-muted); transform: rotate(0deg); }
:is(.tally-quick-options, .tally-insights, .cal-search-disclosure, .travel-info, .reminder-settings, .teamwork-personal-draft, .m-task-details, .mail-digest-rest)[open] > summary::after { transform: rotate(90deg); }

/* Welcome exposes the two entry choices directly and keeps the original mark. */
.welcome-screen { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-lg); min-height: 100dvh; box-sizing: border-box; padding: max(var(--space-lg), env(safe-area-inset-top, 0px)) var(--space-md) max(var(--space-lg), env(safe-area-inset-bottom, 0px)); overflow: visible; touch-action: auto; }
.welcome-ghost-field { position: static; width: calc(var(--space-xl) * 2); height: auto; }
.welcome-floating-ghost { position: static; display: block; width: 100%; height: auto; opacity: 1; filter: none; transform: none; transition: none; will-change: auto; }
.welcome-screen :is(.welcome-intro, .welcome-reveal, .welcome-actions) { position: static; width: min(100%, 25rem); opacity: 1; transform: none; transition: none; }
.welcome-screen .welcome-kicker { color: var(--text-muted); font: var(--phone-meta-weight) var(--phone-meta-size)/var(--phone-meta-lh) var(--font-ui); letter-spacing: 0; text-transform: none; }
.welcome-screen .welcome-title { margin-top: var(--space-sm); font: var(--phone-display-weight) var(--phone-display-size)/var(--phone-display-lh) var(--font-ui); letter-spacing: 0; }
.welcome-screen .welcome-reveal-copy { color: var(--text-muted); font: var(--phone-body-weight) var(--phone-body-size)/var(--phone-body-lh) var(--font-ui); letter-spacing: 0; }
.welcome-screen .welcome-actions { display: grid; gap: var(--space-sm); pointer-events: auto; }
.welcome-screen :is(.welcome-provider, .welcome-enter) { min-height: 48px; padding: var(--space-sm) var(--space-md); border: 0; border-radius: var(--radius-pill); font: var(--phone-action-weight) var(--phone-action-size)/var(--phone-action-lh) var(--font-ui); letter-spacing: 0; box-shadow: none; }
.welcome-screen .welcome-provider-google { background: var(--primary); color: var(--on-primary); }
.welcome-screen .welcome-enter { background: var(--surface); color: var(--text); }
.welcome-screen :is(.welcome-provider, .welcome-enter):hover { background: var(--surface-hover); color: var(--text); transform: none; box-shadow: none; }

@media (min-width: 820px) {
  body.has-bento-rail .layout,
  body.planner-page.has-bento-rail .layout,
  body.travel-page.has-bento-rail .layout { width: min(1120px, 92vw); max-width: min(1120px, 92vw); padding: 0; gap: var(--space-lg); margin-inline: auto; }
  body.travel-page.has-bento-rail .bento-rail { position: sticky; top: var(--space-md); left: auto; bottom: auto; height: calc(100dvh - var(--space-md) * 2); }
  body.has-bento-rail:not(.has-mobile-dock) :is(.bento-rail-brand, .bento-rail-link, .bento-rail-theme, .bento-rail-lang) { min-width: 44px; min-height: 44px; }
  body.planner-page .planner-shell { padding: var(--space-lg) 0 var(--space-xl); }
  body.teamwork-page .main-area { padding: var(--space-lg) 0; }
}
@media (max-width: 819px) {
  body.planner-page.has-bento-rail .layout { padding: 0; }
  body.planner-page .planner-cards { gap: var(--space-sm); }
  body.travel-page :is(.travel-stop, .travel-desktop-stop) { min-height: 72px; padding: var(--space-sm) 0; }
  body.travel-page .travel-stop-list { max-height: none; overflow: visible; }
  body.calendar-page .cal-shell .cal-week-head { overflow-x: auto; }
  body.calendar-page .cal-week-day { min-width: 44px; }
}

/* Approved Apple-inspired material; preserve the existing page and control layout. */
:root {
  --type-label-weight: var(--phone-meta-weight);
  --material-fill: var(--panel-surface);
  --material-control: var(--surface);
  --material-edge: color-mix(in srgb, var(--text) 12%, transparent);
  --material-shadow: 0 var(--space-md) var(--space-xl) color-mix(in srgb, var(--overlay-ink) 18%, transparent);
  --material-blur: none;
  --workspace-viewport-height: 100dvh;
}
:root[data-theme="dark"] {
  --material-edge: color-mix(in srgb, var(--text) 13%, transparent);
  --material-shadow: 0 var(--space-md) var(--space-xl) color-mix(in srgb, var(--overlay-ink) 40%, transparent);
  --text-muted: color-mix(in srgb, var(--secondary) 76%, var(--text));
}
body { isolation: isolate; }
body.has-bento-rail .layout {
  position: relative;
  background: transparent;
}
/* Only this paint layer blurs. Fixed dialogs and the drawer stay in the viewport. */
body.has-bento-rail .layout::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: var(--material-fill);
  backdrop-filter: var(--material-blur);
  -webkit-backdrop-filter: var(--material-blur);
  pointer-events: none;
}
body.has-mobile-dock .layout::before {
  position: fixed;
  border-radius: 0;
}
body :is(.workspace-icon-button, .page-action-cluster .workspace-agent-button,
  .filter-btn.is-active, .workspace-task-shortcuts button) {
  background: var(--material-control);
  border: 1px solid var(--material-edge);
}
body .page-action-cluster .notif-bell {
  background: var(--material-control);
  border: 1px solid var(--material-edge);
}
body .add-form-notion .add-form-row,
body .deadline-trigger {
  background: var(--material-control);
  border-color: var(--material-edge);
}
body .m-top { background: transparent; }
body.todo-mobile .m-shell { align-items: stretch; }
body .m-task-tabs button[aria-selected=true] {
  background: transparent;
  border-inline: 0;
  border-top: 0;
}
body :is(.todo-label, .planner-card-face-title, .travel-stop-title) {
  font-size: var(--phone-task-size);
  font-weight: var(--phone-task-weight);
  line-height: var(--phone-task-lh);
}
body :is(.todo-due, .task-detail-meta, .daily-loop-pill-label,
  .daily-loop-progress, .tally-record-note, .planner-meta, .travel-trip-meta) {
  font-size: var(--phone-meta-size);
  font-weight: var(--phone-meta-weight);
  line-height: var(--phone-meta-lh);
}
body :is(.daily-loop-pill-count, .cal-week-day-wd, .tally-bar-value, .tally-bar-day) {
  font-weight: var(--phone-meta-weight);
}

@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
  :root {
    --material-fill: color-mix(in srgb, var(--panel-surface) 72%, transparent);
    --material-control: color-mix(in srgb, var(--surface) 48%, transparent);
    --material-blur: blur(28px) saturate(1.05);
  }
  :root[data-theme="dark"] {
    --material-fill: color-mix(in srgb, var(--panel-surface) 60%, transparent);
  }
  body.has-mobile-dock {
    --material-fill: color-mix(in srgb, var(--panel-surface) 82%, transparent);
    --material-blur: blur(20px) saturate(1.05);
  }
  :root[data-theme="dark"] body.has-mobile-dock {
    --material-fill: color-mix(in srgb, var(--bg) 36%, transparent);
  }
  body.has-bento-rail::before,
  :root[data-theme="dark"] body.has-bento-rail::before {
    display: block;
    content: '';
    position: fixed;
    inset: 0;
    z-index: -2;
    background: var(--light-backdrop);
    filter: none;
    transform: none;
    opacity: 1;
    pointer-events: none;
  }
  :root[data-theme="dark"] body.has-bento-rail::before {
    background: var(--dark-backdrop);
    filter: none;
  }
}
@media (min-width: 820px) {
  body.has-bento-rail:not(.has-mobile-dock) {
    display: flow-root;
    --workspace-viewport-height: calc(100dvh - var(--space-lg) * 2);
  }
  body.has-bento-rail:not(.has-mobile-dock) .layout {
    height: var(--workspace-viewport-height);
    min-height: 0;
    margin-block: var(--space-lg);
    border: 1px solid var(--material-edge);
    border-radius: var(--radius-lg);
    box-shadow: var(--material-shadow);
  }
  body.has-bento-rail:not(.has-mobile-dock) .main-area {
    height: 100%;
    min-height: 0;
    overflow-y: auto;
    scrollbar-width: thin;
    box-sizing: border-box;
    padding-inline-end: var(--space-lg);
    border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
  }
  body.has-bento-rail:not(.has-mobile-dock) .bento-rail {
    position: sticky;
    top: 0;
    align-self: stretch;
    height: 100%;
    margin: 0;
    border: 0;
    border-right: 1px solid var(--material-edge);
    border-radius: var(--radius-lg) 0 0 var(--radius-lg);
    background: color-mix(in srgb, var(--surface) 16%, transparent);
  }
  body.todo-bento .app.bento-shell.today-shell { margin-inline: auto; }
  body.mail-page.mail-connect-view .mail-app {
    min-height: calc(var(--workspace-viewport-height) - var(--space-xl) * 2);
  }
  body.teamwork-page .teamwork-app,
  body.calendar-page .calendar-app {
    min-height: auto;
  }
  body.planner-page .planner-card:not(.is-collapsed) .planner-card-top {
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--space-sm);
  }
  body.planner-page .planner-card-title-wrap {
    flex: 1 1 calc(100% - 44px - var(--space-sm));
  }
}
body.travel-page .travel-search-day {
  background: var(--surface-muted);
  color: var(--text);
}
body.travel-page .travel-search-btn {
  background: var(--primary);
  color: var(--on-primary);
  border-color: transparent;
}
body.travel-page .travel-desktop-day.is-active {
  background: var(--surface-muted);
  border-color: var(--text-muted);
  box-shadow: none;
}
@media (prefers-reduced-motion: reduce) {
  body.has-bento-rail { --material-blur: blur(16px); }
}
@media (prefers-reduced-transparency: reduce) {
  :root, :root[data-theme="dark"], body.has-bento-rail,
  :root[data-theme="dark"] body.has-mobile-dock {
    --material-fill: var(--panel-surface);
    --material-control: var(--surface);
    --material-blur: none;
  }
  body.has-bento-rail::before,
  :root[data-theme="dark"] body::before,
  :root[data-theme="dark"] body.has-bento-rail::before { display: none; }
  body.has-bento-rail:not(.has-mobile-dock) .bento-rail {
    background: var(--surface);
  }
}