/* ui493: final PC cockpit system. Loaded after all legacy layout layers. */
:root {
  --ui493-canvas: 1280px;
  --ui493-sidebar: 224px;
  --ui493-edge: 20px;
  --ui493-gap: 14px;
  --ui493-bg: #071017;
  --ui493-surface: #0d1b24;
  --ui493-surface-2: #112631;
  --ui493-surface-3: #162f3b;
  --ui493-line: rgba(190, 224, 235, 0.17);
  --ui493-line-strong: rgba(121, 216, 242, 0.62);
  --ui493-text: #eef8fa;
  --ui493-muted: #a9bdc6;
  --ui493-faint: #78939d;
  --ui493-signal: #79d8f2;
  --ui493-signal-deep: #246d80;
  --ui493-good: #8bd5ae;
  --ui493-warn: #e4b96e;
  --ui493-danger: #ef958c;
  --ui493-radius: 7px;
  --ui493-font: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
}

/* The product is intentionally desktop-only. Narrow windows keep the same
   1280px information architecture and can be scrolled horizontally. */
html,
body {
  min-width: var(--ui493-canvas) !important;
  width: var(--ui493-canvas) !important;
  margin-inline: auto !important;
  overflow-x: auto !important;
  background: var(--ui493-bg) !important;
  color: var(--ui493-text) !important;
  font-family: var(--ui493-font) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}

html body #portal-root,
html body #root {
  width: var(--ui493-canvas) !important;
  min-width: var(--ui493-canvas) !important;
  max-width: var(--ui493-canvas) !important;
  margin-inline: auto !important;
  background: var(--ui493-bg) !important;
  color: var(--ui493-text) !important;
  font-family: var(--ui493-font) !important;
}

html body #portal-root :is(.mobile-nav, .portal-mobile-nav, .mobile-menu, .mobile-nav-toggle, .mobile-nav-actions, .mobile-only, [data-mobile-only]),
html body #root :is(.mobile-nav, .geo-mobile-nav-hint, .mobile-menu, .mobile-nav-toggle, .mobile-nav-actions, .mobile-only, .menu-button, [data-mobile-only]) {
  display: none !important;
}

/* Shared frame */
html body #portal-root main.portal-shell,
html body #root main.geo-admin-shell {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: var(--ui493-sidebar) minmax(0, 1fr) !important;
  gap: 0 !important;
  width: var(--ui493-canvas) !important;
  min-width: var(--ui493-canvas) !important;
  max-width: var(--ui493-canvas) !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: var(--ui493-bg) !important;
}

html body #portal-root main.portal-shell .portal-header,
html body #root main.geo-admin-shell .geo-sidebar {
  box-sizing: border-box !important;
  width: var(--ui493-sidebar) !important;
  min-width: var(--ui493-sidebar) !important;
  max-width: var(--ui493-sidebar) !important;
  min-height: 100vh !important;
  height: 100vh !important;
  max-height: none !important;
  position: sticky !important;
  top: 0 !important;
  align-self: start !important;
  overflow: auto !important;
  border: 0 !important;
  border-right: 1px solid var(--ui493-line) !important;
  border-radius: 0 !important;
  background: #0a151d !important;
  box-shadow: none !important;
}

html body #portal-root main.portal-shell .portal-content-stage,
html body #root main.geo-admin-shell .geo-workspace {
  box-sizing: border-box !important;
  min-width: 0 !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  background: var(--ui493-bg) !important;
}

html body #portal-root main.portal-shell .portal-content-stage > *,
html body #root main.geo-admin-shell .geo-content > * {
  box-sizing: border-box !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 0 var(--ui493-gap) !important;
}

html body #portal-root main.portal-shell .portal-content-stage,
html body #root main.geo-admin-shell .geo-content {
  display: grid !important;
  gap: var(--ui493-gap) !important;
  align-content: start !important;
}

html body #root main.geo-admin-shell .geo-content {
  width: auto !important;
  padding: var(--ui493-edge) !important;
}

/* Remove the old narrative green surfaces wherever a page-specific selector
   is more specific than the base cockpit layer. */
html body #root main.geo-admin-shell :is(
  .geo-module-story,
  .geo-growth-shell,
  .geo-growth-stage,
  .geo-overview-shell,
  .geo-overview-hero,
  .geo-overview-copy,
  .geo-growth-tabs,
  .geo-growth-overview-switch,
  .geo-story-path,
  .geo-story-metrics,
  .geo-story-path article,
  .geo-story-metrics div
) {
  background: var(--ui493-surface) !important;
  background-image: none !important;
  border-color: var(--ui493-line) !important;
  border-radius: var(--ui493-radius) !important;
  box-shadow: none !important;
  color: var(--ui493-text) !important;
}

html body #portal-root main.portal-shell :is(
  .page-control-tower,
  .client-core-command-deck,
  .client-command-cockpit,
  .task-pool-cockpit,
  .task-quick-list,
  .command-tools,
  .command-route-board,
  .command-metrics,
  .client-core-command-strip,
  .client-advanced-drawer,
  .client-section-detail-drawer,
  .publisher-command-center,
  .publisher-account-station,
  .publisher-assets,
  .publisher-jobs,
  .compliance-sandbox-cockpit,
  .panel
),
html body #root main.geo-admin-shell :is(
  .geo-panel,
  .geo-panel-table,
  .geo-dashboard-card,
  .geo-dashboard-action-card,
  .geo-project-card,
  .geo-report-card,
  .geo-card,
  .geo-list-card,
  .geo-command,
  .geo-control,
  .geo-delivery-console,
  .geo-user-command,
  .admin-dashboard-v2,
  .admin-dashboard-band,
  .admin-dashboard-data,
  .admin-flight-command,
  .geo-empty,
  .geo-notice,
  .geo-growth-shell,
  .geo-overview-shell
) {
  box-sizing: border-box !important;
  min-width: 0 !important;
  border: 1px solid var(--ui493-line) !important;
  border-radius: var(--ui493-radius) !important;
  background: var(--ui493-surface) !important;
  background-image: none !important;
  color: var(--ui493-text) !important;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.025) !important;
}

html body #portal-root main.portal-shell :is(
  .page-control-stats > *,
  .client-core-card-grid > *,
  .client-core-next-grid > *,
  .task-pool-cards > *,
  .task-pool-tower > *,
  .task-quick-card,
  .client-home-kpis > *,
  .client-home-next-grid > *,
  .publisher-platform,
  .publisher-asset-list > *,
  .publisher-job,
  .command-tool-card,
  .command-next-action
),
html body #root main.geo-admin-shell :is(
  .geo-kpi-grid > *,
  .geo-project-grid > *,
  .geo-report-grid > *,
  .geo-health-metrics > *,
  .geo-task-health-grid > *,
  .geo-task-job-grid > *,
  .geo-delivery-cards > *,
  .geo-permission-grid > *,
  .geo-dashboard-actions > *,
  .geo-admin-command-step,
  .geo-launch-blocker,
  .geo-launch-group,
  .geo-user-card
) {
  box-sizing: border-box !important;
  min-width: 0 !important;
  border: 1px solid var(--ui493-line) !important;
  border-radius: 6px !important;
  background: var(--ui493-surface-2) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Stable content grids */
html body #portal-root main.portal-shell :is(.page-control-tower, .client-core-command-deck, .client-command-cockpit) {
  display: grid !important;
  grid-template-columns: minmax(0, 1.18fr) minmax(252px, 0.75fr) minmax(190px, 0.47fr) !important;
  gap: var(--ui493-gap) !important;
  align-items: stretch !important;
  padding: var(--ui493-edge) !important;
}

html body #portal-root main.portal-shell :is(.page-control-hero, .client-core-hero, .page-control-stats, .page-control-actions) {
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 16px !important;
  border: 1px solid var(--ui493-line) !important;
  border-radius: 6px !important;
  background: var(--ui493-surface-2) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body #portal-root main.portal-shell :is(.page-control-stats, .client-home-kpis, .command-metrics, .task-pool-cards),
html body #root main.geo-admin-shell :is(.geo-kpi-grid, .geo-health-metrics, .geo-task-health-grid, .geo-project-health-grid) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

html body #portal-root main.portal-shell :is(.page-control-actions, .client-home-actions, .command-deck-actions, .task-pool-actions) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 8px !important;
  align-content: start !important;
}

html body #root main.geo-admin-shell :is(.geo-module-story, .geo-overview-hero, .geo-overview-command, .geo-flight-command, .geo-admin-hero) {
  display: grid !important;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.85fr) !important;
  gap: var(--ui493-gap) !important;
  align-items: start !important;
  min-height: 0 !important;
  padding: var(--ui493-edge) !important;
}

html body #root main.geo-admin-shell :is(.geo-story-path, .geo-story-metrics, .geo-overview-metrics) {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  align-content: start !important;
  min-width: 0 !important;
  padding: 0 !important;
}

html body #root main.geo-admin-shell :is(.geo-growth-tabs, .geo-growth-overview-switch) {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 6px !important;
  padding: 8px !important;
}

html body #root main.geo-admin-shell :is(.geo-growth-tabs > *, .geo-growth-overview-switch > *) {
  min-width: 0 !important;
  width: 100% !important;
}

/* Type ladder: one readable PC scale across every module. */
html body #portal-root main.portal-shell :is(h1, h2, h3, h4, strong, b),
html body #root main.geo-admin-shell :is(h1, h2, h3, h4, strong, b) {
  color: var(--ui493-text) !important;
  letter-spacing: 0 !important;
  overflow-wrap: anywhere !important;
}

html body #portal-root main.portal-shell :is(h1, .page-control-hero h1, .client-core-hero h1),
html body #root main.geo-admin-shell :is(h1, .geo-safe-heading, .geo-command h1, .geo-story-copy h2) {
  margin: 0 0 8px !important;
  font-size: 32px !important;
  line-height: 1.18 !important;
  font-weight: 760 !important;
}

html body #portal-root main.portal-shell :is(h2, .page-control-hero h2, .client-core-hero h2),
html body #root main.geo-admin-shell :is(h2, .geo-command h2, .geo-panel h2) {
  margin: 0 0 8px !important;
  font-size: 21px !important;
  line-height: 1.3 !important;
  font-weight: 720 !important;
}

html body #portal-root main.portal-shell :is(h3, h4),
html body #root main.geo-admin-shell :is(h3, h4) {
  font-size: 16px !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
}

html body #portal-root main.portal-shell :is(p, li, label, input, select, textarea, button, a),
html body #root main.geo-admin-shell :is(p, li, label, input, select, textarea, button, a) {
  font-family: var(--ui493-font) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
}

html body #portal-root main.portal-shell :is(small, .muted, .hint, .caption, .meta, .eyebrow),
html body #root main.geo-admin-shell :is(small, .muted, .hint, .caption, .meta, .geo-copy, .geo-muted, .geo-panel-head small) {
  color: var(--ui493-muted) !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
}

html body #portal-root main.portal-shell :is(.num, .metric-value, .page-control-stats strong, .client-home-kpis strong),
html body #root main.geo-admin-shell :is(.num, .metric-value, .geo-story-metrics strong, .geo-kpi strong) {
  color: var(--ui493-signal) !important;
  font-size: 26px !important;
  line-height: 1.1 !important;
  font-variant-numeric: tabular-nums !important;
}

/* Buttons and links share three semantic states: normal, execute, destructive. */
html body #portal-root main.portal-shell :is(button, .button, a[role="button"], .geo-mini-button),
html body #root main.geo-admin-shell :is(button, .button, a[role="button"], .geo-mini-button, .geo-story-button, .geo-action-card-button, .geo-notice-action) {
  box-sizing: border-box !important;
  min-height: 38px !important;
  max-width: 100% !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(190, 224, 235, 0.26) !important;
  border-radius: 6px !important;
  background: #162833 !important;
  background-image: none !important;
  color: #e9f5f7 !important;
  -webkit-text-fill-color: #e9f5f7 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 7px 16px rgba(0, 0, 0, 0.2) !important;
  text-shadow: none !important;
  transition: transform 160ms ease, border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease !important;
}

html body #portal-root main.portal-shell :is(button, .button, a[role="button"], .geo-mini-button):not(:disabled):hover,
html body #root main.geo-admin-shell :is(button, .button, a[role="button"], .geo-mini-button, .geo-story-button, .geo-action-card-button, .geo-notice-action):not(:disabled):hover {
  border-color: var(--ui493-line-strong) !important;
  background: #1b3542 !important;
  color: #f5fcfd !important;
  -webkit-text-fill-color: #f5fcfd !important;
  transform: translateY(-1px) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 10px 20px rgba(0, 0, 0, 0.27) !important;
}

html body #portal-root main.portal-shell :is(button, .button, a[role="button"], .geo-mini-button):not(:disabled):active,
html body #root main.geo-admin-shell :is(button, .button, a[role="button"], .geo-mini-button, .geo-story-button, .geo-action-card-button, .geo-notice-action):not(:disabled):active {
  transform: translateY(1px) scale(0.985) !important;
}

html body #portal-root main.portal-shell :is(.primary, .is-primary, .client-ignite-button, .primary-setup-action, .client-home-ignite, .self-start-primary, [data-primary="true"], [data-open-project-modal], [data-portal-action="run"], .cockpit-launch-action),
html body #root main.geo-admin-shell :is(.primary, .is-primary, .geo-mini-button.accent, .geo-action-card-button.primary, .cockpit-launch-action, button[class*="primary"]) {
  border-color: #75c8df !important;
  background: #246d80 !important;
  color: #f5fdff !important;
  -webkit-text-fill-color: #f5fdff !important;
  box-shadow: inset 0 -2px 0 rgba(7, 37, 48, 0.55), 0 9px 20px rgba(17, 98, 120, 0.26) !important;
}

html body #portal-root main.portal-shell :is(.primary, .is-primary, .client-ignite-button, .primary-setup-action, .client-home-ignite, .self-start-primary, [data-primary="true"], [data-open-project-modal], [data-portal-action="run"], .cockpit-launch-action):not(:disabled):hover,
html body #root main.geo-admin-shell :is(.primary, .is-primary, .geo-mini-button.accent, .geo-action-card-button.primary, .cockpit-launch-action, button[class*="primary"]):not(:disabled):hover {
  border-color: #a9ebfa !important;
  background: #2b8198 !important;
}

html body #portal-root main.portal-shell :is(.danger, [class*="danger"], [class*="delete"], [data-task-cancel], [data-provider-key-delete]),
html body #root main.geo-admin-shell :is(.danger, [class*="danger"], [class*="delete"], button[class*="delete"]) {
  border-color: rgba(239, 149, 140, 0.58) !important;
  background: #422526 !important;
  color: #ffecea !important;
  -webkit-text-fill-color: #ffecea !important;
  box-shadow: inset 3px 0 0 var(--ui493-danger), 0 7px 16px rgba(0, 0, 0, 0.2) !important;
}

html body #portal-root main.portal-shell :is(.warn, .warning),
html body #root main.geo-admin-shell :is(.warn, .warning, .pending) {
  border-color: rgba(228, 185, 110, 0.56) !important;
  background: #3c3021 !important;
  color: #ffe4ae !important;
  -webkit-text-fill-color: #ffe4ae !important;
}

html body #portal-root main.portal-shell :is(.good, .success, .ready),
html body #root main.geo-admin-shell :is(.good, .success, .ready) {
  border-color: rgba(139, 213, 174, 0.42) !important;
  background: #163329 !important;
  color: #b8edcf !important;
  -webkit-text-fill-color: #b8edcf !important;
}

html body #portal-root main.portal-shell :is(button:disabled, .disabled),
html body #root main.geo-admin-shell :is(button:disabled, .disabled) {
  opacity: 0.48 !important;
  transform: none !important;
  cursor: not-allowed !important;
}

html body #portal-root main.portal-shell :is(button, a, input, select, textarea):focus-visible,
html body #root main.geo-admin-shell :is(button, a, input, select, textarea):focus-visible {
  outline: 2px solid var(--ui493-signal) !important;
  outline-offset: 2px !important;
}

/* Inputs, tables and expandable details */
html body #portal-root main.portal-shell :is(input, select, textarea),
html body #root main.geo-admin-shell :is(input, select, textarea) {
  box-sizing: border-box !important;
  min-width: 0 !important;
  max-width: 100% !important;
  border: 1px solid var(--ui493-line) !important;
  border-radius: 6px !important;
  background: #08151d !important;
  color: var(--ui493-text) !important;
  -webkit-text-fill-color: var(--ui493-text) !important;
}

html body #portal-root main.portal-shell :is(input, select, textarea):focus,
html body #root main.geo-admin-shell :is(input, select, textarea):focus {
  border-color: var(--ui493-signal) !important;
  box-shadow: 0 0 0 3px rgba(121, 216, 242, 0.13) !important;
  outline: 0 !important;
}

html body #portal-root main.portal-shell :is(.table-wrap, .table-scroll, .geo-table-scroll),
html body #root main.geo-admin-shell :is(.table-wrap, .table-scroll, .geo-table-scroll) {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  border: 1px solid var(--ui493-line) !important;
  border-radius: 6px !important;
  background: #08151d !important;
}

html body #portal-root main.portal-shell table,
html body #root main.geo-admin-shell table {
  width: 100% !important;
  min-width: 720px !important;
  border-collapse: collapse !important;
  background: #08151d !important;
}

html body #portal-root main.portal-shell :is(th, td),
html body #root main.geo-admin-shell :is(th, td) {
  padding: 10px 12px !important;
  border-bottom: 1px solid var(--ui493-line) !important;
  color: var(--ui493-text) !important;
  vertical-align: top !important;
}

html body #portal-root main.portal-shell th,
html body #root main.geo-admin-shell th {
  background: var(--ui493-surface-3) !important;
  color: var(--ui493-muted) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}

html body #portal-root main.portal-shell :is(details, summary),
html body #root main.geo-admin-shell :is(details, summary) {
  border-radius: 6px !important;
}

/* SVGs are signal graphics, not competing decorations. */
html body #portal-root main.portal-shell svg,
html body #root main.geo-admin-shell svg {
  color: var(--ui493-signal) !important;
}

html body #portal-root main.portal-shell svg :is(path, polyline, line, circle, rect),
html body #root main.geo-admin-shell svg :is(path, polyline, line, circle, rect) {
  vector-effect: non-scaling-stroke !important;
}

html body #portal-root main.portal-shell :is(.portal-nav button.active, .client-nav-group button.active, [role="tab"][aria-selected="true"]),
html body #root main.geo-admin-shell :is(.geo-nav-children button.active, [role="tab"][aria-selected="true"]) {
  border-color: rgba(121, 216, 242, 0.4) !important;
  background: #15303b !important;
  color: var(--ui493-text) !important;
  box-shadow: inset 3px 0 0 var(--ui493-signal) !important;
}

/* Loading and empty states remain compact and readable on the fixed canvas. */
html body #portal-root main.portal-shell :is(.empty, .empty-state, .geo-empty),
html body #root main.geo-admin-shell :is(.empty, .empty-state, .geo-empty) {
  min-height: 112px !important;
  padding: 20px !important;
  background: var(--ui493-surface) !important;
  color: var(--ui493-muted) !important;
}

html body #root main.geo-admin-shell :is(.geo-loading-state, .geo-skeleton-panel, .geo-skeleton-grid) {
  border-color: var(--ui493-line) !important;
  border-radius: var(--ui493-radius) !important;
  background: var(--ui493-surface) !important;
}

/* Root public pages use the same desktop command surface, including the
   static loading shell before the directory app mounts. */
html body #root :is(.root-shell-loading, .site-shell, .site-header, .site-main, .root-page, .page-shell) {
  box-sizing: border-box !important;
  background: var(--ui493-bg) !important;
  color: var(--ui493-text) !important;
}

html body #root :is(.root-shell-loading, .site-header, .site-main, .root-page, .page-shell) {
  width: var(--ui493-canvas) !important;
  min-width: var(--ui493-canvas) !important;
  max-width: var(--ui493-canvas) !important;
}

html body #root :is(.site-header, .root-shell-loading__nav) {
  border-color: var(--ui493-line) !important;
}

html body #root :is(.root-shell-loading__panel, .root-shell-loading__actions, .public-shell-loading__preview, .public-shell-loading__actions) {
  border-color: var(--ui493-line) !important;
  border-radius: var(--ui493-radius) !important;
  background: var(--ui493-surface) !important;
  background-image: none !important;
}

html body #root :is(.root-shell-loading__button, .public-shell-loading__button, .site-header a, .site-main a[role="button"]) {
  border-radius: 6px !important;
  background: #162833 !important;
  color: var(--ui493-text) !important;
  -webkit-text-fill-color: var(--ui493-text) !important;
}

html body #root :is(.root-shell-loading__button.primary, .public-shell-loading__button.primary) {
  background: #246d80 !important;
  color: #f5fdff !important;
  -webkit-text-fill-color: #f5fdff !important;
}

/* Account/auth pages are server-rendered and sit outside the SPA roots. */
html body :is(.wrap, .login-shell, .signup-shell, .reset-shell) {
  box-sizing: border-box !important;
  min-width: var(--ui493-canvas) !important;
  width: var(--ui493-canvas) !important;
  max-width: var(--ui493-canvas) !important;
  background: var(--ui493-bg) !important;
  color: var(--ui493-text) !important;
  font-family: var(--ui493-font) !important;
}

html body :is(.login-card, .signup-card, .reset-card, .login-link-card, .hero, .panel, .card) {
  border-color: var(--ui493-line) !important;
  border-radius: var(--ui493-radius) !important;
  background: var(--ui493-surface) !important;
  background-image: none !important;
  color: var(--ui493-text) !important;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.2) !important;
}

html body :is(.nav a, .btn, .actions a, .actions button) {
  border: 1px solid rgba(190, 224, 235, 0.26) !important;
  border-radius: 6px !important;
  background: #162833 !important;
  color: var(--ui493-text) !important;
  -webkit-text-fill-color: var(--ui493-text) !important;
}

html body :is(.btn.primary, .btn.blue, .login-submit, .signup-form button[type="submit"], .reset-card button) {
  border-color: #75c8df !important;
  background: #246d80 !important;
  color: #f5fdff !important;
  -webkit-text-fill-color: #f5fdff !important;
}

/* Account templates contain older high-specificity green locks. Match their
   specificity here so the final PC palette also applies before authentication. */
html body .wrap :is(.login-shell, .signup-shell, .reset-shell) {
  background: var(--ui493-bg) !important;
  color: var(--ui493-text) !important;
}

html body .wrap :is(.login-card, .signup-card, .reset-card, .login-link-card) {
  border-color: var(--ui493-line) !important;
  border-radius: var(--ui493-radius) !important;
  background: var(--ui493-surface) !important;
  background-image: none !important;
  color: var(--ui493-text) !important;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.2) !important;
}

html body .wrap :is(.login-qr-side, .login-form-panel, .signup-copy, .signup-form) {
  border-radius: 6px !important;
  background: var(--ui493-surface-2) !important;
  background-image: none !important;
}

html body .wrap :is(.login-proof-card, .signup-steps div) {
  border-color: var(--ui493-line) !important;
  border-radius: 6px !important;
  background: var(--ui493-surface-2) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body .wrap :is(.login-mark, .signup-mark) {
  border-radius: 6px !important;
  background: var(--ui493-signal) !important;
  color: #06131a !important;
  box-shadow: 0 0 18px rgba(121, 216, 242, 0.16) !important;
}

html body .wrap :is(.login-title, .login-tabs span, .login-region a, .login-link-card svg, .signup-copy > span, .signup-form label, .reset-card .eyebrow, .reset-card label, .reset-actions a) {
  color: var(--ui493-signal) !important;
  -webkit-text-fill-color: var(--ui493-signal) !important;
}

html body .wrap :is(.login-form, .signup-form, .reset-card) :is(input, input:-webkit-autofill) {
  border-color: var(--ui493-line) !important;
  border-radius: 6px !important;
  background: #08151d !important;
  background-image: none !important;
  color: var(--ui493-text) !important;
  -webkit-text-fill-color: var(--ui493-text) !important;
  box-shadow: 0 0 0 1000px #08151d inset !important;
}

html body .wrap :is(.login-submit, .signup-form button[type="submit"], .reset-card button) {
  min-height: 44px !important;
  height: auto !important;
  border: 1px solid #75c8df !important;
  border-radius: 6px !important;
  background: #246d80 !important;
  background-image: none !important;
  color: #f5fdff !important;
  -webkit-text-fill-color: #f5fdff !important;
  box-shadow: inset 0 -2px 0 rgba(7, 37, 48, 0.55), 0 9px 20px rgba(17, 98, 120, 0.26) !important;
}

html body .wrap :is(.login-region a, .signup-form .hint a, .signup-code-row button, .reset-actions a) {
  border: 1px solid rgba(190, 224, 235, 0.26) !important;
  border-radius: 6px !important;
  background: #162833 !important;
  color: var(--ui493-text) !important;
  -webkit-text-fill-color: var(--ui493-text) !important;
  box-shadow: none !important;
}

/* Never reintroduce a phone composition in this final layer. */
@media (max-width: 1279px) {
  html,
  body,
  html body #portal-root,
  html body #root,
  html body #portal-root main.portal-shell,
  html body #root main.geo-admin-shell {
    min-width: var(--ui493-canvas) !important;
    width: var(--ui493-canvas) !important;
    max-width: var(--ui493-canvas) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body #portal-root *,
  html body #portal-root *::before,
  html body #portal-root *::after,
  html body #root *,
  html body #root *::before,
  html body #root *::after {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
}

/* PC-only contract: every product surface keeps one desktop composition. The
   viewport may be narrower than the canvas, but the information architecture
   never changes into a mobile stack or menu. */
html body {
  min-width: var(--ui493-canvas) !important;
  width: 100% !important;
  margin: 0 !important;
  overflow-x: auto !important;
}

html body #portal-root,
html body #root {
  box-sizing: border-box !important;
  min-width: var(--ui493-canvas) !important;
}

html body #portal-root > .portal-mobile-nav,
html body #portal-root > .mobile-nav,
html body #root > .geo-mobile-nav-hint,
html body #root > .mobile-nav,
html body #root > .mobile-title,
html body #root > .menu-button,
html body #root > [data-mobile-only] {
  display: none !important;
}

/* The public site uses a separate shell from the two application shells. Keep
   its desktop rail and reading column aligned to the same canvas. */
html body #root > :is(.site-header, main, footer, .root-shell-loading) {
  box-sizing: border-box !important;
  width: var(--ui493-canvas) !important;
  min-width: var(--ui493-canvas) !important;
  max-width: var(--ui493-canvas) !important;
  margin-inline: auto !important;
}

html body #root .site-header .nav,
html body #root .site-header .desktop-nav {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

html body #portal-root main.portal-shell,
html body #root main.geo-admin-shell {
  width: var(--ui493-canvas) !important;
  min-width: var(--ui493-canvas) !important;
  max-width: var(--ui493-canvas) !important;
}

/* Do not allow legacy phone selectors to reintroduce full-width controls or
   stacked navigation after this contract layer. */
html body #portal-root :is(.mobile-nav, .portal-mobile-nav, .mobile-nav-toggle, .mobile-menu, .mobile-nav-actions, .mobile-only, [data-mobile-only]),
html body #root :is(.geo-mobile-nav-hint, .mobile-portal-link, .mobile-nav, .mobile-nav-toggle, .mobile-nav-actions, .mobile-only, .menu-button, .mobile-title, [data-mobile-only]) {
  display: none !important;
}

/* ui493 desktop polish: the overview cockpit is a two-column board. The
   previous universal three-column override left an unused rail on the right
   because its named areas still came from the original two-column layout. */
html body #portal-root main.portal-shell.section-overview.has-project .client-command-cockpit {
  grid-template-columns: minmax(0, 1.18fr) minmax(280px, 0.82fr) !important;
  grid-template-areas:
    "header header"
    "radar metrics"
    "route route"
    "next next"
    "tools tools" !important;
  gap: var(--ui493-gap) !important;
}

html body #portal-root main.portal-shell.section-overview.has-project .client-command-cockpit :is(
  .command-deck-header,
  .command-route-board,
  .command-next-action,
  .command-tools
) {
  width: 100% !important;
  max-width: none !important;
}

/* Charts remain data surfaces: remove legacy green/radial skins without
   changing their SVG geometry or the values they communicate. */
html body #portal-root main.portal-shell :is(
  .command-radar-card,
  .command-radar-stage,
  .command-radar-orb,
  .trend-stage,
  .setup-radar,
  .onboarding-radar,
  .feed-task-radar,
  .compliance-radar-card
) {
  background-color: var(--ui493-surface-2) !important;
  background-image: none !important;
  border-color: var(--ui493-line) !important;
}

html body #portal-root main.portal-shell :is(
  .command-radar-orb,
  .command-radar-orb::before,
  .command-radar-orb::after,
  .trend-stage::before,
  .trend-scanline,
  .trend-orb,
  .trend-pulse
) {
  border-color: rgba(121, 216, 242, 0.42) !important;
  background-color: rgba(121, 216, 242, 0.08) !important;
  box-shadow: none !important;
}

/* Final visible button language: quiet controls, one clear primary signal,
   and readable text on every state. */
html body #portal-root main.portal-shell :is(button, a[role="button"]),
html body #root main.geo-admin-shell :is(button, a[role="button"]) {
  min-height: 38px !important;
  border-radius: 6px !important;
  border-color: rgba(190, 224, 235, 0.28) !important;
  background: #142a35 !important;
  color: var(--ui493-text) !important;
  -webkit-text-fill-color: var(--ui493-text) !important;
  text-shadow: none !important;
}

html body #portal-root main.portal-shell :is(button:hover, button:focus-visible, a[role="button"]:hover, a[role="button"]:focus-visible),
html body #root main.geo-admin-shell :is(button:hover, button:focus-visible, a[role="button"]:hover, a[role="button"]:focus-visible) {
  border-color: var(--ui493-line-strong) !important;
  background: #1b3d4a !important;
  outline: none !important;
}

html body #portal-root main.portal-shell :is(button.primary, button.cockpit-launch-action, .cockpit-launch-action),
html body #root main.geo-admin-shell :is(button.primary, button.cockpit-launch-action, .cockpit-launch-action) {
  border-color: #75c8df !important;
  background: #246d80 !important;
  color: #f5fdff !important;
  -webkit-text-fill-color: #f5fdff !important;
}

html body #portal-root main.portal-shell :is(button[disabled], a[aria-disabled="true"]),
html body #root main.geo-admin-shell :is(button[disabled], a[aria-disabled="true"]) {
  opacity: 0.52 !important;
  cursor: not-allowed !important;
}

/* Keep the final override accessible when the browser requests reduced
   motion, including styles introduced by this last polish pass. */
@media (prefers-reduced-motion: reduce) {
  html body #portal-root *,
  html body #portal-root *::before,
  html body #portal-root *::after,
  html body #root *,
  html body #root *::before,
  html body #root *::after {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
}