/* Authoritative portrait mobile layout.
   This file is loaded after styles.css and owns geometry for the two chat
   workspaces plus the bottom navigation. Do not add mobile geometry for these
   elements back to styles.css. */

/* The desktop shell is also used as the operator's phone preview. New mobile
   header markup must remain bounded there, otherwise an intrinsic logo can
   expand to its source size and push the whole page below the viewport. */
body.mobile-final #dashboard .dashboard-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* gui-v7 interaction closeout — keep these after every earlier mobile skin. */
@media (max-width: 760px) {
  body.mobile-final #assistant > .composer,
  body.mobile-final.keyboard-open #assistant > .composer {
    width: 100% !important;
    max-width: 100% !important;
    margin: 8px 0 0 !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-composer,
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-composer {
    width: calc(100% - 32px) !important;
    max-width: calc(100% - 32px) !important;
    margin: 8px 16px 0 !important;
  }
  body.mobile-final #recurring-payments.detail-editing .management-form-grid label {
    min-height: 50px !important;
    padding: 4px 0 !important;
  }
  body.mobile-final #recurring-payments.detail-editing .management-form-grid input,
  body.mobile-final #recurring-payments.detail-editing .management-form-grid select {
    height: 34px !important;
    min-height: 34px !important;
  }
  body.mobile-final #recurring-payments.detail-editing #recurring-payment-form {
    padding-bottom: 150px !important;
  }
  body.mobile-final #sales > .management-tabs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin: 0 0 14px !important;
  }
  body.mobile-final #sales > .management-tabs button {
    min-width: 0 !important;
    height: 42px !important;
    padding: 0 6px !important;
    border: 1px solid #e1e6e5 !important;
    border-radius: 8px !important;
    color: #25353d !important;
    background: #fff !important;
  }
  body.mobile-final #sales > .management-tabs button.active {
    border-color: #08a99e !important;
    color: #fff !important;
    background: #08a99e !important;
  }
  body.mobile-final #recurring-payments.detail-editing .management-form-grid label {
    min-height: 50px !important;
    padding: 4px 0 !important;
  }
  body.mobile-final #recurring-payments.detail-editing .management-form-grid input,
  body.mobile-final #recurring-payments.detail-editing .management-form-grid select {
    height: 34px !important;
    min-height: 34px !important;
  }
}

/* gui-v7 detail states: real list → detail/edit flows. */
@media (max-width: 760px) {
  body.mobile-final #recurring-payments.detail-editing {
    padding: max(env(safe-area-inset-top), 16px) 16px calc(94px + env(safe-area-inset-bottom)) !important;
    background: #fff !important;
  }
  body.mobile-final #recurring-payments.detail-editing > .secondary-target-header,
  body.mobile-final #recurring-payments.detail-editing > .recurring-status-tabs,
  body.mobile-final #recurring-payments.detail-editing > .recurring-info,
  body.mobile-final #recurring-payments.detail-editing > .recurring-search-tools,
  body.mobile-final #recurring-payments.detail-editing > #recurring-action-form,
  body.mobile-final #recurring-payments.detail-editing > #recurring-payment-list {
    display: none !important;
  }
  body.mobile-final #recurring-payments.detail-editing #recurring-payment-form {
    display: block !important;
    min-height: 100% !important;
    margin: 0 !important;
    padding: 0 0 96px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
  }
  body.mobile-final #recurring-payments.detail-editing .management-form-head {
    position: relative !important;
    display: flex !important;
    min-height: 64px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 0 18px !important;
  }
  body.mobile-final #recurring-payments.detail-editing .management-form-head strong {
    font-size: 24px !important;
    font-weight: 760 !important;
  }
  body.mobile-final #recurring-payments.detail-editing .management-form-head button {
    position: absolute !important;
    left: 0 !important;
    width: 44px !important;
    height: 44px !important;
  }
  body.mobile-final #recurring-payments.detail-editing .management-form-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    padding: 0 14px !important;
    border: 1px solid #e1e6e5 !important;
    border-radius: 12px !important;
    background: #fff !important;
  }
  body.mobile-final #recurring-payments.detail-editing .management-form-grid label,
  body.mobile-final #recurring-payments.detail-editing #recurring-payment-form > label {
    display: grid !important;
    grid-template-columns: 118px minmax(0,1fr) !important;
    min-height: 62px !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 8px 0 !important;
    border-bottom: 1px solid #edf0ef !important;
  }
  body.mobile-final #recurring-payments.detail-editing label span { color: #172630 !important; font-size: 15px !important; }
  body.mobile-final #recurring-payments.detail-editing input,
  body.mobile-final #recurring-payments.detail-editing select,
  body.mobile-final #recurring-payments.detail-editing textarea {
    min-width: 0 !important;
    width: 100% !important;
    border: 0 !important;
    background: transparent !important;
    text-align: right !important;
  }
  body.mobile-final #recurring-payments.detail-editing #recurring-payment-form > label {
    grid-template-columns: 1fr !important;
    min-height: 116px !important;
    margin-top: 16px !important;
    padding: 14px !important;
    border: 1px solid #e1e6e5 !important;
    border-radius: 12px !important;
  }
  body.mobile-final #recurring-payments.detail-editing textarea { min-height: 66px !important; text-align: left !important; }
  body.mobile-final #recurring-payments.detail-editing .form-safety-note {
    margin: 16px 0 0 !important;
    padding: 14px !important;
    border: 1px solid #cde8e5 !important;
    border-radius: 10px !important;
    color: #52616a !important;
    background: #f6fbfa !important;
  }
  body.mobile-final #recurring-payments.detail-editing .recurring-edit-actions {
    position: fixed !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 80 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom)) !important;
    border-top: 1px solid #e5e9e8 !important;
    background: rgba(255,255,255,.98) !important;
  }
  body.mobile-final #recurring-payments.detail-editing .recurring-edit-actions button { min-height: 52px !important; }

  body.mobile-final #sales[data-sales-view="stores"] > .secondary-target-header h1 { font-size: 25px !important; }
  body.mobile-final #sales[data-sales-view="stores"] > .secondary-target-header .secondary-header-actions { display: none !important; }
  body.mobile-final #sales[data-sales-view="stores"] .store-directory-filters {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }
  body.mobile-final #sales[data-sales-view="stores"] .store-directory-filters .management-form-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
  }
  body.mobile-final #sales[data-sales-view="stores"] .store-directory-filters label:first-child {
    grid-column: 1 / -1 !important;
  }
  body.mobile-final #sales[data-sales-view="stores"] .store-card {
    margin: 0 0 12px !important;
    border: 1px solid #e1e6e5 !important;
    border-radius: 11px !important;
    background: #fff !important;
    box-shadow: none !important;
  }

  body.mobile-final #app-modal[data-view="knowledge-detail"] {
    z-index: 120 !important;
    display: block !important;
    padding: 0 !important;
    background: #fff !important;
    backdrop-filter: none !important;
  }
  body.mobile-final #app-modal[data-view="knowledge-detail"] .modal-card {
    width: 100% !important;
    height: 100dvh !important;
    max-height: none !important;
    padding: max(env(safe-area-inset-top), 16px) 16px calc(24px + env(safe-area-inset-bottom)) !important;
    overflow-y: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
  }
  body.mobile-final #app-modal[data-view="knowledge-detail"] .modal-head {
    position: relative !important;
    min-height: 64px !important;
    justify-content: center !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
  }
  body.mobile-final #app-modal[data-view="knowledge-detail"] .modal-head h2 { margin: 0 !important; font-size: 24px !important; }
  body.mobile-final #app-modal[data-view="knowledge-detail"] .modal-head button { position: absolute !important; left: 0 !important; }
  body.mobile-final #app-modal[data-view="knowledge-detail"] #modal-body { padding: 0 !important; }
  body.mobile-final .knowledge-detail-title { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; margin-bottom: 16px !important; }
  body.mobile-final .knowledge-detail-title h3 { margin: 0 !important; color: #172630 !important; font-size: 26px !important; }
  body.mobile-final .knowledge-detail-title h3 span { font-size: 15px !important; color: #65727a !important; }
  body.mobile-final .knowledge-detail-title b { padding: 8px 12px !important; border-radius: 8px !important; color: #078f87 !important; background: #e8f7f5 !important; white-space: nowrap !important; }
  body.mobile-final .knowledge-detail-meta { margin: 0 0 14px !important; padding: 0 14px !important; border: 1px solid #e1e6e5 !important; border-radius: 10px !important; }
  body.mobile-final .knowledge-detail-meta div { display: grid !important; grid-template-columns: 96px 1fr !important; min-height: 52px !important; align-items: center !important; border-bottom: 1px solid #edf0ef !important; }
  body.mobile-final .knowledge-detail-meta div:last-child { border-bottom: 0 !important; }
  body.mobile-final .knowledge-detail-meta dt { color: #607078 !important; }
  body.mobile-final .knowledge-detail-meta dd { margin: 0 !important; color: #172630 !important; }
  body.mobile-final .knowledge-detail-content,
  body.mobile-final .knowledge-version-list { margin: 0 0 14px !important; padding: 16px !important; border: 1px solid #e1e6e5 !important; border-radius: 10px !important; background: #fff !important; }
  body.mobile-final .knowledge-detail-content h4,
  body.mobile-final .knowledge-version-list h4 { margin: 0 0 12px !important; font-size: 19px !important; }
  body.mobile-final .knowledge-detail-content p { margin: 0 0 12px !important; color: #263840 !important; font-size: 15px !important; line-height: 1.75 !important; }
  body.mobile-final .knowledge-ai-note { display: flex !important; align-items: center !important; gap: 10px !important; margin: 0 0 14px !important; padding: 13px !important; border: 1px solid #b8e1dd !important; border-radius: 9px !important; color: #078f87 !important; background: #f5fbfa !important; }
  body.mobile-final .knowledge-version-list article { display: flex !important; justify-content: space-between !important; gap: 12px !important; padding: 10px 0 !important; border-top: 1px solid #edf0ef !important; }
  body.mobile-final .knowledge-version-list small { color: #68767c !important; text-align: right !important; }
  body.mobile-final .knowledge-detail-actions { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 12px !important; }
  body.mobile-final .knowledge-detail-actions button { min-height: 50px !important; }
  body.mobile-final .knowledge-detail-actions .danger { color: #dc3b34 !important; border-color: #dc3b34 !important; }
}
body.mobile-final #dashboard .dashboard-header > div {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 12px;
}
body.mobile-final #dashboard .dashboard-header img {
  display: block;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  object-fit: contain;
  border-radius: 14px;
}
body.mobile-final #dashboard .dashboard-header h1 {
  min-width: 0;
  margin: 0;
}

@media (max-width: 600px) and (orientation: portrait) {
  :root {
    --final-nav-height: 72px;
    --final-composer-gap: 8px;
    --final-composer-height: 66px;
  }

  html,
  body.mobile-final {
    width: 100%;
    height: 100%;
    min-height: 0 !important;
    overflow: hidden !important;
    overscroll-behavior: none;
    touch-action: manipulation !important;
  }

  body.mobile-final .page {
    touch-action: pan-y !important;
  }

  body.mobile-final button,
  body.mobile-final a,
  body.mobile-final [role="button"],
  body.mobile-final .msg,
  body.mobile-final .assistant-card,
  body.mobile-final .bookkeeping-message {
    touch-action: manipulation !important;
  }

  body.mobile-final .app-shell,
  body.mobile-final .phone-frame {
    position: fixed !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: var(--app-vh, 100dvh) !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  body.mobile-final .bottom-nav,
  body.mobile-final.ios-shell .bottom-nav,
  body.mobile-final.ios-standalone .bottom-nav {
    position: fixed !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 50 !important;
    display: grid !important;
    height: calc(var(--final-nav-height) + var(--safe-bottom)) !important;
    min-height: calc(var(--final-nav-height) + var(--safe-bottom)) !important;
    padding: 6px max(8px, var(--safe-right)) max(7px, var(--safe-bottom)) max(8px, var(--safe-left)) !important;
    overflow: hidden !important;
    background: rgba(255, 255, 255, .99) !important;
    transform: none !important;
  }

  body.mobile-final #assistant.page.active,
  body.mobile-final.ios-shell #assistant.page.active,
  body.mobile-final.ios-standalone #assistant.page.active {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: calc(8px + var(--safe-top)) max(20px, var(--safe-right)) calc(var(--final-nav-height) + var(--safe-bottom) + 8px) max(20px, var(--safe-left)) !important;
    overflow: hidden !important;
  }

  body.mobile-final #assistant > .topbar,
  body.mobile-final #assistant > .context-pills {
    flex: 0 0 auto !important;
  }

  body.mobile-final #assistant > .chat-stream {
    flex: 1 1 auto !important;
    align-content: start !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 8px 0 28px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scroll-padding-bottom: 28px !important;
    overscroll-behavior-y: contain;
    overflow-anchor: none;
    -webkit-overflow-scrolling: touch;
  }

  body.mobile-final #assistant > .chat-stream > :last-child {
    margin-bottom: 18px !important;
  }

  body.mobile-final #assistant > .composer,
  body.mobile-final.ios-shell #assistant > .composer,
  body.mobile-final.ios-standalone #assistant > .composer {
    position: relative !important;
    inset: auto !important;
    z-index: 4 !important;
    display: grid !important;
    flex: 0 0 auto !important;
    grid-template-columns: minmax(0, 1fr) 50px !important;
    gap: 8px !important;
    width: 100% !important;
    height: auto !important;
    min-height: var(--final-composer-height) !important;
    margin: var(--final-composer-gap) 0 0 !important;
    padding: 7px !important;
    overflow: visible !important;
    border: 1px solid var(--target-line, #dfe6e4) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .99) !important;
    box-shadow: 0 8px 24px rgba(36, 57, 66, .08) !important;
    transform: none !important;
  }

  body.mobile-final #assistant > .composer textarea {
    width: 100% !important;
    min-height: 50px !important;
    max-height: 96px !important;
    padding: 13px 12px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: transparent !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    resize: none !important;
  }

  body.mobile-final #assistant > .composer button {
    width: 50px !important;
    min-width: 50px !important;
    height: 50px !important;
    min-height: 50px !important;
    align-self: center !important;
    padding: 0 !important;
    border-radius: 14px !important;
  }

  body.mobile-final #bookkeeping.page.active,
  body.mobile-final.ios-shell #bookkeeping.page.active,
  body.mobile-final.ios-standalone #bookkeeping.page.active {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: calc(8px + var(--safe-top)) max(16px, var(--safe-right)) calc(var(--final-nav-height) + var(--safe-bottom) + 8px) max(16px, var(--safe-left)) !important;
    overflow: hidden !important;
  }

  body.mobile-final #bookkeeping > .topbar,
  body.mobile-final #bookkeeping > .book-switch,
  body.mobile-final #bookkeeping > .bookkeeping-view-tabs {
    flex: 0 0 auto !important;
  }

  body.mobile-final #bookkeeping > .bookkeeping-view {
    flex: 1 1 auto !important;
    min-height: 0 !important;
  }

  body.mobile-final #bookkeeping > [data-bookkeeping-panel="chat"].active {
    display: block !important;
    overflow: hidden !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-shell {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-list {
    order: 1 !important;
    flex: 1 1 auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 16px 2px 24px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain;
    overflow-anchor: none;
    -webkit-overflow-scrolling: touch;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-list > :last-child {
    margin-bottom: 18px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-pending {
    order: 2 !important;
    flex: 0 0 auto !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-quick-examples {
    order: 3 !important;
    flex: 0 0 auto !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-empty {
    order: 4 !important;
    flex: 0 0 auto !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-composer {
    position: relative !important;
    inset: auto !important;
    order: 6 !important;
    z-index: 4 !important;
    display: grid !important;
    flex: 0 0 auto !important;
    grid-template-columns: minmax(0, 1fr) 54px !important;
    gap: 8px !important;
    width: 100% !important;
    height: auto !important;
    min-height: var(--final-composer-height) !important;
    margin: var(--final-composer-gap) 0 0 !important;
    padding: 7px !important;
    overflow: visible !important;
    border: 1px solid var(--target-line, #dfe6e4) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .99) !important;
    box-shadow: 0 8px 24px rgba(36, 57, 66, .08) !important;
    transform: none !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-composer textarea {
    width: 100% !important;
    min-height: 50px !important;
    max-height: 84px !important;
    padding: 12px 13px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: transparent !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    resize: none !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-composer button {
    width: 54px !important;
    min-width: 54px !important;
    height: 54px !important;
    min-height: 54px !important;
    align-self: center !important;
    padding: 0 !important;
    border-radius: 14px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-hint {
    order: 7 !important;
    flex: 0 0 auto !important;
  }

  body.mobile-final #bookkeeping > [data-bookkeeping-panel="ledger"].active,
  body.mobile-final #bookkeeping > [data-bookkeeping-panel="stats"].active,
  body.mobile-final #bookkeeping > [data-bookkeeping-panel="manage"].active {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
  }

  body.mobile-final.keyboard-open .bottom-nav {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(100%) !important;
  }

  body.mobile-final.keyboard-open .app-shell,
  body.mobile-final.keyboard-open .phone-frame {
    top: var(--visual-viewport-top, 0px) !important;
    height: var(--visual-viewport-height, 100dvh) !important;
    overflow: visible !important;
  }

  body.mobile-final.keyboard-open #assistant.page.active,
  body.mobile-final.keyboard-open #bookkeeping.page.active {
    height: var(--visual-viewport-height, 100dvh) !important;
    padding-bottom: 8px !important;
    overflow: visible !important;
  }

  body.mobile-final.keyboard-open #bookkeeping > [data-bookkeeping-panel="chat"].active,
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-chat-shell {
    overflow: visible !important;
  }

  body.mobile-final.keyboard-open #assistant > .composer,
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-composer {
    position: fixed !important;
    right: max(14px, var(--safe-right)) !important;
    bottom: auto !important;
    left: max(14px, var(--safe-left)) !important;
    z-index: 1000 !important;
    width: auto !important;
    margin: 0 !important;
  }

  body.mobile-final.keyboard-open #assistant > .composer {
    top: calc(var(--visual-viewport-top) + var(--visual-viewport-height) - 74px) !important;
  }

  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-composer {
    top: calc(var(--visual-viewport-top) + var(--visual-viewport-height) - 92px) !important;
  }

  body.mobile-final.keyboard-open #assistant > .chat-stream,
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-chat-list {
    padding-bottom: 92px !important;
    scroll-padding-bottom: 92px !important;
  }

  /* final-4: visible mobile UX closeout. Geometry above keeps the page stable;
     these rules make the result compact, readable and touch-friendly. */
  :root {
    --final-nav-height: 64px;
    --final-composer-height: 58px;
  }

  body.mobile-final .page:not(#dashboard) > .topbar {
    min-height: 56px !important;
    padding: 0 !important;
    margin: 0 0 8px !important;
  }

  body.mobile-final .page:not(#dashboard) > .topbar h1 {
    gap: 8px !important;
    font-size: 24px !important;
    line-height: 1.15 !important;
  }

  body.mobile-final .page:not(#dashboard) > .topbar h1::before {
    width: 42px !important;
    height: 42px !important;
    margin-right: 2px !important;
    border-radius: 13px !important;
  }

  body.mobile-final .top-actions {
    gap: 4px !important;
  }

  body.mobile-final .top-actions .icon-btn {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
  }

  body.mobile-final #assistant .context-pills {
    gap: 7px !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
    overflow-x: auto !important;
    scrollbar-width: none;
  }

  body.mobile-final #assistant .context-pills::-webkit-scrollbar {
    display: none;
  }

  body.mobile-final #assistant .context-pills button {
    min-width: max-content !important;
    min-height: 34px !important;
    padding: 0 13px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
  }

  body.mobile-final #assistant > .chat-stream {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
    padding: 4px 0 14px !important;
    scroll-padding-bottom: 14px !important;
  }

  body.mobile-final #assistant > .chat-stream > .msg {
    flex: 0 0 auto !important;
  }

  body.mobile-final #assistant .msg {
    margin: 0 !important;
  }

  body.mobile-final #assistant .msg.user {
    width: fit-content !important;
    max-width: 82% !important;
    margin-left: auto !important;
    padding: 11px 14px !important;
    border-radius: 17px 17px 5px 17px !important;
    background: var(--target-teal-soft, #e7f6f3) !important;
    box-shadow: none !important;
  }

  body.mobile-final #assistant .msg.user .msg-text {
    font-size: 15px !important;
    font-weight: 650 !important;
    line-height: 1.45 !important;
  }

  body.mobile-final #assistant .assistant-card:not(.assistant-welcome) {
    display: grid !important;
    grid-template-columns: 32px minmax(0, 1fr) !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: none !important;
    padding: 14px !important;
    border: 1px solid var(--target-line, #e4e6e3) !important;
    border-radius: 18px !important;
    background: #fff !important;
    box-shadow: 0 5px 18px rgba(36, 57, 66, .05) !important;
  }

  body.mobile-final #assistant .assistant-card:not(.assistant-welcome) .assistant-avatar-wrap,
  body.mobile-final #assistant .assistant-card:not(.assistant-welcome) .assistant-avatar {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    border-radius: 10px !important;
  }

  body.mobile-final #assistant .assistant-card-body {
    min-width: 0 !important;
    gap: 10px !important;
  }

  body.mobile-final #assistant .assistant-card:not(.assistant-welcome) .msg-text {
    color: var(--target-ink, #253642) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.55 !important;
  }

  body.mobile-final #assistant .assistant-bullets {
    margin: 0 !important;
    padding-left: 18px !important;
    color: #647279 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.55 !important;
  }

  body.mobile-final #assistant .assistant-bullets li + li {
    margin-top: 6px !important;
  }

  body.mobile-final #assistant .assistant-note {
    padding: 10px 11px !important;
    border-radius: 12px !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
  }

  body.mobile-final #assistant .msg-foot {
    margin-top: 0 !important;
    color: #899398 !important;
    font-size: 11px !important;
  }

  body.mobile-final #assistant .assistant-card.assistant-welcome {
    width: 100% !important;
    margin: 16px auto 0 !important;
    padding: 18px 14px !important;
  }

  body.mobile-final #assistant .assistant-welcome .assistant-avatar-wrap,
  body.mobile-final #assistant .assistant-welcome .assistant-avatar {
    width: 92px !important;
    height: 92px !important;
  }

  body.mobile-final #assistant .assistant-welcome .msg-text {
    font-size: 20px !important;
  }

  body.mobile-final #assistant > .composer,
  body.mobile-final #bookkeeping .bookkeeping-composer {
    min-height: 58px !important;
    padding: 6px !important;
    align-items: center !important;
    border-radius: 17px !important;
    box-shadow: 0 6px 18px rgba(36, 57, 66, .07) !important;
  }

  body.mobile-final #assistant > .composer {
    grid-template-columns: minmax(0, 1fr) 46px !important;
  }

  body.mobile-final #assistant > .composer textarea,
  body.mobile-final #bookkeeping .bookkeeping-composer textarea {
    height: 44px !important;
    min-height: 44px !important;
    max-height: 88px !important;
    padding: 10px 11px !important;
    font-size: 16px !important;
  }

  body.mobile-final #assistant > .composer button,
  body.mobile-final #bookkeeping .bookkeeping-composer button {
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    border-radius: 13px !important;
  }

  body.mobile-final #bookkeeping .book-switch {
    min-height: 48px !important;
    margin: 0 0 8px !important;
    padding: 3px !important;
    border-radius: 14px !important;
  }

  body.mobile-final #bookkeeping .book-switch button {
    min-height: 40px !important;
    border-radius: 11px !important;
    font-size: 15px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-view-tabs {
    min-height: 52px !important;
    margin: 0 !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-view-tabs button {
    min-height: 52px !important;
    padding: 6px 3px !important;
    font-size: 13px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-view-tabs button svg {
    display: none !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-view-tabs small {
    margin-top: 1px !important;
    font-size: 9px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-head {
    min-height: 44px !important;
    padding: 7px 2px !important;
    border: 0 !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-head strong {
    font-size: 14px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-head small {
    margin-top: 1px !important;
    font-size: 10px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-actions {
    gap: 4px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-actions button {
    min-height: 34px !important;
    padding: 0 9px !important;
    font-size: 12px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-list {
    padding: 8px 0 14px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-message {
    margin-bottom: 10px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-message > div {
    max-width: 84% !important;
    padding: 10px 12px !important;
    border-radius: 15px !important;
    font-size: 15px !important;
    font-weight: 550 !important;
    line-height: 1.5 !important;
    box-shadow: none !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-message.assistant {
    display: grid !important;
    grid-template-columns: 30px minmax(0, 1fr) !important;
    gap: 8px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-message-avatar {
    width: 30px !important;
    height: 30px !important;
    border-radius: 9px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-message.assistant > div,
  body.mobile-final #bookkeeping .bookkeeping-message.assistant > small {
    margin-left: 0 !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-message small {
    margin-top: 3px !important;
    font-size: 9px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-list:not(:empty) ~ .bookkeeping-quick-examples {
    display: none !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-hint {
    display: none !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-composer {
    order: 7 !important;
    grid-template-columns: minmax(0, 1fr) 46px !important;
  }

  body.mobile-final .bottom-nav,
  body.mobile-final.ios-shell .bottom-nav,
  body.mobile-final.ios-standalone .bottom-nav {
    padding-top: 4px !important;
  }

  body.mobile-final .bottom-item {
    min-height: 54px !important;
    gap: 1px !important;
    font-size: 10px !important;
  }

  body.mobile-final .bottom-item svg {
    width: 23px !important;
    height: 23px !important;
  }

  body.mobile-final.keyboard-open #assistant > .composer,
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-composer {
    top: calc(var(--visual-viewport-top) + var(--visual-viewport-height) - 8px) !important;
    transform: translateY(-100%) !important;
  }

  body.mobile-final.keyboard-open #assistant .topbar,
  body.mobile-final.keyboard-open #assistant .context-pills,
  body.mobile-final.keyboard-open #bookkeeping .topbar,
  body.mobile-final.keyboard-open #bookkeeping .book-switch,
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-chat-head {
    display: none !important;
  }

  body.mobile-final.keyboard-open #assistant > .chat-stream,
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-chat-list {
    padding-bottom: 74px !important;
    scroll-padding-bottom: 74px !important;
  }

  body.mobile-final #memory.page.active {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: calc(8px + var(--safe-top)) max(16px, var(--safe-right)) calc(var(--final-nav-height) + var(--safe-bottom) + 8px) max(16px, var(--safe-left)) !important;
    overflow: hidden !important;
  }

  body.mobile-final #memory > .topbar,
  body.mobile-final #memory > .memory-view-tabs,
  body.mobile-final #memory > .memory-form {
    flex: 0 0 auto !important;
  }

  body.mobile-final #memory > .topbar {
    min-height: 74px !important;
    margin: 0 !important;
  }

  body.mobile-final #memory > .memory-view-tabs {
    width: 100% !important;
    margin: 3px 0 10px !important;
    padding-bottom: 2px !important;
  }

  body.mobile-final #memory .memory-view-tabs button {
    min-height: 38px !important;
    padding: 0 13px !important;
    font-size: 12px !important;
  }

  body.mobile-final #memory > .memory-workspace {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.mobile-final #memory .memory-view-panel.active {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: 2px 0 22px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
  }

  body.mobile-final #memory .memory-health-card { padding: 16px !important; border-radius: 20px !important; }
  body.mobile-final #memory .memory-metric-grid { gap: 8px !important; margin-bottom: 14px !important; }
  body.mobile-final #memory .memory-metric-grid button { min-height: 66px !important; }
  body.mobile-final #memory .memory-knowledge-card { padding: 13px !important; border-radius: 18px !important; }
  body.mobile-final #memory .memory-card-actions { grid-template-columns: 1.3fr 1fr 1fr !important; }
  body.mobile-final #memory .company-profile-hero { padding: 14px !important; }
  body.mobile-final #memory .company-profile-group > div { padding: 11px 0 !important; }

  /* shell-v1: the visual viewport owns the available height while the keyboard
     is open. Both chat pages stay as a single flex layout, so the composer
     remains visible without being detached or absolutely re-positioned. */
  body.mobile-final .company-book-label {
    display: block !important;
    padding: 10px 14px !important;
  }

  body.mobile-final .company-book-label > span {
    display: grid !important;
    grid-template-columns: 24px max-content minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 36px !important;
    color: var(--ink, #263942) !important;
  }

  body.mobile-final .company-book-label strong {
    white-space: nowrap !important;
  }

  body.mobile-final .company-book-label small {
    min-width: 0 !important;
    overflow: hidden !important;
    justify-self: end !important;
    color: var(--muted, #81908f) !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.mobile-final #more .more-page-list > h2 {
    margin: 14px 4px 6px !important;
    color: var(--muted, #758482) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .08em !important;
  }

  body.mobile-final #more .more-page-list > h2:first-child {
    margin-top: 2px !important;
  }

  body.mobile-final.keyboard-open .app-shell,
  body.mobile-final.keyboard-open .phone-frame {
    position: fixed !important;
    inset: var(--visual-viewport-top, 0px) 0 auto !important;
    height: var(--visual-viewport-height, 100dvh) !important;
    overflow: hidden !important;
  }

  body.mobile-final.keyboard-open #assistant.page.active,
  body.mobile-final.keyboard-open #bookkeeping.page.active {
    position: absolute !important;
    inset: 0 !important;
    height: 100% !important;
    padding: 8px max(14px, var(--safe-right)) 8px max(14px, var(--safe-left)) !important;
    overflow: hidden !important;
  }

  body.mobile-final.keyboard-open #bookkeeping > [data-bookkeeping-panel="chat"].active,
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-chat-shell {
    min-height: 0 !important;
    overflow: hidden !important;
  }

  body.mobile-final.keyboard-open #assistant > .composer,
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-composer {
    position: relative !important;
    inset: auto !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    margin: 6px 0 0 !important;
    transform: none !important;
  }

  body.mobile-final.keyboard-open #assistant > .chat-stream,
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-chat-list {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    padding-bottom: 20px !important;
    scroll-padding-bottom: 20px !important;
  }
}

/* target-v2: PAGE-OV-01 and PAGE-AI-01. This block is intentionally last. */
@media (max-width: 760px) {
  body.mobile-final #dashboard.page,
  body.mobile-final #assistant.page {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: calc(var(--visual-viewport-height, 100dvh) - var(--bottom-nav-height, 74px)) !important;
    margin: 0 !important;
    padding: max(env(safe-area-inset-top), 16px) 18px 24px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: #fffefa !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #assistant.page::before,
  body.mobile-final #assistant > .topbar::before,
  body.mobile-final #assistant > .topbar h1::before {
    content: none !important;
    display: none !important;
  }

  body.mobile-final #dashboard .dashboard-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 68px !important;
    margin: 0 0 14px !important;
  }

  body.mobile-final #dashboard .dashboard-header > div,
  body.mobile-final #assistant > .topbar > div:first-child {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
  }

  body.mobile-final #dashboard .dashboard-header img,
  body.mobile-final #assistant > .topbar img {
    width: 48px !important;
    height: 48px !important;
    object-fit: contain !important;
    border-radius: 14px !important;
  }

  body.mobile-final #dashboard .dashboard-header h1,
  body.mobile-final #assistant > .topbar h1 {
    margin: 0 !important;
    color: #172632 !important;
    font-size: 26px !important;
    font-weight: 760 !important;
    line-height: 1.1 !important;
    letter-spacing: -.02em !important;
  }

  body.mobile-final #dashboard .dashboard-header > button,
  body.mobile-final #assistant > .topbar .top-actions button {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    width: auto !important;
    height: 42px !important;
    padding: 0 4px !important;
    border: 0 !important;
    background: transparent !important;
    color: #24343d !important;
    font-size: 15px !important;
  }

  body.mobile-final #dashboard .dashboard-header > button svg,
  body.mobile-final #assistant > .topbar .top-actions button svg {
    width: 22px !important;
    height: 22px !important;
  }

  body.mobile-final #dashboard .dashboard-sync-state {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 48px !important;
    margin: 0 0 24px !important;
    padding: 0 16px !important;
    border: 1px solid #e3e7e6 !important;
    border-radius: 13px !important;
    color: #6d7479 !important;
    background: #fff !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #dashboard .dashboard-sync-state span {
    width: 9px !important;
    height: 9px !important;
    flex: 0 0 auto !important;
    border-radius: 50% !important;
    background: #11b3a7 !important;
  }

  body.mobile-final #dashboard .dashboard-sync-state p {
    margin: 0 !important;
    font-size: 14px !important;
  }

  body.mobile-final #dashboard .dashboard-section {
    margin: 0 0 24px !important;
  }

  body.mobile-final #dashboard .dashboard-section > h2,
  body.mobile-final #dashboard .dashboard-section-head h2 {
    margin: 0 0 12px !important;
    color: #18262e !important;
    font-size: 21px !important;
    font-weight: 760 !important;
  }

  body.mobile-final #dashboard .dashboard-metric-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 9px !important;
  }

  body.mobile-final #dashboard .dashboard-metric-grid button {
    display: flex !important;
    min-width: 0 !important;
    min-height: 138px !important;
    padding: 14px 6px !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    border: 1px solid #e2e7e6 !important;
    border-radius: 16px !important;
    background: #fff !important;
    color: #172630 !important;
    box-shadow: none !important;
  }

  body.mobile-final #dashboard .dashboard-metric-grid button svg {
    width: 44px !important;
    height: 44px !important;
    padding: 10px !important;
    border-radius: 50% !important;
    color: #0aab9f !important;
    background: #eaf8f6 !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #dashboard .dashboard-metric-grid span {
    font-size: 16px !important;
    white-space: nowrap !important;
  }

  body.mobile-final #dashboard .dashboard-metric-grid strong {
    max-width: 100% !important;
    overflow: hidden !important;
    color: #7d8387 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.mobile-final #dashboard .dashboard-section-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  body.mobile-final #dashboard .dashboard-section-head button {
    border: 0 !important;
    background: transparent !important;
    color: #05ab9e !important;
    font-size: 14px !important;
  }

  body.mobile-final #dashboard .dashboard-pending-card {
    display: flex !important;
    width: 100% !important;
    min-height: 140px !important;
    padding: 20px !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;
    border: 1px solid #e2e7e6 !important;
    border-radius: 16px !important;
    background: #fff !important;
    color: #172630 !important;
  }

  body.mobile-final #dashboard .dashboard-pending-card svg {
    width: 50px !important;
    height: 50px !important;
    padding: 12px !important;
    border-radius: 50% !important;
    color: #09aa9e !important;
    background: #eaf8f6 !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #dashboard .dashboard-pending-card strong { font-size: 17px !important; }
  body.mobile-final #dashboard .dashboard-pending-card span { color: #7d8387 !important; font-size: 13px !important; text-align: center !important; }

  body.mobile-final #dashboard .dashboard-inventory-section > button {
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) auto 18px !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 64px !important;
    margin-top: 10px !important;
    padding: 10px 12px !important;
    gap: 10px !important;
    border: 1px solid #e2e7e6 !important;
    border-radius: 13px !important;
    background: #fff !important;
    color: #172630 !important;
    text-align: left !important;
  }

  body.mobile-final #dashboard .dashboard-inventory-section > button > svg:first-child {
    width: 40px !important;
    height: 40px !important;
    padding: 9px !important;
    border-radius: 50% !important;
    color: #09aa9e !important;
    background: #eaf8f6 !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #dashboard .dashboard-inventory-section > button strong {
    color: #858b8f !important;
    font-size: 13px !important;
    font-weight: 500 !important;
  }

  body.mobile-final #assistant.page.active,
  body.mobile-final.ios-shell #assistant.page.active,
  body.mobile-final.ios-standalone #assistant.page.active {
    display: grid !important;
    grid-template-rows: 68px 64px minmax(0, 1fr) 70px !important;
    gap: 0 !important;
    overflow: hidden !important;
  }

  body.mobile-final #assistant > .topbar,
  body.mobile-final.keyboard-open #assistant > .topbar {
    position: relative !important;
    inset: auto !important;
    display: flex !important;
    width: 100% !important;
    height: 68px !important;
    min-height: 68px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: transparent !important;
    transform: none !important;
  }

  body.mobile-final #assistant > .topbar .top-actions {
    display: flex !important;
    gap: 9px !important;
  }

  body.mobile-final #assistant > .context-pills,
  body.mobile-final.keyboard-open #assistant > .context-pills {
    position: relative !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: 100% !important;
    height: 64px !important;
    margin: 0 !important;
    padding: 7px 0 !important;
    gap: 9px !important;
    overflow: visible !important;
    background: transparent !important;
    transform: none !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #assistant .context-pills .pill {
    display: flex !important;
    min-width: 0 !important;
    height: 50px !important;
    padding: 0 8px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    border: 1px solid #e0e5e4 !important;
    border-radius: 14px !important;
    background: #fff !important;
    color: #1f3038 !important;
    font-size: 15px !important;
    white-space: nowrap !important;
  }

  body.mobile-final #assistant .context-pills .pill.active { box-shadow: none !important; }
  body.mobile-final #assistant .context-pills .pill svg { width: 23px !important; height: 23px !important; color: #08aa9e !important; }

  body.mobile-final #assistant > .chat-stream,
  body.mobile-final.keyboard-open #assistant > .chat-stream {
    position: relative !important;
    inset: auto !important;
    display: flex !important;
    min-height: 0 !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 20px 0 18px !important;
    flex-direction: column !important;
    gap: 14px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    transform: none !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #assistant .msg.user {
    align-self: flex-end !important;
    max-width: 78% !important;
    margin: 0 !important;
  }

  body.mobile-final #assistant .msg.user .msg-text {
    padding: 15px 18px !important;
    border: 0 !important;
    border-radius: 16px 16px 2px 16px !important;
    background: #dff6f3 !important;
    color: #18272f !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
  }

  body.mobile-final #assistant .assistant-card:not(.assistant-welcome) {
    position: relative !important;
    display: block !important;
    width: calc(100% - 28px) !important;
    max-width: none !important;
    margin: 12px 0 0 28px !important;
    padding: 0 !important;
    border: 1px solid #e1e5e4 !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: none !important;
  }

  body.mobile-final #assistant .assistant-card:not(.assistant-welcome) .assistant-avatar-wrap {
    position: absolute !important;
    top: -2px !important;
    left: -30px !important;
    display: block !important;
    width: 42px !important;
    height: 42px !important;
  }

  body.mobile-final #assistant .assistant-card:not(.assistant-welcome) .assistant-avatar {
    display: block !important;
    width: 42px !important;
    height: 42px !important;
    border: 1px solid #e2e6e5 !important;
    border-radius: 50% !important;
    background: #fff !important;
    object-fit: contain !important;
  }

  body.mobile-final #assistant .assistant-card-body { padding: 18px !important; }
  body.mobile-final #assistant .assistant-card .msg-text { color: #18272f !important; font-size: 16px !important; line-height: 1.65 !important; }
  body.mobile-final #assistant .assistant-card .assistant-bullets { color: #66747a !important; font-size: 14px !important; line-height: 1.55 !important; }

  body.mobile-final #assistant > .composer,
  body.mobile-final.keyboard-open #assistant > .composer {
    position: relative !important;
    inset: auto !important;
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) 52px !important;
    align-items: center !important;
    width: calc(100% + 36px) !important;
    height: 70px !important;
    margin: 0 -18px !important;
    padding: 8px 18px !important;
    gap: 8px !important;
    border: 0 !important;
    border-top: 1px solid #e4e7e6 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    transform: none !important;
    box-sizing: border-box !important;
    z-index: 8 !important;
  }

  body.mobile-final #assistant > .composer textarea {
    grid-column: 2 !important;
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 12px 42px 10px 14px !important;
    border: 1px solid #dfe4e3 !important;
    border-radius: 18px !important;
    background: #fff !important;
    color: #172630 !important;
    font-size: 16px !important;
    line-height: 24px !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #assistant > .composer .assistant-attachment-btn {
    grid-column: 1 !important;
    grid-row: 1 !important;
    position: static !important;
    display: grid !important;
    width: 38px !important;
    height: 38px !important;
    place-items: center !important;
    border: 1px solid #dfe4e3 !important;
    border-radius: 50% !important;
    background: #fff !important;
    color: #26363e !important;
  }

  body.mobile-final #assistant > .composer button[type="submit"] {
    grid-column: 3 !important;
    grid-row: 1 !important;
    position: static !important;
    display: grid !important;
    width: 50px !important;
    height: 50px !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #08aea2 !important;
    color: #fff !important;
  }

  body.mobile-final #assistant > .composer .assistant-voice-btn {
    position: absolute !important;
    right: 82px !important;
    display: grid !important;
    width: 32px !important;
    height: 32px !important;
    place-items: center !important;
    border: 0 !important;
    background: transparent !important;
    color: #45535a !important;
  }

  body.mobile-final.keyboard-open #assistant.page.active {
    height: var(--visual-viewport-height, 100dvh) !important;
    padding-top: max(env(safe-area-inset-top), 12px) !important;
    grid-template-rows: 68px 64px minmax(0, 1fr) 70px !important;
  }

  body.mobile-final.keyboard-open .bottom-nav { display: none !important; }
}

/* target-v1: PAGE-BK-01 mobile visual implementation. */
@media (max-width: 760px) {
  body.mobile-final #bookkeeping.page.active {
    padding: calc(12px + var(--safe-top)) 0 calc(var(--final-nav-height) + var(--safe-bottom)) !important;
    background: #fffdfa !important;
  }

  body.mobile-final #bookkeeping > .topbar {
    min-height: 82px !important;
    padding: 0 24px !important;
    border: 0 !important;
    background: #fffdfa !important;
  }

  body.mobile-final #bookkeeping > .topbar h1 {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    font-size: 26px !important;
    line-height: 1 !important;
    letter-spacing: -.03em !important;
  }

  body.mobile-final #bookkeeping > .topbar h1::before {
    width: 52px !important;
    height: 52px !important;
    border-radius: 17px !important;
    background: #fff url('./stone-icon.png') center/45px 45px no-repeat !important;
    box-shadow: 0 8px 20px rgba(40, 56, 62, .06) !important;
  }

  body.mobile-final #bookkeeping > .topbar .eyebrow,
  body.mobile-final #bookkeeping > .book-switch,
  body.mobile-final #bookkeeping .bookkeeping-chat-head,
  body.mobile-final #bookkeeping .bookkeeping-quick-examples,
  body.mobile-final #bookkeeping .bookkeeping-chat-hint,
  body.mobile-final #bookkeeping .bookkeeping-chat-empty {
    display: none !important;
  }

  body.mobile-final #bookkeeping > .bookkeeping-view-tabs {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    min-height: 58px !important;
    padding: 0 8px !important;
    border-bottom: 1px solid #dfe4e2 !important;
    background: #fff !important;
  }

  body.mobile-final #bookkeeping > .bookkeeping-view-tabs button {
    position: relative !important;
    min-height: 58px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: #65706f !important;
    background: transparent !important;
    font-size: 16px !important;
    font-weight: 600 !important;
  }

  body.mobile-final #bookkeeping > .bookkeeping-view-tabs button.active {
    color: #08aa9e !important;
  }

  body.mobile-final #bookkeeping > .bookkeeping-view-tabs button.active::after {
    content: "";
    position: absolute;
    right: 22%;
    bottom: 0;
    left: 22%;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: #09aa9f;
  }

  body.mobile-final #bookkeeping .bookkeeping-chat-list {
    padding: 22px 18px 18px !important;
    background: #fffdfa !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-message {
    position: relative !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 10px !important;
    margin: 0 0 18px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-message.user {
    justify-content: flex-end !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-message-avatar {
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;
    padding: 3px !important;
    border: 1px solid #e4e7e5 !important;
    border-radius: 50% !important;
    background: #fff !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-message > div {
    max-width: calc(100% - 58px) !important;
    padding: 15px 17px !important;
    border: 1px solid #e2e5e3 !important;
    border-radius: 18px !important;
    color: #263337 !important;
    background: #fff !important;
    box-shadow: 0 6px 17px rgba(50, 65, 70, .04) !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-message.user > div {
    border: 0 !important;
    border-radius: 18px 18px 4px 18px !important;
    color: #fff !important;
    background: linear-gradient(135deg, #13b5aa, #079f94) !important;
    box-shadow: none !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-message small { display: none !important; }

  body.mobile-final #bookkeeping .bookkeeping-pending:not(:empty) {
    order: 1 !important;
    max-height: none !important;
    padding: 0 18px 18px 70px !important;
    overflow: visible !important;
    border: 0 !important;
    background: #fffdfa !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-review-card {
    padding: 18px 16px !important;
    border: 1px solid #dfe4e2 !important;
    border-radius: 20px !important;
    background: #fff !important;
    box-shadow: 0 7px 18px rgba(47, 62, 68, .05) !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-review-card header span {
    color: #1f292d !important;
    font-size: 18px !important;
    font-weight: 800 !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-review-card dl { margin: 10px 0 12px !important; }
  body.mobile-final #bookkeeping .bookkeeping-review-card dl > div {
    display: grid !important;
    grid-template-columns: 72px minmax(0, 1fr) !important;
    align-items: center !important;
    min-height: 44px !important;
    border-top: 1px solid #e7e9e8 !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-review-card dt { color: #788184 !important; }
  body.mobile-final #bookkeeping .bookkeeping-review-card dd { margin: 0 !important; text-align: right !important; color: #293337 !important; }
  body.mobile-final #bookkeeping .bookkeeping-review-card select { width: 100% !important; border: 0 !important; text-align: right !important; background: transparent !important; }
  body.mobile-final #bookkeeping .bookkeeping-review-reason { margin: 0 0 10px !important; color: #8a6c3f !important; font-size: 12px !important; }
  body.mobile-final #bookkeeping .bookkeeping-learn-choice { margin: 8px 0 !important; color: #6f7b7e !important; font-size: 12px !important; }
  body.mobile-final #bookkeeping .bookkeeping-review-card .section-actions { grid-template-columns: 1fr 1.18fr !important; }

  body.mobile-final #bookkeeping .bookkeeping-composer {
    grid-template-columns: 70px minmax(0, 1fr) 54px !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 9px 16px !important;
    border: 0 !important;
    border-top: 1px solid #e0e4e2 !important;
    border-radius: 0 !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 -7px 18px rgba(42, 58, 63, .035) !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-composer-input { display: contents !important; }
  body.mobile-final #bookkeeping .bookkeeping-attachment-btn {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 62px !important;
    min-width: 62px !important;
    height: 54px !important;
    color: #566164 !important;
    background: #fff !important;
    border: 1px solid #dfe4e2 !important;
    border-radius: 10px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-attachment-btn svg { width: 22px !important; height: 22px !important; }
  body.mobile-final #bookkeeping .bookkeeping-attachment-btn span { display: block !important; margin-top: 2px !important; font-size: 9px !important; }
  body.mobile-final #bookkeeping .bookkeeping-composer textarea {
    min-height: 54px !important;
    padding: 15px 16px !important;
    border: 1px solid #dfe4e2 !important;
    border-radius: 18px !important;
    background: #fff !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-composer > .primary-btn {
    width: 54px !important;
    height: 54px !important;
    border-radius: 50% !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-composer > .primary-btn span { display: none !important; }
}

/* target-v1: PAGE-MORE-01 */
@media (max-width: 760px) {
  body.mobile-final #more.page.active {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: calc(12px + var(--safe-top)) 18px calc(var(--final-nav-height) + var(--safe-bottom) + 12px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: #fffdfa !important;
  }
  body.mobile-final #more.page.active > .topbar {
    flex: 0 0 auto !important;
    min-height: 76px !important;
    padding: 0 6px !important;
    border: 0 !important;
    background: transparent !important;
  }
  body.mobile-final #more.page.active > .topbar h1 {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin: 0 !important;
    font-size: 28px !important;
    letter-spacing: -.03em !important;
  }
  body.mobile-final #more.page.active > .topbar h1::before {
    content: "" !important;
    display: block !important;
    width: 52px !important;
    height: 52px !important;
    flex: 0 0 52px !important;
    border-radius: 17px !important;
    background: #fff url('./stone-icon.png') center/46px 46px no-repeat !important;
  }
  body.mobile-final #more .more-page-list {
    display: grid !important;
    gap: 15px !important;
    padding: 0 !important;
  }
  body.mobile-final #more .more-page-group { display: grid !important; gap: 8px !important; }
  body.mobile-final #more .more-page-group > h2 {
    margin: 0 4px !important;
    color: #222c30 !important;
    font-size: 17px !important;
    font-weight: 600 !important;
  }
  body.mobile-final #more .more-page-group > div {
    overflow: hidden !important;
    border: 1px solid #dfe3e1 !important;
    border-radius: 18px !important;
    background: #fff !important;
  }
  body.mobile-final #more .more-page-group button {
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) 22px !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    min-height: 53px !important;
    margin: 0 !important;
    padding: 0 15px !important;
    border: 0 !important;
    border-bottom: 1px solid #e8eae9 !important;
    border-radius: 0 !important;
    color: #263034 !important;
    background: #fff !important;
    box-shadow: none !important;
    text-align: left !important;
  }
  body.mobile-final #more .more-page-group button:last-child { border-bottom: 0 !important; }
  body.mobile-final #more .more-page-icon {
    display: grid !important;
    place-items: center !important;
    width: 32px !important;
    height: 32px !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: #172126 !important;
    background: transparent !important;
  }
  body.mobile-final #more .more-page-icon svg { width: 23px !important; height: 23px !important; stroke-width: 1.8 !important; }
  body.mobile-final #more .more-page-group button > span:nth-child(2) { display: block !important; }
  body.mobile-final #more .more-page-group strong { font-size: 16px !important; font-weight: 600 !important; }
  body.mobile-final #more .more-page-group small { display: none !important; }
  body.mobile-final #more .more-page-group button > svg { width: 19px !important; height: 19px !important; color: #879095 !important; }
}

@media (max-width: 760px) {
  body.mobile-final #bookkeeping .bookkeeping-composer-input {
    grid-template-columns: 40px minmax(0, 1fr) !important;
    gap: 5px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-attachment-btn {
    width: 40px !important;
    min-width: 40px !important;
    height: 44px !important;
    min-height: 44px !important;
    border-radius: 12px !important;
  }
}
/* core-v25: cloud owner login; local/LAN mode still opens directly. */
.auth-gate {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  padding: max(24px, env(safe-area-inset-top)) 24px max(24px, env(safe-area-inset-bottom));
  background: #f8faf8;
}
.auth-gate[hidden] { display: none !important; }
.auth-card {
  width: min(100%, 430px);
  display: grid;
  gap: 18px;
  padding: 30px;
  border: 1px solid #e0e7e5;
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(37, 62, 69, .12);
}
.auth-card > img { width: 76px; height: 76px; border-radius: 22px; }
.auth-card h1 { margin: 0; color: #253e45; font-size: 30px; }
.auth-card p { margin: 6px 0 0; color: #718187; }
.auth-card label { display: grid; gap: 7px; color: #50636a; font-size: 13px; font-weight: 800; }
.auth-card input {
  width: 100%; min-height: 52px; box-sizing: border-box; padding: 0 15px;
  border: 1px solid #cfdcda; border-radius: 15px; color: #253e45; background: #fff; font-size: 16px;
}
.auth-card input:focus { outline: 3px solid rgba(18, 184, 170, .15); border-color: #12a99e; }
.auth-card .primary-btn { min-height: 52px; border-radius: 15px; }
.auth-card > small { color: #829095; line-height: 1.55; }
body.auth-required .app-shell { visibility: hidden; }
.auth-device-list { display: grid; gap: 12px; }
.auth-device-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 14px; border: 1px solid #e0e7e5; border-radius: 18px; background: #fff; }
.auth-device-row > span:nth-child(2) { min-width: 0; display: grid; gap: 3px; }
.auth-device-row strong { color: #253e45; }
.auth-device-row small, .auth-device-row em { color: #7b8b90; font-size: 12px; font-style: normal; overflow-wrap: anywhere; }
@media (max-width: 560px) { .auth-device-row { grid-template-columns: auto minmax(0, 1fr); } .auth-device-row > button { grid-column: 1 / -1; width: 100%; } }

/* core-v27: confirmed problem workflow, filters and immutable timeline. */
.problem-status-tabs { overflow-x: auto; justify-content: flex-start; scrollbar-width: none; }
.problem-status-tabs button { flex: 0 0 auto; }
.problem-filter-toolbar { display: grid; grid-template-columns: minmax(220px, 1.4fr) repeat(3, minmax(140px, .7fr)) repeat(2, minmax(135px, .65fr)) auto; gap: 10px; margin: 14px 0 18px; }
.problem-filter-toolbar > label { position: relative; }
.problem-filter-toolbar > label svg { position: absolute; left: 13px; top: 50%; width: 17px; transform: translateY(-50%); color: #839398; }
.problem-filter-toolbar input, .problem-filter-toolbar select { width: 100%; min-height: 42px; box-sizing: border-box; border: 1px solid #dbe5e3; border-radius: 12px; padding: 0 12px; background: #fff; color: #33484f; }
.problem-filter-toolbar > label input { padding-left: 40px; }
.problem-card { cursor: pointer; }
.problem-card.overdue { border-color: #efb15b; background: #fffaf1; }
.problem-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.problem-card-head b { padding: 4px 9px; border-radius: 999px; color: #087f76; background: #e5f6f3; font-size: 11px; white-space: nowrap; }
.problem-detail-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.problem-detail-head h2 { margin: 0 0 5px; }
.problem-meta-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 16px 0; }
.problem-meta-grid span { display: grid; gap: 4px; padding: 11px 12px; border-radius: 13px; background: #f6f9f8; color: #60747a; font-size: 13px; }
.problem-meta-grid b { color: #344a51; font-size: 11px; }
.problem-result { margin: 14px 0; padding: 14px; border-radius: 15px; background: #eaf8f5; }
.problem-result p { margin: 6px 0 0; }
.problem-detail h3 { margin: 22px 0 12px; color: #30464d; }
.problem-timeline { display: grid; gap: 0; }
.problem-timeline article { position: relative; display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 10px; padding-bottom: 16px; }
.problem-timeline article::before { content: ""; position: absolute; left: 5px; top: 13px; bottom: -2px; width: 2px; background: #dce9e6; }
.problem-timeline article:last-child::before { display: none; }
.problem-timeline article > i { position: relative; z-index: 1; width: 12px; height: 12px; margin-top: 4px; border-radius: 50%; background: #11b4a7; box-shadow: 0 0 0 4px #e7f7f4; }
.problem-timeline article > div { display: grid; gap: 4px; }
.problem-timeline p { margin: 0; white-space: pre-wrap; }
.problem-timeline a { color: #0b8f84; font-size: 12px; }
.problem-timeline small { color: #87959a; }
@media (max-width: 900px) { .problem-filter-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); } .problem-filter-toolbar > label { grid-column: 1 / -1; } }
@media (max-width: 560px) { .problem-filter-toolbar { grid-template-columns: 1fr 1fr; } .problem-filter-toolbar > button { grid-column: 1 / -1; } .problem-meta-grid { grid-template-columns: 1fr; } }

/* target-v1 authoritative mobile geometry; keep this block last. */
@media (max-width: 760px) {
  html, body.mobile-final,
  body.mobile-final .app-shell,
  body.mobile-final .phone-frame,
  body.mobile-final .phone-main {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  body.mobile-final #bookkeeping,
  body.mobile-final #bookkeeping * { box-sizing: border-box !important; }

  body.mobile-final #bookkeeping .bookkeeping-composer {
    grid-template-columns: 70px minmax(0, 1fr) 54px !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-composer-input { display: contents !important; }
  body.mobile-final #bookkeeping .bookkeeping-composer textarea { min-width: 0 !important; width: 100% !important; }
  body.mobile-final #bookkeeping .bookkeeping-attachment-btn { width: 62px !important; min-width: 62px !important; }
  body.mobile-final #bookkeeping .bookkeeping-composer > .primary-btn { display: grid !important; width: 54px !important; min-width: 54px !important; }

  body.mobile-final #bookkeeping .bookkeeping-conversation-scroll {
    order: 1 !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-y: contain !important;
    scroll-padding-bottom: 18px !important;
    -webkit-overflow-scrolling: touch;
    background: #fffdfa !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-chat-list {
    flex: none !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-pending:not(:empty) {
    order: initial !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-scroll-anchor {
    width: 100% !important;
    height: 1px !important;
  }

  body.mobile-final .bottom-nav,
  body.mobile-final.ios-shell .bottom-nav,
  body.mobile-final.ios-standalone .bottom-nav {
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
  body.mobile-final .bottom-item { min-width: 0 !important; width: auto !important; }

  body.mobile-final.keyboard-open #bookkeeping > .topbar,
  body.mobile-final.keyboard-open #bookkeeping > .bookkeeping-view-tabs {
    display: flex !important;
  }
  body.mobile-final.keyboard-open #bookkeeping > .bookkeeping-view-tabs { display: grid !important; }
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-composer {
    position: relative !important;
    inset: auto !important;
    right: auto !important;
    left: auto !important;
    width: 100% !important;
    margin: 0 !important;
    transform: none !important;
  }
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-conversation-scroll {
    padding-bottom: 10px !important;
    scroll-padding-bottom: 10px !important;
  }
  body.mobile-final.keyboard-open #bookkeeping.page.active {
    height: var(--visual-viewport-height, 100dvh) !important;
    padding-bottom: 0 !important;
    overflow: hidden !important;
  }
}

/* target-v1: PAGE-ISS-01 */
@media (max-width: 760px) {
  body.mobile-final #problems.page.active {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: calc(12px + var(--safe-top)) 18px calc(var(--final-nav-height) + var(--safe-bottom) + 10px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: #fffdfa !important;
  }
  body.mobile-final #problems > .topbar {
    min-height: 76px !important;
    padding: 0 4px !important;
    border: 0 !important;
    background: transparent !important;
  }
  body.mobile-final #problems > .topbar h1 {
    display: flex !important;
    align-items: center !important;
    gap: 13px !important;
    margin: 0 !important;
    font-size: 27px !important;
  }
  body.mobile-final #problems > .topbar h1::before {
    content: "" !important;
    display: block !important;
    width: 52px !important;
    height: 52px !important;
    flex: 0 0 52px !important;
    border-radius: 17px !important;
    background: #fff url('./stone-icon.png') center/46px 46px no-repeat !important;
  }
  body.mobile-final #problems .problem-create-btn {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-height: 42px !important;
    padding: 0 14px !important;
    border: 0 !important;
    border-radius: 22px !important;
    color: #fff !important;
    background: linear-gradient(135deg,#16b9ae,#08a399) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
  }
  body.mobile-final #problems .problem-create-btn svg { width: 19px !important; height: 19px !important; }
  body.mobile-final #problems .problem-search-row {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 48px !important;
    min-height: 50px !important;
    margin: 4px 0 14px !important;
    border: 1px solid #dfe3e1 !important;
    border-radius: 25px !important;
    background: #fff !important;
  }
  body.mobile-final #problems .problem-search-row > label { position: relative !important; display: flex !important; align-items: center !important; }
  body.mobile-final #problems .problem-search-row > label svg { position: absolute !important; left: 15px !important; width: 21px !important; color: #7d878a !important; }
  body.mobile-final #problems .problem-search-row input[type="search"] { width: 100% !important; height: 48px !important; padding: 0 12px 0 48px !important; border: 0 !important; background: transparent !important; font-size: 16px !important; }
  body.mobile-final #problems .problem-advanced-filters { position: static !important; }
  body.mobile-final #problems .problem-advanced-filters summary { display: grid !important; place-items: center !important; width: 48px !important; height: 48px !important; color: #06a99e !important; cursor: pointer !important; list-style: none !important; }
  body.mobile-final #problems .problem-advanced-filters summary::-webkit-details-marker { display: none !important; }
  body.mobile-final #problems .problem-advanced-filters summary svg { width: 22px !important; }
  body.mobile-final #problems .problem-advanced-filters > div {
    position: absolute !important;
    z-index: 20 !important;
    top: 56px !important;
    right: 0 !important;
    left: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    padding: 12px !important;
    border: 1px solid #dfe3e1 !important;
    border-radius: 16px !important;
    background: #fff !important;
    box-shadow: 0 14px 35px rgba(30,50,56,.12) !important;
  }
  body.mobile-final #problems .problem-advanced-filters select,
  body.mobile-final #problems .problem-advanced-filters input,
  body.mobile-final #problems .problem-advanced-filters button { min-width: 0 !important; min-height: 40px !important; width: 100% !important; }
  body.mobile-final #problems .problem-status-tabs {
    display: grid !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    gap: 10px !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
  }
  body.mobile-final #problems .problem-status-tabs button {
    min-width: 0 !important;
    min-height: 40px !important;
    padding: 0 6px !important;
    border: 1px solid #dfe3e1 !important;
    border-radius: 20px !important;
    color: #586468 !important;
    background: #fff !important;
    font-size: 14px !important;
  }
  body.mobile-final #problems .problem-status-tabs button.active {
    border-color: transparent !important;
    color: #fff !important;
    background: linear-gradient(135deg,#16b9ae,#08a399) !important;
  }
  body.mobile-final #problems .problem-result-count { margin: 0 4px 12px !important; color: #374247 !important; font-size: 15px !important; }
  body.mobile-final #problems #problem-list { display: grid !important; gap: 11px !important; }
  body.mobile-final #problems .problem-list-card {
    display: grid !important;
    grid-template-columns: 42px minmax(0,1fr) 20px !important;
    align-items: start !important;
    gap: 11px !important;
    padding: 17px 14px !important;
    border: 1px solid #dfe3e1 !important;
    border-radius: 18px !important;
    background: #fff !important;
  }
  body.mobile-final #problems .problem-priority { display: grid !important; place-items: center !important; width: 38px !important; height: 38px !important; border-radius: 9px !important; color: #fff !important; background: #f68b1f !important; font-size: 15px !important; }
  body.mobile-final #problems .problem-list-card.p1 .problem-priority { background: #e84040 !important; }
  body.mobile-final #problems .problem-list-card.p3 .problem-priority { background: #849095 !important; }
  body.mobile-final #problems .problem-card-copy { min-width: 0 !important; }
  body.mobile-final #problems .problem-card-copy > div { display: flex !important; justify-content: space-between !important; gap: 8px !important; }
  body.mobile-final #problems .problem-card-copy strong { color: #202a2e !important; font-size: 16px !important; }
  body.mobile-final #problems .problem-card-copy em { color: #08a69b !important; font-size: 13px !important; font-style: normal !important; white-space: nowrap !important; }
  body.mobile-final #problems .problem-card-copy p { margin: 6px 0 10px !important; color: #758084 !important; font-size: 13px !important; }
  body.mobile-final #problems .problem-card-copy small { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; color: #788287 !important; font-size: 12px !important; }
  body.mobile-final #problems .problem-card-copy small span { display: inline-flex !important; align-items: center !important; gap: 4px !important; }
  body.mobile-final #problems .problem-card-copy small svg { width: 15px !important; height: 15px !important; }
  body.mobile-final #problems .problem-card-copy small .danger { color: #ee4b43 !important; }
  body.mobile-final #problems .problem-list-card > svg { align-self: center !important; color: #858f93 !important; }
  body.mobile-final #problems.detail-open > .problem-search-row,
  body.mobile-final #problems.detail-open > .problem-status-tabs,
  body.mobile-final #problems.detail-open > .problem-result-count,
  body.mobile-final #problems.detail-open > #problem-list { display: none !important; }
  body.mobile-final #problems.detail-open > #problem-detail { display: block !important; }
  body.mobile-final #problems .problem-detail-back { display: inline-flex !important; align-items: center !important; gap: 6px !important; margin-bottom: 14px !important; border: 0 !important; color: #079e94 !important; background: transparent !important; }
}

/* target-v2: secondary management pages */
@media (max-width: 760px) {
  body.mobile-final.secondary-page-open .bottom-nav { display: none !important; }
  body.mobile-final.secondary-page-open .page.active {
    width: 100% !important;
    max-width: none !important;
    height: var(--visual-viewport-height, 100dvh) !important;
    margin: 0 !important;
    padding: max(env(safe-area-inset-top), 16px) 20px max(env(safe-area-inset-bottom), 20px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: #fff !important;
    box-sizing: border-box !important;
  }

  body.mobile-final .secondary-target-header,
  body.mobile-final .page:not(#dashboard) > .secondary-target-header {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) auto !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 70px !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    gap: 10px !important;
    background: #fff !important;
  }

  body.mobile-final .secondary-target-header::before,
  body.mobile-final .secondary-target-header h1::before { content: none !important; display: none !important; }
  body.mobile-final .secondary-target-header .secondary-back { display: grid !important; width: 38px !important; height: 46px !important; padding: 0 !important; place-items: center !important; border: 0 !important; background: transparent !important; color: #172630 !important; }
  body.mobile-final .secondary-target-header .secondary-back svg { width: 32px !important; height: 32px !important; }
  body.mobile-final .secondary-target-header > div:not(.secondary-header-actions) { display: flex !important; align-items: center !important; gap: 10px !important; }
  body.mobile-final .secondary-target-header img { width: 44px !important; height: 44px !important; border-radius: 13px !important; object-fit: contain !important; }
  body.mobile-final .secondary-target-header h1 { margin: 0 !important; font-size: 25px !important; line-height: 1.1 !important; color: #172630 !important; }
  body.mobile-final .secondary-target-header > .primary-btn { min-height: 42px !important; padding: 0 14px !important; border-radius: 8px !important; font-size: 15px !important; white-space: nowrap !important; }
  body.mobile-final .secondary-header-actions { display: flex !important; align-items: center !important; gap: 6px !important; }
  body.mobile-final .secondary-header-actions button { min-height: 40px !important; padding: 0 10px !important; white-space: nowrap !important; }

  body.mobile-final #inventory .management-tabs,
  body.mobile-final #recurring-payments .recurring-status-tabs {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    width: 100% !important;
    height: 50px !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    border: 1px solid #e1e6e5 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    background: #fff !important;
  }
  body.mobile-final #inventory .management-tabs button,
  body.mobile-final #recurring-payments .recurring-status-tabs button {
    position: relative !important;
    height: 49px !important;
    padding: 0 4px !important;
    border: 0 !important;
    background: #fff !important;
    color: #58636a !important;
    font-size: 15px !important;
  }
  body.mobile-final #inventory .management-tabs button.active,
  body.mobile-final #recurring-payments .recurring-status-tabs button.active { color: #08a99e !important; font-weight: 700 !important; }
  body.mobile-final #inventory .management-tabs button.active::after,
  body.mobile-final #recurring-payments .recurring-status-tabs button.active::after { content: "" !important; position: absolute !important; right: 10px !important; bottom: 0 !important; left: 10px !important; height: 3px !important; border-radius: 3px !important; background: #08afa3 !important; }

  body.mobile-final #inventory .inventory-filter-panel {
    margin: 0 0 12px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  body.mobile-final #inventory .inventory-filter-panel .management-form-grid { display: grid !important; grid-template-columns: minmax(0, 1fr) 92px 92px !important; gap: 7px !important; }
  body.mobile-final #inventory .inventory-filter-panel label { min-height: 48px !important; margin: 0 !important; padding: 0 10px !important; border: 1px solid #e1e6e5 !important; border-radius: 10px !important; background: #fff !important; }
  body.mobile-final #inventory .inventory-filter-panel label > span { display: none !important; }
  body.mobile-final #inventory .inventory-filter-panel input,
  body.mobile-final #inventory .inventory-filter-panel select { width: 100% !important; height: 46px !important; min-width: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; font-size: 14px !important; }

  body.mobile-final #inventory .inventory-target-actions { display: grid !important; grid-template-columns: auto auto minmax(0, 1fr) !important; align-items: center !important; margin: 0 0 12px !important; gap: 8px !important; }
  body.mobile-final #inventory .inventory-target-actions button { height: 42px !important; padding: 0 12px !important; border-color: #08a99e !important; color: #078f87 !important; background: #fff !important; }
  body.mobile-final #inventory .inventory-target-actions span { justify-self: end !important; color: #59656c !important; font-size: 14px !important; }
  body.mobile-final #inventory .inventory-alert { margin: 0 0 14px !important; }
  body.mobile-final #inventory .inventory-alert > div { min-height: 58px !important; padding: 12px 14px !important; border: 1px solid #e0e6e5 !important; border-radius: 10px !important; background: #fff !important; box-sizing: border-box !important; }
  body.mobile-final #inventory .inventory-alert > .warning { border-color: #ffbf8e !important; background: #fff8f1 !important; color: #f06412 !important; }
  body.mobile-final #inventory .inventory-alert small { display: none !important; }

  body.mobile-final #inventory #inventory-list { display: flex !important; flex-direction: column !important; gap: 12px !important; }
  body.mobile-final #inventory .inventory-card { margin: 0 !important; padding: 14px !important; border: 1px solid #e2e7e6 !important; border-radius: 12px !important; background: #fff !important; box-shadow: 0 3px 12px rgba(24,44,49,.035) !important; }
  body.mobile-final #inventory .inventory-card-main { display: grid !important; grid-template-columns: 48px minmax(0, 1fr) auto !important; gap: 12px !important; align-items: start !important; }
  body.mobile-final #inventory .inventory-card-main .management-card-icon { display: grid !important; width: 48px !important; height: 48px !important; place-items: center !important; border-radius: 10px !important; color: #08a99e !important; background: #edf8f7 !important; }
  body.mobile-final #inventory .inventory-card-main > span:nth-child(2) { min-width: 0 !important; }
  body.mobile-final #inventory .inventory-card-main strong { display: block !important; margin-bottom: 6px !important; color: #172630 !important; font-size: 17px !important; }
  body.mobile-final #inventory .inventory-card-main small,
  body.mobile-final #inventory .inventory-card-main em { display: block !important; margin-top: 4px !important; color: #637078 !important; font-size: 13px !important; font-style: normal !important; }
  body.mobile-final #inventory .inventory-card-main > b { padding: 5px 9px !important; border-radius: 16px !important; color: #078f87 !important; background: #edf8f7 !important; font-size: 13px !important; white-space: nowrap !important; }
  body.mobile-final #inventory .inventory-card-main > b.overdue { color: #f06412 !important; background: #fff1e5 !important; }
  body.mobile-final #inventory .inventory-card-actions { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; margin-top: 12px !important; padding-top: 10px !important; gap: 7px !important; border-top: 1px solid #edf0ef !important; }
  body.mobile-final #inventory .inventory-card-actions button { min-width: 0 !important; height: 38px !important; padding: 0 4px !important; border-color: #08a99e !important; color: #078f87 !important; background: #fff !important; }
  body.mobile-final #inventory .inventory-card-actions button:nth-child(2) { color: #fff !important; background: #08a99e !important; }

  body.mobile-final #recurring-payments .recurring-info { display: flex !important; align-items: center !important; gap: 10px !important; min-height: 50px !important; margin: 0 0 18px !important; padding: 0 14px !important; border: 1px solid #e0e6e5 !important; border-radius: 10px !important; color: #26373f !important; background: #fff !important; font-size: 14px !important; }
  body.mobile-final #recurring-payments .recurring-info svg { color: #08a99e !important; }
  body.mobile-final #recurring-payments .recurring-search-tools { display: none !important; }
  body.mobile-final #recurring-payments #recurring-payment-list { display: flex !important; flex-direction: column !important; gap: 12px !important; }
  body.mobile-final #recurring-payments .recurring-card { margin: 0 !important; padding: 14px !important; border: 1px solid #e2e7e6 !important; border-radius: 12px !important; background: #fff !important; }
  body.mobile-final #recurring-payments .recurring-main { display: grid !important; grid-template-columns: 48px minmax(0,1fr) auto 18px !important; width: 100% !important; padding: 0 !important; gap: 12px !important; border: 0 !important; background: transparent !important; text-align: left !important; }
  body.mobile-final #recurring-payments .recurring-main .management-card-icon { display: grid !important; width: 48px !important; height: 48px !important; place-items: center !important; border-radius: 50% !important; color: #08a99e !important; background: #edf8f7 !important; }
  body.mobile-final #recurring-payments .recurring-main strong { display: block !important; margin-bottom: 7px !important; color: #172630 !important; font-size: 18px !important; }
  body.mobile-final #recurring-payments .recurring-main small,
  body.mobile-final #recurring-payments .recurring-main em { display: block !important; margin-top: 5px !important; color: #637078 !important; font-size: 13px !important; font-style: normal !important; }
  body.mobile-final #recurring-payments .recurring-main b { padding: 5px 8px !important; border-radius: 15px !important; color: #078f87 !important; background: #edf8f7 !important; font-size: 12px !important; white-space: nowrap !important; }
  body.mobile-final #recurring-payments .recurring-main b.warning,
  body.mobile-final #recurring-payments .recurring-main b.overdue { color: #f06412 !important; background: #fff1e5 !important; }
  body.mobile-final #recurring-payments .inventory-card-actions { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; margin-top: 12px !important; padding-top: 10px !important; gap: 8px !important; border-top: 1px solid #edf0ef !important; }
  body.mobile-final #recurring-payments .inventory-card-actions button { height: 38px !important; padding: 0 6px !important; border-color: #08a99e !important; color: #078f87 !important; background: #fff !important; }
  body.mobile-final #recurring-payments .inventory-card-actions button[data-recurring-action="paid"] { color: #fff !important; background: #08a99e !important; }
  body.mobile-final #recurring-payments .inventory-card-actions button[data-recurring-action="skip"],
  body.mobile-final #recurring-payments .inventory-card-actions button[data-recurring-action="stop"],
  body.mobile-final #recurring-payments .inventory-card-actions button[data-recurring-history] { display: none !important; }

  body.mobile-final #sales > .management-tabs { display: none !important; }
  body.mobile-final #sales .sales-filter-panel { margin: 0 0 14px !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
  body.mobile-final #sales .sales-filter-panel .management-form-grid { display: grid !important; grid-template-columns: repeat(4,minmax(0,1fr)) !important; gap: 8px !important; }
  body.mobile-final #sales .sales-filter-panel label { min-width: 0 !important; margin: 0 !important; }
  body.mobile-final #sales .sales-filter-panel label > span { display: none !important; }
  body.mobile-final #sales .sales-filter-panel input,
  body.mobile-final #sales .sales-filter-panel select { width: 100% !important; min-width: 0 !important; height: 42px !important; padding: 0 7px !important; border: 1px solid #e1e6e5 !important; border-radius: 8px !important; background: #fff !important; font-size: 12px !important; }
  body.mobile-final #sales .sales-filter-panel label:nth-child(1),
  body.mobile-final #sales .sales-filter-panel label:nth-child(3),
  body.mobile-final #sales .sales-filter-panel label:nth-child(4) { display: none !important; }
  body.mobile-final #sales [data-sales-panel="overview"] > .management-actions { display: none !important; }
  body.mobile-final #sales .sales-summary { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 10px !important; margin: 18px 0 !important; }
  body.mobile-final #sales .sales-summary article { display: grid !important; grid-template-columns: 46px minmax(0,1fr) 18px !important; align-items: center !important; min-height: 82px !important; padding: 12px !important; gap: 10px !important; border: 1px solid #e1e6e5 !important; border-radius: 10px !important; background: #fff !important; }
  body.mobile-final #sales .sales-summary article > svg:first-child { width: 44px !important; height: 44px !important; padding: 10px !important; border-radius: 50% !important; color: #08a99e !important; background: #edf8f7 !important; box-sizing: border-box !important; }
  body.mobile-final #sales .sales-summary article span { min-width: 0 !important; }
  body.mobile-final #sales .sales-summary small { display: block !important; color: #637078 !important; font-size: 13px !important; }
  body.mobile-final #sales .sales-summary strong { display: block !important; margin-top: 5px !important; color: #172630 !important; font-size: 18px !important; }
  body.mobile-final #sales #sales-record-list > .execution-empty { min-height: 210px !important; padding: 28px 20px !important; border: 1px solid #e1e6e5 !important; border-radius: 12px !important; background: #fff !important; text-align: center !important; }
  body.mobile-final #sales .sales-info-banner { display: flex !important; align-items: center !important; gap: 9px !important; min-height: 46px !important; margin: 0 0 18px !important; padding: 8px 12px !important; border: 1px solid #9edfd9 !important; border-radius: 8px !important; color: #078f87 !important; background: #f0fbfa !important; font-size: 13px !important; box-sizing: border-box !important; }
  body.mobile-final #sales .sales-info-banner svg { width: 20px !important; height: 20px !important; flex: 0 0 auto !important; }
  body.mobile-final #sales .sales-metric-title { margin: 0 0 10px !important; color: #172630 !important; font-size: 21px !important; }
  body.mobile-final #sales .sales-empty-state { display: flex !important; min-height: 220px !important; padding: 28px 20px !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 10px !important; border: 1px solid #e1e6e5 !important; border-radius: 12px !important; background: #fff !important; text-align: center !important; }
  body.mobile-final #sales .sales-empty-state > svg { width: 50px !important; height: 50px !important; color: #c9ced5 !important; }
  body.mobile-final #sales .sales-empty-state h2 { margin: 0 !important; color: #172630 !important; font-size: 18px !important; }
  body.mobile-final #sales .sales-empty-state p { margin: 0 !important; color: #68747a !important; font-size: 13px !important; }
  body.mobile-final #sales .sales-empty-state button { min-width: 170px !important; margin-top: 8px !important; }
}

/* target-v2: payroll, knowledge, reports and connectors */
@media (max-width: 760px) {
  body.mobile-final #payroll .payroll-period-bar { display: grid !important; grid-template-columns: auto minmax(0,1fr) auto !important; align-items: center !important; min-height: 48px !important; margin: 0 0 10px !important; padding: 8px 12px !important; gap: 8px !important; border: 1px solid #e1e6e5 !important; border-radius: 10px !important; background: #fff !important; }
  body.mobile-final #payroll .payroll-period-bar label { color: #56636a !important; font-size: 13px !important; }
  body.mobile-final #payroll .payroll-period-bar input { min-width: 0 !important; height: 36px !important; border: 0 !important; background: transparent !important; font-size: 16px !important; }
  body.mobile-final #payroll .payroll-period-bar span { padding: 5px 8px !important; border-radius: 15px !important; color: #078f87 !important; background: #edf8f7 !important; font-size: 11px !important; white-space: nowrap !important; }
  body.mobile-final #payroll .payroll-tabs { display: grid !important; grid-template-columns: repeat(4,minmax(0,1fr)) !important; height: 48px !important; margin: 0 0 14px !important; border: 1px solid #e1e6e5 !important; border-radius: 10px !important; overflow: hidden !important; background: #fff !important; }
  body.mobile-final #payroll .payroll-tabs button { position: relative !important; height: 47px !important; padding: 0 !important; border: 0 !important; background: #fff !important; color: #58636a !important; font-size: 14px !important; }
  body.mobile-final #payroll .payroll-tabs button.active { color: #08a99e !important; font-weight: 700 !important; }
  body.mobile-final #payroll .payroll-tabs button.active::after { content: "" !important; position: absolute !important; right: 8px !important; bottom: 0 !important; left: 8px !important; height: 3px !important; background: #08a99e !important; }
  body.mobile-final #payroll .payroll-summary-grid { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 10px !important; margin: 0 0 12px !important; }
  body.mobile-final #payroll .payroll-summary-grid article { min-height: 86px !important; padding: 14px !important; border: 1px solid #e1e6e5 !important; border-radius: 11px !important; background: #fff !important; }
  body.mobile-final #payroll .payroll-summary-grid span { display: block !important; color: #637078 !important; font-size: 13px !important; }
  body.mobile-final #payroll .payroll-summary-grid strong { display: inline-block !important; margin-top: 9px !important; color: #172630 !important; font-size: 23px !important; }
  body.mobile-final #payroll .payroll-summary-grid small { margin-left: 4px !important; color: #637078 !important; }
  body.mobile-final #payroll .payroll-progress-card,
  body.mobile-final #payroll .payroll-batch-card { margin: 0 0 12px !important; padding: 15px !important; border: 1px solid #e1e6e5 !important; border-radius: 11px !important; background: #fff !important; }
  body.mobile-final #payroll .payroll-section-head { display: flex !important; align-items: center !important; justify-content: space-between !important; margin: 16px 0 10px !important; }
  body.mobile-final #payroll .payroll-section-head h2 { margin: 0 !important; color: #172630 !important; font-size: 20px !important; }
  body.mobile-final #payroll .payroll-record-list { display: flex !important; flex-direction: column !important; gap: 10px !important; }
  body.mobile-final #payroll .payroll-record-card { margin: 0 !important; padding: 14px !important; border: 1px solid #e1e6e5 !important; border-radius: 11px !important; background: #fff !important; }

  body.mobile-final #memory .memory-view-tabs { display: none !important; }
  body.mobile-final #memory .knowledge-top-tools { display: grid !important; grid-template-columns: minmax(0,1fr) auto auto !important; gap: 8px !important; margin: 0 0 14px !important; }
  body.mobile-final #memory .knowledge-top-tools label { display: flex !important; align-items: center !important; min-width: 0 !important; height: 48px !important; padding: 0 12px !important; gap: 8px !important; border: 1px solid #e1e6e5 !important; border-radius: 10px !important; background: #fff !important; }
  body.mobile-final #memory .knowledge-top-tools label svg { width: 20px !important; color: #52616a !important; }
  body.mobile-final #memory .knowledge-top-tools input { min-width: 0 !important; width: 100% !important; height: 44px !important; border: 0 !important; background: transparent !important; font-size: 14px !important; }
  body.mobile-final #memory .knowledge-top-tools > button { min-height: 48px !important; padding: 0 10px !important; border: 1px solid #08a99e !important; border-radius: 9px !important; color: #078f87 !important; background: #fff !important; white-space: nowrap !important; }
  body.mobile-final #memory .knowledge-filter-panel { margin: 0 0 14px !important; padding: 12px !important; border: 1px solid #e1e6e5 !important; border-radius: 10px !important; background: #fff !important; box-shadow: none !important; }
  body.mobile-final #memory .knowledge-filter-panel .management-form-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  body.mobile-final #memory .knowledge-filter-panel label span { display: none !important; }
  body.mobile-final #memory .knowledge-filter-panel select { width: 100% !important; height: 42px !important; border: 1px solid #e1e6e5 !important; border-radius: 8px !important; background: #fff !important; }
  body.mobile-final #memory .knowledge-filter-panel .memory-search,
  body.mobile-final #memory .knowledge-filter-panel .section-actions { display: none !important; }
  body.mobile-final #memory #memory-rule-list { display: flex !important; flex-direction: column !important; gap: 10px !important; }
  body.mobile-final #memory #memory-rule-list > * { margin: 0 !important; border: 1px solid #e1e6e5 !important; border-radius: 11px !important; background: #fff !important; box-shadow: none !important; }

  body.mobile-final #reports .report-type-tabs { display: grid !important; grid-template-columns: repeat(5,minmax(0,1fr)) !important; gap: 7px !important; margin: 0 0 12px !important; }
  body.mobile-final #reports .report-type-tabs button { min-width: 0 !important; height: 42px !important; padding: 0 5px !important; border: 1px solid #e1e6e5 !important; border-radius: 8px !important; color: #25353d !important; background: #fff !important; font-size: 13px !important; }
  body.mobile-final #reports .report-type-tabs button.active { border-color: #08a99e !important; color: #fff !important; background: #08a99e !important; }
  body.mobile-final #reports .report-filter-panel { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 8px !important; margin: 0 0 10px !important; padding: 0 !important; border: 0 !important; background: transparent !important; }
  body.mobile-final #reports .report-filter-panel label span { display: none !important; }
  body.mobile-final #reports .report-filter-panel select,
  body.mobile-final #reports .report-filter-panel input { width: 100% !important; min-width: 0 !important; height: 42px !important; border: 1px solid #e1e6e5 !important; border-radius: 8px !important; background: #fff !important; }
  body.mobile-final #reports .report-export-actions { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 9px !important; margin: 0 0 12px !important; }
  body.mobile-final #reports .report-export-actions button { height: 42px !important; border: 1px solid #48606e !important; border-radius: 8px !important; color: #24353d !important; background: #fff !important; }
  body.mobile-final #reports .report-center-summary { margin: 0 0 12px !important; padding: 12px !important; border: 1px solid #ffbd80 !important; border-radius: 8px !important; background: #fff7ef !important; }
  body.mobile-final #reports .report-center-summary h2 { margin: 0 0 5px !important; font-size: 16px !important; color: #ef6a13 !important; }
  body.mobile-final #reports .report-center-summary p { margin: 0 !important; color: #7c6c61 !important; font-size: 12px !important; }
  body.mobile-final #reports .report-center-metrics { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 9px !important; margin-bottom: 16px !important; }
  body.mobile-final #reports .report-center-metrics > * { min-width: 0 !important; min-height: 100px !important; padding: 12px 6px !important; border: 1px solid #e1e6e5 !important; border-radius: 10px !important; background: #fff !important; text-align: center !important; }
  body.mobile-final #reports .report-center-groups { min-height: 180px !important; margin-bottom: 14px !important; border: 1px solid #e1e6e5 !important; border-radius: 11px !important; background: #fff !important; }
  body.mobile-final #reports .report-detail-band { margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; }
  body.mobile-final #reports .report-detail-band .section-head { display: block !important; }
  body.mobile-final #reports #report-detail-toggle { width: 100% !important; height: 44px !important; border: 1px solid #078f87 !important; border-radius: 8px !important; color: #078f87 !important; background: #fff !important; }
  body.mobile-final #reports > .band:last-child { display: none !important; }

  body.mobile-final #connectors .connector-readonly-note { display: flex !important; align-items: center !important; gap: 9px !important; min-height: 48px !important; margin: 0 0 14px !important; padding: 8px 12px !important; border: 1px solid #cfe6e3 !important; border-radius: 8px !important; color: #34464e !important; background: #f5fbfa !important; font-size: 13px !important; }
  body.mobile-final #connectors .connector-readonly-note svg { color: #078f87 !important; }
  body.mobile-final #connectors .connector-status-tabs { display: grid !important; grid-template-columns: repeat(4,minmax(0,1fr)) !important; gap: 9px !important; margin: 0 0 16px !important; }
  body.mobile-final #connectors .connector-status-tabs button { height: 42px !important; border: 1px solid #e1e6e5 !important; border-radius: 8px !important; color: #25353d !important; background: #fff !important; }
  body.mobile-final #connectors .connector-status-tabs button.active { color: #fff !important; background: #069f96 !important; }
  body.mobile-final #connectors > .connector-action-panel.compact { display: none !important; }
  body.mobile-final #connectors #connector-config-list { display: flex !important; flex-direction: column !important; gap: 12px !important; }
  body.mobile-final #connectors .connector-live-form { display: grid !important; grid-template-columns: minmax(0,1fr) auto !important; margin: 0 !important; padding: 15px !important; gap: 8px 12px !important; border: 1px solid #e1e6e5 !important; border-radius: 11px !important; background: #fff !important; box-shadow: none !important; }
  body.mobile-final #connectors .connector-live-form > strong { color: #172630 !important; font-size: 18px !important; }
  body.mobile-final #connectors .connector-live-form > p,
  body.mobile-final #connectors .connector-live-form > small { grid-column: 1 / -1 !important; margin: 0 !important; color: #647078 !important; font-size: 13px !important; }
  body.mobile-final #connectors .connector-live-form > label { grid-column: 1 / -1 !important; }
  body.mobile-final #connectors .connector-live-form > button { grid-column: 1 / -1 !important; height: 40px !important; }
  body.mobile-final #connectors > .connector-action-panel:not(.compact) { margin-top: 14px !important; padding: 14px !important; border: 1px solid #e1e6e5 !important; border-radius: 11px !important; background: #fff !important; }
  body.mobile-final #connectors .connector-live-card { margin: 0 !important; border: 1px solid #e1e6e5 !important; border-radius: 11px !important; background: #fff !important; overflow: hidden !important; }
  body.mobile-final #connectors .connector-live-card > summary { display: grid !important; grid-template-columns: 54px minmax(0,1fr) auto 18px !important; align-items: start !important; min-height: 126px !important; padding: 16px !important; gap: 12px !important; list-style: none !important; cursor: pointer !important; box-sizing: border-box !important; }
  body.mobile-final #connectors .connector-live-card > summary::-webkit-details-marker { display: none !important; }
  body.mobile-final #connectors .connector-live-icon { display: grid !important; width: 54px !important; height: 54px !important; place-items: center !important; border-radius: 13px !important; color: #fff !important; background: linear-gradient(145deg,#18b4aa,#078b9d) !important; }
  body.mobile-final #connectors .connector-live-icon svg { width: 29px !important; height: 29px !important; }
  body.mobile-final #connectors .connector-live-card summary strong { display: block !important; color: #172630 !important; font-size: 18px !important; }
  body.mobile-final #connectors .connector-live-card summary small,
  body.mobile-final #connectors .connector-live-card summary em { display: block !important; margin-top: 6px !important; color: #66737a !important; font-size: 13px !important; font-style: normal !important; }
  body.mobile-final #connectors .connector-live-card summary b { padding: 5px 9px !important; border-radius: 14px !important; color: #078f87 !important; background: #edf8f7 !important; font-size: 12px !important; white-space: nowrap !important; }
  body.mobile-final #connectors .connector-live-card summary b.warning,
  body.mobile-final #connectors .connector-live-card summary b.unconfigured { color: #f06412 !important; background: #fff1e5 !important; }
  body.mobile-final #connectors .connector-live-card[open] > summary { border-bottom: 1px solid #edf0ef !important; }
  body.mobile-final #connectors .connector-live-card .connector-live-form { border: 0 !important; border-radius: 0 !important; }

  body.mobile-final #memory .memory-knowledge-card > p { display: none !important; }
  body.mobile-final #memory .memory-knowledge-card { padding: 14px !important; }
  body.mobile-final #memory .memory-card-head strong { font-size: 17px !important; }
  body.mobile-final #memory .memory-card-tags { margin-top: 10px !important; }
}

/* gui-v7 final interaction overrides. */
@media (max-width: 760px) {
  body.mobile-final #dashboard.page {
    padding-bottom: calc(88px + env(safe-area-inset-bottom)) !important;
  }
  body.mobile-final #assistant > .composer,
  body.mobile-final.keyboard-open #assistant > .composer {
    width: 100% !important;
    max-width: 100% !important;
    margin: 8px 0 0 !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-composer,
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-composer {
    width: calc(100% - 32px) !important;
    max-width: calc(100% - 32px) !important;
    margin: 8px 16px 0 !important;
  }
  body.mobile-final #recurring-payments.detail-editing .management-form-grid label {
    min-height: 50px !important;
    padding: 4px 0 !important;
  }
  body.mobile-final #recurring-payments.detail-editing .management-form-grid input,
  body.mobile-final #recurring-payments.detail-editing .management-form-grid select {
    height: 34px !important;
    min-height: 34px !important;
  }
  body.mobile-final #recurring-payments.detail-editing #recurring-payment-form {
    padding-bottom: 150px !important;
  }
  body.mobile-final #recurring-payments.detail-editing > .secondary-target-header,
  body.mobile-final #recurring-payments.detail-editing > .recurring-status-tabs,
  body.mobile-final #recurring-payments.detail-editing > .recurring-info,
  body.mobile-final #recurring-payments.detail-editing > .recurring-search-tools,
  body.mobile-final #recurring-payments.detail-editing > #recurring-action-form,
  body.mobile-final #recurring-payments.detail-editing > #recurring-payment-list {
    display: none !important;
  }
  body.mobile-final #sales > .management-tabs {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin: 0 0 14px !important;
  }
  body.mobile-final #sales > .management-tabs button {
    min-width: 0 !important;
    height: 42px !important;
    padding: 0 6px !important;
    border: 1px solid #e1e6e5 !important;
    border-radius: 8px !important;
    color: #25353d !important;
    background: #fff !important;
  }
  body.mobile-final #sales > .management-tabs button.active {
    border-color: #08a99e !important;
    color: #fff !important;
    background: #08a99e !important;
  }
}

/* gui-v16: keep the AI composer hit area stable on mobile Safari. */
@media (max-width: 760px) {
  body.mobile-final #assistant > .composer,
  body.mobile-final #assistant > .composer.voice-supported {
    grid-template-columns: 42px minmax(0, 1fr) 52px !important;
  }

  body.mobile-final #assistant > .composer textarea {
    grid-column: auto !important;
    grid-row: auto !important;
    min-width: 0 !important;
    width: 100% !important;
    justify-self: stretch !important;
    position: absolute !important;
    top: 11px !important;
    right: 78px !important;
    bottom: auto !important;
    left: 68px !important;
    z-index: 2 !important;
    width: auto !important;
    max-width: none !important;
    pointer-events: auto !important;
    touch-action: manipulation;
    -webkit-user-select: text;
    user-select: text;
  }

}

/* gui-v17: iOS home-screen App pages own their vertical scroll area.
   Safari can chain a gesture past an overflow-hidden child; standalone
   WebKit cannot, so keep the page above the fixed nav and make the list
   wrapper transparent to vertical scrolling. */
@media (max-width: 760px) and (orientation: portrait) {
  body.mobile-final.ios-standalone #dashboard.page.active,
  body.mobile-final.ios-standalone #problems.page.active,
  body.mobile-final.ios-standalone #more.page.active {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: calc(var(--final-nav-height) + var(--safe-bottom)) !important;
    left: 0 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding-bottom: 30px !important;
    overflow-x: hidden !important;
    overflow-y: scroll !important;
    overscroll-behavior-y: contain !important;
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch;
  }

  body.mobile-final.ios-standalone #more .more-page-list {
    overflow: visible !important;
    touch-action: pan-y !important;
  }
}

/* gui-v19: approved mobile visual closeout.
   This is the only final authority for shared navigation, chat composers and
   the three approved target pages. Keep it at the end of this file. */
@media (max-width: 760px) {
  body.mobile-final .bottom-nav,
  body.mobile-final.ios-shell .bottom-nav,
  body.mobile-final.ios-standalone .bottom-nav {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: center !important;
    justify-items: center !important;
    padding-top: 4px !important;
  }

  body.mobile-final .bottom-item,
  body.mobile-final .bottom-item.active {
    position: relative !important;
    display: flex !important;
    width: 64px !important;
    min-width: 64px !important;
    max-width: 64px !important;
    height: 56px !important;
    min-height: 56px !important;
    margin: 0 !important;
    padding: 4px 3px 3px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 1px !important;
    border: 0 !important;
    border-radius: 17px !important;
    color: #617077 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    font-size: 10px !important;
    line-height: 1.1 !important;
  }

  body.mobile-final .bottom-item::before,
  body.mobile-final .bottom-item::after,
  body.mobile-final .bottom-item.active::before,
  body.mobile-final .bottom-item.active::after {
    content: none !important;
    display: none !important;
  }

  body.mobile-final .bottom-item.active {
    color: #08a99d !important;
    background: #e9f8f6 !important;
  }

  body.mobile-final .bottom-item svg {
    width: 24px !important;
    height: 24px !important;
    color: currentColor !important;
    stroke-width: 2.2 !important;
  }

  body.mobile-final .bottom-item span {
    color: currentColor !important;
    font-weight: 600 !important;
  }

  body.mobile-final #assistant > .composer button[type="submit"],
  body.mobile-final #bookkeeping .bookkeeping-composer > .primary-btn {
    display: grid !important;
    place-items: center !important;
    flex: 0 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    color: #fff !important;
    background: #08aea2 !important;
    background-image: none !important;
    box-shadow: none !important;
  }

  body.mobile-final #assistant > .composer button[type="submit"] svg,
  body.mobile-final #bookkeeping .bookkeeping-composer > .primary-btn svg {
    display: block !important;
    width: 27px !important;
    height: 27px !important;
    margin: 0 !important;
    stroke-width: 2.6 !important;
    transform: none !important;
  }

  body.mobile-final #assistant > .composer button[type="submit"] {
    width: 50px !important;
    min-width: 50px !important;
    height: 50px !important;
    min-height: 50px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-composer {
    grid-template-columns: 62px minmax(0, 1fr) 54px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 9px 16px !important;
    gap: 8px !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-composer-input {
    display: contents !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-attachment-btn {
    width: 62px !important;
    min-width: 62px !important;
    height: 54px !important;
    min-height: 54px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-composer textarea {
    width: 100% !important;
    min-width: 0 !important;
    height: 54px !important;
    min-height: 54px !important;
    max-height: 54px !important;
    padding: 14px 15px !important;
    overflow: hidden !important;
    border: 1px solid #dfe4e2 !important;
    border-radius: 18px !important;
    background: #fff !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    resize: none !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-composer > .primary-btn {
    width: 54px !important;
    min-width: 54px !important;
    height: 54px !important;
    min-height: 54px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-review-card {
    display: block !important;
    width: 100% !important;
    padding: 18px 16px !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-review-card > header {
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-review-card > header span {
    display: block !important;
    width: 100% !important;
    line-height: 1.4 !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-review-card dl {
    display: block !important;
    margin: 12px 0 !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-review-card dl > div {
    display: grid !important;
    grid-template-columns: 78px minmax(0, 1fr) !important;
    width: 100% !important;
    min-height: 48px !important;
    align-items: center !important;
    border-top: 1px solid #e7e9e8 !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-review-card dt,
  body.mobile-final #bookkeeping .bookkeeping-review-card dd {
    display: block !important;
    min-width: 0 !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-review-card dd {
    margin: 0 !important;
    text-align: right !important;
    overflow-wrap: anywhere !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-learn-choice {
    display: flex !important;
    min-height: 36px !important;
    margin: 8px 0 12px !important;
    align-items: center !important;
    gap: 8px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-learn-choice input {
    width: 20px !important;
    height: 20px !important;
    margin: 0 !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-review-card .section-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.18fr) !important;
    gap: 9px !important;
  }

  body.mobile-final #bookkeeping .bookkeeping-review-card .section-actions button {
    min-width: 0 !important;
    min-height: 48px !important;
    margin: 0 !important;
  }

  body.mobile-final #more.page.active,
  body.mobile-final #more .more-page-list,
  body.mobile-final #more .more-page-group,
  body.mobile-final #more .more-page-group > div {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #more .more-page-list {
    display: grid !important;
    gap: 15px !important;
    padding: 0 0 12px !important;
    overflow: visible !important;
  }

  body.mobile-final #more .more-page-group {
    display: grid !important;
    gap: 8px !important;
    margin: 0 !important;
  }

  body.mobile-final #more .more-page-group > h2 {
    position: static !important;
    width: auto !important;
    margin: 0 4px !important;
    padding: 0 !important;
    overflow: visible !important;
    font-size: 17px !important;
    line-height: 1.35 !important;
  }

  body.mobile-final #more .more-page-group > div {
    overflow: hidden !important;
  }
}

@media (max-width: 760px) and (orientation: portrait) {
  body.mobile-final.ios-standalone #more.page.active {
    padding-right: max(18px, var(--safe-right)) !important;
    padding-bottom: 30px !important;
    padding-left: max(18px, var(--safe-left)) !important;
  }
}

/* gui-v20: keep a focused chat composer inside the real iOS visual viewport.
   iPhone Mirroring may use the Mac keyboard, which shows only the iOS input
   accessory bar and shrinks the viewport by less than the soft-keyboard
   threshold. Treat composer focus as its own layout state. */
@media (max-width: 760px) {
  body.mobile-final.composer-focused .bottom-nav,
  body.mobile-final.keyboard-open .bottom-nav {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.mobile-final.composer-focused #assistant > .composer,
  body.mobile-final.keyboard-open #assistant > .composer,
  body.mobile-final.composer-focused #bookkeeping .bookkeeping-composer,
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-composer {
    position: fixed !important;
    top: calc(var(--visual-viewport-top, 0px) + var(--visual-viewport-height, 100dvh) - 8px) !important;
    right: max(14px, var(--safe-right)) !important;
    bottom: auto !important;
    left: max(14px, var(--safe-left)) !important;
    z-index: 1000 !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    transform: translateY(-100%) !important;
  }

  body.mobile-final.composer-focused #assistant > .chat-stream,
  body.mobile-final.keyboard-open #assistant > .chat-stream,
  body.mobile-final.composer-focused #bookkeeping .bookkeeping-conversation-scroll,
  body.mobile-final.keyboard-open #bookkeeping .bookkeeping-conversation-scroll {
    padding-bottom: 82px !important;
    scroll-padding-bottom: 82px !important;
  }
}

/* gui-v21: secondary pages share one native-like return affordance.
   Primary tabs deliberately stay outside the back stack. */
@media (max-width: 760px) {
  body.mobile-final.secondary-page-open .page.active > .topbar:not(.secondary-target-header) {
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) auto !important;
    align-items: center !important;
    min-height: 70px !important;
    gap: 10px !important;
  }

  body.mobile-final.secondary-page-open .page.active > .topbar .secondary-back,
  body.mobile-final.secondary-page-open .page.active > .secondary-target-header .secondary-back {
    display: grid !important;
    width: 38px !important;
    height: 46px !important;
    padding: 0 !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: transparent !important;
    color: #172630 !important;
  }

  body.mobile-final.secondary-page-open .page.active > .topbar .secondary-back svg,
  body.mobile-final.secondary-page-open .page.active > .secondary-target-header .secondary-back svg {
    width: 30px !important;
    height: 30px !important;
    stroke-width: 2 !important;
  }

  body.mobile-final.secondary-page-open::after {
    content: "‹";
    position: fixed;
    top: 50%;
    left: 4px;
    z-index: 1400;
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border: 1px solid rgba(12, 169, 158, .22);
    border-radius: 50%;
    background: rgba(255, 255, 255, .94);
    color: #0ca99e;
    font: 500 38px/1 -apple-system, BlinkMacSystemFont, "SF Pro Display", sans-serif;
    opacity: 0;
    pointer-events: none;
    transform: translate(-18px, -50%) scale(.82);
    transition: opacity .12s ease, transform .12s ease;
    box-shadow: 0 8px 24px rgba(23, 38, 48, .12);
  }

  body.mobile-final.secondary-page-open.edge-swipe-tracking::after {
    opacity: 1;
    transform: translate(0, -50%) scale(1);
  }
}

/* gui-v22: render the approved AI welcome target as real UI instead of a
   shortened status line. These controls are bound to existing live actions. */
@media (max-width: 760px) {
  body.mobile-final #assistant .assistant-card.assistant-welcome {
    display: flex !important;
    width: 100% !important;
    max-width: none !important;
    margin: 16px auto 0 !important;
    padding: 18px 0 8px !important;
    align-items: center !important;
    flex-direction: column !important;
    gap: 16px !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    text-align: center !important;
  }

  body.mobile-final #assistant .assistant-welcome .assistant-avatar-wrap,
  body.mobile-final #assistant .assistant-welcome .assistant-avatar {
    width: 112px !important;
    height: 112px !important;
    min-width: 112px !important;
  }

  body.mobile-final #assistant .assistant-welcome .assistant-avatar-wrap {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
    background: radial-gradient(circle, rgba(255, 246, 235, .96) 0 58%, rgba(255, 246, 235, 0) 72%) !important;
  }

  body.mobile-final #assistant .assistant-welcome .assistant-card-body {
    display: flex !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    flex-direction: column !important;
    gap: 9px !important;
  }

  body.mobile-final #assistant .assistant-welcome .msg-text {
    max-width: 360px !important;
    color: #172b36 !important;
    font-size: 20px !important;
    font-weight: 820 !important;
    line-height: 1.35 !important;
  }

  body.mobile-final #assistant .assistant-welcome-subtitle {
    margin: 0 !important;
    color: #687a82 !important;
    font-size: 14px !important;
    font-weight: 520 !important;
    line-height: 1.45 !important;
  }

  body.mobile-final #assistant .assistant-welcome .assistant-evidence {
    width: min(100%, 220px) !important;
    margin: 4px 0 10px !important;
    padding-top: 9px !important;
    border-top: 1px solid #e5e9e8 !important;
  }

  body.mobile-final #assistant .assistant-welcome .assistant-evidence summary {
    color: #61747b !important;
    font-size: 13px !important;
    font-weight: 720 !important;
    line-height: 1.35 !important;
  }

  body.mobile-final #assistant .assistant-welcome .assistant-evidence .assistant-bullets {
    margin-top: 10px !important;
    padding: 12px 14px 12px 30px !important;
    border: 1px solid #e3e7e6 !important;
    border-radius: 12px !important;
    background: #fff !important;
    text-align: left !important;
  }

  body.mobile-final #assistant .assistant-load-alert {
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) auto auto !important;
    width: min(100%, 360px) !important;
    min-height: 60px !important;
    padding: 9px 12px !important;
    align-items: center !important;
    gap: 8px !important;
    border: 1px solid #ffd8d1 !important;
    border-radius: 13px !important;
    background: #fff9f7 !important;
    color: #172b36 !important;
    box-sizing: border-box !important;
  }

  body.mobile-final #assistant .assistant-load-alert > svg {
    width: 30px !important;
    height: 30px !important;
    color: #ff5a42 !important;
    stroke-width: 2.3 !important;
  }

  body.mobile-final #assistant .assistant-load-alert strong {
    min-width: 0 !important;
    text-align: left !important;
    font-size: 13px !important;
    font-weight: 760 !important;
    line-height: 1.35 !important;
  }

  body.mobile-final #assistant .assistant-load-alert button {
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 0 11px !important;
    border: 1px solid #dfe6e5 !important;
    border-radius: 9px !important;
    background: #fff !important;
    color: #20343e !important;
    font-size: 12px !important;
    font-weight: 720 !important;
    white-space: nowrap !important;
  }

  body.mobile-final #assistant .assistant-load-alert [data-assistant-load-retry] {
    border-color: #0aa99e !important;
    color: #079d93 !important;
  }

  body.mobile-final #assistant .assistant-welcome-prompts {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: min(100%, 360px) !important;
    gap: 8px !important;
  }

  body.mobile-final #assistant .assistant-welcome-prompts button {
    display: flex !important;
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 0 8px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    border: 1px solid #dfe5e4 !important;
    border-radius: 11px !important;
    background: #fff !important;
    color: #53656d !important;
    font-size: 11px !important;
    font-weight: 620 !important;
    white-space: nowrap !important;
  }

  body.mobile-final #assistant .assistant-welcome-prompts svg {
    width: 15px !important;
    height: 15px !important;
    color: #172b36 !important;
    stroke-width: 2 !important;
  }
}

/* gui-v25: pixel-close authority for the approved iPhone targets.
   Keep this block last so older emergency/mobile overrides cannot undo it. */
@media (max-width: 760px) and (orientation: portrait) {
  body.mobile-final {
    background: #fffdfa !important;
  }

  /* Shared native-style bottom navigation selection pill. */
  body.mobile-final .bottom-nav,
  body.mobile-final.ios-shell .bottom-nav,
  body.mobile-final.ios-standalone .bottom-nav {
    border-top: 1px solid #e4e7e6 !important;
    background: rgba(255, 255, 255, .99) !important;
  }
  body.mobile-final .bottom-item,
  body.mobile-final .bottom-item.active {
    width: 64px !important;
    min-width: 64px !important;
    height: 58px !important;
    min-height: 58px !important;
    border-radius: 18px !important;
    outline: 0 !important;
  }
  body.mobile-final .bottom-item.active {
    color: #08a99d !important;
    background: linear-gradient(145deg, #eefaf8, #e3f6f3) !important;
  }

  /* PAGE-MORE-01: complete groups, unbroken headings and target spacing. */
  body.mobile-final #more.page.active {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    padding-top: calc(12px + var(--safe-top)) !important;
    padding-right: max(20px, var(--safe-right)) !important;
    padding-bottom: 0 !important;
    padding-left: max(20px, var(--safe-left)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior-x: none !important;
    touch-action: pan-y !important;
    scrollbar-width: none !important;
    background: #fffdfa !important;
    box-sizing: border-box !important;
  }
  body.mobile-final #more.page.active::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
  }
  body.mobile-final #more > .topbar {
    min-height: 84px !important;
    margin: 0 0 5px !important;
    padding: 0 !important;
  }
  body.mobile-final #more > .topbar h1 {
    gap: 14px !important;
    font-size: 28px !important;
    font-weight: 760 !important;
  }
  body.mobile-final #more > .topbar h1::before {
    width: 52px !important;
    height: 52px !important;
    flex-basis: 52px !important;
    border-radius: 16px !important;
    background-size: 46px 46px !important;
    box-shadow: 0 8px 22px rgba(38, 55, 61, .055) !important;
  }
  body.mobile-final #more .more-page-list {
    display: grid !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    align-content: start !important;
    gap: 20px !important;
    margin: 0 !important;
    padding: 0 0 calc(var(--final-nav-height) + var(--safe-bottom) + 20px) !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    touch-action: pan-y !important;
  }
  body.mobile-final #more .more-page-group {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }
  body.mobile-final #more .more-page-group > h2 {
    position: static !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #172933 !important;
    font-size: 17px !important;
    font-weight: 720 !important;
    line-height: 1.35 !important;
    overflow: visible !important;
  }
  body.mobile-final #more .more-page-group > div {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    border-color: #dfe4e2 !important;
    border-radius: 18px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }
  body.mobile-final #more .more-page-group button {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 64px !important;
    height: 64px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
  }

  /* PAGE-BK-01: target header and rounded four-tab control. */
  body.mobile-final #bookkeeping.page.active,
  body.mobile-final.ios-shell #bookkeeping.page.active,
  body.mobile-final.ios-standalone #bookkeeping.page.active {
    padding-top: calc(12px + var(--safe-top)) !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    background: #fffdfa !important;
  }
  body.mobile-final #bookkeeping.page.active > .topbar {
    min-height: 82px !important;
    margin: 0 !important;
    padding: 0 24px !important;
  }
  body.mobile-final #bookkeeping.page.active > .topbar h1 {
    gap: 14px !important;
    font-size: 27px !important;
    font-weight: 760 !important;
  }
  body.mobile-final #bookkeeping.page.active > .topbar h1::before {
    width: 52px !important;
    height: 52px !important;
    flex: 0 0 52px !important;
    border-radius: 16px !important;
    background-size: 46px 46px !important;
  }
  body.mobile-final #bookkeeping > .bookkeeping-view-tabs {
    width: calc(100% - 36px) !important;
    min-height: 62px !important;
    margin: 0 18px 14px !important;
    padding: 0 8px !important;
    overflow: hidden !important;
    border: 1px solid #dfe4e2 !important;
    border-radius: 23px !important;
    background: #fff !important;
  }
  body.mobile-final #bookkeeping > .bookkeeping-view-tabs button {
    min-height: 61px !important;
    font-size: 17px !important;
  }
  body.mobile-final #bookkeeping > .bookkeeping-view-tabs button.active::after {
    right: 24% !important;
    left: 24% !important;
    height: 4px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-conversation-scroll {
    background: #fffdfa !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-chat-list {
    padding: 8px 20px 18px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-message {
    margin-bottom: 18px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-message-avatar {
    width: 40px !important;
    height: 40px !important;
    flex-basis: 40px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-message > div {
    max-width: calc(100% - 54px) !important;
    padding: 15px 18px !important;
    border-radius: 19px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-pending:not(:empty) {
    padding: 0 40px 20px !important;
    background: #fffdfa !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-review-card {
    padding: 22px 15px 18px !important;
    border-radius: 21px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-review-card > header {
    display: flex !important;
    min-height: 42px !important;
    align-items: center !important;
    gap: 11px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-review-card > header > svg {
    display: block !important;
    width: 32px !important;
    height: 32px !important;
    flex: 0 0 32px !important;
    padding: 7px !important;
    border: 1px solid #d7ece9 !important;
    border-radius: 10px !important;
    color: #08a99d !important;
    background: #eef9f7 !important;
    box-sizing: border-box !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-review-card > header span {
    width: auto !important;
    color: #172933 !important;
    font-size: 19px !important;
    font-weight: 780 !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-review-card dl {
    margin: 7px 0 8px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-review-card dl > div {
    grid-template-columns: 78px minmax(0, 1fr) !important;
    min-height: 55px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-review-card dt {
    font-size: 15px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-review-card dd {
    color: #172933 !important;
    font-size: 15px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-review-reason {
    display: none !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-learn-choice {
    margin: 6px 0 12px !important;
    color: #172933 !important;
    font-size: 14px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-review-card .section-actions button {
    min-height: 52px !important;
    border-radius: 11px !important;
    font-size: 15px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-composer,
  body.mobile-final:not(.keyboard-open):not(.composer-focused) #bookkeeping .bookkeeping-composer {
    grid-template-columns: 62px minmax(0, 1fr) 54px !important;
    width: calc(100% - 30px) !important;
    max-width: calc(100% - 30px) !important;
    min-height: 72px !important;
    margin: 8px 15px 10px !important;
    padding: 8px 10px !important;
    gap: 8px !important;
    border: 1px solid #dfe4e2 !important;
    border-radius: 19px !important;
    background: rgba(255, 255, 255, .99) !important;
    box-shadow: 0 9px 24px rgba(38, 55, 61, .06) !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-attachment-btn {
    height: 54px !important;
    min-height: 54px !important;
    border-radius: 12px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-composer textarea {
    min-width: 0 !important;
    max-width: 100% !important;
    height: 54px !important;
    min-height: 54px !important;
    border-radius: 17px !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-composer textarea::placeholder {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-composer > .primary-btn {
    display: grid !important;
    width: 54px !important;
    height: 54px !important;
    place-items: center !important;
    border-radius: 50% !important;
  }
  body.mobile-final #bookkeeping .bookkeeping-composer > .primary-btn svg {
    width: 26px !important;
    height: 26px !important;
    margin: 0 !important;
    transform: none !important;
  }

  /* PAGE-AI-01: approved hero spacing and complete floating composer. */
  body.mobile-final #assistant.page.active,
  body.mobile-final.ios-shell #assistant.page.active,
  body.mobile-final.ios-standalone #assistant.page.active {
    padding-top: calc(12px + var(--safe-top)) !important;
    background: #fffdfa !important;
  }
  body.mobile-final #assistant.page.active > .topbar {
    min-height: 74px !important;
    height: 74px !important;
  }
  body.mobile-final #assistant > .context-pills {
    height: 64px !important;
  }
  body.mobile-final #assistant .assistant-card.assistant-welcome {
    margin-top: 88px !important;
    padding-top: 0 !important;
  }
  body.mobile-final #assistant .assistant-welcome .assistant-avatar-wrap,
  body.mobile-final #assistant .assistant-welcome .assistant-avatar {
    width: 112px !important;
    height: 112px !important;
    min-width: 112px !important;
  }
  body.mobile-final #assistant .assistant-load-alert,
  body.mobile-final #assistant .assistant-welcome-prompts {
    width: min(100%, 360px) !important;
  }
  body.mobile-final #assistant > .composer,
  body.mobile-final:not(.keyboard-open):not(.composer-focused) #assistant > .composer {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 70px !important;
    margin: 8px 0 10px !important;
    padding: 8px 10px !important;
    gap: 8px !important;
    border: 1px solid #dfe4e2 !important;
    border-radius: 20px !important;
    background: rgba(255, 255, 255, .99) !important;
    box-shadow: 0 9px 24px rgba(38, 55, 61, .06) !important;
  }
  body.mobile-final #assistant > .composer textarea {
    top: 9px !important;
    right: 70px !important;
    left: 58px !important;
    height: 50px !important;
    min-height: 50px !important;
    padding: 12px 15px !important;
    border: 1px solid #dfe4e2 !important;
    border-radius: 18px !important;
    background: #fff !important;
  }
  body.mobile-final #assistant > .composer .assistant-attachment-btn {
    width: 46px !important;
    height: 46px !important;
    border-radius: 50% !important;
  }
  body.mobile-final #assistant > .composer button[type="submit"] {
    width: 52px !important;
    min-width: 52px !important;
    height: 52px !important;
    min-height: 52px !important;
  }
}