/* Life Assistant 3.6 — one authoritative adaptive layer.
   This file intentionally loads last and neutralises legacy scale/layout rules. */

:root {
  --desktop-sidebar: 248px;
  --desktop-content-max: 1600px;
  --motion-fast: 150ms;
  --motion-normal: 240ms;
  --motion-spring: cubic-bezier(.2, .8, .2, 1);
}

html { min-width: 320px; }
body { zoom: 1 !important; }

body {
  background:
    radial-gradient(circle at 8% -8%, color-mix(in srgb, var(--ac) 10%, transparent), transparent 34rem),
    radial-gradient(circle at 104% 104%, color-mix(in srgb, var(--ac2) 7%, transparent), transparent 38rem),
    var(--bg) !important;
}

.desktop-sidebar,
.topbar,
.panel,
.content-card,
.today-metric,
.mobile-nav,
.sheet,
.modal-card {
  transition: background-color 260ms ease, border-color 260ms ease, color 220ms ease,
    box-shadow 260ms ease;
}

/* Keep application chrome unavailable while a first-run dialog owns focus. */
body.onboarding-active #app {
  pointer-events: none;
  user-select: none;
}

.device-select-screen,
.connection-screen {
  overscroll-behavior: contain;
  overflow: auto;
  padding: max(18px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right))
    max(18px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
}

/* Passkey-first authentication */
.connection-card { position: relative; overflow: hidden; }
.connection-card::before {
  content: '';
  position: absolute;
  width: 210px;
  height: 210px;
  right: -90px;
  top: -100px;
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--ac) 24%, transparent), transparent 68%);
  pointer-events: none;
}
.connection-logo {
  color: white;
  isolation: isolate;
}
.passkey-login-panel { display: grid; gap: 6px; margin-top: 26px; }
.passkey-login-panel[hidden], .auth-secondary[hidden] { display: none !important; }
.passkey-main-action {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 58px !important;
  font-size: 15px !important;
  box-shadow: 0 16px 36px color-mix(in srgb, var(--ac) 28%, transparent) !important;
}
.passkey-button-icon {
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  border-radius: 9px;
  background: rgba(255,255,255,.18);
  font-size: 14px;
}
.auth-secondary {
  margin-top: 22px;
  padding-top: 17px;
  border-top: 1px solid var(--line);
}
.auth-secondary > summary {
  color: var(--muted);
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
  list-style-position: inside;
}
.auth-secondary[open] > summary { color: var(--text); margin-bottom: 16px; }
.auth-setup-form { padding: 0 !important; }
.auth-recovery-form {
  margin-top: 18px;
  padding: 17px 0 0 !important;
  border-top: 1px solid var(--line);
}
.auth-legacy-link { justify-self: center; font-size: 12px; color: var(--muted); }
.auth-security-note { display: flex; align-items: flex-start; gap: 8px; margin-top: 14px; }
.auth-security-note::before { content: '✓'; color: var(--success); font-weight: 900; }
.auth-method-panel {
  display: grid;
  gap: 12px;
  margin-top: 22px;
  padding: 18px;
  border: 1px solid color-mix(in srgb, var(--ac) 28%, var(--line));
  border-radius: 18px;
  background: var(--ac-s);
}
.auth-method-panel[hidden] { display: none; }
.auth-method-panel h2 { margin: 0; font-size: 18px; letter-spacing: -.02em; }
.auth-method-panel p { margin: 0; color: var(--muted); line-height: 1.5; }
.auth-method-badge {
  width: fit-content;
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--card-bg);
  color: var(--ac);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.auth-recovery-code {
  padding: 14px;
  border: 1px dashed color-mix(in srgb, var(--ac) 45%, var(--line));
  border-radius: 14px;
  background: var(--ac-s);
  color: var(--text);
  font: 700 13px/1.7 ui-monospace, SFMono-Regular, Consolas, monospace;
  overflow-wrap: anywhere;
  user-select: all;
}
.auth-share-modal {
  position: fixed;
  inset: 0;
  z-index: 220;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(8,10,16,.58);
  backdrop-filter: blur(12px);
}
.auth-share-card { width: min(100%, 460px) !important; overflow: hidden; }
.auth-share-body { display: grid; gap: 16px; padding: 20px 22px 22px; }
.auth-share-body > p { margin: 0; line-height: 1.55; }
.auth-pairing-qr {
  width: min(240px, 72vw);
  aspect-ratio: 1;
  justify-self: center;
  padding: 10px;
  border-radius: 20px;
  background: white;
  box-shadow: var(--shadow-md);
}

@media (max-width: 520px) {
  .connection-card h1 { font-size: 30px !important; }
  .connection-card .lead { font-size: 14px; }
  .passkey-main-action { min-height: 54px !important; }
}

/* Desktop is a true workspace, not a magnified mobile canvas. */
@media (min-width: 1100px) {
  body.device-desktop,
  body:not(.device-phone):not(.device-tablet):not(.device-desktop) {
    font-size: 15px;
  }

  body.device-desktop .desktop-sidebar,
  body:not(.device-phone):not(.device-tablet):not(.device-desktop) .desktop-sidebar {
    width: var(--desktop-sidebar) !important;
    padding: 18px 14px !important;
  }

  body.device-desktop .main-area,
  body:not(.device-phone):not(.device-tablet):not(.device-desktop) .main-area {
    margin-left: var(--desktop-sidebar) !important;
  }

  body.device-desktop .content,
  body:not(.device-phone):not(.device-tablet):not(.device-desktop) .content {
    box-sizing: border-box;
    width: 100%;
    max-width: var(--desktop-content-max) !important;
    padding: 34px clamp(32px, 4vw, 68px) 72px !important;
  }

  .topbar {
    min-height: 72px !important;
    padding-inline: clamp(28px, 3.5vw, 58px) !important;
  }

  .hub-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .assistant-hub-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .health-metric-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .insights-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

  /* Entity editing uses the wide screen without obscuring the current context. */
  #editor-modal.modal {
    align-items: stretch !important;
    justify-content: flex-end !important;
    padding: 0 !important;
  }

  #editor-modal .modal-card {
    width: min(720px, 48vw) !important;
    max-width: 720px !important;
    max-height: 100dvh !important;
    height: 100dvh;
    border-radius: 24px 0 0 24px !important;
    box-shadow: -24px 0 70px rgba(15, 20, 35, .18) !important;
    animation: adaptive-inspector-in var(--motion-normal) var(--motion-spring) both !important;
  }

  #editor-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-content: start;
  }

  #editor-form > .form-actions,
  #editor-form > .editor-actions,
  #editor-form > details,
  #editor-form > p,
  #editor-form > label:has(textarea),
  #editor-form > label:has(input[type="file"]),
  #editor-form > .full {
    grid-column: 1 / -1;
  }

  #editor-form .form-actions {
    bottom: -1px;
    padding: 16px 0 max(4px, env(safe-area-inset-bottom));
    border-top: 1px solid var(--card-brd);
  }
}

/* Phone: consistent mental model, safe-area and comfortable touch targets. */
@media (max-width: 760px) {
  body.device-phone .content,
  body:not(.device-phone):not(.device-tablet):not(.device-desktop) .content {
    padding: 18px 14px calc(104px + env(safe-area-inset-bottom)) !important;
  }

  .topbar {
    min-height: 64px !important;
    padding: max(8px, env(safe-area-inset-top)) 12px 8px !important;
  }

  .greeting-icon-btn,
  .workspace-button,
  .mobile-search-button,
  .mobile-theme-button,
  .notification-button {
    min-width: 44px !important;
    min-height: 44px !important;
  }

  .mobile-mode-pill { width: 96px !important; flex: 0 0 96px !important; min-height: 48px; }
  .mobile-mode-pill .workspace-button { width: 48px; min-width: 48px !important; padding: 0 !important; }
  .greeting-row { min-width: 0; }
  .greeting-copy { min-width: 0; }
  .greeting-copy strong,
  .greeting-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  body.device-phone .mobile-nav,
  body:not(.device-phone):not(.device-tablet):not(.device-desktop) .mobile-nav {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: center !important;
    bottom: max(8px, env(safe-area-inset-bottom)) !important;
    min-height: 64px !important;
  }

  .mobile-nav-button {
    min-height: 60px !important;
    font-size: 10px !important;
  }

  .mobile-nav-button span { font-size: 10px !important; }

  .mobile-fab {
    bottom: calc(max(8px, env(safe-area-inset-bottom)) + 8px) !important;
    transition: transform var(--motion-normal) var(--motion-spring),
      box-shadow var(--motion-normal) ease, opacity var(--motion-fast) ease !important;
  }

  .mobile-fab:active { transform: translateX(-50%) scale(.92) !important; }

  .device-select-card,
  .connection-card {
    width: min(100%, 420px) !important;
    margin: auto;
  }

  .device-select-options { grid-template-columns: 1fr !important; }
  .device-option {
    min-height: 76px;
    padding: 12px 14px !important;
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) !important;
    column-gap: 12px !important;
    text-align: left !important;
  }
  .device-option-ico { grid-row: 1 / 3; width: 48px; height: 48px; }
  .device-option-label,
  .device-option-sub { text-align: left; }

  .voice-sheet {
    max-height: min(92dvh, var(--visual-viewport-height, 92dvh));
    padding-bottom: calc(18px + env(safe-area-inset-bottom));
  }

  .voice-record-button { min-height: 72px !important; }
}

/* Stable, GPU-friendly motion: animate the changed surface, never the full app. */
.hub-tile,
.panel,
.task-card,
.notification-card,
.health-metric-card {
  contain: layout paint;
}

.hub-tile,
.health-metric-card {
  transition: transform var(--motion-normal) var(--motion-spring),
    border-color var(--motion-fast) ease, box-shadow var(--motion-normal) ease !important;
}

.voice-inbox-panel { margin-top: 20px; }
.voice-inbox-panel > h2 { margin: 4px 0 14px; }
.voice-inbox-list { display: grid; gap: 10px; }
.voice-inbox-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 13px 14px;
  border: 1px solid var(--card-brd);
  border-radius: 14px;
  background: var(--bg);
}
.voice-inbox-copy { min-width: 0; display: grid; gap: 4px; }
.voice-inbox-copy p { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.voice-inbox-actions { display: flex; gap: 8px; flex: 0 0 auto; }

@media (max-width: 560px) {
  .voice-inbox-row { align-items: stretch; flex-direction: column; }
  .voice-inbox-actions .button { flex: 1; }
}

@keyframes adaptive-inspector-in {
  from { opacity: 0; transform: translate3d(28px, 0, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

/* Context transition: a directional colour veil expands from the workspace
   switch, reveals the new palette, then dissolves without flashing the page. */
.interface-overlay {
  --transition-x: 50%;
  overflow: hidden;
  opacity: 1 !important;
  visibility: hidden;
  clip-path: circle(0 at var(--transition-x) 72px);
  transition: clip-path 420ms cubic-bezier(.22, .78, .2, 1), visibility 0s linear 420ms !important;
  isolation: isolate;
}

.interface-overlay::before,
.interface-overlay::after {
  content: '';
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
  filter: blur(2px);
}

.interface-overlay::before {
  width: min(72vw, 760px);
  aspect-ratio: 1;
  top: -38%;
  left: -14%;
  background: rgba(255, 255, 255, .10);
}

.interface-overlay::after {
  width: min(54vw, 620px);
  aspect-ratio: 1;
  right: -12%;
  bottom: -42%;
  border: 1px solid rgba(255, 255, 255, .20);
  background: rgba(255, 255, 255, .045);
}

.interface-overlay.active {
  visibility: visible;
  clip-path: circle(150vmax at var(--transition-x) 72px);
  transition: clip-path 420ms cubic-bezier(.22, .78, .2, 1), visibility 0s !important;
}

.interface-overlay.leaving {
  visibility: visible;
  clip-path: circle(150vmax at var(--transition-x) 72px);
  opacity: 0 !important;
  transition: opacity 300ms ease !important;
}

.interface-overlay-card {
  position: relative;
  z-index: 1;
  min-width: min(82vw, 340px);
  display: grid;
  justify-items: center;
  gap: 7px;
  padding: 26px 34px 24px;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 28px;
  background: rgba(255, 255, 255, .12);
  color: white;
  box-shadow: 0 24px 70px rgba(10, 12, 24, .24);
  backdrop-filter: blur(24px) saturate(125%);
  opacity: 0;
  transform: translateY(18px) scale(.92);
  transition: opacity 240ms ease 90ms, transform 420ms cubic-bezier(.2, .9, .2, 1) 50ms;
}

.interface-overlay-icon {
  --ac: #fff;
  --ac2: rgba(255, 255, 255, .74);
  width: 66px;
  height: 66px;
  margin-bottom: 4px;
  opacity: 1;
  transform: none;
  transition: none;
}

.interface-overlay.active .interface-overlay-card {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.interface-overlay.leaving .interface-overlay-card {
  opacity: 0;
  transform: translateY(-12px) scale(1.035);
  transition: opacity 200ms ease, transform 280ms ease;
}

.interface-overlay-kicker {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
  opacity: .72;
}

.interface-overlay-label {
  font-size: clamp(20px, 4vw, 27px);
  letter-spacing: -.025em;
}

#app { transition: transform 460ms cubic-bezier(.2, .8, .2, 1), filter 320ms ease; }
body.interface-changing #app { transform: scale(.992); filter: saturate(.88); }

/* Workspace changes are deliberately brief: the user already knows which
   control was pressed, so the veil confirms direction without delaying work. */
.interface-overlay[data-kind="workspace"] {
  transition: clip-path 160ms cubic-bezier(.22, .78, .2, 1), visibility 0s linear 160ms !important;
}
.interface-overlay[data-kind="workspace"].active {
  transition: clip-path 160ms cubic-bezier(.22, .78, .2, 1), visibility 0s !important;
}
.interface-overlay[data-kind="workspace"].leaving {
  transition: opacity 110ms ease !important;
}
.interface-overlay[data-kind="workspace"] .interface-overlay-card {
  transition: opacity 110ms ease, transform 160ms cubic-bezier(.2, .9, .2, 1) !important;
}

/* Native Android workspace motion. Only transform + opacity are animated so
   the WebView can keep the transition on the compositor even on a busy home
   screen. The old and new DOM are never visible in the same frame. */
.content.workspace-motion-forward,
.content.workspace-motion-backward {
  will-change: transform, opacity;
  contain: paint;
  backface-visibility: hidden;
}

.content.workspace-motion-forward.workspace-motion-out {
  animation: android-workspace-out-forward 120ms cubic-bezier(.4, 0, 1, 1) both !important;
}
.content.workspace-motion-backward.workspace-motion-out {
  animation: android-workspace-out-backward 120ms cubic-bezier(.4, 0, 1, 1) both !important;
}
.content.workspace-motion-forward.workspace-motion-in {
  animation: android-workspace-in-forward 205ms cubic-bezier(.16, 1, .3, 1) both !important;
}
.content.workspace-motion-backward.workspace-motion-in {
  animation: android-workspace-in-backward 205ms cubic-bezier(.16, 1, .3, 1) both !important;
}

body.android-workspace-changing .content.view-enter > *,
body.android-workspace-changing .content.view-enter .stagger-item {
  animation: none !important;
  opacity: 1;
  transform: none;
}
body.android-workspace-changing #app {
  transform: none !important;
  filter: none !important;
}

@keyframes android-workspace-out-forward {
  to { opacity: 0; transform: translate3d(-22px, 0, 0); }
}
@keyframes android-workspace-out-backward {
  to { opacity: 0; transform: translate3d(22px, 0, 0); }
}
@keyframes android-workspace-in-forward {
  from { opacity: 0; transform: translate3d(28px, 0, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes android-workspace-in-backward {
  from { opacity: 0; transform: translate3d(-28px, 0, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}

/* Completed tasks stay available without dominating the daily workspace. */
.task-archive {
  margin-top: 18px;
  padding: 0 !important;
  overflow: hidden;
}

.task-archive-summary {
  min-height: 68px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  cursor: pointer;
  list-style: none;
  user-select: none;
}

.task-archive-summary::-webkit-details-marker { display: none; }
.task-archive-summary > span:nth-child(2) { display: grid; gap: 3px; }
.task-archive-summary small { color: var(--muted); font-size: 12px; line-height: 1.35; }
.task-archive-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: var(--ac-s);
  color: var(--ac);
  font-weight: 900;
}
.task-archive-chevron { color: var(--muted); font-size: 25px; transition: transform 180ms ease; }
.task-archive[open] .task-archive-chevron { transform: rotate(90deg); }
.task-archive-list { border-top: 1px solid var(--card-brd); padding: 4px 14px 12px; }

.project-task-count {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 13px;
  background: var(--surface-soft);
}
.project-task-count strong { font-size: 22px; color: var(--ac); }
.project-task-count span { color: var(--muted); font-size: 13px; }
.today-project-task-count { display: grid; justify-items: end; gap: 2px; min-width: 72px; }
.today-project-task-count strong { font-size: 18px; color: var(--ac); }
.today-project-task-count span { color: var(--muted); font-size: 11px; }

/* Fast habit check-in from the dashboard. */
.habit-checkin-modal { z-index: 1200; }
.habit-checkin-card { width: min(92vw, 430px); padding: 22px !important; }
.habit-checkin-head { display: flex; align-items: center; gap: 14px; }
.habit-checkin-head h2 { margin: 2px 0 0; }
.habit-checkin-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  flex: 0 0 48px;
  border-radius: 15px;
  color: var(--ac);
  background: var(--ac-s);
}
.habit-checkin-icon.complete { color: var(--success); background: color-mix(in srgb, var(--success) 14%, transparent); }
.habit-checkin-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.9; }
.habit-checkin-status { margin: 18px 0; color: var(--muted); }
.habit-checkin-actions { display: grid; gap: 9px; }

/* AI wardrobe intake: photo first, automatic fields second, explicit review. */
.wardrobe-ai-button {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  background: linear-gradient(135deg, var(--ac), var(--accent-2, var(--ac)));
  color: white;
}
.wardrobe-ai-button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.wardrobe-ai-button.loading svg { animation: wardrobe-ai-pulse 900ms ease-in-out infinite alternate; }
.wardrobe-ai-status {
  margin-top: -2px;
  padding: 11px 13px;
  border-radius: 12px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.wardrobe-ai-status.success { color: var(--success); background: color-mix(in srgb, var(--success) 10%, transparent); }
.wardrobe-ai-status.error { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, transparent); }
@keyframes wardrobe-ai-pulse { to { transform: scale(1.18) rotate(12deg); } }

/* iOS Safari can leave a blurred fixed overlay interactive but unpainted. */
.more-menu-overlay {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  touch-action: manipulation;
}
.more-menu { touch-action: pan-y; overscroll-behavior: contain; }
.greeting-icon-btn.open .greeting-icon { transform: scale(.94) !important; }
.greeting-icon svg { fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; }

@media (max-width: 760px) {
  .task-archive-summary { padding: 13px 14px; }
  .task-archive-list { padding-inline: 10px; }
  .habit-checkin-card { border-radius: 22px 22px 0 0 !important; padding-bottom: max(20px, env(safe-area-inset-bottom)); }
  .wardrobe-ai-button, .wardrobe-ai-status { grid-column: 1 / -1; }
}

/* 4.2 — compact information architecture. Descriptions live in contextual help. */
.button,
.page-unified-add-btn,
.quick-action,
.more-menu-item,
.text-button,
.icon-button {
  justify-content: center;
  text-align: center;
}
.brand-mark { padding: 0 !important; overflow: hidden; background: transparent !important; }
.brand-mark img { width: 100%; height: 100%; display: block; }

.page-head {
  align-items: center !important;
  gap: 14px !important;
  margin-bottom: 20px !important;
}
.page-title-row,
.compact-section-head {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 9px;
}
.page-title-row h1,
.compact-section-head h2 { margin: 0; }
.page-head-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
}
.page-head-actions > * { margin: 0 !important; }
.context-help-button {
  width: 32px;
  height: 32px;
  min-width: 32px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--card-brd);
  border-radius: 50%;
  color: var(--muted);
  background: var(--surface-soft);
  cursor: pointer;
}
.context-help-button:active { transform: scale(.94); }
.context-help-button svg,
.context-help-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.context-help-modal { z-index: 1600; }
.context-help-card { width: min(92vw, 440px); padding: 22px !important; }
.context-help-head { display: flex; align-items: center; gap: 13px; }
.context-help-head h2 { margin: 2px 0 0; }
.context-help-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  flex: 0 0 44px;
  border-radius: 14px;
  color: var(--ac);
  background: var(--ac-s);
}
.context-help-copy { margin: 18px 0; color: var(--muted); line-height: 1.55; }
.context-help-close { width: 100%; }

/* A single menu surface replaces the old two-layer iOS drawer. */
.more-menu-overlay { display: none !important; }
.more-menu,
.more-menu.open {
  inset: 0 !important;
  width: 100% !important;
  max-width: none !important;
  height: 100dvh !important;
  transform: none !important;
  transition: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: var(--bg) !important;
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
  z-index: 1500 !important;
}
.more-menu[hidden] { display: none !important; }
body.sections-menu-open { overflow: hidden; }
.more-menu-header,
.more-menu-grid,
.more-menu-footer { width: min(720px, 100%); margin-inline: auto; }
.more-menu-header { min-height: 68px; padding: 15px 18px 11px !important; }
.more-menu-title { font-size: 24px !important; letter-spacing: -.6px !important; }
.more-menu-close { width: 40px !important; height: 40px !important; font-size: 22px !important; }
.more-menu-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  gap: 10px !important;
  padding: 14px 16px 20px !important;
}
.more-menu-section-lbl { grid-column: 1 / -1; margin-top: 8px; padding: 4px 2px !important; }
.more-menu-item {
  min-height: 84px;
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr);
  align-content: center;
  justify-content: start;
  gap: 10px !important;
  padding: 13px !important;
  border: 1px solid var(--card-brd) !important;
  border-radius: 17px !important;
  background: var(--card-bg, var(--surface)) !important;
  text-align: left !important;
}
.more-menu-item.active { border-color: color-mix(in srgb, var(--ac) 45%, var(--card-brd)) !important; background: var(--ac-s) !important; }
.more-menu-item-label { font-size: 13px !important; font-weight: 650 !important; }
.more-menu-footer {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom)) !important;
  border-top: 1px solid var(--card-brd);
  background: var(--bg);
}
.more-menu-customize-btn { min-height: 46px; justify-content: center !important; text-align: center !important; }
.greeting-icon-btn.open .greeting-icon { transform: none !important; }

/* Hide routine success noise; problems and pending changes remain visible. */
.sync-status-bar.synced { display: none !important; }

/* Nutrition: one visual summary, fewer repeated controls and sentences. */
.nutrition-toolbar { padding: 10px !important; }
.nutrition-datenav { width: 100%; }
.nutrition-datenav .button { flex: 1; }
.nutrition-hero-label { margin: -5px 0 10px; color: var(--muted); }
.nutrition-hero-stats { display: flex; flex-wrap: wrap; gap: 7px; }
.nutrition-hero-stats span {
  padding: 7px 9px;
  border-radius: 10px;
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 12px;
  white-space: nowrap;
}
.nutrition-activity-panel .compact-section-head { margin-bottom: 12px; }

@media (max-width: 760px) {
  .content { gap: 14px !important; }
  .page-head { margin: 2px 0 16px !important; }
  .page-head h1,
  .page-unified-title { font-size: 27px !important; line-height: 1.05 !important; letter-spacing: -.7px !important; }
  .page-head-actions { max-width: 52%; }
  .page-head-actions .button { min-height: 44px !important; }
  .page-head.has-multiple-actions { flex-wrap: wrap; }
  .page-head.has-multiple-actions .page-head-actions { flex: 1 0 100%; width: 100%; max-width: none; margin-left: 0; }
  .page-head.has-multiple-actions .page-actions { width: 100%; justify-content: stretch !important; }
  .page-head.has-multiple-actions .page-actions .button { flex: 1 1 0 !important; }
  .page-unified-header { padding-block: 4px !important; }
  .page-unified-topbar { align-items: center !important; }
  .page-actions { justify-content: flex-end !important; }
  .page-actions .button { min-width: 92px; }
  .page-unified-add-row { gap: 10px !important; }
  .page-unified-add-btn { min-height: 52px !important; }
  .panel { padding: 16px !important; }
  .nutrition-hero { padding: 18px !important; }
  .nutrition-hero h2 { font-size: 31px !important; margin-bottom: 4px !important; }
  .nutrition-energy-ring { width: 108px !important; height: 108px !important; }
  .nutrition-activity-panel > p.muted { display: none; }
  .nutrition-section > p.muted { display: none; }
  .meal-breakdown h2,
  .nutrition-activity-panel h2,
  .section-heading h2 { font-size: 23px !important; }
  .context-help-card { border-radius: 22px 22px 0 0 !important; padding-bottom: max(22px, env(safe-area-inset-bottom)) !important; }
  .voice-sheet .sheet-header { align-items: flex-start; }
  .voice-sheet .sheet-subtitle { display: none !important; }
  .voice-capture { gap: 12px !important; }
  .voice-transcript-label { display: grid !important; grid-template-columns: 1fr !important; gap: 7px; font-size: 13px; color: var(--muted); }
  .voice-transcript-label textarea { width: 100% !important; min-height: 104px !important; }
  .voice-inbox-actions,
  .voice-sheet > .form-actions { display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px !important; }
  .voice-sheet > .form-actions .button { width: 100% !important; min-height: 50px !important; }
  .hub-tile-copy small { display: none !important; }
  .hub-tile { min-height: 76px !important; }
}

@media (max-width: 420px) {
  .nutrition-hero { grid-template-columns: minmax(0, 1fr) 96px !important; gap: 8px !important; }
  .nutrition-energy-ring { width: 96px !important; height: 96px !important; }
  .nutrition-hero-stats span { font-size: 11px; padding: 6px 8px; }
}
