/* Mobile enterprise v3: unified controls, restrained hierarchy and production-ready spacing. */
body[data-app-surface="mobile"] {
  --mobile-control-height: 44px;
  --mobile-control-radius: 8px;
  --mobile-panel-radius: 11px;
  --mobile-panel-border: #dfe7f0;
  --mobile-panel-shadow: 0 1px 2px rgb(15 43 70 / 4%);
  --mobile-muted-bg: #f6f9fc;
}

/* The title stack must keep real breathing room inside the app header.
   A fixed flex basis prevents compact/embedded captures from shaving the
   first line, while the explicit inner height keeps both rows centred. */
body[data-app-surface="mobile"] .mobile-header {
  box-sizing: border-box;
  flex: 0 0 58px !important;
  height: 58px !important;
  min-height: 58px !important;
  padding-block: 6px !important;
  overflow: visible !important;
}

body[data-app-surface="mobile"] .mobile-header > div {
  display: grid;
  min-width: 0;
  min-height: 42px;
  align-content: center;
  gap: 1px;
  overflow: visible;
}

body[data-app-surface="mobile"] .mobile-header strong {
  line-height: 20px !important;
}

body[data-app-surface="mobile"] .mobile-header small {
  margin-top: 0 !important;
  line-height: 14px !important;
}

/* Section headers: accent and title form one left-aligned group; only
   optional metadata/actions are allowed to occupy the right edge. */
body[data-app-surface="mobile"] :where(
  .mobile-section > header,
  .m-prg-form-section > header,
  .m-mat-form-section > header
) {
  align-items: center !important;
  justify-content: flex-start !important;
  min-height: 44px !important;
}

body[data-app-surface="mobile"] :where(
  .mobile-section > header > h3,
  .m-prg-form-section > header > h2,
  .m-mat-form-section > header > h2
) {
  margin: 0 !important;
  color: #20364f !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 22px !important;
  letter-spacing: 0 !important;
  text-align: left !important;
}

body[data-app-surface="mobile"] :where(
  .mobile-section > header,
  .m-prg-form-section > header,
  .m-mat-form-section > header
) > :where(span, button):last-child {
  margin-left: auto !important;
}

/* One button hierarchy: solid primary, outlined secondary and compact text actions. */
body[data-app-surface="mobile"] :where(.el-button, .mobile-sticky-actions > button, .mobile-page-actionbar > button) {
  min-height: var(--mobile-control-height) !important;
  padding-inline: 16px !important;
  border-radius: var(--mobile-control-radius) !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

body[data-app-surface="mobile"] :where(.el-button--primary, .mobile-sticky-actions > .el-button--primary, .mobile-page-actionbar > .el-button--primary) {
  border-color: #1478d4 !important;
  color: #fff !important;
  background: #1478d4 !important;
}

body[data-app-surface="mobile"] :where(.el-button--default, .mobile-sticky-actions > .el-button--default, .mobile-page-actionbar > .el-button--default) {
  border: 1px solid #cdd9e6 !important;
  color: #36506d !important;
  background: #fff !important;
}

body[data-app-surface="mobile"] .mobile-card-list article > button {
  display: inline-flex !important;
  width: auto !important;
  min-width: 76px !important;
  min-height: 40px !important;
  margin: 10px 0 0 auto !important;
  padding: 0 15px !important;
  border: 1px solid #1478d4 !important;
  border-radius: 8px !important;
  color: #fff !important;
  background: #1478d4 !important;
  box-shadow: none !important;
}

/* Native select arrows are disabled so every select shows exactly one system arrow. */
body[data-app-surface="mobile"] :where(.mobile-content select, .el-overlay--mobile select, .mobile-fullscreen select) {
  padding-right: 34px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: none !important;
}

/* Generic file inputs become a consistent business upload row. */
body[data-app-surface="mobile"] .mobile-file-field {
  position: relative;
}

body[data-app-surface="mobile"] .mobile-file-input {
  position: absolute !important;
  inset: auto 0 0 !important;
  z-index: 2;
  width: 100% !important;
  height: 56px !important;
  min-height: 56px !important;
  margin: 0 !important;
  opacity: 0 !important;
  cursor: pointer;
}

body[data-app-surface="mobile"] .mobile-file-control {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: center;
  min-height: 56px;
  padding: 8px 10px;
  gap: 9px;
  border: 1px dashed #b9cbe0;
  border-radius: 9px;
  color: #223a55;
  background: #f8fbfe;
}

body[data-app-surface="mobile"] .mobile-file-control__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 7px;
  color: #176fb4;
  background: #eaf3fb;
}

body[data-app-surface="mobile"] .mobile-file-control__icon .ui-icon { width: 16px; height: 16px; }
body[data-app-surface="mobile"] .mobile-file-control__copy { min-width: 0; }
body[data-app-surface="mobile"] .mobile-file-control__copy b,
body[data-app-surface="mobile"] .mobile-file-control__copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body[data-app-surface="mobile"] .mobile-file-control__copy b { font-size: 13px; font-weight: 600; }
body[data-app-surface="mobile"] .mobile-file-control__copy small { margin-top: 1px; color: #748296; font-size: 11px; }
body[data-app-surface="mobile"] .mobile-file-control__action { color: #176fb4; font-size: 12px; font-weight: 500; }
body[data-app-surface="mobile"] :where(.contract-upload-step, .contract-import) label > .mobile-file-control ~ span { display: none !important; }
body[data-app-surface="mobile"] .mobile-file-field:focus-within .mobile-file-control { border-color: #1687f8; box-shadow: 0 0 0 3px rgb(22 135 248 / 12%); }

/* Specialist photo/evidence uploaders use the same compact horizontal pattern. */
body[data-app-surface="mobile"] :where(.mobile-upload > span, .m-mat-upload > span, .m-prg-upload > span, .m-saf-upload > span) {
  flex-direction: row !important;
  justify-content: flex-start !important;
  min-height: 64px !important;
  padding: 10px 12px !important;
  gap: 9px !important;
  border-radius: 9px !important;
  color: #176fb4 !important;
  background: #f8fbfe !important;
}

body[data-app-surface="mobile"] :where(.mobile-upload > span, .m-mat-upload > span, .m-prg-upload > span, .m-saf-upload > span) > .ui-icon {
  flex: 0 0 18px;
  width: 18px !important;
  height: 18px !important;
}

body[data-app-surface="mobile"] :where(.mobile-upload, .m-mat-upload, .m-prg-upload, .m-saf-upload) b { margin: 0 !important; font-size: 13px !important; font-weight: 600 !important; }
body[data-app-surface="mobile"] :where(.mobile-upload, .m-mat-upload, .m-prg-upload, .m-saf-upload) small { margin-left: auto; color: #748296 !important; font-size: 11px !important; }

/* Every fixed/sticky action area reserves content space and stays below form content. */
body[data-app-surface="mobile"] .mobile-content:has(:where(.mobile-sticky-actions, .mobile-page-actionbar, .m-prg-sticky, .m-mat-sticky, .m-saf-sticky, .mobile-function-page > .page-function-actions, .mobile-function-closure > .page-function-actions)) {
  scroll-padding-bottom: calc(100px + env(safe-area-inset-bottom));
  padding-bottom: calc(100px + env(safe-area-inset-bottom)) !important;
}

body[data-app-surface="mobile"] :where(.mobile-sticky-actions, .mobile-page-actionbar, .m-prg-sticky, .m-mat-sticky, .m-saf-sticky, .mobile-function-page > .page-function-actions, .mobile-function-closure > .page-function-actions) {
  bottom: 0 !important;
  z-index: 30 !important;
  gap: 8px !important;
  padding: 10px 12px calc(10px + env(safe-area-inset-bottom)) !important;
  border-top: 1px solid #dfe7f0 !important;
  background: rgb(255 255 255 / 97%) !important;
  box-shadow: 0 -4px 12px rgb(15 43 70 / 5%) !important;
  backdrop-filter: blur(8px);
}

/* Lighter panels replace the oversized card-on-card treatment. */
body[data-app-surface="mobile"] :where(
  .mobile-section,
  .mobile-form-card,
  .mobile-page-intro,
  .mobile-profile-card,
  .mobile-card-list > article,
  .mobile-message-list,
  .mobile-all-apps,
  .m-ai-analysis-card
) {
  border-color: var(--mobile-panel-border) !important;
  border-radius: var(--mobile-panel-radius) !important;
  box-shadow: var(--mobile-panel-shadow) !important;
}

body[data-app-surface="mobile"] :where(
  .m-prg-card,
  .m-prg-context,
  .m-prg-form-section,
  .m-mat-order,
  .m-mat-form,
  .m-mat-intro,
  .m-saf-context,
  .m-saf-task,
  .m-saf-form,
  .m-saf-intro,
  .m-saf-candidate
) {
  border-color: var(--mobile-panel-border) !important;
  border-radius: var(--mobile-panel-radius) !important;
  box-shadow: none !important;
}

/* Personal centre: identity first, then a separate right-aligned utility row. */
body[data-app-surface="mobile"] .mobile-profile-card > button {
  grid-column: 1 / -1 !important;
  justify-self: end !important;
  width: auto !important;
  min-width: 116px !important;
  min-height: 40px !important;
  margin-top: 8px !important;
  padding: 0 14px !important;
  border: 1px solid #cdd9e6 !important;
  border-radius: 8px !important;
  color: #176fb4 !important;
  background: #fff !important;
}

/* Trailing navigation chevrons are quiet 14px affordances with a 44px hit area. */
body[data-app-surface="mobile"] :where(
  .mobile-settings-list > button,
  .mobile-task-list > button,
  .mobile-task-list > a,
  .mobile-all-apps > summary,
  .m-ai-role-prompts > button,
  .mobile-domain-overview-links > button,
  .mobile-domain-list > button,
  .mobile-domain-function-grid > button,
  .m-prg-voice-entry
) > .ui-icon:last-child {
  width: 14px !important;
  height: 14px !important;
  color: #7d8da1 !important;
}

/* Dialog and file centre are compact content surfaces rather than full-height demo sheets. */
body[data-app-surface="mobile"] .el-layer__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px !important;
  height: 36px !important;
  border: 1px solid #d7e1ec !important;
  border-radius: 50% !important;
  color: #617187 !important;
  background: #f8fafc !important;
}

body[data-app-surface="mobile"] .el-layer__close .ui-icon { width: 14px !important; height: 14px !important; }
/* AI analysis is a business risk view: denser, quieter and source-led. */
body[data-app-surface="mobile"] .m-ai-analysis-scroll { padding-right: 0 !important; scrollbar-width: none; }
body[data-app-surface="mobile"] .m-ai-analysis-scroll::-webkit-scrollbar { display: none; }
body[data-app-surface="mobile"] .m-ai-analysis-head h2 { font-size: 18px !important; font-weight: 600 !important; line-height: 25px !important; }
body[data-app-surface="mobile"] .m-ai-analysis-head p { max-width: 250px; font-size: 11px !important; line-height: 17px !important; }
body[data-app-surface="mobile"] .m-ai-analysis-head select { min-height: 40px !important; }
body[data-app-surface="mobile"] .m-ai-domain-grid { gap: 8px !important; }
body[data-app-surface="mobile"] .m-ai-domain-grid > button { min-height: 82px !important; padding: 10px !important; border-radius: 10px !important; box-shadow: none !important; }
body[data-app-surface="mobile"] .m-ai-domain-grid > button > span { width: 30px !important; height: 30px !important; border-radius: 8px !important; }
body[data-app-surface="mobile"] .m-ai-domain-grid .ui-icon { width: 16px !important; height: 16px !important; }
body[data-app-surface="mobile"] .m-ai-domain-grid b { font-size: 11px !important; font-weight: 500 !important; }
body[data-app-surface="mobile"] .m-ai-domain-grid strong { font-size: 15px !important; font-weight: 600 !important; }
body[data-app-surface="mobile"] .m-ai-domain-grid small { font-size: 10.5px !important; line-height: 15px !important; }
body[data-app-surface="mobile"] .m-ai-composer-v5 { gap: 8px !important; padding: 10px 12px !important; }
body[data-app-surface="mobile"] .m-ai-composer-v5 :where(button, textarea) { min-height: 44px !important; border-radius: 9px !important; }

/* Quality page: compact metrics and collision-proof task rows. */
body[data-app-surface="mobile"] .mobile-quality-summary {
  gap: 0 !important;
  overflow: hidden;
  border: 1px solid var(--mobile-panel-border);
  border-radius: 10px;
  background: #fff;
  box-shadow: var(--mobile-panel-shadow);
}
body[data-app-surface="mobile"] .mobile-quality-summary > div { min-height: 76px !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
body[data-app-surface="mobile"] .mobile-quality-summary > div + div { border-left: 1px solid #e6ecf2 !important; }
body[data-app-surface="mobile"] .mobile-quality-create { padding: 10px !important; }
body[data-app-surface="mobile"] .mobile-quality-create .mobile-primary-block { min-height: 44px !important; border-radius: 8px !important; box-shadow: none !important; font-size: 14px !important; }
body[data-app-surface="mobile"] .mobile-quality-create .ui-icon { width: 15px !important; height: 15px !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M30"] .mobile-task-list > button {
  grid-template-columns: 7px minmax(0, 1fr) auto !important;
  align-items: start !important;
  min-height: 66px !important;
  padding: 10px 0 !important;
  gap: 8px !important;
}
body[data-app-surface="mobile"] .mobile-content[data-page-code="M30"] .mobile-task-list .el-tag { align-self: start; max-width: 72px; margin-top: 1px; white-space: nowrap; }

@media (max-width: 374px) {
  body[data-app-surface="mobile"] .mobile-profile-card > button { margin-left: 0 !important; }
  body[data-app-surface="mobile"] .m-ai-analysis-head { grid-template-columns: minmax(0, 1fr) 112px !important; }
}

/* V4 audit fixes: native mobile hierarchy, collision safety and one affordance per control. */
body[data-app-surface="mobile"] :where(.login-shell select, .mobile-content select, .el-overlay--mobile select, .mobile-fullscreen select) {
  padding-right: 34px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: none !important;
}
body[data-app-surface="mobile"] select::-ms-expand { display: none; }
body[data-app-surface="mobile"] :where(label:has(> select), .el-form-item__content:has(> select))::before { content: none !important; }

body[data-app-surface="mobile"] .mobile-card-list article > .mobile-card-action {
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 40px !important;
  margin: 10px 0 0 !important;
  padding: 8px 0 0 !important;
  gap: 5px;
  border: 0 !important;
  border-top: 1px solid #e7edf4 !important;
  border-radius: 0 !important;
  color: #176fb4 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body[data-app-surface="mobile"] .mobile-card-action .ui-icon { width: 13px !important; height: 13px !important; }

body[data-app-surface="mobile"] .mobile-content.has-sticky-action {
  scroll-padding-bottom: calc(112px + env(safe-area-inset-bottom));
  padding-bottom: calc(112px + env(safe-area-inset-bottom)) !important;
}
body[data-app-surface="mobile"] .mobile-content.has-sticky-action :where(form, .m-mat-form, .m-prg-form, .m-saf-form):last-child { margin-bottom: 18px !important; }

body[data-app-surface="mobile"] .mobile-context-card { padding: 12px !important; }
body[data-app-surface="mobile"] .mobile-context-card h2 { font-size: 16px !important; font-weight: 600 !important; }
body[data-app-surface="mobile"] .mobile-context-card > p { font-size: 12px !important; line-height: 18px !important; }

body[data-app-surface="mobile"] .mobile-domain-menu { margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
body[data-app-surface="mobile"] .mobile-domain-list { overflow: hidden; border: 1px solid var(--mobile-panel-border); border-radius: 10px; background: #fff; }
body[data-app-surface="mobile"] .mobile-domain-list > a { min-height: 62px !important; padding: 9px 12px !important; border-radius: 0 !important; }
body[data-app-surface="mobile"] .mobile-domain-list > a + a { border-top: 1px solid #e7edf4 !important; }

body[data-app-surface="mobile"] .mobile-permission-state {
  display: flex; min-height: 100dvh; box-sizing: border-box; flex-direction: column; align-items: center; justify-content: center;
  padding: 32px 24px; color: #1f344d; text-align: center; background: #f4f7fb;
}
body[data-app-surface="mobile"] .mobile-permission-state > span { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; color: #c2413a; background: #fdeceb; }
body[data-app-surface="mobile"] .mobile-permission-state > span .ui-icon { width: 22px; height: 22px; }
body[data-app-surface="mobile"] .mobile-permission-state h1 { margin: 16px 0 6px; font-size: 18px; font-weight: 600; }
body[data-app-surface="mobile"] .mobile-permission-state p { max-width: 300px; margin: 0; color: #69788c; font-size: 13px; line-height: 20px; }
body[data-app-surface="mobile"] .mobile-permission-state > div { display: grid; width: min(100%, 280px); margin-top: 22px; gap: 10px; }
body[data-app-surface="mobile"] .mobile-permission-state .el-button { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }

body[data-app-surface="mobile"] .mobile-message-tabs { position: relative; margin: 0 -12px !important; padding: 0 12px !important; border-bottom: 1px solid #dfe7f0; border-radius: 0 !important; background: #fff !important; }
body[data-app-surface="mobile"] .mobile-message-tabs button { position: relative; min-height: 44px !important; border-radius: 0 !important; box-shadow: none !important; }
body[data-app-surface="mobile"] .mobile-message-tabs button.is-active::after { content: ""; position: absolute; right: 14px; bottom: 0; left: 14px; height: 2px; background: #1687f8; }
body[data-app-surface="mobile"] .mobile-message-list { margin: 0 -12px !important; gap: 0 !important; border: 0 !important; border-radius: 0 !important; background: #fff !important; box-shadow: none !important; }
body[data-app-surface="mobile"] .mobile-message-list > a { position: relative; grid-template-columns: 36px minmax(0, 1fr) 8px !important; min-height: 72px; padding: 11px 12px !important; border: 0 !important; border-bottom: 1px solid #e7edf4 !important; border-radius: 0 !important; background: #fff !important; }
body[data-app-surface="mobile"] .mobile-message-list > a.is-unread { border-left: 0 !important; background: #fbfdff !important; }
body[data-app-surface="mobile"] .mobile-message-list > a > i { width: 6px; height: 6px; align-self: start; margin-top: 6px; border-radius: 50%; background: #1687f8; }
body[data-app-surface="mobile"] .mobile-message-list header b { font-size: 13px !important; font-weight: 600 !important; }
body[data-app-surface="mobile"] .mobile-message-list p { display: -webkit-box; overflow: hidden; margin: 3px 0 0 !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: 11px !important; line-height: 17px !important; }

body[data-app-surface="mobile"] .m-prg-overview .prg-kpis { overflow: hidden; gap: 0 !important; border: 1px solid var(--mobile-panel-border); border-radius: 10px; background: #fff; }
body[data-app-surface="mobile"] .m-prg-overview .prg-kpis article { min-height: 72px !important; padding: 10px 12px !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
body[data-app-surface="mobile"] .m-prg-overview .prg-kpis article:nth-child(even) { border-left: 1px solid #e7edf4 !important; }
body[data-app-surface="mobile"] .m-prg-overview .prg-kpis article:nth-child(n+3) { border-top: 1px solid #e7edf4 !important; }
body[data-app-surface="mobile"] .m-prg-risk-list { margin-top: 10px; padding: 0 12px; border: 1px solid var(--mobile-panel-border); border-radius: 10px; background: #fff; }
body[data-app-surface="mobile"] .m-prg-risk-list > header { display: flex; align-items: center; justify-content: space-between; min-height: 44px; border-bottom: 1px solid #e7edf4; }
body[data-app-surface="mobile"] .m-prg-risk-list h3 { margin: 0; font-size: 15px; font-weight: 600; }
body[data-app-surface="mobile"] .m-prg-risk-list header button { min-height: 40px; color: #176fb4; background: transparent; }
body[data-app-surface="mobile"] .m-prg-risk-list dl { display: grid; grid-template-columns: 1fr 1fr; margin: 0; }
body[data-app-surface="mobile"] .m-prg-risk-list dl div { padding: 10px 0; }
body[data-app-surface="mobile"] .m-prg-risk-list dl div:nth-child(even) { padding-left: 12px; border-left: 1px solid #eef2f6; }
body[data-app-surface="mobile"] .m-prg-risk-list dl div:nth-child(n+3) { border-top: 1px solid #eef2f6; }
body[data-app-surface="mobile"] .m-prg-risk-list dt { color: #748296; font-size: 11px; }
body[data-app-surface="mobile"] .m-prg-risk-list dd { margin: 3px 0 0; font-size: 13px; font-weight: 600; }

body[data-app-surface="mobile"] .mobile-offline-result { grid-template-columns: 36px minmax(0, 1fr) auto !important; align-items: center !important; }
body[data-app-surface="mobile"] .mobile-offline-result > div { min-width: 0; }
body[data-app-surface="mobile"] .mobile-offline-result > div b,
body[data-app-surface="mobile"] .mobile-offline-result > div small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body[data-app-surface="mobile"] .mobile-offline-result > .el-tag { position: static !important; justify-self: end; align-self: center; margin: 0 !important; white-space: nowrap; }

body[data-app-surface="mobile"] .mobile-quality-create {
  display: flex !important;
  justify-content: flex-end !important;
  margin: 10px 0 12px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body[data-app-surface="mobile"] .mobile-quality-create .mobile-primary-block {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 120px !important;
  min-height: 44px !important;
  padding: 0 16px !important;
  gap: 7px !important;
  border-radius: 22px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}
body[data-app-surface="mobile"] .mobile-quality-create .mobile-primary-block .ui-icon {
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
}

/* V5 global mobile audit: page-native hierarchy, compact details and complete imagery. */
body[data-app-surface="mobile"] .mobile-content:has(:where(.mobile-sticky-actions, .mobile-page-actionbar, .m-prg-sticky, .m-mat-sticky, .m-saf-sticky)),
body[data-app-surface="mobile"] .mobile-content.has-sticky-action {
  scroll-padding-bottom: calc(82px + env(safe-area-inset-bottom)) !important;
  padding-bottom: calc(82px + env(safe-area-inset-bottom)) !important;
}
body[data-app-surface="mobile"] .mobile-content.has-sticky-action :where(form, .m-mat-form, .m-prg-form, .m-saf-form):last-child { margin-bottom: 6px !important; }

/* A dedicated 3:1 panorama avoids the severe crop caused by reusing a 16:9
   image inside the shallow mobile banner. Domain pages share this stable
   project context; the AI assistant keeps its own illustrated hero. */
body[data-app-surface="mobile"] .mobile-content[data-page-code]:not([data-page-code="M02"]):not([data-page-code="M03"]):not([data-page-code="M70"]) {
  --page-hero: url("../assets/skyline-blue/site-hero-mobile-v2.webp");
}
body[data-app-surface="mobile"] .mobile-content[data-page-code]:not([data-page-code="M02"]):not([data-page-code="M03"]):not([data-page-code="M70"])::before {
  height: 124px !important;
  flex: 0 0 124px !important;
  background-image: linear-gradient(180deg, rgb(7 43 91 / 8%), rgb(5 36 79 / 30%)), var(--page-hero) !important;
  background-position: center, center !important;
  background-size: 100% 100%, cover !important;
  background-repeat: no-repeat !important;
  background-color: #dceaf7;
}
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"]::before {
  height: 124px !important;
  flex: 0 0 124px !important;
  background-image: linear-gradient(180deg, rgb(7 43 91 / 5%), rgb(5 36 79 / 22%)), var(--page-hero) !important;
  background-position: center, center !important;
  background-size: 100% 100%, cover !important;
  background-repeat: no-repeat !important;
}

body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] {
  --page-hero: url("../assets/skyline-blue/ai-assistant-mobile-v2.webp");
}
body[data-app-surface="mobile"] :where(
  .m-saf-candidate figure,
  .m-saf-mobile-compare figure,
  .m-saf-evidence-one,
  .m-mat-evidence,
  .mobile-source-compare,
  .mobile-candidate-thumb,
  .mobile-evidence-strip > div,
  .capture-photo,
  .mobile-material-photo,
  .mobile-upload-item,
  .mobile-evidence-detail figure,
  .mobile-trace-detail figure
) img {
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  object-position: center !important;
  background: #edf3f8;
}

/* Offline queue is a left-aligned task list, not a stack of centred cards. */
body[data-app-surface="mobile"] .mobile-upload-section { padding: 0 12px !important; }
body[data-app-surface="mobile"] .mobile-upload-section > header {
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 44px !important;
  margin: 0 !important;
  text-align: left !important;
  border-bottom: 1px solid #e7edf4;
}
body[data-app-surface="mobile"] .mobile-upload-section > header::before { display: none !important; }
body[data-app-surface="mobile"] .mobile-upload-section > header h3 { flex: 0 1 auto !important; margin: 0 !important; text-align: left !important; }
body[data-app-surface="mobile"] .mobile-upload-section > header span { margin-left: auto; color: #748296; font-size: 12px; }
body[data-app-surface="mobile"] .mobile-upload-section .mobile-queue-list { display: grid; gap: 0 !important; }
body[data-app-surface="mobile"] .mobile-upload-section .mobile-queue-list > article { min-height: 64px; padding: 10px 0 !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
body[data-app-surface="mobile"] .mobile-upload-section .mobile-empty-inline { min-height: 58px !important; padding: 18px 0 !important; text-align: left !important; }
body[data-app-surface="mobile"] .mobile-offline-result > .el-tag { align-self: start !important; margin-top: 2px !important; }

/* File centre is a first-class page. */
body[data-app-surface="mobile"] .mobile-file-center-page { z-index: 90; background: var(--mobile-page); }
body[data-app-surface="mobile"] .mobile-file-center-page .mobile-fullscreen__body { padding: 8px 14px calc(18px + env(safe-area-inset-bottom)); }
body[data-app-surface="mobile"] .mobile-file-center-page .file-task-list { overflow: hidden; border: 1px solid var(--mobile-panel-border); border-radius: 11px; background: #fff; }
body[data-app-surface="mobile"] .mobile-file-center-page .file-task-list article { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; min-height: 72px; padding: 10px 12px; gap: 10px; border-bottom: 1px solid #e7edf4; }
body[data-app-surface="mobile"] .mobile-file-center-page .file-task-list article:last-child { border-bottom: 0; }
body[data-app-surface="mobile"] .mobile-file-center-page .file-format { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 8px; color: #176fb4; background: #eef6fc; font-size: 11px; font-weight: 700; }
body[data-app-surface="mobile"] .mobile-file-center-page .file-task-list strong,
body[data-app-surface="mobile"] .mobile-file-center-page .file-task-list small { display: block; overflow: hidden; text-overflow: ellipsis; }
body[data-app-surface="mobile"] .mobile-file-center-page .file-task-list small { margin-top: 2px; color: #748296; font-size: 11px; line-height: 16px; }
body[data-app-surface="mobile"] .mobile-file-center-page .el-button { min-width: 52px !important; min-height: 40px !important; padding-inline: 10px !important; }

/* Read-only source/evidence views are compact details, not empty full-height shells. */
body[data-app-surface="mobile"] .mobile-detail-sheet {
  height: auto !important;
  max-height: calc(100% - 20px) !important;
  margin: auto 10px !important;
}
body[data-app-surface="mobile"] .mobile-detail-sheet .el-layer__body { flex: 0 1 auto !important; padding: 10px 14px 14px !important; overflow-y: auto; background: #f6f9fc !important; }
body[data-app-surface="mobile"] .mobile-detail-sheet .el-layer__footer { position: static !important; justify-content: flex-end !important; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)) !important; }
body[data-app-surface="mobile"] :where(.mobile-evidence-detail,.mobile-trace-detail) { display: grid; gap: 12px; }
body[data-app-surface="mobile"] :where(.mobile-evidence-detail,.mobile-trace-detail) figure { overflow: hidden; margin: 0; border: 1px solid #dfe7f0; border-radius: 10px; background: #edf3f8; }
body[data-app-surface="mobile"] :where(.mobile-evidence-detail,.mobile-trace-detail) figure img { display: block; max-height: 210px; aspect-ratio: 16/9; }
body[data-app-surface="mobile"] :where(.mobile-evidence-detail,.mobile-trace-detail) figcaption { padding: 8px 10px; color: #667892; background: #fff; font-size: 11px; }
body[data-app-surface="mobile"] :where(.mobile-evidence-detail,.mobile-trace-detail) dl { display: grid; grid-template-columns: 1fr 1fr; margin: 0; overflow: hidden; border: 1px solid #dfe7f0; border-radius: 10px; background: #fff; }
body[data-app-surface="mobile"] :where(.mobile-evidence-detail,.mobile-trace-detail) dl > div { padding: 10px; border-bottom: 1px solid #edf1f5; }
body[data-app-surface="mobile"] :where(.mobile-evidence-detail,.mobile-trace-detail) dl > div:nth-child(even) { border-left: 1px solid #edf1f5; }
body[data-app-surface="mobile"] :where(.mobile-evidence-detail,.mobile-trace-detail) dt { color: #748296; font-size: 11px; }
body[data-app-surface="mobile"] :where(.mobile-evidence-detail,.mobile-trace-detail) dd { margin: 3px 0 0; font-size: 13px; font-weight: 600; }
body[data-app-surface="mobile"] :where(.mobile-evidence-detail,.mobile-trace-detail) aside { padding: 10px 12px; border-left: 3px solid #1687f8; border-radius: 7px; background: #eef7ff; }
body[data-app-surface="mobile"] :where(.mobile-evidence-detail,.mobile-trace-detail) aside p { margin: 3px 0 0; color: #52677f; font-size: 12px; line-height: 18px; }

/* Milestone is one coherent detail surface with a clear cause statement. */
body[data-app-surface="mobile"] .m-prg-milestone-detail { margin-top: 10px; overflow: hidden; border: 1px solid var(--mobile-panel-border); border-radius: 11px; background: #fff; }
body[data-app-surface="mobile"] .m-prg-milestone-detail > header { display: flex; align-items: center; justify-content: space-between; min-height: 48px; padding: 0 12px; border-bottom: 1px solid #e7edf4; }
body[data-app-surface="mobile"] .m-prg-milestone-detail h2 { margin: 0; font-size: 15px; font-weight: 600; }
body[data-app-surface="mobile"] .m-prg-milestone-detail header span { color: #c56a00; font-size: 12px; }
body[data-app-surface="mobile"] .m-prg-milestone-detail dl { display: grid; grid-template-columns: 1fr 1fr; margin: 0; padding: 2px 12px 10px; }
body[data-app-surface="mobile"] .m-prg-milestone-detail dl > div { padding: 10px 0; border-bottom: 1px solid #edf1f5; }
body[data-app-surface="mobile"] .m-prg-milestone-detail dl > div:nth-child(even) { padding-left: 12px; border-left: 1px solid #edf1f5; }
body[data-app-surface="mobile"] .m-prg-milestone-detail dt { color: #748296; font-size: 11px; }
body[data-app-surface="mobile"] .m-prg-milestone-detail dd { margin: 3px 0 0; font-size: 13px; font-weight: 600; }
body[data-app-surface="mobile"] .m-prg-milestone-detail aside { margin: 0 12px 12px; padding: 10px 12px; border-radius: 8px; background: #fff7e8; }
body[data-app-surface="mobile"] .m-prg-milestone-detail aside p { margin: 3px 0 0; color: #6f5837; font-size: 12px; line-height: 18px; }

/* AI result/candidate hierarchy: summary first, metadata second. */
body[data-app-surface="mobile"] .m-saf-candidate > header { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; gap: 12px; }
body[data-app-surface="mobile"] .m-saf-candidate > header h2 { margin: 3px 0 0; font-size: 19px; line-height: 26px; }
body[data-app-surface="mobile"] .m-saf-candidate > header p { margin: 2px 0 0; color: #748296; font-size: 12px; }
body[data-app-surface="mobile"] .m-saf-candidate > header > b { display: grid; justify-items: end; color: #176fb4; font-size: 18px; }
body[data-app-surface="mobile"] .m-saf-candidate > header > b small { color: #748296; font-size: 10px; font-weight: 400; }
body[data-app-surface="mobile"] .m-saf-candidate > h2,
body[data-app-surface="mobile"] .m-saf-candidate > header + h2,
body[data-app-surface="mobile"] .m-saf-candidate > header + h2 + p { display: none; }
body[data-app-surface="mobile"] .m-saf-candidate footer { justify-content: flex-end !important; }
body[data-app-surface="mobile"] .mobile-ai-result { box-shadow: none !important; }
body[data-app-surface="mobile"] .mobile-ai-result > header > b { display: grid; justify-items: end; color: #176fb4; font-size: 18px; }
body[data-app-surface="mobile"] .mobile-ai-result > header > b small { color: #748296; font-size: 10px; font-weight: 400; }
body[data-app-surface="mobile"] .mobile-ai-result__summary { margin: 12px 0 0; border-top: 1px solid #e7edf4; }
body[data-app-surface="mobile"] .mobile-ai-result__summary > div { display: grid; grid-template-columns: 66px minmax(0,1fr); padding: 11px 0; gap: 10px; border-bottom: 1px solid #edf1f5; }
body[data-app-surface="mobile"] .mobile-ai-result__summary dt { color: #5f7188; font-size: 12px; font-weight: 600; }
body[data-app-surface="mobile"] .mobile-ai-result__summary dd { margin: 0; color: #243b55; font-size: 13px; line-height: 20px; }
body[data-app-surface="mobile"] .mobile-source-button { display: flex !important; align-items: center; justify-content: space-between !important; width: 100%; min-height: 44px; margin-top: 10px; padding: 0 !important; border: 0 !important; color: #176fb4; background: transparent !important; box-shadow: none !important; }
body[data-app-surface="mobile"] .mobile-source-button .ui-icon { width: 14px; height: 14px; }

/* AI analysis header keeps title and period filter on separate, readable axes. */
body[data-app-surface="mobile"] .m-ai-analysis-head { display: grid !important; grid-template-columns: minmax(0,1fr) 104px !important; align-items: end !important; gap: 12px !important; }
body[data-app-surface="mobile"] .m-ai-analysis-head > div > span { display: none !important; }
body[data-app-surface="mobile"] .m-ai-analysis-head h2 { margin: 0 !important; font-size: 19px !important; }
body[data-app-surface="mobile"] .m-ai-analysis-head p { margin: 4px 0 0 !important; max-width: none; }
body[data-app-surface="mobile"] .m-ai-analysis-head label { display: grid; gap: 4px; }
body[data-app-surface="mobile"] .m-ai-analysis-head label > span { font-size: 11px; text-align: right; }
body[data-app-surface="mobile"] :where(.mobile-content[data-page-code="M70"], .mobile-content[data-page-code="M71"]) > .m-ai-composer-v5 {
  right: -10px !important;
  left: -10px !important;
  margin-right: -10px !important;
  margin-left: -10px !important;
  padding-right: 10px !important;
  padding-left: 10px !important;
}

/* Mobile personnel forms use right-aligned, softer action buttons. */
body[data-app-surface="mobile"] .cg-page > h2 { margin: 2px 2px 10px; font-size: 20px; }
body[data-app-surface="mobile"] .cg-card { padding: 14px !important; box-shadow: none !important; }
body[data-app-surface="mobile"] .cg-form footer { justify-content: flex-end !important; padding-top: 10px !important; }
body[data-app-surface="mobile"] .cg-form footer button { flex: 0 0 auto !important; min-height: 40px !important; padding-inline: 15px !important; border-radius: 20px !important; font-size: 13px !important; }
body[data-app-surface="mobile"] .cg-form footer button:not(:last-child) { border-color: transparent !important; background: #f1f5f9 !important; }
body[data-app-surface="mobile"] .cg-form footer button:last-child { background: #176fb4 !important; }

/* AI workbench v2: question-led assistance and evidence-led project judgement. */
body[data-app-surface="mobile"] :where(.mobile-content[data-page-code="M70"], .mobile-content[data-page-code="M71"]) .m-ai-tabs {
  flex: 0 0 auto;
  margin-bottom: 10px;
  border-color: #dbe5ef;
  background: #edf3f8;
}
body[data-app-surface="mobile"] :where(.mobile-content[data-page-code="M70"], .mobile-content[data-page-code="M71"]) .m-ai-tabs button {
  min-height: 44px;
  font-size: 14px;
}
body[data-app-surface="mobile"] .m-ai-first-open { display: grid; gap: 10px; padding-bottom: 4px; }
body[data-app-surface="mobile"] .m-ai-data-status {
  display: grid;
  grid-template-columns: 8px minmax(0,1fr);
  align-items: center;
  padding: 8px 2px 8px 4px;
  gap: 8px;
}
body[data-app-surface="mobile"] .m-ai-data-status > i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #17a66a;
  box-shadow: 0 0 0 4px #e6f7ef;
}
body[data-app-surface="mobile"] .m-ai-data-status > span { display: grid; gap: 1px; }
body[data-app-surface="mobile"] .m-ai-data-status b { color: #23384f; font-size: 12px; }
body[data-app-surface="mobile"] .m-ai-data-status small { color: #718197; font-size: 10.5px; line-height: 16px; }
body[data-app-surface="mobile"] .m-ai-data-status > em { display: none; }

body[data-app-surface="mobile"] .m-ai-daily-brief,
body[data-app-surface="mobile"] .m-ai-role-prompts,
body[data-app-surface="mobile"] .m-ai-recent,
body[data-app-surface="mobile"] .m-ai-judgement-summary,
body[data-app-surface="mobile"] .m-ai-priority,
body[data-app-surface="mobile"] .m-ai-trend-proof {
  overflow: hidden;
  border: 1px solid #dbe5ef;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 3px rgb(24 55 88 / 5%);
}
body[data-app-surface="mobile"] :where(.m-ai-daily-brief,.m-ai-role-prompts,.m-ai-recent,.m-ai-priority,.m-ai-trend-proof) > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 13px 13px 10px;
  gap: 12px;
  border-bottom: 1px solid #e8eef4;
}
body[data-app-surface="mobile"] :where(.m-ai-daily-brief,.m-ai-role-prompts,.m-ai-recent,.m-ai-priority,.m-ai-trend-proof) > header span {
  display: block;
  margin-bottom: 2px;
  color: #176fb4;
  font-size: 10.5px;
  font-weight: 650;
}
body[data-app-surface="mobile"] :where(.m-ai-daily-brief,.m-ai-role-prompts,.m-ai-recent,.m-ai-priority,.m-ai-trend-proof) > header h2 {
  margin: 0;
  color: #172b43;
  font-size: 16px;
  font-weight: 650;
  line-height: 23px;
}
body[data-app-surface="mobile"] :where(.m-ai-daily-brief,.m-ai-priority,.m-ai-trend-proof) > header > em {
  flex: 0 0 auto;
  margin-top: 2px;
  color: #6d7e92;
  font-size: 11px;
  font-style: normal;
}
body[data-app-surface="mobile"] .m-ai-brief-main { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: start; padding: 13px; gap: 10px; }
body[data-app-surface="mobile"] .m-ai-brief-main > span {
  padding: 3px 7px;
  border: 1px solid #f0c681;
  border-radius: 6px;
  color: #9c5700;
  background: #fff7e8;
  font-size: 10.5px;
  white-space: nowrap;
}
body[data-app-surface="mobile"] .m-ai-brief-main h3 { margin: 0; color: #162b44; font-size: 16px; line-height: 23px; }
body[data-app-surface="mobile"] .m-ai-brief-main p { margin: 4px 0 0; color: #52677e; font-size: 12px; line-height: 19px; }
body[data-app-surface="mobile"] .m-ai-brief-evidence { display: flex; flex-wrap: wrap; padding: 0 13px 11px; gap: 5px; }
body[data-app-surface="mobile"] .m-ai-brief-evidence span,
body[data-app-surface="mobile"] .m-ai-judgement-summary > div:last-child span {
  padding: 3px 7px;
  border-radius: 5px;
  color: #557089;
  background: #f1f5f8;
  font-size: 10.5px;
}
body[data-app-surface="mobile"] .m-ai-daily-brief > footer { display: flex; justify-content: flex-end; padding: 10px 13px 12px; gap: 8px; border-top: 1px solid #edf1f5; }
body[data-app-surface="mobile"] .m-ai-daily-brief > footer button { min-height: 40px; padding: 0 14px; border: 1px solid #c8d6e5; border-radius: 8px; color: #176fb4; background: #fff; font-size: 12px; }
body[data-app-surface="mobile"] .m-ai-daily-brief > footer button.is-primary { border-color: #176fb4; color: #fff; background: #176fb4; }

body[data-app-surface="mobile"] :where(.m-ai-role-prompts,.m-ai-recent) > button {
  display: grid;
  width: calc(100% - 26px);
  min-height: 54px;
  align-items: center;
  margin: 0 13px;
  padding: 8px 0;
  border: 0;
  border-bottom: 1px solid #e9eef4;
  color: #223a54;
  background: #fff;
  text-align: left;
}
body[data-app-surface="mobile"] .m-ai-role-prompts > button { grid-template-columns: 32px minmax(0,1fr) 18px; gap: 8px; }
body[data-app-surface="mobile"] .m-ai-role-prompts > button > span { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 8px; color: #176fb4; background: #edf5fb; }
body[data-app-surface="mobile"] .m-ai-role-prompts > button > span .ui-icon { width: 16px; height: 16px; }
body[data-app-surface="mobile"] :where(.m-ai-role-prompts,.m-ai-recent) > button:last-child { border-bottom: 0; }
body[data-app-surface="mobile"] .m-ai-role-prompts > button b { font-size: 12.5px; font-weight: 600; line-height: 19px; }
body[data-app-surface="mobile"] .m-ai-role-prompts > button > .ui-icon,
body[data-app-surface="mobile"] .m-ai-recent > button > .ui-icon { width: 16px; height: 16px; color: #8090a2; }
body[data-app-surface="mobile"] .m-ai-recent > button { grid-template-columns: minmax(0,1fr) 18px; gap: 8px; }
body[data-app-surface="mobile"] .m-ai-recent > button > span { display: grid; gap: 2px; }
body[data-app-surface="mobile"] .m-ai-recent > button b { font-size: 12.5px; }
body[data-app-surface="mobile"] .m-ai-recent > button small { color: #76869a; font-size: 10.5px; line-height: 16px; }
body[data-app-surface="mobile"] .m-ai-boundary-note { margin: 2px 4px 5px; color: #6e8094; font-size: 10.5px; line-height: 17px; }

body[data-app-surface="mobile"] .m-ai-judgement-summary { padding: 13px; border-left: 3px solid #d26b22; }
body[data-app-surface="mobile"] .m-ai-judgement-summary > header { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; gap: 12px; }
body[data-app-surface="mobile"] .m-ai-judgement-summary > header span { display: inline-block; padding: 3px 7px; border-radius: 5px; color: #a3500c; background: #fff3e5; font-size: 10.5px; }
body[data-app-surface="mobile"] .m-ai-judgement-summary h2 { margin: 7px 0 0; color: #172b43; font-size: 17px; line-height: 24px; }
body[data-app-surface="mobile"] .m-ai-judgement-summary strong { display: grid; justify-items: center; color: #176fb4; font-size: 25px; line-height: 26px; }
body[data-app-surface="mobile"] .m-ai-judgement-summary strong small { color: #738398; font-size: 9.5px; font-weight: 500; white-space: nowrap; }
body[data-app-surface="mobile"] .m-ai-judgement-summary > p { margin: 10px 0; color: #50667e; font-size: 12px; line-height: 19px; }
body[data-app-surface="mobile"] .m-ai-judgement-summary > div:last-child { display: flex; flex-wrap: wrap; gap: 5px; }
body[data-app-surface="mobile"] .m-ai-analysis-scroll { display: grid; align-content: start; gap: 10px; }
body[data-app-surface="mobile"] .m-ai-analysis-scroll .m-ai-analysis-head { margin: 0 0 2px !important; }
body[data-app-surface="mobile"] .m-ai-analysis-head > div > span { display: block !important; margin-bottom: 2px; color: #176fb4; font-size: 10.5px; font-weight: 650; }
body[data-app-surface="mobile"] .m-ai-analysis-head h2 { font-size: 17px !important; line-height: 24px !important; }

body[data-app-surface="mobile"] .m-ai-priority > article { display: grid; grid-template-columns: 24px minmax(0,1fr); padding: 12px 13px; gap: 9px; border-bottom: 1px solid #e8eef4; }
body[data-app-surface="mobile"] .m-ai-priority > article:last-child { border-bottom: 0; }
body[data-app-surface="mobile"] .m-ai-priority > article > i { display: grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; color: #526b83; background: #edf2f6; font-size: 11px; font-style: normal; font-weight: 700; }
body[data-app-surface="mobile"] .m-ai-priority > article.is-critical > i { color: #fff; background: #cf5c35; }
body[data-app-surface="mobile"] .m-ai-priority article article,
body[data-app-surface="mobile"] .m-ai-priority article > div { min-width: 0; }
body[data-app-surface="mobile"] .m-ai-priority article > div > header { display: flex; justify-content: space-between; gap: 8px; color: #677b91; font-size: 10.5px; }
body[data-app-surface="mobile"] .m-ai-priority article > div > header em { color: #ad5417; font-style: normal; font-weight: 650; }
body[data-app-surface="mobile"] .m-ai-priority h3 { margin: 5px 0; color: #192e46; font-size: 14px; line-height: 21px; }
body[data-app-surface="mobile"] .m-ai-priority p { margin: 5px 0; color: #586c82; font-size: 11px; line-height: 18px; }
body[data-app-surface="mobile"] .m-ai-priority article small { color: #75869a; font-size: 10.5px; line-height: 16px; }
body[data-app-surface="mobile"] .m-ai-causal { display: flex; align-items: center; margin: 8px 0; gap: 4px; }
body[data-app-surface="mobile"] .m-ai-causal span { flex: 1 1 0; padding: 5px 4px; border-radius: 5px; color: #425c74; background: #f1f5f8; font-size: 9.5px; text-align: center; }
body[data-app-surface="mobile"] .m-ai-causal b { flex: 0 0 auto; color: #8b99a9; font-size: 11px; }
body[data-app-surface="mobile"] .m-ai-priority article footer { margin-top: 6px; }
body[data-app-surface="mobile"] .m-ai-priority article footer button { display: flex; width: 100%; min-height: 40px; align-items: center; justify-content: space-between; padding: 0; border: 0; color: #176fb4; background: transparent; font-size: 11.5px; text-align: left; }
body[data-app-surface="mobile"] .m-ai-priority article footer .ui-icon { width: 15px; height: 15px; }

body[data-app-surface="mobile"] .m-ai-trend-proof { padding-bottom: 11px; }
body[data-app-surface="mobile"] .m-ai-trend-bars { display: flex; height: 78px; align-items: end; padding: 12px 14px 0; gap: 8px; }
body[data-app-surface="mobile"] .m-ai-trend-bars i { flex: 1 1 0; max-height: 100%; min-height: 12px; border-radius: 3px 3px 0 0; background: #75a8cf; }
body[data-app-surface="mobile"] .m-ai-trend-bars i.is-alert { background: #cf5c35; }
body[data-app-surface="mobile"] .m-ai-trend-axis { display: flex; justify-content: space-between; margin: 0 14px; padding: 5px 0 9px; color: #76879a; font-size: 10px; border-bottom: 1px solid #e9eef4; }
body[data-app-surface="mobile"] .m-ai-trend-axis strong { color: #ad5417; }
body[data-app-surface="mobile"] .m-ai-trend-proof > footer { display: grid; padding: 9px 14px 0; gap: 2px; }
body[data-app-surface="mobile"] .m-ai-trend-proof > footer b { color: #2d604b; font-size: 11px; }
body[data-app-surface="mobile"] .m-ai-trend-proof > footer span { color: #738499; font-size: 10.5px; line-height: 16px; }
body[data-app-surface="mobile"] :where(.mobile-content[data-page-code="M70"], .mobile-content[data-page-code="M71"]) > .m-ai-composer-v5 { flex: 0 0 auto; }

/* AI workbench v3: one primary thought per screen, flat lists, no nested card clipping. */
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-first-open {
  display: grid !important;
  min-height: 0 !important;
  flex: 1 1 auto !important;
  align-content: start !important;
  padding: 0 0 8px !important;
  gap: 8px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body[data-app-surface="mobile"] .m-ai-data-status { padding: 6px 4px !important; }
body[data-app-surface="mobile"] .m-ai-focus {
  padding: 13px;
  border: 1px solid #dbe5ef;
  border-left: 3px solid #d98a2b;
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 1px 2px rgb(24 55 88 / 4%);
}
body[data-app-surface="mobile"] .m-ai-focus > header { display: flex; align-items: center; justify-content: space-between; }
body[data-app-surface="mobile"] .m-ai-focus > header span { color: #176fb4; font-size: 11px; font-weight: 650; }
body[data-app-surface="mobile"] .m-ai-focus > header em { padding: 2px 7px; border-radius: 5px; color: #9b5708; background: #fff3df; font-size: 10px; font-style: normal; }
body[data-app-surface="mobile"] .m-ai-focus h2 { margin: 8px 0 4px; color: #172d46; font-size: 16px; line-height: 23px; }
body[data-app-surface="mobile"] .m-ai-focus p { margin: 0; color: #596d83; font-size: 12px; line-height: 18px; }
body[data-app-surface="mobile"] .m-ai-focus > div { display: flex; flex-wrap: wrap; margin-top: 9px; gap: 5px; }
body[data-app-surface="mobile"] .m-ai-focus > div span { padding: 3px 7px; border-radius: 5px; color: #597089; background: #f1f5f8; font-size: 10px; }
body[data-app-surface="mobile"] .m-ai-focus > footer { display: flex; justify-content: flex-end; margin-top: 10px; padding-top: 9px; gap: 8px; border-top: 1px solid #e9eef4; }
body[data-app-surface="mobile"] .m-ai-focus > footer button { min-height: 40px; padding: 0 13px; border: 1px solid #c6d4e2; border-radius: 8px; color: #176fb4; background: #fff; font-size: 12px; }
body[data-app-surface="mobile"] .m-ai-focus > footer button.is-primary { border-color: #176fb4; color: #fff; background: #176fb4; }

body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-role-prompts {
  display: block !important;
  padding: 0 !important;
  gap: 0 !important;
  overflow: visible !important;
  border: 1px solid #dbe5ef !important;
  border-radius: 11px !important;
  background: #fff !important;
  box-shadow: 0 1px 2px rgb(24 55 88 / 4%) !important;
}
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-role-prompts > header { padding: 11px 13px 8px !important; border-bottom: 1px solid #e9eef4 !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-role-prompts > header h2 { font-size: 15px !important; line-height: 21px !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-role-prompts > button {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 18px !important;
  width: calc(100% - 26px) !important;
  min-height: 46px !important;
  margin: 0 13px !important;
  padding: 7px 0 !important;
  gap: 8px !important;
  border: 0 !important;
  border-bottom: 1px solid #e9eef4 !important;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-role-prompts > button:last-child { border-bottom: 0 !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-role-prompts > button b { font-size: 12px !important; font-weight: 550 !important; }

body[data-app-surface="mobile"] .mobile-content[data-page-code="M71"] .m-ai-analysis-scroll {
  display: grid !important;
  min-height: 0 !important;
  align-content: start !important;
  gap: 8px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}
body[data-app-surface="mobile"] .mobile-content[data-page-code="M71"]::before { height: 112px !important; flex-basis: 112px !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M71"] .m-ai-analysis-head { min-height: 50px; margin: 0 !important; align-items: center !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M71"] .m-ai-analysis-head h2 { font-size: 17px !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M71"] .m-ai-analysis-head p { margin-top: 1px !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M71"] .m-ai-analysis-head label > span { display: none; }
body[data-app-surface="mobile"] .m-ai-judgement-summary { padding: 12px 13px !important; overflow: visible !important; border-radius: 11px !important; box-shadow: none !important; }
body[data-app-surface="mobile"] .m-ai-judgement-summary h2 { margin-top: 5px !important; font-size: 16px !important; line-height: 22px !important; }
body[data-app-surface="mobile"] .m-ai-judgement-summary > p { margin: 7px 0 0 !important; font-size: 11.5px !important; line-height: 18px !important; }
body[data-app-surface="mobile"] .m-ai-judgement-summary strong { font-size: 22px !important; }
body[data-app-surface="mobile"] .m-ai-priority { overflow: visible !important; border-radius: 11px !important; box-shadow: none !important; }
body[data-app-surface="mobile"] .m-ai-priority > header { padding: 10px 13px 8px !important; }
body[data-app-surface="mobile"] .m-ai-priority > header h2 { font-size: 15px !important; line-height: 21px !important; }
body[data-app-surface="mobile"] .m-ai-priority > article { padding: 10px 13px !important; }
body[data-app-surface="mobile"] .m-ai-priority h3 { margin: 4px 0 !important; font-size: 13px !important; line-height: 19px !important; }
body[data-app-surface="mobile"] .m-ai-priority p { display: none !important; }
body[data-app-surface="mobile"] .m-ai-priority article footer { margin-top: 2px !important; }
body[data-app-surface="mobile"] .m-ai-priority article footer button { min-height: 34px !important; }
body[data-app-surface="mobile"] .m-ai-priority > article:not(.is-critical) p { display: none !important; }
body[data-app-surface="mobile"] .m-ai-priority > article:not(.is-critical) footer { margin-top: 0 !important; }
body[data-app-surface="mobile"] .m-ai-priority > article:not(.is-critical) footer button { min-height: 30px !important; }
body[data-app-surface="mobile"] .m-ai-risk-row {
  display: grid;
  grid-template-columns: 24px minmax(0,1fr) 18px;
  width: calc(100% - 26px);
  min-height: 62px;
  align-items: center;
  margin: 0 13px;
  padding: 7px 0;
  gap: 9px;
  border: 0;
  border-bottom: 1px solid #e8eef4;
  color: #22384f;
  background: #fff;
  text-align: left;
}
body[data-app-surface="mobile"] .m-ai-risk-row:last-child { border-bottom: 0; }
body[data-app-surface="mobile"] .m-ai-risk-row > i { display: grid; width: 22px; height: 22px; place-items: center; border-radius: 50%; color: #5f7388; background: #edf2f6; font-size: 10px; font-style: normal; font-weight: 700; }
body[data-app-surface="mobile"] .m-ai-risk-row.is-critical > i { color: #fff; background: #cf5c35; }
body[data-app-surface="mobile"] .m-ai-risk-row > span { display: grid; min-width: 0; gap: 3px; }
body[data-app-surface="mobile"] .m-ai-risk-row small { display: flex; justify-content: space-between; gap: 8px; font-size: 9.5px; }
body[data-app-surface="mobile"] .m-ai-risk-row small em { color: #718397; font-style: normal; }
body[data-app-surface="mobile"] .m-ai-risk-row small strong { color: #ad5a17; font-weight: 650; white-space: nowrap; }
body[data-app-surface="mobile"] .m-ai-risk-row > span > b { overflow: hidden; color: #213850; font-size: 12px; font-weight: 600; line-height: 18px; text-overflow: ellipsis; white-space: nowrap; }
body[data-app-surface="mobile"] .m-ai-risk-row > .ui-icon { width: 16px; height: 16px; color: #176fb4; }

/* AI answer state: compact scope toolbar followed by one conversation stream. */
body[data-app-surface="mobile"] .m-ai-querybar {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  min-height: 46px;
  align-items: center;
  padding: 4px 2px 8px;
  gap: 10px;
  border-bottom: 1px solid #dfe7ef;
}
body[data-app-surface="mobile"] .m-ai-querybar label { display: flex; min-width: 0; align-items: center; gap: 6px; }
body[data-app-surface="mobile"] .m-ai-querybar label > span { flex: 0 0 auto; color: #6b7e92; font-size: 11px; }
body[data-app-surface="mobile"] .m-ai-querybar select { min-width: 0; min-height: 36px; flex: 1 1 auto; padding: 0 28px 0 9px; border: 1px solid #cbd8e5; border-radius: 8px; color: #223a53; background-color: #fff; font-size: 11.5px; }
body[data-app-surface="mobile"] .m-ai-scope-state { display: flex; align-items: center; gap: 5px; color: #3f6e5b; }
body[data-app-surface="mobile"] .m-ai-scope-state > .ui-icon { width: 15px; height: 15px; }
body[data-app-surface="mobile"] .m-ai-scope-state > span { display: grid; gap: 0; }
body[data-app-surface="mobile"] .m-ai-scope-state b { font-size: 10px; white-space: nowrap; }
body[data-app-surface="mobile"] .m-ai-scope-state small { color: #7d8d9e; font-size: 9px; white-space: nowrap; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-chat { gap: 8px !important; padding: 8px 0 6px !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-chat .is-user { max-width: 82% !important; padding: 7px 10px !important; border-radius: 10px 10px 2px 10px !important; box-shadow: none !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-chat .is-user > span { margin-bottom: 1px !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-chat .is-user p { font-size: 12px !important; line-height: 18px !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-chat .is-ai { border-radius: 11px !important; box-shadow: none !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-chat .is-ai > header { display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 9px 12px !important; gap: 10px !important; background: #fff !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-chat .is-ai > header > div { min-width: 0; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-chat .is-ai > header b { font-size: 13px !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-chat .is-ai > header small { font-size: 9.5px !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-chat .is-ai > header em { padding: 0 !important; color: #348064 !important; background: transparent !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-answer-lead { padding: 10px 12px 8px !important; font-size: 12px !important; line-height: 19px !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-priority-list { padding: 0 12px !important; gap: 0 !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-priority-list li { padding: 8px 0 !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-priority-list li > span { width: 22px !important; height: 22px !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-evidence { margin: 7px 12px 0 !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-evidence button { min-height: 40px !important; border-radius: 8px !important; }
body[data-app-surface="mobile"] .mobile-content[data-page-code="M70"] .m-ai-chat .is-ai > footer { justify-content: space-between !important; margin-top: 8px !important; padding: 7px 12px !important; background: #f7f9fb !important; font-size: 9.5px !important; }

/* AI verification is a focused review task, not a generic detail page. */
body[data-app-surface="mobile"] .mobile-content[data-page-code="M72"]::before {
  display: none !important;
  content: none !important;
  height: 0 !important;
  flex: 0 0 0 !important;
}
body[data-app-surface="mobile"] .mobile-content[data-page-code="M72"] { gap: 10px !important; }
body[data-app-surface="mobile"] .ai-result-v2 { display: grid; gap: 10px; }
body[data-app-surface="mobile"] .ai-result-v2__meta {
  display: flex;
  min-height: 46px;
  align-items: center;
  justify-content: space-between;
  padding: 0 2px;
  gap: 12px;
}
body[data-app-surface="mobile"] .ai-result-v2__meta > span { display: grid; min-width: 0; justify-items: start; gap: 4px; }
body[data-app-surface="mobile"] .ai-result-v2__meta > span > small { overflow: hidden; max-width: 230px; color: #6d7e91; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
body[data-app-surface="mobile"] .ai-result-v2__meta > b { display: grid; grid-template-columns: auto auto; align-items: baseline; justify-items: end; color: #176fb4; font-size: 25px; line-height: 1; }
body[data-app-surface="mobile"] .ai-result-v2__meta > b > em { font-size: 12px; font-style: normal; }
body[data-app-surface="mobile"] .ai-result-v2__meta > b > small { grid-column: 1 / -1; margin-top: 4px; color: #7b8999; font-size: 9px; font-weight: 500; }
body[data-app-surface="mobile"] .ai-result-v2__overview {
  display: grid;
  grid-template-columns: minmax(0,1fr) 112px;
  min-height: 154px;
  overflow: hidden;
  border: 1px solid #d5e0eb;
  border-radius: 12px;
  background: #fff;
}
body[data-app-surface="mobile"] .ai-result-v2__overview.is-text-only { grid-template-columns: 1fr; min-height: 132px; }
body[data-app-surface="mobile"] .ai-result-v2__overview > div { display: flex; min-width: 0; flex-direction: column; justify-content: center; padding: 16px; }
body[data-app-surface="mobile"] .ai-result-v2__overview > div > span { color: #176fb4; font-size: 11px; font-weight: 650; }
body[data-app-surface="mobile"] .ai-result-v2__overview h2 { margin: 5px 0 4px; color: #172f49; font-size: 20px; line-height: 28px; }
body[data-app-surface="mobile"] .ai-result-v2__overview p { margin: 0 0 12px; color: #66798e; font-size: 11px; line-height: 17px; }
body[data-app-surface="mobile"] .ai-result-v2__overview > div > div { display: flex; flex-wrap: wrap; gap: 5px; }
body[data-app-surface="mobile"] .ai-result-v2__overview figure { position: relative; min-width: 0; margin: 0; border-left: 1px solid #e5ebf1; background: #edf3f7; }
body[data-app-surface="mobile"] .ai-result-v2__overview figure img { width: 100%; height: 100%; object-fit: contain; }
body[data-app-surface="mobile"] .ai-result-v2__overview figcaption { position: absolute; right: 6px; bottom: 6px; padding: 3px 6px; border-radius: 5px; color: #fff; background: rgba(20,43,65,.76); font-size: 9px; }
body[data-app-surface="mobile"] .ai-result-v2__evidence { overflow: hidden; border: 1px solid #d5e0eb; border-radius: 12px; background: #fff; }
body[data-app-surface="mobile"] .ai-result-v2__evidence > header { display: flex; align-items: center; justify-content: space-between; padding: 13px 14px 10px; gap: 10px; }
body[data-app-surface="mobile"] .ai-result-v2__evidence > header span { color: #176fb4; font-size: 10px; font-weight: 650; }
body[data-app-surface="mobile"] .ai-result-v2__evidence h3 { margin: 3px 0 0; color: #213950; font-size: 15px; }
body[data-app-surface="mobile"] .ai-result-v2__evidence button { display: flex; min-height: 44px; align-items: center; padding: 0; gap: 4px; border: 0; color: #176fb4; background: transparent; font-size: 11px; white-space: nowrap; }
body[data-app-surface="mobile"] .ai-result-v2__evidence button .ui-icon { width: 14px; height: 14px; }
body[data-app-surface="mobile"] .ai-result-v2__evidence dl { margin: 0; padding: 0 14px 5px; }
body[data-app-surface="mobile"] .ai-result-v2__evidence dl > div { display: grid; grid-template-columns: 66px minmax(0,1fr); padding: 10px 0; gap: 10px; border-top: 1px solid #edf1f5; }
body[data-app-surface="mobile"] .ai-result-v2__evidence dt { color: #77879a; font-size: 11px; }
body[data-app-surface="mobile"] .ai-result-v2__evidence dd { margin: 0; color: #2a4058; font-size: 12px; line-height: 18px; }
body[data-app-surface="mobile"] .ai-result-v2__permission { display: flex; min-height: 52px; align-items: center; padding: 8px 10px; gap: 9px; border-top: 1px solid #dfe7ef; color: #63758a; }
body[data-app-surface="mobile"] .ai-result-v2__permission > span { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; border-radius: 50%; color: #60758b; background: #eaf0f5; }
body[data-app-surface="mobile"] .ai-result-v2__permission .ui-icon { width: 16px; height: 16px; }
body[data-app-surface="mobile"] .ai-result-v2__permission p { display: grid; margin: 0; gap: 2px; }
body[data-app-surface="mobile"] .ai-result-v2__permission b { color: #344b62; font-size: 12px; }
body[data-app-surface="mobile"] .ai-result-v2__permission small { color: #7a8999; font-size: 10px; line-height: 15px; }
body[data-app-surface="mobile"] .ai-result-v2__permission.is-complete > span { color: #2f7e5c; background: #e9f6ef; }
