:root {
  color-scheme: light;
  --bg: #edf2f6;
  --surface: #ffffff;
  --surface-soft: #f4f7fa;
  --surface-muted: #e6edf4;
  --line: #dce4ec;
  --line-strong: #ccd7e2;
  --line-soft: #e8edf2;
  --text: #172436;
  --muted: #69788a;
  --accent: #2f6fe4;
  --accent-soft: #e4eefc;
  --chrome: #7891aa;
  --chrome-strong: #667f99;
  --navigation-surface: #eaf1f7;
  --navigation-hover: #dde8f1;
  --success: #2f9e61;
  --warning: #d9822b;
  --danger: #d94a4a;
  --info: #4b7bec;
  --font-xs: 12px;
  --font-sm: 13px;
  --font-md: 14px;
  --font-lg: 16px;
  --cell-empty: #fafbfc;
  --cell-road: #dfe3e9;
  --cell-place: #f8e1a6;
  --cell-blocked: #334155;
  --place-residential: #d9f2df;
  --place-office: #dbeafe;
  --place-commercial: #fde7b8;
  --place-school: #fef3c7;
  --place-hospital: #fde2e2;
  --place-metro-station: #cffafe;
  --place-hotel: #fce7f3;
  --place-transport-hub: #e2e8f0;
  --place-ops-center: #e9d5ff;
  --service-area: #14b8a6;
  --ops-center: #a855f7;
  --route: #ef4444;
  --road-node: #1d4ed8;
}

/* v041.2.15: refined public demo shell, access gate and release history */
.platform-login-shell {
  display: grid;
  min-height: 100dvh;
  place-items: center;
  padding: 24px;
  background: #dfe8f1;
}

.platform-login-panel {
  width: min(420px, 100%);
  padding: 34px 36px 30px;
  border: 1px solid rgba(100, 126, 151, 0.28);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: 0 16px 42px rgba(58, 78, 99, 0.12);
}

.platform-login-brand {
  display: grid;
  gap: 6px;
  margin-bottom: 28px;
}

.platform-login-kicker {
  color: var(--accent);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
}

.platform-login-brand h1 {
  margin: 0;
  color: var(--text);
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.35;
}

.platform-login-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.platform-login-form .ant-input,
.platform-login-form .ant-btn {
  height: 36px;
  border-radius: 6px;
}

.platform-login-form .ant-btn {
  min-width: 72px;
}

.platform-login-feedback {
  min-height: 28px;
  padding-top: 8px;
  color: transparent;
  font-size: var(--font-xs);
  line-height: 20px;
}

.platform-login-feedback.visible {
  color: var(--danger);
}

.ops-shell,
.ops-main-layout {
  background: var(--bg);
}

.ops-sider {
  border-right-color: #d5e0ea;
  background: var(--navigation-surface) !important;
  box-shadow: 1px 0 0 rgba(52, 75, 98, 0.035);
}

.brand-bar {
  border-bottom-color: #d8e3ed;
  background: rgba(255, 255, 255, 0.5);
}

.brand-title-button.ant-btn {
  color: #1f3449;
}

.ops-menu.ant-menu {
  color: #2c4055;
  background: var(--navigation-surface);
}

.ops-menu .ant-menu-item:hover,
.ops-menu .ant-menu-submenu-title:hover {
  color: #172f47 !important;
  background: var(--navigation-hover) !important;
}

.ops-menu .ant-menu-item-selected {
  color: #205fc5 !important;
  background: #d8e7f7 !important;
  box-shadow: inset 3px 0 0 var(--accent);
}

.top-strip {
  position: relative;
  border-bottom-color: rgba(255, 255, 255, 0.18);
  color: #ffffff;
  background: var(--chrome);
}

.top-strip-title .ant-typography:first-child,
.top-strip-title .ant-typography-secondary {
  color: #ffffff;
}

.top-strip-title .ant-typography-secondary {
  opacity: 0.78;
}

.top-strip-tools {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}

.top-strip-metrics .ant-tag,
.top-strip-metrics .ant-tag-success {
  color: rgba(255, 255, 255, 0.9);
}

.top-strip-metrics .ant-tag-success::before {
  background: #8ee0b4;
}

.top-strip-metrics .ant-btn,
.platform-utilities .ant-btn {
  border-color: rgba(255, 255, 255, 0.36);
  color: #ffffff;
  background: rgba(255, 255, 255, 0.08);
  box-shadow: none;
}

.top-strip-metrics .ant-btn:hover,
.platform-utilities .ant-btn:hover {
  border-color: rgba(255, 255, 255, 0.68);
  color: #ffffff;
  background: rgba(255, 255, 255, 0.16);
}

.platform-utilities {
  display: flex;
  flex: none;
  align-items: center;
  gap: 4px;
  padding-left: 10px;
  border-left: 1px solid rgba(255, 255, 255, 0.24);
}

.platform-current-user {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 28px;
  padding: 0 8px;
  border: 1px solid rgba(255, 255, 255, 0.32);
  border-radius: 6px;
  color: #ffffff;
  background: rgba(255, 255, 255, 0.12);
  font-size: var(--font-xs);
  font-weight: 600;
}

.release-history-panel {
  position: absolute;
  z-index: 80;
  top: 44px;
  right: 12px;
  display: flex;
  width: min(360px, calc(100vw - 24px));
  max-height: min(560px, calc(100dvh - 68px));
  flex-direction: column;
  border: 1px solid #cdd8e3;
  border-radius: 8px;
  color: var(--text);
  background: var(--surface);
  box-shadow: 0 18px 48px rgba(41, 60, 80, 0.18);
}

.project-readme-panel {
  position: absolute;
  z-index: 81;
  top: 44px;
  right: 12px;
  display: flex;
  width: min(520px, calc(100vw - 24px));
  max-height: min(640px, calc(100dvh - 88px));
  flex-direction: column;
  border: 1px solid #cdd8e3;
  border-radius: 8px;
  color: var(--text);
  background: var(--surface);
  box-shadow: 0 18px 48px rgba(41, 60, 80, 0.18);
  animation: project-readme-enter 160ms ease-out;
}

@keyframes project-readme-enter {
  from { opacity: 0; transform: translateX(16px); }
  to { opacity: 1; transform: translateX(0); }
}

.project-readme-scroll {
  min-height: 0;
  padding: 12px 18px 20px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.project-readme-scroll h2,
.project-readme-scroll h3,
.project-readme-scroll h4 {
  margin: 18px 0 7px;
  color: #263d53;
  letter-spacing: 0;
  line-height: 1.4;
}

.project-readme-scroll h2:first-child { margin-top: 0; }
.project-readme-scroll h2 { font-size: var(--font-md); font-weight: 600; }
.project-readme-scroll h3,
.project-readme-scroll h4 { font-size: var(--font-sm); font-weight: 600; }
.project-readme-scroll p,
.project-readme-scroll li,
.project-readme-scroll blockquote,
.project-readme-scroll td,
.project-readme-scroll th { font-size: var(--font-xs); line-height: 1.65; }
.project-readme-scroll p { margin: 7px 0; color: #485d70; }
.project-readme-scroll ul,
.project-readme-scroll ol { margin: 7px 0; padding-left: 20px; color: #485d70; }
.project-readme-scroll blockquote { margin: 8px 0; padding: 7px 10px; border-left: 2px solid #91a7ba; color: #526a7d; background: var(--surface-soft); }
.project-readme-table-wrap { margin: 10px 0; overflow-x: auto; }
.project-readme-table-wrap table { width: 100%; border-collapse: collapse; }
.project-readme-table-wrap th,
.project-readme-table-wrap td { padding: 7px 8px; border-bottom: 1px solid var(--line-soft); text-align: left; vertical-align: top; }
.project-readme-table-wrap th { color: #364d62; background: var(--surface-soft); font-weight: 600; }
.project-readme-diagram { margin: 10px 0 14px; padding: 10px; overflow-x: auto; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #fbfcfe; }
.project-readme-diagram svg { display: block; max-height: 420px; }
.project-readme-diagram-nodes rect { fill: #ffffff; stroke: #b9c8d6; stroke-width: 1; }
.project-readme-diagram-nodes text { fill: #344b61; font-size: 12px; font-weight: 500; letter-spacing: 0; }
.project-readme-diagram-edges path { fill: none; stroke: #8da1b3; stroke-width: 1.25; }
.project-readme-diagram-edges path[data-dashed="true"] { stroke-dasharray: 5 4; }
.project-readme-diagram marker path { fill: #8da1b3; }
.project-readme-code { margin: 0 0 10px; padding: 9px 10px; overflow: auto; color: #526376; background: var(--surface-soft); font: 11px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; }
.project-readme-state { padding: 48px 0; color: var(--muted); text-align: center; font-size: var(--font-xs); }

.release-history-header {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 48px;
  padding: 8px 10px 8px 14px;
  border-bottom: 1px solid var(--line);
}

.release-history-header > div {
  display: grid;
  gap: 1px;
}

.release-history-header strong {
  font-size: var(--font-sm);
  font-weight: 600;
}

.release-history-header span {
  color: var(--muted);
  font-size: 11px;
}

.release-history-header .ant-btn {
  width: 28px;
  min-width: 28px;
  height: 28px;
  padding: 0;
  color: var(--muted);
  font-size: 18px;
}

.release-history-scroll {
  min-height: 0;
  padding: 0 14px 10px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.release-history-item {
  position: relative;
  padding: 12px 0 12px 14px;
  border-bottom: 1px solid var(--line-soft);
}

.release-history-item::before {
  position: absolute;
  top: 18px;
  left: 0;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #9aaabd;
  content: "";
}

.release-history-item.current::before {
  background: var(--accent);
}

.release-history-item-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.release-history-item-heading strong {
  color: #2a3f55;
  font-size: var(--font-xs);
  font-weight: 600;
}

.release-history-item-heading span {
  color: var(--accent);
  font-size: 11px;
}

.release-history-item p {
  margin: 4px 0 0;
  color: #526376;
  font-size: var(--font-xs);
  line-height: 1.55;
}

.release-history-item small {
  display: -webkit-box;
  margin-top: 3px;
  overflow: hidden;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.5;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.release-history-item ul {
  margin: 7px 0 0;
  padding-left: 14px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.55;
}

.workspace-bar {
  border-bottom-color: #dbe4ed;
  background: #f4f7fa;
}

.workspace-tab {
  color: #596a7d;
}

.workspace-tab:focus-visible {
  outline: 2px solid rgba(47, 111, 228, 0.32);
  outline-offset: -2px;
}

.workbench,
.workbench.detail-collapsed {
  background: var(--bg);
}

.work-content,
.record-page-new,
.map-page-new,
.detail-rail,
.detail-panel-new,
.event-log-section {
  background: var(--surface);
}

.detail-rail {
  border-left-color: #d8e2ec;
}

.record-page-new .ant-table-thead > tr > th {
  color: #435469;
  background: #f4f7fa !important;
}

.record-page-new .ant-table-tbody > tr:hover > td {
  background: #f5f8fb !important;
}

.record-page-new .ant-table-tbody > tr.active-table-row > td,
.record-page-new .ant-table-tbody > tr.active-table-row:hover > td {
  background: #e7f0fc !important;
}

.module-footer {
  background: #f7f9fb;
}

@media (max-width: 1240px) {
  .top-strip-tools {
    gap: 6px;
  }

  .platform-utilities {
    padding-left: 6px;
  }
}

@media (max-width: 767px) {
  .platform-login-shell {
    padding: 16px;
  }

  .platform-login-panel {
    padding: 28px 22px 24px;
  }

  .platform-login-form {
    grid-template-columns: minmax(0, 1fr) 64px;
  }

  .top-strip-title {
    flex: 0 0 104px;
  }

  .top-strip-title .ant-typography {
    max-width: 104px;
  }

  .top-strip-tools {
    flex: 1 1 auto;
    justify-content: flex-start;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .top-strip-tools::-webkit-scrollbar {
    display: none;
  }

  .top-strip-metrics {
    flex: none;
  }

  .platform-utilities {
    flex: none;
  }

  .release-history-panel {
    position: fixed;
    top: 58px;
    right: 10px;
    left: 10px;
    width: auto;
    max-height: calc(100dvh - 76px);
  }
}

/* v049.4.0 unified map controls and desktop-only spatial planning */
.map-floating-actions {
  top: 12px;
  right: auto !important;
  bottom: auto;
  left: 12px;
}

.map-navigation-actions {
  position: absolute;
  z-index: 4;
  right: 12px;
  bottom: 12px;
  display: inline-flex;
  overflow: hidden;
  border: 1px solid rgba(201, 214, 226, 0.9);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 4px 14px rgba(39, 61, 82, 0.08);
}

.map-navigation-actions .ant-btn {
  width: 34px;
  min-width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  border-left: 1px solid rgba(218, 226, 233, 0.8);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.map-navigation-actions .ant-btn:first-child { border-left: 0; }
.spatial-plan-trigger { top: 54px; right: auto; left: 12px; }

@media (min-width: 768px) {
  .console-workbench:not(.detail-collapsed) .map-floating-actions,
  .console-workbench.detail-collapsed .map-floating-actions { right: auto !important; }
  .console-workbench:not(.detail-collapsed) .map-navigation-actions { right: 340px !important; }
  .console-workbench.detail-collapsed .map-navigation-actions { right: 52px !important; }
}

@media (max-width: 767px) {
  .spatial-plan-trigger,
  .spatial-plan-editor { display: none !important; }
  .map-floating-actions { top: 8px; left: 8px; }
  .map-navigation-actions { right: 8px; bottom: 8px; }
  .geospatial-map-attribution {
    right: 124px;
    bottom: 8px;
    max-width: calc(100% - 140px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

/* Public visitor analytics: a dedicated lightweight surface, separate from business workbench pages. */
.visitor-password-form {
  display: grid;
  gap: 10px;
}

.visitor-password-form label {
  color: var(--text-soft);
  font-size: var(--font-xs);
  font-weight: 600;
}

.visitor-password-form .ant-btn {
  width: 100%;
  margin-top: 2px;
}

.visitor-password-feedback {
  min-height: 18px;
  color: var(--muted);
  font-size: var(--font-xs);
}

.visitor-password-feedback.visible { color: #b65050; }

.visitor-records-shell {
  position: fixed;
  inset: var(--app-viewport-offset-top) auto auto var(--app-viewport-offset-left);
  width: var(--app-viewport-width);
  height: var(--app-viewport-height);
  overflow: auto;
  background: var(--canvas);
  color: var(--text);
}

.visitor-records-panel {
  width: min(860px, calc(100% - 40px));
  margin: 0 auto;
  padding: 28px 0 48px;
}

.visitor-records-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.visitor-records-header h1 {
  margin: 0 0 5px;
  font-size: 22px;
  font-weight: 600;
}

.visitor-records-header p {
  margin: 0;
  color: var(--muted);
  font-size: var(--font-xs);
}

.visitor-records-period {
  display: flex;
  gap: 18px;
  padding: 14px 0 10px;
  border-bottom: 1px solid var(--line-soft);
}

.visitor-records-period button {
  padding: 3px 0;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: var(--font-xs);
  cursor: pointer;
}

.visitor-records-period button.is-active {
  border-bottom-color: var(--accent);
  color: var(--accent);
  font-weight: 600;
}

.visitor-records-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 14px;
  border-block: 1px solid var(--line-soft);
}

.visitor-records-summary > div {
  display: grid;
  gap: 6px;
  padding: 13px 14px;
  border-right: 1px solid var(--line-soft);
}

.visitor-records-summary > div:last-child { border-right: 0; }
.visitor-records-summary span { color: var(--muted); font-size: var(--font-xs); }
.visitor-records-summary strong { font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums; }

.visitor-records-list { display: grid; }
.visitor-records-list article {
  display: grid;
  grid-template-columns: minmax(180px, .7fr) minmax(0, 1.3fr);
  gap: 22px;
  padding: 15px 2px;
  border-bottom: 1px solid var(--line-soft);
}
.visitor-records-list article > div { display: grid; align-content: start; gap: 4px; }
.visitor-records-list article > div strong { font-size: var(--font-sm); font-weight: 600; }
.visitor-records-list article > div span { color: var(--muted); font-size: var(--font-xs); }
.visitor-records-list dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 18px; margin: 0; }
.visitor-records-list dl > div { display: flex; justify-content: space-between; gap: 10px; }
.visitor-records-list dt { color: var(--muted); font-size: var(--font-xs); }
.visitor-records-list dd { margin: 0; font-size: var(--font-xs); text-align: right; overflow-wrap: anywhere; }
.visitor-records-empty,
.visitor-records-message { padding: 48px 0; color: var(--muted); font-size: var(--font-sm); text-align: center; }
.visitor-records-message { display: grid; justify-items: center; gap: 8px; }
.visitor-records-message strong { color: var(--text); }

@media (max-width: 767px) {
  .viewport-stable-dialog .ant-modal {
    width: min(360px, calc(var(--app-viewport-width) - 32px)) !important;
    max-width: calc(var(--app-viewport-width) - 32px);
    padding-bottom: 0;
  }

  .viewport-stable-dialog .ant-modal-content {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  .viewport-stable-dialog .ant-input,
  .viewport-stable-dialog .ant-input-affix-wrapper > input.ant-input {
    font-size: 16px;
    touch-action: manipulation;
  }

  .visitor-records-panel { width: calc(100% - 28px); padding: max(18px, env(safe-area-inset-top)) 0 32px; }
  .visitor-records-header h1 { font-size: 20px; }
  .visitor-records-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .visitor-records-summary > div:nth-child(2n) { border-right: 0; }
  .visitor-records-summary > div:nth-child(-n + 2) { border-bottom: 1px solid var(--line-soft); }
  .visitor-records-list article { grid-template-columns: 1fr; gap: 10px; }
  .visitor-records-list dl { grid-template-columns: 1fr; }
}

/* v045 经营模型与数据分析页面共享同一分析画布。 */
.record-page-new.analytical-workspace {
  min-width: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  padding-bottom: clamp(36px, 7vh, 72px);
  background: var(--surface);
}

.analytical-workspace > * {
  flex: 0 0 auto;
  min-width: 0;
}

.operating-model-panel {
  display: grid;
  gap: 18px;
  padding: 18px;
}

.operating-model-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line-soft);
}

.analysis-eyebrow {
  color: var(--muted);
  font-size: var(--font-xs);
}

.operating-model-header h2,
.operating-model-relations h3 {
  margin: 4px 0 6px;
  color: var(--text);
  font-size: 20px;
  font-weight: 600;
}

.operating-model-header p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-size: var(--font-sm);
  line-height: 1.65;
}

.operating-model-version {
  display: grid;
  flex: 0 0 auto;
  gap: 3px;
  text-align: right;
}

.operating-model-version span { color: #237a57; font-size: var(--font-sm); font-weight: 600; }
.operating-model-version small { color: var(--muted); font-size: var(--font-xs); }

.operating-model-domain-grid {
  display: grid;
  grid-template-columns: repeat(13, minmax(18px, auto));
  align-items: stretch;
  gap: 6px;
  overflow-x: auto;
  padding-bottom: 4px;
}

.operating-model-domain {
  width: min(210px, 18vw);
  min-width: 168px;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fbfcfe;
}

.operating-model-domain-index { color: #7b8ea5; font-size: 11px; font-variant-numeric: tabular-nums; }
.operating-model-domain h3 { margin: 5px 0; color: var(--text); font-size: 15px; font-weight: 600; }
.operating-model-domain > p { min-height: 40px; margin: 0 0 9px; color: #566578; font-size: var(--font-xs); line-height: 1.55; }
.operating-model-domain dl { display: grid; gap: 7px; margin: 0; }
.operating-model-domain dl > div { display: grid; gap: 2px; padding-top: 6px; border-top: 1px solid var(--line-soft); }
.operating-model-domain dt { color: var(--muted); font-size: 11px; }
.operating-model-domain dd { margin: 0; color: var(--text); font-size: var(--font-xs); line-height: 1.5; }
.operating-model-arrow { align-self: center; color: #91a0b2; font-size: 15px; }

.operating-model-relations {
  display: grid;
  grid-template-columns: minmax(180px, 0.28fr) minmax(0, 1fr);
  gap: 28px;
  padding-top: 4px;
}

.operating-model-relations h3 { font-size: 16px; }
.operating-model-relation-list { display: grid; grid-template-columns: repeat(2, minmax(230px, 1fr)); gap: 0 18px; }
.operating-model-relation-list > div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--line-soft); }
.operating-model-relation-list strong { color: var(--text); font-size: var(--font-xs); font-weight: 600; }
.operating-model-relation-list span { color: var(--muted); font-size: var(--font-xs); line-height: 1.5; }

@media (max-width: 767px) {
  .record-page-new.analytical-workspace { padding-bottom: max(48px, env(safe-area-inset-bottom)); }
  .analytical-workspace .list-action-bar,
  .analytical-workspace .metric-period-actions { flex-wrap: wrap; align-items: stretch; height: auto; }
  .analytical-workspace .metric-period-actions .metric-data-pool-state { flex-basis: 100%; white-space: normal; }
  .analytical-workspace .module-footer { flex-wrap: wrap; gap: 4px 12px; height: auto; white-space: normal; }
  .analytical-workspace .metric-card-grid,
  .analytical-workspace .analysis-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .analytical-workspace .metric-summary-card span,
  .analytical-workspace .analysis-summary-card span { overflow: visible; text-overflow: clip; white-space: normal; }
  .operating-model-panel { gap: 14px; padding: 12px; }
  .operating-model-header { display: grid; gap: 10px; }
  .operating-model-version { text-align: left; }
  .operating-model-domain-grid { grid-template-columns: 1fr; overflow: visible; }
  .operating-model-domain { width: auto; min-width: 0; }
  .operating-model-domain > p { min-height: 0; }
  .operating-model-arrow { justify-self: center; transform: rotate(90deg); }
  .operating-model-relations { grid-template-columns: 1fr; gap: 4px; }
  .operating-model-relation-list { grid-template-columns: 1fr; }
  .operating-model-relation-list > div { grid-template-columns: 105px minmax(0, 1fr); }
}

/* v042.0 multi-zone operational map scene */
.map-page-new {
  display: block;
  position: relative;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  background: var(--surface-soft);
}

.map-stage {
  position: absolute;
  inset: 0;
  padding: 0;
  overflow: hidden;
  background: #eef3f6;
}

.zone-canvas-new {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0;
  background: #eef3f6;
  box-shadow: none;
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.zone-canvas-new:active {
  cursor: grabbing;
}

.map-ground {
  fill: #f7f9fb;
}

.map-grid {
  pointer-events: none;
  opacity: 0.72;
}

.map-grid-line {
  fill: none;
  stroke: #e5ebf0;
  stroke-width: 0.045;
}

.map-zone-fill {
  fill: rgba(177, 211, 194, 0.2);
  pointer-events: none;
}

.map-zone-object[data-planned="true"] .map-zone-fill {
  fill: rgba(222, 204, 154, 0.18);
}

.map-zone-boundary {
  fill: transparent;
  stroke: #6f9f88;
  stroke-width: 0.18;
  vector-effect: non-scaling-stroke;
  cursor: pointer;
}

.map-zone-object[data-planned="true"] .map-zone-boundary {
  stroke: #b49a61;
  stroke-dasharray: 0.8 0.5;
}

.map-zone-boundary[data-active="true"] {
  stroke: var(--accent);
  stroke-width: 0.32;
}

.map-zone-label,
.map-zone-status,
.map-place-label,
.map-service-area-label,
.map-road-label {
  pointer-events: none;
  paint-order: stroke;
  stroke: rgba(247, 249, 251, 0.96);
  stroke-width: 0.24;
  stroke-linejoin: round;
  letter-spacing: 0;
}

.map-zone-label {
  fill: #284638;
  font-size: 1.25px;
  font-weight: 600;
}

.map-zone-status {
  fill: #6f7e75;
  font-size: 0.72px;
}

.map-place-object rect {
  fill: rgba(221, 232, 226, 0.88);
  stroke: rgba(105, 139, 121, 0.4);
  stroke-width: 0.12;
  vector-effect: non-scaling-stroke;
  cursor: pointer;
}

.map-place-residential rect { fill: rgba(207, 235, 216, 0.92); }
.map-place-office rect { fill: rgba(211, 226, 243, 0.92); }
.map-place-commercial rect { fill: rgba(247, 226, 183, 0.92); }
.map-place-hospital rect { fill: rgba(242, 213, 216, 0.92); }
.map-place-metro-station rect,
.map-place-transport-hub rect { fill: rgba(198, 231, 231, 0.92); }
.map-place-hotel rect { fill: rgba(235, 218, 232, 0.92); }
.map-place-ops-center rect { fill: rgba(221, 217, 235, 0.92); }

.map-place-object[data-planned="true"] rect {
  opacity: 0.68;
  stroke-dasharray: 0.55 0.35;
}

.map-place-object rect[data-active="true"],
.service-area-cell[data-active="true"],
.ops-center-cell[data-active="true"] {
  stroke: var(--accent);
  stroke-width: 0.3;
}

.map-place-label {
  fill: #405548;
  font-size: 0.78px;
  font-weight: 550;
}

.map-road-line {
  fill: none;
  stroke: #aab8c4;
  stroke-width: 0.62;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  cursor: pointer;
}

.map-road-line[data-planned="true"] {
  stroke: #c7b991;
  stroke-dasharray: 1.2 0.7;
}

.map-road-label {
  display: none;
  fill: #657585;
  font-size: 0.56px;
}

.service-area-cell {
  fill: rgba(49, 155, 137, 0.54);
  stroke: rgba(31, 117, 103, 0.82);
  stroke-width: 0.12;
  vector-effect: non-scaling-stroke;
  cursor: pointer;
}

.map-service-area-object[data-planned="true"] .service-area-cell {
  fill: rgba(191, 163, 95, 0.38);
  stroke: #a78d55;
  stroke-dasharray: 0.45 0.3;
}

.map-service-area-label {
  display: none;
  fill: #285f58;
  font-size: 0.54px;
}

.map-selected-route {
  fill: none;
  stroke: var(--route);
  stroke-width: 0.28;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}

.map-stage[data-zoom-band="district"] .map-service-area-label,
.map-stage[data-zoom-band="detail"] .map-service-area-label,
.map-stage[data-zoom-band="detail"] .map-road-label {
  display: block;
}

.map-stage[data-zoom-band="detail"] .map-zone-label { font-size: 0.72px; }
.map-stage[data-zoom-band="detail"] .map-zone-status { font-size: 0.46px; }
.map-stage[data-zoom-band="detail"] .map-place-label { font-size: 0.5px; }

.map-floating-actions {
  inset: auto 12px 12px auto !important;
  width: max-content;
  height: auto;
  z-index: 6;
  display: flex;
  gap: 2px;
  padding: 3px;
  border: 1px solid rgba(201, 214, 226, 0.9);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 4px 14px rgba(39, 61, 82, 0.08);
  backdrop-filter: blur(8px);
}

.map-floating-actions .ant-btn {
  min-width: 28px;
  height: 28px;
  padding-inline: 8px;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.map-hover-card {
  position: absolute;
  z-index: 8;
  width: 236px;
  max-width: calc(100% - 24px);
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 8px 22px rgba(39, 61, 82, 0.13);
  pointer-events: none;
}

.map-hover-card > strong,
.map-hover-card > span {
  display: block;
}

.map-hover-card > strong {
  font-size: var(--font-sm);
  font-weight: 600;
}

.map-hover-card > span {
  margin-top: 2px;
  color: var(--muted);
  font-size: var(--font-xs);
}

.map-hover-card dl {
  display: grid;
  gap: 5px;
  margin: 8px 0 0;
}

.map-hover-card dl > div {
  display: grid;
  grid-template-columns: minmax(72px, auto) minmax(0, 1fr);
  gap: 10px;
  font-size: var(--font-xs);
}

.map-hover-card dt { color: var(--muted); }
.map-hover-card dd {
  margin: 0;
  overflow-wrap: anywhere;
  text-align: right;
}

.legend-new,
.map-network-summary {
  display: none;
}

/* v042.0.1 final operational-map ownership */
.map-grid { opacity: 0.38; }
.map-grid-line { stroke: #dfe6ec; stroke-width: 0.026; }
.map-zone-fill { fill: rgba(184, 211, 198, 0.12); }
.map-zone-object[data-planned="true"] .map-zone-fill { fill: rgba(218, 205, 172, 0.11); }
.map-zone-boundary { fill: none; stroke-width: 0.09; opacity: 0.72; pointer-events: stroke; }
.map-zone-boundary[data-active="true"] { stroke-width: 0.18; opacity: 1; }
.map-place-object rect { opacity: 0.68; stroke-width: 0.06; }

.map-road-cells {
  fill: rgba(205, 216, 225, 0.74);
  stroke: rgba(166, 181, 193, 0.58);
  stroke-width: 0.035;
  vector-effect: non-scaling-stroke;
  cursor: pointer;
}

.map-road-object[data-planned="true"] .map-road-cells {
  fill: rgba(220, 211, 187, 0.56);
  stroke: rgba(186, 168, 126, 0.66);
  stroke-dasharray: 0.35 0.24;
}

.map-anchor-label { pointer-events: none; }
.map-anchor-label circle {
  fill: rgba(255, 255, 255, 0.96);
  stroke: #75899a;
  stroke-width: 0.055;
  vector-effect: non-scaling-stroke;
}
.map-anchor-label path {
  fill: none;
  stroke: #91a1af;
  stroke-width: 0.055;
  vector-effect: non-scaling-stroke;
}
.map-anchor-label text {
  fill: #445665;
  font-size: 0.54px;
  font-weight: 400;
  letter-spacing: 0;
  paint-order: stroke;
  stroke: rgba(248, 250, 252, 0.94);
  stroke-width: 0.15;
  stroke-linejoin: round;
}
.map-zone-anchor text { fill: #334b43; font-size: 0.6px; }
.map-road-anchor,
.map-service-area-anchor { display: none; }
.map-stage[data-zoom-band="detail"] .map-road-anchor,
.map-stage[data-zoom-band="detail"] .map-service-area-anchor { display: block; }
.map-stage[data-zoom-band="detail"] .map-zone-anchor,
.map-stage[data-zoom-band="detail"] .map-place-anchor { display: none; }

.service-area-cell {
  fill: rgba(77, 155, 143, 0.42);
  stroke: rgba(52, 126, 115, 0.72);
  stroke-width: 0.055;
}
.map-selected-cell {
  fill: rgba(255, 255, 255, 0.24);
  stroke: var(--accent);
  stroke-width: 0.18;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}
.robotaxi-map-halo { fill: rgba(255, 255, 255, 0.94); stroke-width: 0.055; }
.robotaxi-map-marker {
  fill: #4c7195;
  stroke: #ffffff;
  stroke-width: 0.055;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}
.robotaxi-map-object[data-active="true"] .robotaxi-map-marker { fill: var(--accent); }
.map-hover-card {
  width: 210px;
  padding: 9px 10px;
  border-color: rgba(207, 218, 228, 0.9);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 8px 20px rgba(39, 61, 82, 0.1);
  backdrop-filter: blur(12px);
}
.map-hover-card > strong { font-size: 12px; font-weight: 500; }
.map-hover-card dl { gap: 3px; margin-top: 6px; }

@media (max-width: 560px) {
  .map-zone-anchor,
  .map-place-anchor { display: block !important; }
  .map-road-anchor,
  .map-service-area-anchor { display: none !important; }
  .map-anchor-label text { font-size: 0.46px; }
  .map-zone-anchor text { font-size: 0.5px; }
  .map-stage[data-zoom-band="detail"] .map-zone-anchor,
  .map-stage[data-zoom-band="detail"] .map-place-anchor { display: none !important; }
}

/* v049.0 unified geospatial map adapter */
.geospatial-map-shell,
.geospatial-map-canvas {
  position: absolute;
  inset: 0;
}

.geospatial-map-shell {
  overflow: hidden;
  background: #eef3f6;
}

.geospatial-map-canvas {
  font-family: var(--font-family);
}

.geospatial-map-canvas .maplibregl-canvas {
  outline: 0;
}

.geospatial-map-canvas .maplibregl-ctrl-group {
  overflow: hidden;
  border: 1px solid rgba(201, 214, 226, 0.9);
  border-radius: 6px;
  box-shadow: 0 4px 14px rgba(39, 61, 82, 0.08);
}

.geospatial-map-canvas .maplibregl-ctrl button {
  width: 30px;
  height: 30px;
}

.geospatial-map-canvas .maplibregl-ctrl-attrib {
  display: none;
}

.map-mode-switch {
  margin-right: 2px;
  background: rgba(232, 239, 245, 0.9);
}

.map-mode-switch .ant-segmented-item-label {
  min-height: 26px;
  padding-inline: 8px;
  line-height: 26px;
  font-size: var(--font-xs);
}

.geospatial-map-attribution,
.geospatial-map-status {
  position: absolute;
  z-index: 3;
  bottom: 7px;
  left: 8px;
  max-width: calc(100% - 88px);
  padding: 3px 6px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--text-tertiary);
  font-size: 10px;
  line-height: 1.3;
  backdrop-filter: blur(8px);
}

.geospatial-map-status {
  bottom: 32px;
  color: var(--text-secondary);
}

.geospatial-map-unavailable {
  position: absolute;
  inset: 50% auto auto 50%;
  display: grid;
  gap: 4px;
  width: min(300px, calc(100% - 32px));
  padding: 14px 16px;
  transform: translate(-50%, -50%);
  border: 1px solid var(--border);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.94);
  color: var(--text-secondary);
  text-align: center;
  box-shadow: 0 8px 22px rgba(39, 61, 82, 0.08);
}

.geospatial-map-unavailable strong {
  color: var(--text-primary);
}

.spatial-plan-trigger {
  position: absolute;
  z-index: 4;
  top: 52px;
  left: 12px;
  border-color: rgba(190, 204, 216, 0.9);
  background: rgba(255, 255, 255, 0.9);
  color: var(--text-secondary);
  box-shadow: 0 4px 14px rgba(39, 61, 82, 0.08);
  backdrop-filter: blur(10px);
}

.spatial-plan-edit-trigger {
  position: absolute;
  z-index: 4;
  top: 52px;
  left: 128px;
  border-color: rgba(190, 204, 216, 0.9);
  background: rgba(255, 255, 255, 0.9);
  color: var(--text-secondary);
  box-shadow: 0 4px 14px rgba(39, 61, 82, 0.08);
  backdrop-filter: blur(10px);
}

.spatial-plan-editor {
  position: absolute;
  z-index: 5;
  top: 90px;
  left: 12px;
  display: grid;
  gap: 10px;
  width: min(320px, calc(100% - 24px));
  max-height: calc(100% - 108px);
  overflow: auto;
  padding: 12px;
  border: 1px solid rgba(190, 204, 216, 0.9);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 10px 28px rgba(39, 61, 82, 0.13);
  backdrop-filter: blur(14px);
}

.spatial-plan-editor header,
.spatial-plan-editor label,
.spatial-plan-impact {
  display: grid;
  gap: 5px;
}

.spatial-plan-context {
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  border-left: 2px solid var(--accent);
  background: var(--surface-subtle);
  color: var(--text-secondary);
  font-size: var(--font-xs);
}

.spatial-plan-context strong {
  color: var(--text-primary);
  font-weight: 600;
}

.spatial-plan-reference {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 12px;
  padding: 8px 0;
  border-top: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  font-size: 12px;
}

.spatial-plan-reference strong {
  color: var(--text-primary);
  font-weight: 600;
}

.spatial-plan-source-units {
  align-items: flex-start;
}

.spatial-plan-source-unit-list {
  display: grid;
  width: 100%;
  max-height: 112px;
  overflow: auto;
  border: 1px solid var(--border-subtle);
  border-radius: 4px;
  background: var(--surface-subtle);
}

.spatial-plan-source-unit {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px;
  align-items: center;
  min-height: 28px;
  padding-left: 8px;
  border-bottom: 1px solid var(--border-subtle);
}

.spatial-plan-source-unit:last-child {
  border-bottom: 0;
}

.spatial-plan-source-unit > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.spatial-plan-editor header {
  grid-template-columns: 1fr auto;
  align-items: center;
}

.spatial-plan-editor label > span,
.spatial-plan-impact span,
.spatial-plan-notice {
  color: var(--text-secondary);
  font-size: var(--font-xs);
}

.spatial-plan-editor .ant-select,
.spatial-plan-editor .ant-input {
  width: 100%;
}

.spatial-plan-editor-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
  gap: 6px;
}

.spatial-plan-action-feedback {
  min-height: 32px;
  padding: 7px 9px;
  border: 1px solid color-mix(in srgb, var(--success) 28%, var(--border-subtle));
  border-radius: 4px;
  background: color-mix(in srgb, var(--success) 7%, var(--surface));
  color: var(--text-primary);
  font-size: var(--font-xs);
  line-height: 1.45;
}

.spatial-plan-action-feedback.error {
  border-color: color-mix(in srgb, var(--danger) 30%, var(--border-subtle));
  background: color-mix(in srgb, var(--danger) 6%, var(--surface));
  color: var(--danger);
}

.spatial-plan-history-actions {
  display: flex;
  justify-content: flex-end;
  gap: 2px;
}

.spatial-plan-object-management {
  display: flex;
  min-height: 30px;
  align-items: center;
  justify-content: space-between;
  padding-top: 6px;
  border-top: 1px solid var(--border-subtle);
  color: var(--text-tertiary);
  font-size: var(--font-xs);
}

.spatial-plan-impact {
  padding-top: 8px;
  border-top: 1px solid var(--border);
}

.spatial-plan-notice {
  margin: 0;
  line-height: 1.5;
}

.spatial-plan-notice.error {
  color: var(--danger);
}

@media (max-width: 560px) {
  .map-floating-actions {
    align-items: center;
  }

  .map-mode-switch .ant-segmented-item-label {
    padding-inline: 6px;
  }

  .geospatial-map-attribution {
    max-width: calc(100% - 76px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .spatial-plan-trigger {
    top: 8px;
    left: 8px;
    max-width: calc(100% - 80px);
  }
}

@media (min-width: 768px) {
  .console-workbench,
  .console-workbench.detail-collapsed {
    position: relative;
    display: block;
  }

  .console-workbench > .work-content {
    position: absolute;
    inset: 0;
  }

  .console-workbench > .detail-rail {
    position: absolute;
    z-index: 5;
    top: 0;
    right: 0;
    bottom: 0;
    width: 328px;
    box-shadow: -8px 0 20px rgba(39, 61, 82, 0.045);
  }

  .console-workbench.detail-collapsed > .detail-rail {
    width: 40px;
  }

  .console-workbench:not(.detail-collapsed) .map-floating-actions {
    right: 340px !important;
  }

  .console-workbench.detail-collapsed .map-floating-actions {
    right: 52px !important;
  }
}

@media (max-width: 560px) {
  .map-floating-actions {
    inset: auto 8px 8px auto !important;
  }
}

/* v042.0.1 refined operational map language */
.map-grid {
  opacity: 0.38;
}

.map-grid-line {
  stroke: #dfe6ec;
  stroke-width: 0.026;
}

.map-zone-fill {
  fill: rgba(184, 211, 198, 0.12);
}

.map-zone-object[data-planned="true"] .map-zone-fill {
  fill: rgba(218, 205, 172, 0.11);
}

.map-zone-boundary {
  stroke-width: 0.09;
  opacity: 0.72;
}

.map-zone-boundary[data-active="true"] {
  stroke-width: 0.18;
  opacity: 1;
}

.map-place-object rect {
  opacity: 0.68;
  stroke-width: 0.06;
}

.map-road-cells {
  fill: rgba(205, 216, 225, 0.74);
  stroke: rgba(166, 181, 193, 0.58);
  stroke-width: 0.035;
  vector-effect: non-scaling-stroke;
  cursor: pointer;
}

.map-road-object[data-planned="true"] .map-road-cells {
  fill: rgba(220, 211, 187, 0.56);
  stroke: rgba(186, 168, 126, 0.66);
  stroke-dasharray: 0.35 0.24;
}

.map-anchor-label {
  pointer-events: none;
}

.map-anchor-label circle {
  fill: rgba(255, 255, 255, 0.96);
  stroke: #75899a;
  stroke-width: 0.055;
  vector-effect: non-scaling-stroke;
}

.map-anchor-label path {
  fill: none;
  stroke: #91a1af;
  stroke-width: 0.055;
  vector-effect: non-scaling-stroke;
}

.map-anchor-label text {
  fill: #445665;
  font-size: 0.54px;
  font-weight: 400;
  letter-spacing: 0;
  paint-order: stroke;
  stroke: rgba(248, 250, 252, 0.94);
  stroke-width: 0.15;
  stroke-linejoin: round;
}

.map-zone-anchor text {
  fill: #334b43;
  font-size: 0.6px;
}

.map-road-anchor,
.map-service-area-anchor {
  display: none;
}

.map-stage[data-zoom-band="detail"] .map-road-anchor,
.map-stage[data-zoom-band="detail"] .map-service-area-anchor {
  display: block;
}

.map-stage[data-zoom-band="detail"] .map-zone-anchor,
.map-stage[data-zoom-band="detail"] .map-place-anchor {
  display: none;
}

.service-area-cell {
  fill: rgba(77, 155, 143, 0.42);
  stroke: rgba(52, 126, 115, 0.72);
  stroke-width: 0.055;
}

.map-selected-cell {
  fill: rgba(255, 255, 255, 0.24);
  stroke: var(--accent);
  stroke-width: 0.18;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}

.robotaxi-map-halo {
  fill: rgba(255, 255, 255, 0.94);
  stroke-width: 0.055;
}

.robotaxi-map-marker {
  fill: #4c7195;
  stroke: #ffffff;
  stroke-width: 0.055;
  vector-effect: non-scaling-stroke;
  pointer-events: none;
}

.robotaxi-map-object[data-active="true"] .robotaxi-map-marker {
  fill: var(--accent);
}

.map-hover-card {
  width: 210px;
  padding: 9px 10px;
  border-color: rgba(207, 218, 228, 0.9);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 8px 20px rgba(39, 61, 82, 0.1);
  backdrop-filter: blur(12px);
}

.map-hover-card > strong {
  font-size: 12px;
  font-weight: 500;
}

.map-hover-card dl {
  gap: 3px;
  margin-top: 6px;
}

@media (max-width: 560px) {
  .map-anchor-label {
    display: none !important;
  }
}

@media (max-width: 560px) {
  .map-zone-label,
  .map-zone-status,
  .map-place-label,
  .map-service-area-label,
  .map-road-label,
  .robotaxi-map-label {
    display: none !important;
  }

  .map-floating-actions {
    top: 10px;
    right: 8px;
  }

}

@media (max-width: 767px) {
  .map-floating-actions {
    top: 8px;
    right: 8px;
  }

  .map-hover-card {
    display: none;
  }
}

/* v041.3 Autonomous Mobility OS visual foundation */
:root {
  --bg: #f1f5f9;
  --surface: #ffffff;
  --surface-soft: #f6f8fb;
  --surface-muted: #edf2f7;
  --line: #dce4ec;
  --line-strong: #cbd7e3;
  --line-soft: #e8edf3;
  --text: #1e2d3d;
  --muted: #6b7c8e;
  --accent: #2f6fe4;
  --accent-soft: #e7f0fd;
  --chrome: #f4f7fa;
  --chrome-strong: #e8eef4;
  --navigation-surface: #f8fafc;
  --navigation-hover: #edf2f7;
}

.ops-shell {
  display: flex;
  height: 100vh;
  flex-direction: column;
  background: var(--bg);
}

.global-system-bar {
  position: relative;
  z-index: 40;
  display: flex;
  flex: 0 0 52px;
  width: 100%;
  height: 52px;
  border-bottom: 1px solid var(--line);
  color: var(--text);
  background: var(--chrome);
}

.system-brand {
  display: flex;
  width: 200px;
  min-width: 200px;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 0 8px 0 14px;
  transition: width 180ms ease, min-width 180ms ease;
}

.system-brand.collapsed {
  width: 60px;
  min-width: 60px;
  padding-inline: 8px;
}

.system-brand .brand-title-button.ant-btn {
  min-width: 0;
  padding: 0;
  overflow: hidden;
  color: #223449;
  font-size: var(--font-md);
  font-weight: 600;
  text-overflow: clip;
  white-space: nowrap;
}

.system-brand > .ant-btn:last-child {
  width: 28px;
  min-width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  color: #6d7f91;
  background: transparent;
  box-shadow: none;
}

.system-brand > .ant-btn:last-child:hover {
  color: #27435f;
  background: rgba(255, 255, 255, 0.72);
}

.ops-workspace-shell {
  min-height: 0;
  flex: 1 1 auto;
  background: var(--bg);
}

.ops-sider {
  height: 100%;
  border-right: 1px solid var(--line);
  background: var(--navigation-surface) !important;
  box-shadow: none;
}

.ops-menu.ant-menu {
  height: 100%;
  padding: 10px 7px 14px;
  color: #2d4054;
  background: var(--navigation-surface) !important;
}

.ops-menu .ant-menu-item,
.ops-menu .ant-menu-submenu-title {
  border-radius: 6px !important;
}

.ops-menu .ant-menu-item:hover,
.ops-menu .ant-menu-submenu-title:hover {
  color: #1f3851 !important;
  background: var(--navigation-hover) !important;
}

.ops-menu .ant-menu-item-selected {
  color: #205fc5 !important;
  background: #e5eefb !important;
  box-shadow: inset 2px 0 0 var(--accent);
}

.ops-menu .ant-menu-submenu-selected > .ant-menu-submenu-title {
  color: #2b5f9e !important;
}

.top-strip {
  position: relative;
  min-width: 0;
  height: 51px;
  flex: 1 1 auto;
  padding: 0 16px 0 10px;
  border: 0;
  color: var(--text);
  background: transparent;
}

.top-strip-title .ant-typography:first-child {
  color: #23364a;
  font-size: var(--font-md);
  font-weight: 600;
}

.top-strip-title .ant-typography-secondary {
  color: #718296;
  opacity: 1;
}

.top-strip-tools .ant-tag,
.top-strip-tools .ant-btn,
.platform-user-trigger.ant-btn,
.release-history-trigger.ant-btn {
  color: #40566d;
  background: transparent;
}

.top-strip-tools .ant-btn:hover,
.platform-user-trigger.ant-btn:hover,
.release-history-trigger.ant-btn:hover {
  color: #1f3d59;
  background: rgba(255, 255, 255, 0.72);
}

.platform-utilities {
  border-left-color: #d5dee7;
}

.release-history-panel {
  top: 46px;
}

.workspace-bar {
  background: #fbfcfe;
}

.workbench,
.workbench.detail-collapsed {
  background: var(--surface);
}

.platform-login-shell {
  place-items: center;
  background: var(--chrome);
}

.platform-login-panel {
  width: min(420px, 100%);
  transform: translateY(clamp(-72px, -7vh, -40px));
}

.platform-login-brand {
  margin-bottom: 22px;
}

.platform-login-brand h1 {
  color: #223449;
  font-size: 22px;
  font-weight: 500;
}

.platform-login-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.platform-login-input,
.platform-login-submit {
  width: 100%;
  min-width: 0;
  height: 42px;
  border: 1px solid #b9c8d6;
  border-radius: 7px;
  font-size: 14px;
  line-height: 40px;
}

.platform-login-input {
  padding: 0 14px;
  background: rgba(255, 255, 255, 0.9);
}

.platform-login-submit {
  color: #294a68;
  background: #d9e5ef;
}

.platform-login-submit:hover,
.platform-login-submit:focus-visible {
  border-color: #8fa5b7;
  color: #183d5d;
  background: #cfdeea;
}

.map-page-new {
  display: grid;
  height: 100%;
  min-height: 0;
  grid-template-rows: minmax(0, 1fr) auto;
  background: #f5f8fb;
}

.map-stage {
  position: relative;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  background: #f4f7fa;
}

.zone-canvas-new {
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0;
  background: #f8fafc;
  box-shadow: none;
}

.map-network-summary {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 3;
  display: flex;
  min-height: 34px;
  align-items: center;
  gap: 10px;
  padding: 0 10px;
  border: 1px solid rgba(201, 214, 226, 0.88);
  border-radius: 7px;
  color: #5f7285;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 5px 16px rgba(39, 61, 82, 0.08);
  backdrop-filter: blur(8px);
  font-size: var(--font-xs);
}

.map-network-summary strong {
  color: #284867;
  font-size: var(--font-sm);
  font-weight: 600;
}

.map-floating-actions {
  top: 12px;
  right: 12px;
  border-color: rgba(201, 214, 226, 0.88);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 5px 16px rgba(39, 61, 82, 0.08);
}

.map-cell {
  stroke: #e7edf3;
}

.cell-empty {
  fill: #f8fafc;
}

.cell-road {
  fill: #dfe7ee;
}

.service-area-cell {
  fill: rgba(56, 162, 145, 0.54);
  stroke: #2b8779;
}

.ops-center-cell {
  fill: rgba(72, 111, 168, 0.76);
  stroke: #315b91;
}

.map-cell[data-route="true"] {
  fill: #c8dcfb;
  stroke: #2f6fe4;
}

.zone-boundary {
  stroke: #5b8de2;
}

.map-cell[data-route="true"] {
  fill: #c8dcfb;
  stroke: #2f6fe4;
}

.robotaxi-map-object {
  cursor: pointer;
  outline: none;
}

.robotaxi-map-halo {
  fill: transparent;
  stroke: #8095a8;
  stroke-width: 0.05;
  vector-effect: non-scaling-stroke;
}

.robotaxi-map-object.status-success .robotaxi-map-halo {
  stroke: var(--success);
}

.robotaxi-map-object.status-warning .robotaxi-map-halo {
  stroke: var(--warning);
}

.robotaxi-map-object.status-danger .robotaxi-map-halo {
  stroke: var(--danger);
}

.robotaxi-map-object[data-active="true"] .robotaxi-map-halo {
  fill: rgba(231, 240, 253, 0.96);
  stroke: var(--accent);
  stroke-width: 0.16;
}

.robotaxi-map-image {
  filter: drop-shadow(0 0.08px 0.1px rgba(28, 45, 61, 0.35));
  pointer-events: none;
}

.robotaxi-map-label {
  fill: #29445e;
  opacity: 0;
  stroke: rgba(255, 255, 255, 0.96);
  stroke-width: 0.1;
  paint-order: stroke;
  pointer-events: none;
  font-size: 0.42px;
  font-weight: 600;
  transition: opacity 120ms ease;
}

.robotaxi-map-object:hover .robotaxi-map-label,
.robotaxi-map-object:focus .robotaxi-map-label,
.robotaxi-map-object[data-active="true"] .robotaxi-map-label {
  opacity: 1;
}

.legend-new {
  min-height: 36px;
  padding: 8px 12px;
  border-top-color: var(--line);
  color: #6d7e8f;
  background: #fbfcfe;
}

.object-inspector-summary {
  padding: 12px 14px;
  border-bottom: 1px solid var(--line-soft);
  background: #fbfcfe;
}

.object-inspector-identity {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.object-inspector-identity > div {
  display: grid;
  gap: 3px;
}

.object-inspector-identity strong {
  color: #20364c;
  font-size: var(--font-md);
  font-weight: 600;
}

.object-inspector-identity span,
.object-inspector-facts dt {
  color: var(--muted);
  font-size: var(--font-xs);
}

.object-inspector-battery {
  color: #2f8a59 !important;
  font-size: var(--font-md) !important;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

.object-inspector-facts {
  display: grid;
  gap: 0;
  margin: 10px 0 0;
}

.object-inspector-facts > div {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr);
  gap: 8px;
  padding: 5px 0;
  border-top: 1px solid var(--line-soft);
}

.object-inspector-facts dt,
.object-inspector-facts dd {
  margin: 0;
  line-height: 1.45;
}

.object-inspector-facts dd {
  color: #2d4054;
  overflow-wrap: anywhere;
  font-size: var(--font-xs);
  font-weight: 500;
}

@media (max-width: 767px) {
  .global-system-bar {
    height: 52px;
    flex-basis: 52px;
  }

  .system-brand {
    width: 200px;
    min-width: 200px;
  }

  .system-brand.collapsed {
    width: 60px;
    min-width: 60px;
  }

  .ops-sider:not(.ant-layout-sider-collapsed) {
    top: 52px;
  }

  .platform-login-panel {
    width: min(360px, 100%);
    transform: translateY(clamp(-48px, -5vh, -24px));
  }

  .platform-login-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .map-network-summary {
    right: 104px;
    overflow: hidden;
    gap: 6px;
    white-space: nowrap;
  }

  .map-network-summary span:nth-of-type(n + 2) {
    display: none;
  }

  .robotaxi-map-label {
    display: none;
  }
}

* {
  box-sizing: border-box;
}

html,
body,
#app {
  height: 100%;
}

body {
  margin: 0;
  min-width: 1040px;
  color: var(--text);
  background: var(--bg);
  font-size: var(--font-xs);
  font-family: Inter, "SF Pro Text", "PingFang SC", "Microsoft YaHei", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: auto;
  text-rendering: auto;
}

.ops-shell {
  height: 100vh;
  overflow: hidden;
  background: var(--bg);
}

.ops-sider {
  border-right: 1px solid var(--line);
  background: var(--surface) !important;
}

.ops-sider .ant-layout-sider-children {
  display: flex;
  min-height: 0;
  height: 100%;
  flex-direction: column;
}

.brand-bar {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  height: 44px;
  padding: 0 8px 0 14px;
  border-bottom: 1px solid var(--line);
}

.brand-title-button.ant-btn {
  min-width: 0;
  padding: 0;
  overflow: hidden;
  color: #111827;
  font-size: var(--font-md);
  font-weight: 800;
  white-space: nowrap;
  text-align: left;
}

.brand-title-button.ant-btn:hover {
  color: var(--accent);
}

.ops-menu.ant-menu {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  border-inline-end: 0 !important;
  padding: 6px;
  background: var(--surface);
  font-size: var(--font-sm);
}

.ops-menu .ant-menu-item,
.ops-menu .ant-menu-submenu-title {
  height: 32px !important;
  line-height: 32px !important;
  margin: 2px 0 !important;
  border-radius: 4px !important;
}

.ops-menu .ant-menu-item-selected {
  font-weight: 700;
}

.ops-main-layout {
  min-width: 0;
  background: var(--bg);
}

.top-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 44px;
  padding: 0 10px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
  font-size: var(--font-sm);
}

.top-strip-title {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 1px;
  line-height: 1.15;
}

.top-strip-title .ant-typography {
  overflow: hidden;
  max-width: 760px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.top-strip-title .ant-typography-secondary {
  font-size: var(--font-xs);
}

.top-strip-metrics {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
}

.workspace-bar {
  display: flex;
  align-items: center;
  height: 32px;
  min-height: 32px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}

.workspace-scroll {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  min-width: 0;
  padding: 4px 8px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
  white-space: nowrap;
}

.workspace-tab {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 5px;
  max-width: 184px;
  height: 24px;
  padding: 0 8px;
  border: 1px solid #e8edf4;
  border-radius: 5px;
  color: #465568;
  background: #fbfcfe;
  font-size: var(--font-xs);
  line-height: 22px;
  cursor: pointer;
  transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

.workspace-tab span:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-tab:hover {
  border-color: #cbd8ea;
  background: #ffffff;
}

.workspace-tab.active {
  border-color: #93c5fd;
  color: var(--accent);
  background: #eff6ff;
  font-weight: 700;
  box-shadow: inset 0 -1px 0 #60a5fa;
}

.workspace-tab-close {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  border-radius: 3px;
  color: #7a8797;
  font-size: var(--font-xs);
  line-height: 1;
}

.workspace-tab-close:hover {
  color: #2563eb;
  background: #dbeafe;
}

.page-actions {
  display: flex;
  flex: none;
  align-items: center;
  gap: 6px;
}

.page-actions .ant-btn {
  height: 24px;
  padding: 0 8px;
  font-size: var(--font-xs);
}

.event-log-section {
  flex: none;
  position: relative;
  border-top: 1px solid var(--line);
  padding-top: 10px;
  overflow: hidden;
  background: var(--surface);
}

.event-log-title {
  margin-bottom: 6px;
  padding: 0 10px;
  color: #374151;
  font-size: var(--font-xs);
  font-weight: 800;
}

.event-log-resizer {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 8px;
  cursor: ns-resize;
  background: var(--surface);
}

.event-log-resizer::after {
  position: absolute;
  top: 3px;
  left: 50%;
  width: 48px;
  height: 2px;
  border-radius: 999px;
  background: #cbd5e1;
  content: "";
  transform: translateX(-50%);
}

.workbench {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 316px;
  height: calc(100vh - 76px);
  min-height: 0;
  background: var(--bg);
}

.workbench.detail-collapsed {
  grid-template-columns: minmax(0, 1fr) 42px;
}

.work-content {
  min-width: 0;
  min-height: 0;
}

.detail-rail {
  container-type: inline-size;
  min-height: 0;
  overflow: hidden;
  border-left: 1px solid var(--line);
  background: var(--surface);
}

.detail-toggle-button {
  width: 28px;
  height: 28px;
  margin: 8px 6px;
  padding: 0;
  font-size: var(--font-lg);
  line-height: 1;
}

.page-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 42px;
  padding: 7px 10px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}

.page-toolbar > div:first-child {
  min-width: 0;
}

.page-toolbar h1 {
  margin: 0 0 1px;
  font-size: var(--font-md);
  line-height: 1.15;
}

.page-toolbar .ant-typography {
  font-size: var(--font-xs);
}

.record-page-new {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--surface);
}

.map-page-new {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--surface);
}

.record-table-section {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}

.record-table-section .ant-table-wrapper {
  height: 100%;
  min-height: 0;
}

.readiness-page .ant-table-wrapper {
  flex: 1 1 0;
}

.record-page-new .ant-table {
  font-size: var(--font-xs) !important;
}

.record-page-new .ant-table-thead > tr > th {
  padding: 7px 8px !important;
  color: #405064;
  background: #f8fafc !important;
  font-size: var(--font-xs) !important;
  font-weight: 700;
}

.record-page-new .ant-table-tbody > tr > td {
  padding: 6px 8px !important;
  border-bottom-color: var(--line-soft);
  font-size: var(--font-xs) !important;
  cursor: pointer;
}

.record-page-new .ant-table-tbody > tr.active-table-row > td {
  background: #eaf2ff !important;
}

.record-page-new .ant-pagination {
  margin: 8px 10px !important;
}

.status-segment-bar {
  display: flex;
  flex: none;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 5px 10px;
  border-bottom: 1px solid var(--line-soft);
  background: var(--surface);
  overflow-x: auto;
}

.status-segment-bar .ant-btn {
  height: 24px;
  padding: 0 9px;
  font-size: var(--font-xs);
  white-space: nowrap;
}

.list-filter-bar {
  display: flex;
  flex: none;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 6px 10px;
  border-bottom: 1px solid var(--line-soft);
  background: #fbfcfe;
}

.filter-field {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 180px;
}

.filter-field.keyword-field {
  min-width: 280px;
}

.filter-field > span {
  flex: none;
  color: var(--muted);
  font-size: var(--font-xs);
  font-weight: 700;
}

.filter-field .ant-input,
.filter-field .ant-select {
  min-width: 0;
  flex: 1;
}

.list-action-bar {
  display: flex;
  flex: none;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 5px 10px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}

.list-action-bar .ant-btn {
  height: 24px;
  padding: 0 9px;
  font-size: var(--font-xs);
}

.module-footer {
  display: flex;
  flex: none;
  align-items: center;
  gap: 14px;
  min-height: 30px;
  padding: 6px 10px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  background: var(--surface);
  font-size: var(--font-xs);
  white-space: nowrap;
}

.abnormal-modal-body {
  display: grid;
  gap: 12px;
}

.abnormal-field {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}

.abnormal-field > span {
  color: var(--muted);
  font-size: var(--font-xs);
  font-weight: 700;
}

.map-floating-actions {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  border: 1px solid var(--line-soft);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08);
}

.map-floating-actions .ant-btn {
  height: 24px;
  padding: 0 8px;
  font-size: var(--font-xs);
}

.map-stage {
  position: relative;
  min-height: 0;
  padding: 2px;
  background: #fbfcfe;
}

.zone-canvas-new {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  border: 1px solid var(--line);
  background: #fbfcfe;
  cursor: grab;
  user-select: none;
}

.zone-canvas-new:active {
  cursor: grabbing;
}

.zone-boundary {
  fill: transparent;
  stroke: #2563eb;
  stroke-width: 0.08;
  pointer-events: none;
}

.zone-boundary[data-active="true"] {
  stroke-width: 0.14;
}

.map-cell {
  stroke: #edf1f6;
  stroke-width: 0.025;
  cursor: pointer;
}

.cell-empty {
  fill: var(--cell-empty);
}

.cell-road {
  fill: var(--cell-road);
}

.cell-place {
  fill: var(--cell-place);
}

.cell-place-residential {
  fill: var(--place-residential);
}

.cell-place-office {
  fill: var(--place-office);
}

.cell-place-commercial {
  fill: var(--place-commercial);
}

.cell-place-school {
  fill: var(--place-school);
}

.cell-place-hospital {
  fill: var(--place-hospital);
}

.cell-place-metro-station {
  fill: var(--place-metro-station);
}

.cell-place-hotel {
  fill: var(--place-hotel);
}

.cell-place-transport-hub {
  fill: var(--place-transport-hub);
}

.cell-place-ops-center {
  fill: var(--place-ops-center);
}

.cell-blocked {
  fill: var(--cell-blocked);
}

.map-cell:hover,
.map-cell[data-active="true"] {
  fill: #bfdbfe;
}

.map-cell[data-route="true"] {
  fill: #fecaca;
}

.service-area-cell {
  fill: rgba(20, 184, 166, 0.8);
  stroke: #0f766e;
  stroke-width: 0.04;
  pointer-events: none;
}

.service-area-cell[data-active="true"] {
  fill: #2dd4bf;
  stroke-width: 0.12;
}

.ops-center-cell {
  fill: rgba(168, 85, 247, 0.84);
  stroke: #7e22ce;
  stroke-width: 0.06;
  pointer-events: none;
}

.ops-center-cell[data-active="true"] {
  fill: #c084fc;
  stroke-width: 0.14;
}

.road-node {
  fill: #fff;
  stroke: var(--road-node);
  stroke-width: 0.12;
  pointer-events: none;
}

.road-node[data-active="true"] {
  fill: var(--accent);
  stroke: #fff;
}

.legend-new {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  min-height: 30px;
  padding: 6px 10px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  background: var(--surface);
  font-size: var(--font-xs);
}

.legend-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}

.legend-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.legend-dot.cell-empty {
  border: 1px solid #cbd5e1;
  background: var(--cell-empty);
}

.legend-dot.cell-road {
  background: var(--cell-road);
}

.legend-dot.place-residential-swatch {
  border: 1px solid #9bc7a4;
  background: var(--place-residential);
}

.legend-dot.place-office-swatch {
  border: 1px solid #93b4e6;
  background: var(--place-office);
}

.legend-dot.place-commercial-swatch {
  border: 1px solid #dfb464;
  background: var(--place-commercial);
}

.legend-dot.place-hospital-swatch {
  border: 1px solid #e7a4a4;
  background: var(--place-hospital);
}

.legend-dot.place-metro-station-swatch {
  border: 1px solid #67c8d7;
  background: var(--place-metro-station);
}

.legend-dot.place-ops-center-swatch {
  border: 1px solid #b78bf0;
  background: var(--place-ops-center);
}

.legend-dot.service-area-swatch {
  background: var(--service-area);
}

.legend-dot.ops-center-swatch {
  background: var(--ops-center);
}

.legend-dot.route-swatch {
  background: var(--route);
}

.legend-dot.road-node-swatch {
  background: var(--road-node);
}

.detail-panel-new {
  height: 100%;
  overflow: auto;
  background: var(--surface);
}

.panel-title {
  position: sticky;
  top: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  height: 38px;
  padding: 9px 10px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
  color: #111827;
  font-size: var(--font-sm);
  font-weight: 800;
}

.detail-tabs.ant-tabs {
  padding: 0;
}

.detail-tabs .ant-tabs-nav {
  margin: 0 0 4px;
}

.detail-tabs .ant-tabs-tab {
  padding: 8px 0 7px;
  font-size: var(--font-xs);
}

.detail-tabs .ant-tabs-nav { padding-inline: 14px; }

.object-inspector-content {
  min-width: 0;
  padding: 12px 14px 18px;
}

.object-inspector-tab-content { padding-top: 4px; }

.object-inspector-fields { min-width: 0; }

.cost-detail {
  display: grid;
  gap: 10px;
  padding-bottom: 12px;
}

.cost-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  padding: 4px 0 2px;
}

.cost-summary-item {
  min-width: 0;
  border: 1px solid var(--line-soft);
  border-radius: 6px;
  background: var(--surface-soft);
  padding: 8px;
}

.cost-summary-item span {
  display: block;
  color: var(--muted);
  font-size: var(--font-xs);
  line-height: 1.35;
}

.cost-summary-item strong {
  display: block;
  margin-top: 4px;
  color: var(--text);
  font-size: var(--font-xs);
  font-weight: 650;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.cost-meta-descriptions {
  padding-top: 0 !important;
  padding-bottom: 2px !important;
}

.cost-record-list {
  display: grid;
  gap: 8px;
  border-top: 1px solid var(--line-soft);
  padding-top: 8px;
}

.cost-record-group {
  display: grid;
  gap: 6px;
  border-left: 2px solid var(--line-strong);
  padding-left: 8px;
}

.cost-record-group-head,
.cost-record-line-main,
.cost-record-line-sub {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.cost-record-group-head strong,
.cost-record-line-main strong {
  color: var(--text);
  font-size: var(--font-xs);
  font-weight: 650;
  white-space: nowrap;
}

.cost-record-line {
  display: grid;
  gap: 4px;
  border-top: 1px solid var(--line-soft);
  padding-top: 6px;
}

.cost-record-line:first-of-type {
  border-top: 0;
  padding-top: 0;
}

.cost-record-line-main span,
.cost-record-line-sub span {
  min-width: 0;
  color: var(--muted);
  font-size: var(--font-xs);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.cost-record-line-main span {
  color: var(--text);
  font-weight: 500;
}

.cost-record-line-sub {
  align-items: flex-start;
}

.compact-descriptions .ant-descriptions-item {
  padding-bottom: 7px !important;
}

.compact-descriptions .ant-descriptions-item-label {
  width: 108px;
  color: var(--muted);
  font-size: var(--font-xs);
}

.compact-descriptions .ant-descriptions-item-content {
  color: var(--text);
  font-size: var(--font-xs);
  font-weight: 600;
}

.detail-value {
  overflow-wrap: break-word;
  word-break: normal;
  font-size: var(--font-xs);
}

.detail-block-list {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.compact-descriptions + .detail-block-list {
  margin-top: 8px;
}

.detail-block {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding-top: 8px;
  border-top: 1px solid var(--line-soft);
}

.detail-block:first-child {
  padding-top: 0;
  border-top: 0;
}

.detail-block-label {
  color: var(--muted);
  font-size: var(--font-xs);
  font-weight: 600;
}

.detail-block-content {
  min-width: 0;
}

.structured-detail {
  width: 100%;
  min-width: 0;
  border-radius: 6px;
  background: var(--surface-soft);
  font-size: var(--font-xs);
  font-weight: 400;
}

.structured-detail > summary,
.structured-detail-group > summary {
  display: list-item;
  cursor: pointer;
  list-style-position: outside;
  margin-left: 18px;
}

.structured-detail > summary::marker,
.structured-detail-group > summary::marker {
  color: var(--muted);
}

.structured-detail > summary {
  min-height: 34px;
  padding: 7px 9px;
  color: var(--text);
}

.structured-detail-summary {
  overflow-wrap: break-word;
  word-break: normal;
}

.structured-detail-action {
  float: right;
  margin-left: 8px;
  color: var(--accent);
  font-weight: 500;
}

.structured-detail-action-open,
.structured-detail[open] > summary .structured-detail-action-closed {
  display: none;
}

.structured-detail[open] > summary .structured-detail-action-open {
  display: inline;
}

.structured-detail-body {
  padding: 0 9px 9px;
  border-top: 1px solid var(--line-soft);
}

.structured-detail-fields {
  margin: 0;
}

.structured-detail-field {
  display: grid;
  grid-template-columns: minmax(76px, 34%) minmax(0, 1fr);
  gap: 8px;
  padding: 7px 0;
  border-bottom: 1px solid var(--line-soft);
}

.structured-detail-field dt {
  color: var(--muted);
}

.structured-detail-field dd {
  min-width: 0;
  margin: 0;
  color: var(--text);
  line-height: 1.45;
  overflow-wrap: break-word;
  word-break: normal;
}

.compact-array-summary {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}

.interactive-table-cell {
  display: inline-flex;
  max-width: 100%;
  min-width: 0;
  align-items: center;
}

.compact-array-popover {
  display: grid;
  gap: 4px;
  max-width: min(420px, 72vw);
  max-height: 280px;
  overflow: auto;
  overflow-wrap: anywhere;
}

.compact-array-empty {
  color: var(--text-secondary);
}

.operation-number-input {
  display: grid;
  gap: 8px;
  padding-top: 8px;
}

.operation-number-input .ant-input-number {
  width: 100%;
}

.structured-detail-groups {
  display: grid;
}

.structured-detail-group {
  border-bottom: 1px solid var(--line-soft);
}

.structured-detail-group > summary {
  min-height: 32px;
  padding: 6px 0;
  color: var(--text);
}

.structured-detail-group > summary span:last-child {
  float: right;
  margin-left: 8px;
  color: var(--muted);
  font-weight: 400;
}

.structured-detail-group-body {
  margin: 0 0 6px 6px;
  padding-left: 9px;
  border-left: 1px solid var(--line-strong);
}

.detail-block-content .structured-detail-field {
  grid-template-columns: minmax(72px, 28%) minmax(0, 1fr);
}

@container (max-width: 340px) {
  .detail-block-content .structured-detail-field {
    grid-template-columns: 1fr;
    gap: 3px;
  }
}

.structured-value-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
  padding: 7px 0;
  color: var(--text);
  overflow-wrap: anywhere;
}

.compact-location-detail {
  display: grid;
  gap: 3px;
  color: var(--text);
  font-size: var(--font-xs);
  font-weight: 600;
  line-height: 1.45;
}

.compact-location-detail details {
  margin-top: 2px;
  color: var(--muted);
  font-weight: 500;
}

.compact-location-detail summary {
  cursor: pointer;
  color: #2563eb;
}

.route-link-summary-list {
  display: grid;
  gap: 8px;
}

.route-link-summary {
  display: grid;
  gap: 6px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line-soft);
}

.route-link-summary:last-child {
  border-bottom: 0;
}

.route-link-summary-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: var(--font-xs);
  color: var(--text);
}

.route-link-summary-head strong {
  font-weight: 600;
}

.route-link-summary-head span {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.route-link-summary-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3px;
  color: var(--muted);
  font-size: var(--font-xs);
  line-height: 1.45;
}

/* v026: calm, focused operations workspace */
.ops-shell {
  color: var(--text);
}

.ops-sider {
  box-shadow: 1px 0 0 rgba(24, 27, 32, 0.02);
}

.brand-bar {
  height: 52px;
  padding: 0 10px 0 18px;
  border-bottom-color: var(--line-soft);
}

.brand-title-button.ant-btn {
  color: var(--text);
  font-size: var(--font-md);
  font-weight: 600;
  letter-spacing: 0;
}

.brand-bar > .ant-btn:last-child {
  width: 28px;
  min-width: 28px;
  height: 28px;
  padding: 0;
  border-radius: 6px;
  color: var(--muted);
}

.ops-menu.ant-menu {
  padding: 10px 8px;
  color: #30343a;
  font-size: var(--font-sm);
  font-weight: 400;
}

.ops-menu .ant-menu-item,
.ops-menu .ant-menu-submenu-title {
  height: 36px !important;
  margin: 2px 0 !important;
  padding-inline: 14px !important;
  border-radius: 6px !important;
  line-height: 36px !important;
  transition: color 140ms ease, background 140ms ease;
}

.ops-menu.ant-menu-root > .ant-menu-item,
.ops-menu.ant-menu-root > .ant-menu-submenu > .ant-menu-submenu-title {
  padding-inline-start: 14px !important;
  font-weight: 500;
}

.ops-menu.ant-menu-root > .ant-menu-submenu > .ant-menu-sub > .ant-menu-item,
.ops-menu.ant-menu-root > .ant-menu-submenu > .ant-menu-sub > .ant-menu-submenu > .ant-menu-submenu-title {
  padding-inline-start: 34px !important;
  font-weight: 400;
}

.ops-menu.ant-menu-root > .ant-menu-submenu > .ant-menu-sub > .ant-menu-submenu > .ant-menu-sub > .ant-menu-item {
  padding-inline-start: 54px !important;
  font-weight: 400;
}

.ops-menu.ant-menu-root > .ant-menu-submenu > .ant-menu-sub > .ant-menu-submenu > .ant-menu-sub > .ant-menu-submenu > .ant-menu-submenu-title {
  padding-inline-start: 54px !important;
  font-weight: 400;
}

.ops-menu.ant-menu-root > .ant-menu-submenu > .ant-menu-sub > .ant-menu-submenu > .ant-menu-sub > .ant-menu-submenu > .ant-menu-sub > .ant-menu-item {
  padding-inline-start: 72px !important;
  font-weight: 400;
}

.ops-menu .ant-menu-submenu .ant-menu-sub {
  background: transparent !important;
}

.ops-menu .ant-menu-item:hover,
.ops-menu .ant-menu-submenu-title:hover {
  color: #20252c !important;
  background: var(--surface-muted) !important;
}

.ops-menu .ant-menu-item-selected {
  color: #205dcc !important;
  background: var(--accent-soft) !important;
  font-weight: 600 !important;
  box-shadow: inset 3px 0 0 #3f73dc;
}

.ops-menu .ant-menu-submenu-selected > .ant-menu-submenu-title {
  color: #2b5fac !important;
  font-weight: 500;
}

.ops-menu .ant-menu-submenu-open > .ant-menu-submenu-title {
  color: #2b3037;
}

.ops-menu .ant-menu-submenu-arrow {
  color: #8b919b;
}

.ops-menu:focus,
.ops-menu:focus-visible {
  outline: none;
}

.ops-menu .ant-menu-item:focus-visible,
.ops-menu .ant-menu-submenu-title:focus-visible {
  outline: 2px solid rgba(47, 111, 237, 0.35);
  outline-offset: -2px;
}

.top-strip {
  height: 52px;
  padding: 0 16px;
  border-bottom-color: var(--line-soft);
}

.top-strip-title {
  gap: 3px;
}

.top-strip-title .ant-typography:first-child {
  color: var(--text);
  font-size: var(--font-md);
  font-weight: 600;
}

.top-strip-title .ant-typography-secondary {
  color: #858b95;
  font-size: var(--font-xs);
}

.top-strip-metrics {
  gap: 10px;
}

.top-strip-metrics .ant-tag {
  margin: 0;
  padding: 0;
  color: #5d636d;
  background: transparent;
  font-size: var(--font-xs);
  line-height: 22px;
}

.top-strip-metrics .ant-tag-success {
  position: relative;
  padding-left: 11px;
  color: #368b5b;
}

.top-strip-metrics .ant-tag-success::before {
  position: absolute;
  top: 9px;
  left: 0;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--success);
  content: "";
}

.workspace-bar {
  height: 38px;
  min-height: 38px;
  border-bottom-color: var(--line-soft);
}

.workspace-scroll {
  gap: 0;
  padding: 0 12px;
}

.workspace-tab {
  position: relative;
  height: 38px;
  max-width: 196px;
  padding: 0 12px;
  border: 0;
  border-radius: 0;
  color: #737985;
  background: transparent;
  line-height: 38px;
}

.workspace-tab:hover {
  color: var(--text);
  background: transparent;
}

.workspace-tab.active {
  color: var(--accent);
  background: transparent;
  font-weight: 600;
  box-shadow: none;
}

.workspace-tab.active::after {
  position: absolute;
  right: 10px;
  bottom: 0;
  left: 10px;
  height: 2px;
  border-radius: 2px 2px 0 0;
  background: var(--accent);
  content: "";
}

.workspace-tab-close {
  width: 16px;
  height: 16px;
  color: #949aa4;
}

.workspace-tab-close:hover {
  color: var(--text);
  background: var(--surface-muted);
}

.workbench {
  grid-template-columns: minmax(0, 1fr) 328px;
  height: calc(100vh - 90px);
  background: var(--surface);
}

.workbench.detail-collapsed {
  grid-template-columns: minmax(0, 1fr) 40px;
}

.workbench.detail-hidden {
  grid-template-columns: minmax(0, 1fr);
}

.detail-rail {
  border-left-color: var(--line-soft);
}

.record-page-new,
.map-page-new {
  border: 0;
}

.ops-shell .ant-btn {
  border-color: var(--line-strong);
  border-radius: 6px;
  box-shadow: 0 1px 1px rgba(24, 27, 32, 0.025);
  font-weight: 500;
}

.ops-shell .ant-btn:hover {
  border-color: #bfc5ce;
  color: var(--text);
  background: #f9fafb;
}

.ops-shell .ant-btn-primary {
  border-color: var(--accent);
  color: #fff;
  background: var(--accent);
  box-shadow: 0 1px 2px rgba(47, 111, 237, 0.18);
}

.ops-shell .ant-btn-primary:hover {
  border-color: #245fd5;
  color: #fff;
  background: #245fd5;
}

.ops-shell .ant-btn-text {
  border-color: transparent;
  box-shadow: none;
}

.brand-title-button.ant-btn:hover,
.brand-bar > .ant-btn:last-child:hover {
  border-color: transparent !important;
  color: #4f5865 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.brand-title-button.ant-btn:hover {
  color: var(--text) !important;
}

.ops-shell .ant-input,
.ops-shell .ant-select-selector {
  border-color: var(--line-strong) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

.ops-shell .ant-input:hover,
.ops-shell .ant-select:hover .ant-select-selector {
  border-color: #b9c0ca !important;
}

.ops-shell .ant-input:focus,
.ops-shell .ant-select-focused .ant-select-selector {
  border-color: #87aaf5 !important;
  box-shadow: 0 0 0 2px rgba(47, 111, 237, 0.08) !important;
}

.status-segment-bar {
  gap: 4px;
  min-height: 42px;
  padding: 7px 12px;
  border-bottom-color: var(--line-soft);
}

.status-segment-bar .ant-btn {
  height: 28px;
  padding: 0 10px;
  border-color: transparent;
  color: #626872;
  background: transparent;
  box-shadow: none;
}

.status-segment-bar .ant-btn:hover {
  border-color: transparent;
  color: var(--text);
  background: var(--surface-muted);
}

.status-segment-bar .ant-btn-primary,
.status-segment-bar .ant-btn-primary:hover {
  border-color: #d9e5ff;
  color: var(--accent);
  background: var(--accent-soft);
  box-shadow: none;
}

.list-filter-bar {
  gap: 10px;
  min-height: 46px;
  padding: 8px 12px;
  border-bottom-color: var(--line-soft);
  background: #fbfbfc;
}

.filter-field {
  gap: 8px;
}

.filter-field > span {
  color: #626a75;
  font-weight: 500;
}

.filter-field.keyword-field {
  min-width: 300px;
}

.list-action-bar {
  min-height: 42px;
  padding: 7px 12px;
  border-bottom-color: var(--line-soft);
}

.list-action-bar .ant-btn,
.list-filter-bar > .ant-btn,
.status-segment-bar .ant-btn {
  height: 28px;
}

.metric-period-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.metric-period-actions > span {
  color: var(--muted);
  font-size: var(--font-xs);
  font-weight: 500;
}

.metric-period-actions .ant-select {
  min-width: 156px;
}

.metric-data-pool-state {
  min-width: 0;
  margin-left: 4px;
  color: #6f7580;
  font-size: var(--font-xs);
  font-weight: 400;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.metric-experience-panel {
  display: grid;
  flex: none;
  gap: 9px;
  padding: 12px;
  border-bottom: 1px solid var(--line-soft);
  background: var(--surface);
}

.metric-planning-baseline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-width: 0;
  padding: 2px 0 10px;
  border-bottom: 1px solid var(--line-soft);
}

.metric-planning-baseline > div:first-child {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.metric-planning-baseline span,
.metric-planning-baseline small {
  color: var(--muted);
  font-size: var(--font-xs);
}

.metric-planning-baseline strong {
  overflow: hidden;
  color: var(--text);
  font-size: var(--font-sm);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.metric-planning-facts {
  display: flex;
  gap: 14px;
  white-space: nowrap;
}

.metric-planning-facts strong { color: var(--text); }

.metric-comparison-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(190px, 1fr));
  gap: 8px;
}

.metric-comparison-card {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-left: 3px solid #9aa8b7;
  border-radius: 6px;
  background: #fff;
}

.metric-comparison-card.status-achieved { border-left-color: #4c9b78; }
.metric-comparison-card.status-watch { border-left-color: #c39846; }
.metric-comparison-card.status-off_track { border-left-color: #c56b6b; }

.metric-comparison-card header,
.metric-comparison-card footer,
.metric-comparison-values {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.metric-comparison-card header span,
.metric-comparison-card header em,
.metric-comparison-card footer,
.metric-comparison-card footer small {
  color: var(--muted);
  font-size: var(--font-xs);
  font-style: normal;
}

.metric-comparison-card h3 {
  margin: 0;
  color: var(--text);
  font-size: var(--font-sm);
  font-weight: 600;
}

.metric-comparison-values > span {
  display: grid;
  gap: 2px;
  color: var(--muted);
  font-size: var(--font-xs);
}

.metric-comparison-values strong {
  color: var(--text);
  font-size: var(--font-sm);
  font-variant-numeric: tabular-nums;
}

.record-page-new.metric-analysis-page {
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  padding-bottom: clamp(32px, 6vh, 64px);
  scroll-padding-bottom: 32px;
}

.metric-analysis-page .metric-experience-panel,
.metric-analysis-page .metric-table-disclosure {
  flex: 0 0 auto;
}

.metric-analysis-page .record-table-section {
  flex: 0 0 min(420px, 55vh);
  min-height: 280px;
}

.metric-card-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(128px, 1fr));
  gap: 8px;
}

.metric-summary-card {
  display: grid;
  gap: 5px;
  min-width: 0;
  min-height: 78px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  background: #fbfcfe;
  text-align: left;
  cursor: pointer;
  transition: border-color 120ms ease, background 120ms ease;
}

.metric-summary-card:hover {
  border-color: #c6d5f4;
  background: #f8fbff;
}

.metric-summary-card span {
  overflow: hidden;
  color: #59616c;
  font-size: var(--font-xs);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.metric-summary-card strong {
  color: #20252c;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
}

.metric-summary-card small {
  overflow: hidden;
  color: var(--muted);
  font-size: var(--font-xs);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.metric-empty-summary {
  grid-column: 1 / -1;
  padding: 12px;
  border: 1px dashed var(--line);
  border-radius: 6px;
  color: var(--muted);
  background: #fbfcfe;
  font-size: var(--font-xs);
}

.metric-insight-lanes {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 8px;
}

.metric-insight-lane {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 9px 10px;
  border: 0;
  border-top: 1px solid var(--line-soft);
  background: #ffffff;
  text-align: left;
  cursor: pointer;
  transition: background 120ms ease, border-color 120ms ease;
}

.metric-insight-lane:hover {
  border-top-color: #cbd8ea;
  background: #fbfcfe;
}

.metric-insight-lane span {
  color: var(--muted);
  font-size: var(--font-xs);
}

.metric-insight-lane strong {
  overflow: hidden;
  color: var(--text);
  font-size: var(--font-sm);
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.metric-insight-lane small {
  overflow: hidden;
  color: #6f7580;
  font-size: var(--font-xs);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.metric-insight-lane em {
  overflow: hidden;
  color: #8a94a3;
  font-size: var(--font-xs);
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.metric-trend-toolbar {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding-top: 2px;
}

.metric-trend-toolbar > span {
  margin-right: 2px;
  color: var(--muted);
  font-size: var(--font-xs);
  font-weight: 600;
}

.metric-trend-toolbar .ant-btn {
  height: 26px;
}

.metric-trend-toolbar .ant-select {
  min-width: 112px;
}

.metric-trend-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.data-chart {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
}

.data-chart-header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.data-chart-header > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.data-chart-header strong {
  color: var(--text);
  font-size: var(--font-sm);
  font-weight: 600;
}

.data-chart-header small,
.data-chart-header > span,
.data-chart-empty,
.data-chart-sample-note {
  color: var(--muted);
  font-size: var(--font-xs);
}

.data-chart-legend {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 4px 12px;
  min-width: 0;
}

.data-chart-legend button {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0;
  border: 0;
  color: var(--muted);
  background: transparent;
  font-size: var(--font-xs);
  cursor: pointer;
}

.data-chart-legend button[aria-pressed="false"] {
  opacity: 0.42;
}

.data-chart-legend i,
.data-chart-tooltip i {
  width: 10px;
  height: 3px;
  flex: none;
  border-radius: 2px;
}

.data-chart-legend small {
  color: #8a94a3;
  font-size: 10px;
}

.data-chart-scroll {
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  border-top: 1px solid var(--line-soft);
  outline: none;
  overscroll-behavior-inline: contain;
  scrollbar-color: #c8d2df transparent;
  scrollbar-width: thin;
  touch-action: pan-x;
}

.data-chart-scroll:focus-visible {
  box-shadow: inset 0 0 0 1px var(--accent);
}

.data-chart-viewport {
  width: 100%;
  height: clamp(210px, 24vw, 286px);
  min-width: 0;
  border-top: 1px solid var(--line-soft);
  touch-action: pan-y pinch-zoom;
}

.data-chart-plot {
  position: relative;
  min-width: 0;
}

.data-chart-viewport canvas {
  touch-action: pan-y pinch-zoom !important;
}

.data-chart-tooltip-content {
  display: grid;
  min-width: 172px;
  gap: 6px;
  padding: 2px;
  color: var(--text);
  font-size: var(--font-xs);
}

.data-chart-tooltip-content > strong {
  padding-bottom: 5px;
  border-bottom: 1px solid var(--line-soft);
  font-weight: 600;
}

.data-chart-tooltip-row {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
}

.data-chart-tooltip-row i {
  width: 8px;
  height: 3px;
  border-radius: 2px;
}

.data-chart-tooltip-row b {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.data-chart-canvas {
  position: relative;
  min-width: 100%;
}

.data-chart svg {
  display: block;
  width: 100%;
  height: 226px;
  user-select: none;
}

.data-chart svg text {
  fill: var(--muted);
  font-size: 10px;
  letter-spacing: 0;
  pointer-events: none;
}

.data-chart-gridline {
  stroke: var(--line-soft);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.data-chart-axis-label {
  font-variant-numeric: tabular-nums;
}

.data-chart-line {
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.data-chart-point {
  fill: var(--surface);
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
}

.data-chart-bar {
  opacity: 0.82;
}

.data-chart-crosshair {
  stroke: #7f8fa3;
  stroke-width: 1;
  stroke-dasharray: 3 3;
  vector-effect: non-scaling-stroke;
}

.data-chart-empty {
  display: grid;
  min-height: 226px;
  place-items: center;
  border-top: 1px solid var(--line-soft);
}

.metric-quality-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  padding-top: 2px;
  color: var(--muted);
  font-size: var(--font-xs);
}

.metric-quality-strip span {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.robotaxi-operation-panel {
  display: grid;
  flex: none;
  grid-template-rows: auto auto;
  gap: 8px;
  max-height: 132px;
  padding: 8px 12px 10px;
  border-bottom: 1px solid var(--line-soft);
  background: var(--surface);
  overflow: hidden;
}

.robotaxi-fleet-summary-scroll,
.robotaxi-selected-meta-scroll {
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
}

.robotaxi-fleet-summary-scroll::-webkit-scrollbar,
.robotaxi-selected-meta-scroll::-webkit-scrollbar {
  height: 6px;
}

.robotaxi-fleet-summary,
.robotaxi-selected-meta {
  display: flex;
  align-items: stretch;
  gap: 8px;
  width: max-content;
  min-width: 0;
}

.robotaxi-summary-metric {
  display: grid;
  grid-template-columns: auto auto;
  align-items: baseline;
  gap: 6px;
  min-width: 112px;
  padding: 4px 10px;
  border: 1px solid var(--line-soft);
  border-radius: 6px;
  background: var(--surface-soft);
  color: var(--text);
}

.robotaxi-summary-metric span,
.robotaxi-summary-item span,
.robotaxi-selected-card-head span,
.robotaxi-selected-card-head small {
  color: var(--muted);
  font-size: var(--font-xs);
}

.robotaxi-summary-metric strong {
  font-size: 16px;
  font-weight: 650;
  line-height: 1;
}

.robotaxi-selected-card {
  min-width: 0;
  border: 1px solid var(--line-soft);
  border-radius: 6px;
  background: #fbfcfe;
}

.robotaxi-selected-card-inner {
  display: grid;
  grid-template-columns: minmax(132px, 0.2fr) minmax(0, 1fr);
  gap: 10px;
  min-width: 0;
  padding: 8px 10px;
  cursor: pointer;
}

.robotaxi-selected-card-inner:focus-visible {
  outline: 2px solid var(--accent-soft);
  outline-offset: -2px;
}

.robotaxi-selected-card-head {
  display: grid;
  align-content: center;
  gap: 3px;
  min-width: 0;
}

.robotaxi-selected-card-head strong {
  overflow: hidden;
  font-size: 14px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.robotaxi-summary-item {
  display: grid;
  align-content: center;
  gap: 3px;
  width: 176px;
  min-width: 0;
  padding: 2px 10px;
  border-left: 1px solid var(--line-soft);
  background: transparent;
}

.robotaxi-summary-item strong {
  overflow: hidden;
  color: var(--text);
  font-size: var(--font-xs);
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.robotaxi-popover-list {
  display: grid;
  gap: 4px;
  max-width: 360px;
  color: var(--text);
  font-size: var(--font-xs);
}

.table-queue-summary {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  color: var(--text);
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: default;
}

.robotaxi-empty-summary {
  grid-column: 1 / -1;
  padding: 12px;
  border: 1px dashed var(--line);
  border-radius: 6px;
  color: var(--muted);
  background: var(--surface);
  font-size: var(--font-xs);
}

.metric-table-disclosure {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--line-soft);
  background: #fbfcfe;
}

.metric-table-disclosure > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.metric-table-disclosure span {
  color: var(--text);
  font-size: var(--font-xs);
  font-weight: 600;
}

.metric-table-disclosure small {
  overflow: hidden;
  color: var(--muted);
  font-size: var(--font-xs);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.record-page-new .ant-table {
  color: #252a31;
  font-weight: 400;
  font-variant-numeric: tabular-nums;
  table-layout: auto;
}

.record-page-new .ant-table-container {
  border-start-start-radius: 0 !important;
  border-start-end-radius: 0 !important;
}

.record-page-new .ant-table-thead > tr > th {
  height: 36px;
  padding: 8px 10px !important;
  border-bottom: 1px solid var(--line) !important;
  color: #454c56;
  background: #f7f8fa !important;
  font-weight: 600;
}

.record-page-new .ant-table-thead > tr > th::before {
  background-color: var(--line-soft) !important;
}

.record-page-new .ant-table-tbody > tr > td {
  height: 36px;
  padding: 7px 10px !important;
  border-bottom-color: var(--line-soft);
  transition: background 120ms ease;
}

.record-page-new .ant-table-thead > tr > th,
.record-page-new .ant-table-tbody > tr > td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.record-page-new .ant-table-tbody > tr:hover > td {
  background: #f7f9fc !important;
}

.record-page-new .ant-table-tbody > tr.active-table-row > td,
.record-page-new .ant-table-tbody > tr.active-table-row:hover > td {
  background: var(--accent-soft) !important;
}

.record-page-new .ant-table-cell-fix-right {
  box-shadow: -1px 0 0 var(--line-soft);
}

.record-page-new .ant-pagination {
  margin: 10px 12px !important;
}

.record-page-new .ant-pagination .ant-pagination-item,
.record-page-new .ant-pagination .ant-pagination-prev,
.record-page-new .ant-pagination .ant-pagination-next {
  border-radius: 6px;
}

.status-value {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  color: #4f5661;
  white-space: nowrap;
}

.status-value::before {
  width: 6px;
  height: 6px;
  flex: none;
  border-radius: 50%;
  background: #a3a8b1;
  box-shadow: 0 0 0 2px rgba(163, 168, 177, 0.1);
  content: "";
}

.status-success::before {
  background: var(--success);
  box-shadow: 0 0 0 2px rgba(47, 158, 97, 0.1);
}

.status-warning::before {
  background: var(--warning);
  box-shadow: 0 0 0 2px rgba(217, 130, 43, 0.1);
}

.status-danger::before {
  background: var(--danger);
  box-shadow: 0 0 0 2px rgba(217, 74, 74, 0.1);
}

.status-info::before {
  background: var(--info);
  box-shadow: 0 0 0 2px rgba(75, 123, 236, 0.1);
}

.row-action-button.ant-btn {
  height: 24px;
  padding: 0 8px;
  border-color: transparent;
  color: var(--accent);
  background: transparent;
  box-shadow: none;
}

.row-action-button.ant-btn:hover {
  border-color: #d9e5ff;
  color: #245fd5;
  background: var(--accent-soft);
}

.row-action-cell {
  display: inline-flex;
  width: 100%;
  min-width: 0;
  align-items: center;
  justify-content: flex-start;
}

.row-action-cell > .row-action-button.ant-btn {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.row-action-split {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-width: 0;
  gap: 2px;
}

.row-action-disabled-hint {
  display: inline-flex;
  min-width: 0;
}

.row-action-disabled-hint > .row-action-button.ant-btn {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.row-action-split > .row-action-button.ant-btn {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.row-action-menu-trigger.ant-btn {
  display: inline-flex;
  flex: 0 0 24px;
  align-items: center;
  justify-content: center;
  width: 24px;
  min-width: 24px;
  height: 24px;
  padding: 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1;
}

.row-action-menu-trigger.ant-btn:hover,
.row-action-menu-trigger.ant-btn:focus-visible {
  color: var(--accent);
  background: var(--accent-soft);
}

.module-footer {
  min-height: 34px;
  padding: 7px 12px;
  border-top-color: var(--line-soft);
  color: #858b95;
  background: #fbfbfc;
}

.panel-title {
  height: 44px;
  padding: 0 14px;
  border-bottom-color: var(--line-soft);
  color: var(--text);
  font-weight: 600;
}

.panel-title .ant-btn {
  width: 28px;
  height: 28px;
  padding: 0;
  color: #858b95;
}

.detail-panel-new .ant-empty {
  margin-block: 78px 0;
}

.detail-panel-new .ant-empty-description {
  color: #949aa4;
  font-size: var(--font-xs);
}

.detail-tabs.ant-tabs {
  padding: 0;
}

.detail-tabs .ant-tabs-nav {
  margin: 0 0 8px;
}

.detail-tabs .ant-tabs-tab {
  padding: 10px 0 9px;
  color: #737985;
}

.detail-tabs .ant-tabs-tab-active .ant-tabs-tab-btn {
  color: var(--accent);
  font-weight: 500;
}

.compact-descriptions { padding: 0; }

.compact-descriptions .ant-descriptions-item {
  padding-bottom: 9px !important;
}

.compact-descriptions .ant-descriptions-item-label {
  width: 112px;
  color: #7c828c;
}

.compact-descriptions .ant-descriptions-item-content {
  color: #30343a;
  font-weight: 540;
}

.event-log-section {
  border-top-color: var(--line);
  padding-top: 12px;
}

.event-log-title {
  margin-bottom: 8px;
  padding: 0 12px;
  color: #4f5661;
  font-weight: 600;
}

.event-log-resizer {
  height: 10px;
}

.event-log-resizer::after {
  top: 4px;
  width: 44px;
  height: 2px;
  background: #cfd4dc;
}

.map-stage {
  padding: 12px;
  background: #f7f8fa;
}

.zone-canvas-new {
  border-color: var(--line-strong);
  border-radius: 6px;
  background: #fcfcfd;
  box-shadow: 0 1px 2px rgba(24, 27, 32, 0.03);
}

.map-floating-actions {
  top: 20px;
  right: 20px;
  gap: 2px;
  padding: 4px;
  border-color: rgba(212, 216, 223, 0.9);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 4px 12px rgba(24, 27, 32, 0.08);
  backdrop-filter: blur(8px);
}

.map-floating-actions .ant-btn {
  height: 28px;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.map-floating-actions .ant-btn:hover {
  border-color: transparent;
  background: var(--surface-muted);
}

.map-cell {
  stroke: #eef0f3;
  stroke-width: 0.02;
}

.map-cell:hover,
.map-cell[data-active="true"] {
  fill: #cfe0ff;
}

.map-cell[data-route="true"] {
  fill: #f6b9b9;
}

.zone-boundary {
  stroke: #4777d9;
  stroke-width: 0.07;
}

.service-area-cell {
  fill: rgba(25, 163, 145, 0.76);
  stroke: #147a6c;
}

.ops-center-cell {
  fill: rgba(134, 92, 214, 0.82);
  stroke: #6841b5;
}

.legend-new {
  gap: 7px 16px;
  min-height: 40px;
  padding: 9px 14px;
  border-top-color: var(--line-soft);
  color: #6f7580;
}

.legend-dot {
  width: 7px;
  height: 7px;
}

.detail-toggle-button {
  border-color: transparent;
  color: var(--text-secondary);
  background: transparent;
  box-shadow: none;
}

.detail-toggle-button.ant-btn:hover,
.detail-toggle-button.ant-btn:focus-visible {
  border-color: var(--line) !important;
  color: var(--text) !important;
  background: var(--surface-soft) !important;
  box-shadow: 0 2px 8px rgba(30, 48, 68, 0.10) !important;
}

* {
  scrollbar-width: thin;
  scrollbar-color: #c9ced6 transparent;
}

*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

*::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 8px;
  background: #c9ced6;
  background-clip: padding-box;
}

*::-webkit-scrollbar-track {
  background: transparent;
}

.timing-rule-editor {
  display: grid;
  gap: 12px;
  padding-top: 8px;
}

.timing-rule-editor label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
}

.status-timeline {
  list-style: none;
  margin: 0;
  padding: 4px 2px 12px 10px;
}

.status-timeline li {
  position: relative;
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr);
  gap: 8px;
  min-height: 62px;
}

.status-timeline li:not(:last-child)::after {
  position: absolute;
  top: 15px;
  bottom: -2px;
  left: 4px;
  width: 1px;
  background: var(--line);
  content: "";
}

.status-timeline-marker {
  position: relative;
  z-index: 1;
  width: 9px;
  height: 9px;
  margin-top: 5px;
  border: 2px solid var(--surface);
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 1px var(--accent);
}

.status-timeline-content {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding-bottom: 12px;
}

.status-timeline-content .ant-typography {
  margin: 0;
  font-size: 12px;
}

.status-timeline-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

@media (max-width: 1240px) {
  .workbench {
    grid-template-columns: minmax(0, 1fr) 292px;
  }

  .top-strip-metrics {
    gap: 6px;
  }

  .top-strip-metrics .ant-tag:nth-of-type(2),
  .top-strip-metrics .ant-tag:nth-of-type(3) {
    display: none;
  }

  .filter-field.keyword-field {
    min-width: 250px;
  }

  .metric-card-grid {
    grid-template-columns: repeat(3, minmax(128px, 1fr));
  }

  .metric-insight-lanes {
    grid-template-columns: 1fr;
  }

  .metric-comparison-grid { grid-template-columns: repeat(2, minmax(180px, 1fr)); }

  .robotaxi-selected-card-inner {
    grid-template-columns: minmax(120px, 0.24fr) minmax(0, 1fr);
  }

  .metric-table-disclosure {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 767px) {
  html,
  body,
  #app {
    width: 100%;
    min-width: 0;
    overflow: hidden;
  }

  .ops-shell {
    height: 100dvh;
  }

  .ops-sider {
    z-index: 30;
  }

  .ops-sider:not(.ant-layout-sider-collapsed) {
    position: fixed !important;
    top: 0;
    bottom: 0;
    left: 0;
    width: min(232px, calc(100vw - 44px)) !important;
    min-width: min(232px, calc(100vw - 44px)) !important;
    max-width: min(232px, calc(100vw - 44px)) !important;
    box-shadow: 8px 0 22px rgba(24, 27, 32, 0.12);
  }

  .ops-main-layout {
    width: 0;
  }

  .top-strip {
    gap: 6px;
    padding: 0 8px;
  }

  .top-strip-title .ant-typography-secondary,
  .top-strip-metrics .ant-tag {
    display: none;
  }

  .top-strip-title .ant-typography {
    max-width: 148px;
  }

  .top-strip-metrics .ant-btn {
    padding-inline: 8px;
    white-space: nowrap;
  }

  .workspace-scroll {
    padding-inline: 6px;
  }

  .workbench,
  .workbench.detail-collapsed {
    position: relative;
    display: block;
    height: calc(100dvh - 76px);
  }

  .work-content {
    width: 100%;
    height: 100%;
  }

  .detail-rail {
    position: absolute;
    z-index: 20;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(328px, calc(100% - 12px));
    border-left: 1px solid var(--line);
    box-shadow: -8px 0 22px rgba(24, 27, 32, 0.1);
  }

  .workbench.detail-collapsed .detail-rail {
    width: 40px;
    box-shadow: none;
  }

  .list-filter-bar,
  .list-action-bar,
  .status-segment-bar {
    overflow-x: auto;
    overflow-y: hidden;
  }

  .list-filter-bar {
    align-items: center;
    flex-wrap: nowrap;
  }

  .filter-field,
  .filter-field.keyword-field {
    min-width: 220px;
  }

  .metric-card-grid {
    grid-template-columns: repeat(2, minmax(132px, 1fr));
  }

  .metric-planning-baseline { align-items: flex-start; flex-direction: column; }
  .metric-planning-facts { width: 100%; overflow-x: auto; }
  .metric-comparison-grid { grid-template-columns: 1fr; }
}

/* v041.2.15 final shell overrides stay last so legacy version blocks cannot win. */
.ops-shell,
.ops-main-layout {
  background: var(--bg);
}

.ops-sider {
  border-right-color: #d5e0ea;
  background: var(--navigation-surface) !important;
  box-shadow: 1px 0 0 rgba(52, 75, 98, 0.035);
}

.brand-bar {
  border-bottom-color: #d8e3ed;
  background: rgba(255, 255, 255, 0.5);
}

.ops-menu.ant-menu {
  color: #2c4055;
  background: var(--navigation-surface);
}

.ops-menu .ant-menu-item:hover,
.ops-menu .ant-menu-submenu-title:hover {
  color: #172f47 !important;
  background: var(--navigation-hover) !important;
}

.ops-menu .ant-menu-item-selected {
  color: #205fc5 !important;
  background: #d8e7f7 !important;
  box-shadow: inset 3px 0 0 var(--accent);
}

.top-strip {
  position: relative;
  border-bottom-color: rgba(255, 255, 255, 0.18);
  color: #ffffff;
  background: var(--chrome);
}

.top-strip-title .ant-typography:first-child,
.top-strip-title .ant-typography-secondary,
.top-strip-metrics .ant-tag,
.top-strip-metrics .ant-tag-success {
  color: #ffffff;
}

.top-strip-title .ant-typography-secondary {
  opacity: 0.78;
}

.top-strip-metrics .ant-btn,
.platform-utilities .ant-btn {
  border-color: rgba(255, 255, 255, 0.36);
  color: #ffffff;
  background: rgba(255, 255, 255, 0.08);
  box-shadow: none;
}

.top-strip-metrics .ant-btn:hover,
.platform-utilities .ant-btn:hover {
  border-color: rgba(255, 255, 255, 0.68);
  color: #ffffff;
  background: rgba(255, 255, 255, 0.16);
}

.workspace-bar {
  border-bottom-color: #dbe4ed;
  background: #f4f7fa;
}

.workspace-tab {
  color: #596a7d;
}

.workbench,
.workbench.detail-collapsed {
  background: var(--bg);
}

.work-content,
.record-page-new,
.map-page-new,
.detail-rail,
.detail-panel-new,
.event-log-section {
  background: var(--surface);
}

.detail-rail {
  border-left-color: #d8e2ec;
}

.record-page-new .ant-table-thead > tr > th {
  color: #435469;
  background: #f4f7fa !important;
}

.record-page-new .ant-table-tbody > tr:hover > td {
  background: #f5f8fb !important;
}

.record-page-new .ant-table-tbody > tr.active-table-row > td,
.record-page-new .ant-table-tbody > tr.active-table-row:hover > td {
  background: #e7f0fc !important;
}

.module-footer {
  background: #f7f9fb;
}

@media (max-width: 767px) {
  .top-strip-title {
    flex: 0 0 104px;
  }

  .top-strip-title .ant-typography {
    max-width: 104px;
  }

  .top-strip-tools {
    flex: 1 1 auto;
    justify-content: flex-start;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .top-strip-tools::-webkit-scrollbar {
    display: none;
  }

  .top-strip-metrics,
  .platform-utilities {
    display: flex;
    flex: none;
  }

  .release-history-panel {
    position: fixed;
    top: 58px;
    right: 10px;
    left: 10px;
    width: auto;
    max-height: calc(100dvh - 76px);
  }
}

/* v041.2.15 selected visual refinement */
:root {
  --chrome: #8798a8;
  --chrome-strong: #748799;
}

.platform-login-shell {
  place-items: center;
  background: #e2e9f0;
}

.platform-login-panel {
  width: min(480px, 100%);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.platform-login-brand {
  margin-bottom: 20px;
}

.platform-login-brand h1 {
  color: #26384a;
  font-size: 20px;
  font-weight: 500;
}

.platform-login-form {
  grid-template-columns: minmax(0, 1fr) 74px;
  gap: 0;
}

.platform-login-input {
  min-width: 0;
  height: 36px;
  padding: 0 11px;
  outline: none;
  border-color: #b7c5d2;
  border-style: solid;
  border-width: 1px;
  border-radius: 6px 0 0 6px;
  color: #26384a;
  background: rgba(255, 255, 255, 0.74);
  box-shadow: none;
  font: inherit;
}

.platform-login-input:hover,
.platform-login-input:focus {
  z-index: 1;
  border-color: #7e94a8;
  box-shadow: 0 0 0 2px rgba(102, 127, 153, 0.1);
}

.platform-login-input.error {
  border-color: #c98080;
}

.platform-login-submit {
  min-width: 74px;
  height: 36px;
  border-color: #9caebe;
  border-style: solid;
  border-width: 1px;
  border-left: 0;
  border-radius: 0 6px 6px 0;
  color: #40566b;
  background: rgba(255, 255, 255, 0.44);
  box-shadow: none;
  cursor: pointer;
  font: inherit;
  font-weight: 500;
}

.platform-login-submit:hover,
.platform-login-submit:focus-visible {
  outline: none;
  border-color: #7e94a8;
  color: #2f465d;
  background: rgba(255, 255, 255, 0.72);
}

.top-strip-metrics .ant-btn,
.platform-utilities .ant-btn {
  border-color: transparent;
  color: rgba(255, 255, 255, 0.92);
  background: transparent;
}

.top-strip-metrics .ant-btn:hover,
.platform-utilities .ant-btn:hover {
  border-color: transparent;
  color: #ffffff;
  background: rgba(255, 255, 255, 0.1);
}

.platform-current-user {
  min-width: auto;
  padding: 0 6px;
  border: 0;
  background: transparent;
  font-weight: 500;
}

.platform-utilities {
  gap: 2px;
  padding-left: 8px;
  border-left-color: rgba(255, 255, 255, 0.18);
}

@media (max-width: 767px) {
  .top-strip-title {
    flex-basis: 72px;
  }

  .top-strip-title .ant-typography {
    max-width: 72px;
  }

  .top-strip-metrics .ant-btn,
  .platform-utilities .ant-btn {
    padding-inline: 4px;
    font-size: 11px;
  }

  .platform-current-user {
    padding-inline: 2px;
    font-size: 11px;
  }

  .platform-login-panel {
    width: min(420px, 100%);
    padding: 0 10px;
  }
}

/* v041.2.15 coordinated lightweight workspace chrome */
:root {
  --chrome: #dce6ee;
  --chrome-strong: #cedae5;
  --navigation-surface: #edf3f7;
  --navigation-hover: #e1e9f0;
}

.brand-bar,
.top-strip {
  border-color: #cfdbe5;
  color: #263b4f;
  background: var(--chrome);
}

.brand-title-button.ant-btn,
.top-strip-title .ant-typography:first-child {
  color: #263b4f;
}

.top-strip-title .ant-typography-secondary {
  color: #61758a;
  opacity: 1;
}

.top-strip-metrics .ant-tag,
.top-strip-metrics .ant-tag-success {
  color: #52677b;
}

.top-strip-metrics .ant-tag-success::before {
  background: var(--success);
}

.top-strip-metrics .ant-btn,
.platform-utilities .ant-btn {
  border-color: transparent;
  color: #42586d;
  background: transparent;
}

.top-strip-metrics .ant-btn:hover,
.platform-utilities .ant-btn:hover {
  border-color: transparent;
  color: #213b54;
  background: rgba(255, 255, 255, 0.46);
}

.platform-current-user {
  color: #344b61;
}

.platform-utilities {
  border-left-color: #bfcdda;
}

.ops-sider,
.ops-menu.ant-menu {
  background: var(--navigation-surface) !important;
}

/* v041.2.15 integrated brand login canvas */
.platform-login-shell {
  padding: 28px;
  background: var(--chrome);
}

.platform-login-panel {
  width: min(520px, 100%);
}

.platform-login-brand {
  margin-bottom: 24px;
}

.platform-login-brand h1 {
  color: #263b4f;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.4;
}

.platform-login-form {
  grid-template-columns: minmax(0, 1fr) 84px;
}

.platform-login-input,
.platform-login-submit {
  height: 42px;
  font-size: 14px;
  line-height: 40px;
}

.platform-login-input {
  padding: 0 14px;
  border-color: #b8c8d5;
  border-radius: 7px 0 0 7px;
  background: rgba(255, 255, 255, 0.86);
}

.platform-login-input::placeholder {
  color: #7b8d9f;
}

.platform-login-input:hover,
.platform-login-input:focus {
  border-color: #8fa5b7;
  background: #ffffff;
  box-shadow: 0 0 0 2px rgba(89, 116, 140, 0.08);
}

.platform-login-submit {
  min-width: 84px;
  border-color: #aabcca;
  border-radius: 0 7px 7px 0;
  color: #344e64;
  background: #cfdee9;
}

.platform-login-submit:hover,
.platform-login-submit:focus-visible {
  border-color: #8fa5b7;
  color: #203c54;
  background: #c4d5e2;
}

.platform-login-feedback {
  min-height: 30px;
  padding-top: 8px;
  font-size: 12px;
  line-height: 22px;
}

@media (max-width: 767px) {
  .platform-login-shell {
    padding: 24px;
  }

  .platform-login-panel {
    width: min(360px, 100%);
    padding: 0;
  }

  .platform-login-brand {
    margin-bottom: 20px;
  }

  .platform-login-brand h1 {
    font-size: 20px;
  }

  .platform-login-form {
    grid-template-columns: minmax(0, 1fr) 78px;
  }

  .platform-login-submit {
    min-width: 78px;
  }
}

/* v041.2.16 compact navigation and structured top utilities */
.brand-bar {
  padding-inline: 12px 7px;
}

.brand-title-button.ant-btn {
  font-size: var(--font-md);
}

.ops-menu.ant-menu {
  padding-inline: 6px;
}

.top-strip-tools {
  gap: 8px;
}

.top-strip-metrics,
.platform-utilities {
  gap: 2px;
}

.top-strip-tools .ant-tag,
.top-strip-tools .ant-btn,
.platform-current-user {
  height: 28px;
  margin: 0;
  padding-inline: 7px;
  font-size: var(--font-sm);
  font-weight: 500;
  line-height: 28px;
}

.platform-utilities {
  padding-left: 7px;
}

.release-history-trigger.ant-btn {
  min-width: 0;
  color: #40566b;
  font-variant-numeric: tabular-nums;
}

.platform-user-trigger.ant-btn {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 4px;
  color: #344b61;
}

.platform-user-indicator {
  position: relative;
  top: -1px;
  color: #6f8192;
  font-size: 12px;
  font-weight: 400;
  line-height: 1;
}

.platform-user-popover .ant-popover-inner {
  min-width: 120px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 6px;
  box-shadow: 0 8px 20px rgba(36, 55, 72, 0.12);
}

.platform-user-popover .ant-popover-inner-content {
  padding: 0;
}

.platform-account-menu { display: grid; }

.platform-account-action.ant-btn {
  width: 100%;
  height: 28px;
  justify-content: flex-start;
  padding-inline: 8px;
  color: var(--text);
  font-size: var(--font-sm);
  font-weight: 400;
}

.platform-account-action.ant-btn:hover {
  color: var(--text);
  background: var(--surface-muted);
}

@media (max-width: 767px) {
  .ops-sider:not(.ant-layout-sider-collapsed) {
    width: min(200px, calc(100vw - 44px)) !important;
    min-width: min(200px, calc(100vw - 44px)) !important;
    max-width: min(200px, calc(100vw - 44px)) !important;
  }

  .top-strip-tools .ant-tag,
  .top-strip-tools .ant-btn {
    padding-inline: 5px;
    font-size: 12px;
  }
}

/* v041.3 final visual overrides stay last so legacy version blocks cannot win. */
:root {
  --bg: #f1f5f9;
  --surface-soft: #f6f8fb;
  --surface-muted: #edf2f7;
  --line: #dce4ec;
  --line-strong: #cbd7e3;
  --line-soft: #e8edf3;
  --text: #1e2d3d;
  --muted: #6b7c8e;
  --accent: #2f6fe4;
  --accent-soft: #e7f0fd;
  --chrome: #f4f7fa;
  --navigation-surface: #f8fafc;
  --navigation-hover: #edf2f7;
}

.global-system-bar,
.top-strip {
  color: var(--text);
  background: var(--chrome);
}

.system-brand .brand-title-button.ant-btn,
.top-strip-title .ant-typography:first-child {
  color: #223449;
}

.top-strip-title .ant-typography-secondary {
  color: #718296;
  opacity: 1;
}

.ops-sider,
.ops-menu.ant-menu {
  background: var(--navigation-surface) !important;
}

.ops-menu .ant-menu-item:hover,
.ops-menu .ant-menu-submenu-title:hover {
  color: #1f3851 !important;
  background: var(--navigation-hover) !important;
}

.ops-menu .ant-menu-item-selected {
  color: #205fc5 !important;
  background: #e5eefb !important;
  box-shadow: inset 2px 0 0 var(--accent);
}

.top-strip-tools .ant-tag,
.top-strip-tools .ant-btn,
.platform-user-trigger.ant-btn,
.release-history-trigger.ant-btn {
  color: #40566d;
  background: transparent;
}

.top-strip-tools .ant-btn:hover,
.platform-user-trigger.ant-btn:hover,
.release-history-trigger.ant-btn:hover {
  color: #1f3d59;
  background: rgba(255, 255, 255, 0.72);
}

.platform-utilities {
  border-left-color: #d5dee7;
}

.platform-login-shell {
  place-items: center;
  background: var(--chrome);
}

.platform-login-panel {
  width: min(420px, 100%);
  padding: 0;
  transform: translateY(clamp(-72px, -7vh, -40px));
}

.platform-login-brand {
  margin-bottom: 22px;
}

.platform-login-brand h1 {
  color: #223449;
  font-size: 22px;
  font-weight: 500;
}

.platform-login-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}

.platform-login-input,
.platform-login-submit {
  width: 100%;
  min-width: 0;
  height: 42px;
  border: 1px solid #b9c8d6;
  border-radius: 7px;
  font-size: 14px;
  line-height: 40px;
}

.platform-login-input {
  padding: 0 14px;
  background: rgba(255, 255, 255, 0.9);
}

.platform-login-submit {
  color: #294a68;
  background: #d9e5ef;
}

.platform-login-submit:hover,
.platform-login-submit:focus-visible {
  border-color: #8fa5b7;
  color: #183d5d;
  background: #cfdeea;
}

.map-stage {
  padding: 0;
  overflow: hidden;
  background: #f4f7fa;
}

.zone-canvas-new {
  border: 0;
  border-radius: 0;
  background: #f8fafc;
  box-shadow: none;
}

.map-floating-actions {
  top: 12px;
  right: 12px;
  border-color: rgba(201, 214, 226, 0.88);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 5px 16px rgba(39, 61, 82, 0.08);
}

.map-cell {
  stroke: #e7edf3;
}

.cell-empty {
  fill: #f8fafc;
}

.cell-road {
  fill: #dfe7ee;
}

.service-area-cell {
  fill: rgba(56, 162, 145, 0.54);
  stroke: #2b8779;
}

.ops-center-cell {
  fill: rgba(72, 111, 168, 0.76);
  stroke: #315b91;
}

.zone-boundary {
  stroke: #5b8de2;
}

.legend-new {
  min-height: 36px;
  padding: 8px 12px;
  border-top-color: var(--line);
  color: #6d7e8f;
  background: #fbfcfe;
}

@media (max-width: 767px) {
  .ops-sider:not(.ant-layout-sider-collapsed) {
    top: 52px;
  }

  .platform-login-panel {
    width: min(360px, 100%);
    transform: translateY(clamp(-48px, -5vh, -24px));
  }

  .platform-login-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .platform-login-submit {
    min-width: 0;
  }
}

/* v041.3.1 interaction and lightweight map projection refinements */
.platform-login-brand h1 {
  text-align: center;
}

.platform-login-form {
  gap: 6px;
}

.platform-login-input {
  text-align: center;
  caret-color: #5d7890;
}

.platform-login-submit {
  border-color: #c8d4df;
  color: #405a71;
  background: #e9eff4;
}

.platform-login-submit:hover,
.platform-login-submit:focus-visible {
  border-color: #aebfce;
  color: #294a65;
  background: #e1e9f0;
}

.system-brand.collapsed {
  gap: 2px;
  padding-inline: 4px;
}

.system-brand.collapsed .brand-title-button.ant-btn {
  width: 22px;
  min-width: 22px;
  flex: none;
  justify-content: center;
  font-size: 14px;
}

.menu-group-icon {
  display: inline-flex;
  width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
  color: currentColor;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
}

.ops-menu.ant-menu-inline-collapsed > .ant-menu-item,
.ops-menu.ant-menu-inline-collapsed > .ant-menu-submenu > .ant-menu-submenu-title {
  width: 46px;
  margin-inline: 0;
  padding-inline: 14px !important;
}

.ops-menu.ant-menu-inline-collapsed .menu-group-icon {
  margin-inline: 0 !important;
}

.top-strip-metric {
  color: #718296;
  font-size: var(--font-xs);
  font-weight: 400;
  white-space: nowrap;
}

/* v041.3.2 user-facing update history */
.release-history-item summary {
  position: relative;
  padding-right: 18px;
  cursor: pointer;
  list-style: none;
}

.release-history-item summary::-webkit-details-marker {
  display: none;
}

.release-history-item summary::after {
  position: absolute;
  top: 1px;
  right: 1px;
  color: #8191a2;
  content: "›";
  font-size: 15px;
  line-height: 1;
  transition: transform 120ms ease;
}

.release-history-item details[open] > summary::after {
  transform: rotate(90deg);
}

.release-history-item summary:focus-visible {
  border-radius: 4px;
  outline: 2px solid rgba(47, 111, 228, 0.28);
  outline-offset: 2px;
}

.release-history-item summary p {
  margin: 5px 0 0;
  color: #465a6f;
  font-size: var(--font-xs);
  font-weight: 500;
  line-height: 1.5;
}

.release-history-item details > ul {
  margin: 8px 0 1px 2px;
  padding-left: 14px;
  border-left: 1px solid #dce5ed;
  color: #66788a;
  font-size: 11px;
  line-height: 1.6;
}

.release-history-item details > ul li + li {
  margin-top: 4px;
}

.release-history-more.ant-btn {
  width: 100%;
  height: 34px;
  margin-top: 6px;
  color: #4e667d;
  font-size: var(--font-xs);
  font-weight: 500;
}

.release-history-more.ant-btn:hover,
.release-history-more.ant-btn:focus-visible {
  color: #274d72;
  background: var(--surface-muted);
}

/* v041.4 unified responsive viewport foundation */
:root {
  --app-viewport-width: 100vw;
  --app-viewport-height: 100dvh;
  --app-viewport-offset-left: 0px;
  --app-viewport-offset-top: 0px;
  --keyboard-inset: 0px;
}

html,
body,
#app {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  height: 100%;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  position: fixed;
  inset: 0;
  overflow: hidden;
  overscroll-behavior: none;
}

.ops-shell {
  width: 100%;
  max-width: 100vw;
  height: var(--app-viewport-height);
  min-height: 0;
  overflow-x: hidden;
}

.ops-workspace-shell,
.ops-main-layout,
.workbench,
.work-content,
.record-page-new,
.map-page-new {
  min-height: 0;
}

.ops-workspace-shell,
.ops-main-layout {
  width: 100%;
  max-width: 100%;
  height: 100%;
  overflow-x: hidden;
}

.workbench,
.workbench.detail-collapsed {
  height: auto;
  flex: 1 1 auto;
}

.platform-login-shell {
  position: fixed;
  top: var(--app-viewport-offset-top);
  right: auto;
  bottom: auto;
  left: var(--app-viewport-offset-left);
  width: var(--app-viewport-width);
  max-width: var(--app-viewport-width);
  height: var(--app-viewport-height);
  min-height: 0;
  display: block;
  padding: max(24px, env(safe-area-inset-top)) 24px max(24px, env(safe-area-inset-bottom));
  overflow: hidden;
  overscroll-behavior: none;
}

.platform-login-panel {
  position: absolute;
  top: clamp(96px, 16svh, 156px);
  right: max(24px, env(safe-area-inset-right));
  left: max(24px, env(safe-area-inset-left));
  width: auto;
  max-width: 420px;
  margin-inline: auto;
  margin-top: 0;
  transform: none;
}

html[data-keyboard-open="true"] .platform-login-shell {
  padding-top: max(24px, env(safe-area-inset-top));
  padding-bottom: max(24px, env(safe-area-inset-bottom));
}

html[data-keyboard-open="true"] .platform-login-panel {
  margin-top: 0;
  top: clamp(96px, 16svh, 156px);
}

.ops-menu,
.work-content,
.detail-panel-new,
.release-history-scroll,
.ant-modal-content {
  scroll-padding-bottom: calc(var(--keyboard-inset) + 16px);
}

@media (min-width: 768px) and (max-width: 1023px) {
  .top-strip-metrics .top-strip-metric:nth-of-type(n + 3) {
    display: none;
  }

  .detail-rail {
    width: 292px;
  }
}

@media (max-width: 767px) {
  .global-system-bar {
    padding-top: env(safe-area-inset-top);
  }

  .system-brand,
  .system-brand.collapsed {
    width: 52px;
    min-width: 52px;
    padding-inline: 2px;
  }

  .system-brand.collapsed .brand-title-button.ant-btn {
    width: 20px;
    min-width: 20px;
  }

  .system-brand > .ant-btn:last-child {
    width: 26px;
    min-width: 26px;
  }

  .ops-sider.ant-layout-sider-collapsed {
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    flex: 0 0 52px !important;
  }

  .ops-sider:not(.ant-layout-sider-collapsed) {
    top: 52px;
    bottom: 0;
    height: calc(var(--app-viewport-height) - 52px);
  }

  .ops-sider .ant-layout-sider-children,
  .ops-menu.ant-menu {
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
  }

  .ops-menu.ant-menu-inline-collapsed > .ant-menu-item,
  .ops-menu.ant-menu-inline-collapsed > .ant-menu-submenu > .ant-menu-submenu-title {
    width: 38px;
    padding-inline: 10px !important;
  }

  .ops-main-layout {
    width: auto;
    min-width: 0;
    flex: 1 1 auto;
  }

  .top-strip {
    min-width: 0;
    gap: 4px;
    padding: 0 6px 0 8px;
  }

  .top-strip-title {
    min-width: 0;
    flex: 1 1 auto;
  }

  .top-strip-title .ant-typography {
    max-width: 100%;
  }

  .top-strip-title .ant-typography-secondary,
  .top-strip-metrics {
    display: none;
  }

  .top-strip-tools {
    min-width: 0;
    flex: none;
    overflow: visible;
  }

  .platform-utilities {
    display: flex;
    padding-left: 4px;
  }

  .release-history-trigger.ant-btn,
  .platform-user-trigger.ant-btn {
    height: 28px;
    padding-inline: 5px;
    font-size: 12px;
  }

  .workspace-bar {
    flex: 0 0 38px;
  }

  .workspace-scroll {
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
  }

  .workspace-scroll::-webkit-scrollbar {
    display: none;
  }

  .workbench,
  .workbench.detail-collapsed {
    display: block;
    height: auto;
    min-height: 0;
  }

  .work-content {
    width: 100%;
    height: 100%;
    overflow: hidden;
  }

  .detail-rail {
    width: 100%;
    max-width: 100%;
  }

  .workbench.detail-collapsed .detail-rail {
    width: 40px;
  }

  .record-page-new,
  .map-page-new,
  .record-table-section,
  .event-log-section {
    max-width: 100%;
  }

  .list-filter-bar,
  .list-action-bar,
  .status-segment-bar,
  .record-table-section {
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
  }

  .platform-login-shell {
    padding-inline: 0;
  }

  .platform-login-panel {
    right: max(20px, env(safe-area-inset-right));
    left: max(20px, env(safe-area-inset-left));
    width: auto;
    max-width: 420px;
    top: clamp(72px, 12svh, 108px);
    margin-top: 0;
  }

  .platform-login-input,
  .platform-login-submit {
    font-size: 16px;
  }

  .release-history-panel {
    top: calc(var(--app-viewport-offset-top) + 58px);
    right: 8px;
    left: 8px;
    width: auto;
    max-height: calc(var(--app-viewport-height) - 68px);
  }

  .project-readme-panel {
    position: fixed;
    top: calc(var(--app-viewport-offset-top) + 58px);
    right: 8px;
    left: 8px;
    width: auto;
    max-height: calc(var(--app-viewport-height) - 68px);
  }

  .project-readme-scroll { padding: 10px 14px 18px; }

  .ant-modal {
    top: 12px;
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px);
    margin: 0 auto;
    padding-bottom: 12px;
  }

  .ant-modal-content {
    max-height: calc(var(--app-viewport-height) - 24px);
    overflow-y: auto;
  }
}

/* v042.0 final map-scene ownership overrides */
.map-page-new {
  display: block;
  position: relative;
  height: 100%;
  grid-template-rows: none;
  overflow: hidden;
  background: var(--surface-soft);
}

.map-stage {
  position: absolute;
  inset: 0;
  padding: 0;
  overflow: hidden;
  background: #eef3f6;
}

.zone-canvas-new {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 0;
  background: #eef3f6;
  box-shadow: none;
  cursor: grab;
  touch-action: none;
}

.map-floating-actions {
  top: 12px;
  right: 12px;
  border-color: rgba(201, 214, 226, 0.9);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 4px 14px rgba(39, 61, 82, 0.08);
}

.map-floating-actions .ant-btn {
  min-width: 28px;
  height: 28px;
  padding-inline: 8px;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.service-area-cell {
  fill: rgba(49, 155, 137, 0.54);
  stroke: rgba(31, 117, 103, 0.82);
}

.legend-new,
.map-network-summary {
  display: none;
}

/* v042.0.1 effective operational-map overrides */
.map-grid { opacity: 0.38; }
.map-grid-line { stroke: #dfe6ec; stroke-width: 0.026; }
.map-zone-fill { fill: rgba(184, 211, 198, 0.12); }
.map-zone-object[data-planned="true"] .map-zone-fill { fill: rgba(218, 205, 172, 0.11); }
.map-zone-boundary { fill: none; stroke-width: 0.09; opacity: 0.72; pointer-events: stroke; }
.map-zone-boundary[data-active="true"] { stroke-width: 0.18; opacity: 1; }
.map-place-object rect { opacity: 0.68; stroke-width: 0.06; }
.map-road-cells { fill: rgba(205, 216, 225, 0.74); stroke: rgba(205, 216, 225, 0.74); stroke-width: 0.035; vector-effect: non-scaling-stroke; cursor: pointer; }
.map-road-object[data-planned="true"] .map-road-cells { fill: rgba(220, 211, 187, 0.56); stroke: rgba(186, 168, 126, 0.66); stroke-dasharray: 0.35 0.24; }
.map-anchor-label { pointer-events: none; }
.map-anchor-label circle { fill: rgba(255, 255, 255, 0.96); stroke: #75899a; stroke-width: 0.055; vector-effect: non-scaling-stroke; }
.map-anchor-label path { fill: none; stroke: #91a1af; stroke-width: 0.055; vector-effect: non-scaling-stroke; }
.map-anchor-label text { fill: #445665; font-size: 0.54px; font-weight: 400; letter-spacing: 0; paint-order: stroke; stroke: rgba(248, 250, 252, 0.94); stroke-width: 0.15; stroke-linejoin: round; }
.map-zone-anchor text { fill: #334b43; font-size: 0.6px; }
.map-road-anchor,
.map-service-area-anchor { display: none; }
.map-stage[data-zoom-band="detail"] .map-road-anchor,
.map-stage[data-zoom-band="detail"] .map-service-area-anchor { display: block; }
.map-stage[data-zoom-band="detail"] .map-zone-anchor,
.map-stage[data-zoom-band="detail"] .map-place-anchor { display: none; }
.service-area-cell { fill: rgba(77, 155, 143, 0.42); stroke: rgba(52, 126, 115, 0.72); stroke-width: 0.055; pointer-events: all; }
.ops-center-cell,
.road-node { pointer-events: all; }
.map-selected-cell { fill: rgba(47, 111, 228, 0.12); stroke: var(--accent); stroke-width: 0.22; vector-effect: non-scaling-stroke; pointer-events: none; }
.robotaxi-map-halo { fill: rgba(255, 255, 255, 0.94); stroke-width: 0.055; }
.robotaxi-map-marker { pointer-events: none; }
.robotaxi-map-image { filter: drop-shadow(0 0.05px 0.08px rgba(33, 62, 86, 0.34)); }
.robotaxi-map-object { cursor: pointer; }
.road-node-layer { display: none; }
.map-stage[data-zoom-band="detail"] .road-node-layer { display: block; }
.map-stage[data-zoom-band="detail"] .map-road-cells { stroke: rgba(166, 181, 193, 0.58); }
.map-hover-card { width: 210px; padding: 9px 10px; border-color: rgba(207, 218, 228, 0.9); background: rgba(255, 255, 255, 0.94); box-shadow: 0 8px 20px rgba(39, 61, 82, 0.1); backdrop-filter: blur(12px); }
.map-hover-card > strong { font-size: 12px; font-weight: 500; }
.map-hover-card dl { gap: 3px; margin-top: 6px; }

@media (max-width: 560px) {
  .map-zone-anchor,
  .map-place-anchor { display: block !important; }
  .map-road-anchor,
  .map-service-area-anchor { display: none !important; }
  .map-anchor-label text { font-size: 0.46px; }
  .map-zone-anchor text { font-size: 0.5px; }
  .map-stage[data-zoom-band="detail"] .map-zone-anchor,
  .map-stage[data-zoom-band="detail"] .map-place-anchor { display: none !important; }
}

@media (min-width: 768px) {
  .console-workbench,
  .console-workbench.detail-collapsed { position: relative; display: block; }
  .console-workbench > .work-content { position: absolute; inset: 0; }
  .console-workbench > .detail-rail {
    position: absolute;
    z-index: 5;
    top: 0;
    right: 0;
    bottom: 0;
    width: 328px;
    box-shadow: -8px 0 20px rgba(39, 61, 82, 0.045);
  }
  .console-workbench.detail-collapsed > .detail-rail { width: 40px; }
  .console-workbench:not(.detail-collapsed) .map-floating-actions { right: 340px !important; }
  .console-workbench.detail-collapsed .map-floating-actions { right: 52px !important; }
}

.map-hover-card.touch {
  display: grid;
  width: min(260px, calc(100% - 16px));
  max-height: min(210px, calc(100% - 16px));
  overflow-y: auto;
  pointer-events: auto;
}

.map-hover-detail-action {
  justify-self: end;
  height: 28px;
  margin-top: 6px;
  padding-inline: 6px;
  color: var(--accent);
  font-size: var(--font-xs);
}

@media (max-width: 767px) {
  .map-hover-card.touch {
    display: grid;
    padding: 9px 10px 7px;
    border-color: rgba(201, 214, 226, 0.94);
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 8px 20px rgba(39, 61, 82, 0.12);
  }
}
.forecast-analysis {
  min-height: 0;
  overflow: auto;
  padding: 12px;
  background: var(--surface);
}

.forecast-analysis-toolbar,
.forecast-trend-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.forecast-result-switcher,
.forecast-analysis-actions,
.forecast-time-unit-switcher {
  display: flex;
  gap: 6px;
  min-width: 0;
  overflow-x: auto;
}
.forecast-result-switcher .ant-select { width: min(360px, 56vw); }
.forecast-action-feedback { align-self: center; color: var(--danger); font-size: var(--font-xs); }

.forecast-context-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  margin: 10px 0;
  padding: 8px 0;
  border-block: 1px solid var(--line-soft);
  color: var(--muted);
  font-size: var(--font-xs);
}

.analysis-summary-grid,
.metric-card-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(128px, 1fr));
  gap: 8px;
}

.analysis-summary-card,
.metric-summary-card {
  display: grid;
  gap: 5px;
  min-width: 0;
  min-height: 78px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--text);
  background: #fbfcfe;
  text-align: left;
}

.analysis-summary-card span,
.metric-summary-card span,
.forecast-analysis-row span {
  overflow: hidden;
  color: #59616c;
  font-size: var(--font-xs);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analysis-summary-card strong,
.metric-summary-card strong {
  color: #20252c;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
}

.forecast-trend-section {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line-soft);
}

.forecast-trend-toolbar > div:first-child {
  display: grid;
  gap: 2px;
}

.forecast-trend-toolbar strong { font-size: var(--font-sm); font-weight: 600; }
.forecast-trend-toolbar small { color: var(--muted); font-size: var(--font-xs); }

.forecast-trend-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  margin-top: 8px;
}

.planning-field-explanations { display: grid; gap: 0; }
.planning-field-explanations section { padding: 10px 0; border-bottom: 1px solid var(--line-soft); }
.planning-field-explanations strong { display: block; margin-bottom: 4px; font-size: var(--font-xs); font-weight: 600; }
.planning-field-explanations p { margin: 0; color: var(--muted); font-size: var(--font-xs); line-height: 1.65; }
.planning-config-help { color: var(--muted); font-size: 11px; font-weight: 400; line-height: 1.5; }
.forecast-analysis-grid section { background: var(--surface); border-top: 1px solid var(--line-soft); padding: 12px 0; }
.forecast-analysis-grid { display: grid; grid-template-columns: repeat(3, minmax(220px, 1fr)); gap: 8px; margin-top: 8px; }
.forecast-analysis-grid h3 { margin: 0 0 8px; font-size: 14px; }
.forecast-analysis-row { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-top: 1px solid var(--line-soft); }
.forecast-analysis-row strong { font-size: 12px; font-weight: 600; text-align: right; }
.forecast-calculation-details { margin-top: 8px; background: var(--surface); border-top: 1px solid var(--line-soft); padding: 10px 0; }
.forecast-calculation-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 13px; font-weight: 600; }
.forecast-calculation-step { display: grid; grid-template-columns: minmax(150px, 180px) minmax(0, 1fr) minmax(104px, auto); gap: 10px; padding: 7px 0; border-top: 1px solid var(--line-soft); }
.forecast-calculation-group h4 { margin: 10px 0 4px; color: var(--muted); font-size: var(--font-xs); font-weight: 600; }
.forecast-calculation-step span { display: flex; gap: 7px; align-items: baseline; }
.forecast-calculation-step em { min-width: 18px; color: var(--muted); font-size: 10px; font-style: normal; }
.forecast-calculation-step small { color: var(--muted); }
.forecast-calculation-step strong { text-align: right; }
.forecast-calculation-title { align-content: start; }
.forecast-calculation-title > span { display: grid; gap: 2px; min-width: 0; }
.forecast-calculation-title b { font-size: var(--font-sm); font-weight: 600; }
.forecast-calculation-title i { color: var(--muted); font-size: var(--font-xs); font-style: normal; }
.forecast-calculation-explanation { display: grid; gap: 3px; min-width: 0; }
.forecast-calculation-explanation small { overflow-wrap: anywhere; line-height: 1.55; }
.forecast-calculation-explanation small b { color: var(--text-soft); font-weight: 600; }
.forecast-calculation-source { margin-left: 14px; }
.forecast-calculation-formula { color: var(--text-soft) !important; }

@media (max-width: 767px) {
  .forecast-analysis { padding: 10px; }
  .forecast-analysis-toolbar,
  .forecast-trend-toolbar { align-items: stretch; flex-direction: column; }
  .analysis-summary-grid { grid-template-columns: repeat(2, minmax(130px, 1fr)); }
  .forecast-trend-grid { grid-template-columns: 1fr; }
  .data-chart { padding: 10px; }
  .data-chart-viewport { height: 220px; }
  .forecast-analysis-grid { grid-template-columns: 1fr; }
  .forecast-result-switcher .ant-select { width: 100%; }
  .forecast-calculation-step { grid-template-columns: 1fr; gap: 3px; }
  .forecast-calculation-step strong { text-align: left; }
  .forecast-calculation-source { display: block; margin-left: 0; }
}

/* Shared page presentation contract. Keep this final so legacy page styles cannot override it. */
.page-presentation-analysis,
.page-presentation-record,
.analysis-content-viewport {
  min-width: 0;
  max-width: 100%;
}

.analysis-content-viewport {
  flex: 0 0 auto;
  overflow-x: auto;
  overflow-y: visible;
  overscroll-behavior-x: contain;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
}

.analysis-content-viewport > * {
  min-width: 0;
  max-width: 100%;
}

.decision-center-panel { display: grid; gap: 18px; padding: 18px; color: var(--text); }
.supply-position-panel { display: grid; gap: 16px; padding: 18px; color: var(--text); }
.supply-position-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 14px; border-bottom: 1px solid var(--line-soft); }
.supply-position-header h2 { margin: 4px 0 6px; font-size: 20px; font-weight: 600; }
.supply-position-header p { max-width: 760px; margin: 0; color: var(--muted); font-size: var(--font-sm); line-height: 1.6; }
.supply-position-health { flex: none; padding: 6px 9px; border: 1px solid #b9d6c9; border-radius: 4px; color: #36755e; background: #f3faf7; font-size: var(--font-xs); }
.supply-position-health.is-warning { border-color: #e2c996; color: #8a641d; background: #fffaf0; }
.supply-position-summary { grid-template-columns: repeat(6, minmax(120px, 1fr)); }
.supply-position-section { min-width: 0; border-top: 1px solid var(--line-soft); padding-top: 12px; }
.supply-position-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 9px; }
.supply-position-section-heading h3 { margin: 0 0 3px; font-size: var(--font-sm); font-weight: 600; }
.supply-position-section-heading small { color: var(--muted); font-size: var(--font-xs); }
.supply-position-filters { display: flex; flex: none; gap: 8px; }
.supply-position-filters .ant-select { min-width: 150px; }
.supply-position-section .ant-table-wrapper { min-width: 0; }
.supply-position-section .ant-table-cell { overflow-wrap: anywhere; }
.decision-center-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding-bottom: 16px; border-bottom: 1px solid var(--line-soft); }
.decision-center-header h2 { margin: 4px 0 6px; font-size: 20px; font-weight: 600; }
.decision-center-header p { max-width: 760px; margin: 0; color: var(--muted); font-size: var(--font-sm); line-height: 1.6; }
.decision-health { display: grid; min-width: 128px; gap: 3px; padding-left: 18px; border-left: 2px solid #74b99c; text-align: right; }
.decision-health.is-warning { border-left-color: #d5a957; }
.decision-health span { color: var(--muted); font-size: var(--font-xs); }
.decision-health strong { font-size: 22px; font-weight: 600; }
.decision-summary-grid { display: grid; grid-template-columns: repeat(6, minmax(112px, 1fr)); border-block: 1px solid var(--line-soft); }
.decision-data-contract { display: flex; gap: 14px; overflow-x: auto; padding: 7px 0; color: var(--muted); font-size: var(--font-xs); white-space: nowrap; scrollbar-width: none; }
.decision-summary-item { display: grid; gap: 6px; padding: 12px 14px; border-right: 1px solid var(--line-soft); }
.decision-summary-item:last-child { border-right: 0; }
.decision-summary-item span { color: var(--muted); font-size: var(--font-xs); }
.decision-summary-item strong { font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums; }
.decision-section { min-width: 0; }
.decision-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 9px; }
.decision-section-heading h3 { margin: 2px 0 0; font-size: 15px; font-weight: 600; }
.decision-section-heading small { color: var(--muted); font-size: var(--font-xs); }
.decision-capability-grid { display: grid; grid-template-columns: repeat(5, minmax(190px, 1fr)); gap: 8px; }
.decision-capability { display: grid; min-width: 0; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 6px; background: #fbfcfe; }
.decision-capability-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.decision-capability-title span { color: var(--muted); font-size: 11px; }
.decision-capability-title h4 { margin: 2px 0 0; font-size: 14px; font-weight: 600; }
.decision-capability dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 12px; margin: 0; }
.decision-capability dl > div { display: grid; gap: 2px; }
.decision-capability dt { color: var(--muted); font-size: 11px; }
.decision-capability dd { margin: 0; font-size: var(--font-xs); font-variant-numeric: tabular-nums; }
.decision-capability-actions { display: flex; gap: 2px; overflow-x: auto; padding-top: 6px; border-top: 1px solid var(--line-soft); scrollbar-width: none; }
.decision-capability-actions .ant-btn { padding-inline: 4px; color: var(--accent); font-size: 11px; }
.decision-table-scroll { overflow-x: auto; border: 1px solid var(--line); border-radius: 6px; }
.decision-table { width: 100%; min-width: 760px; border-collapse: collapse; font-size: var(--font-xs); }
.decision-table th { padding: 8px 10px; background: var(--surface-soft); color: var(--muted); font-weight: 500; text-align: left; }
.decision-table td { padding: 9px 10px; border-top: 1px solid var(--line-soft); }
.decision-status { color: #536273; }
.decision-status.is-success { color: #237a57; }
.decision-status.is-partial, .decision-status.is-failed { color: #a36722; }
.decision-lower-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr); gap: 18px; }
.decision-exception-list, .decision-effect-list { display: grid; border-top: 1px solid var(--line-soft); }
.decision-exception-list button, .decision-effect-list > div { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 16px; padding: 9px 2px; border: 0; border-bottom: 1px solid var(--line-soft); background: transparent; color: inherit; font: inherit; text-align: left; }
.decision-exception-list button { cursor: pointer; }
.decision-exception-list span, .decision-effect-list span { color: var(--muted); font-size: var(--font-xs); }
.decision-exception-list strong, .decision-effect-list strong { overflow: hidden; font-size: var(--font-xs); font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.decision-empty-state { padding: 18px 0; color: var(--muted); font-size: var(--font-xs); }

@media (max-width: 1100px) {
  .decision-summary-grid { grid-template-columns: repeat(3, minmax(112px, 1fr)); }
  .decision-summary-item:nth-child(3) { border-right: 0; }
  .decision-capability-grid { grid-template-columns: repeat(2, minmax(190px, 1fr)); }
}

@media (max-width: 767px) {
  .decision-center-panel { gap: 14px; padding: 12px; }
  .supply-position-panel { gap: 12px; padding: 12px; }
  .supply-position-header,
  .supply-position-filter-heading { align-items: stretch; flex-direction: column; }
  .supply-position-header h2 { font-size: 18px; }
  .supply-position-health { align-self: flex-start; }
  .supply-position-summary { grid-template-columns: repeat(2, minmax(130px, 1fr)); }
  .supply-position-filters { width: 100%; }
  .supply-position-filters .ant-select { flex: 1 1 0; min-width: 0; }
  .decision-center-header { display: grid; gap: 10px; }
  .decision-health { min-width: 0; padding: 8px 0 0; border-top: 2px solid #74b99c; border-left: 0; text-align: left; }
  .decision-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .decision-summary-item:nth-child(2n) { border-right: 0; }
  .decision-capability-grid, .decision-lower-grid { grid-template-columns: 1fr; }
  .decision-section-heading { align-items: flex-start; flex-direction: column; gap: 3px; }
}

.detail-tabs-control {
  min-width: 0;
}

.detail-tabs-scroll {
  display: flex;
  min-width: 0;
  align-items: stretch;
  gap: 24px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0 14px;
  border-bottom: 1px solid var(--line);
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.detail-tabs-scroll::-webkit-scrollbar {
  display: none;
}

.detail-tab-button {
  position: relative;
  flex: 0 0 auto;
  height: 38px;
  padding: 0;
  border: 0;
  color: var(--muted);
  background: transparent;
  font: inherit;
  cursor: pointer;
  white-space: nowrap;
}

.detail-tab-button:hover,
.detail-tab-button:focus-visible {
  color: var(--text);
}

.detail-tab-button:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.detail-tab-button.is-active {
  color: var(--accent);
  font-weight: 600;
}

.detail-tab-button.is-active::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  background: var(--accent);
  content: "";
}

.detail-tabs-content-only > .ant-tabs-nav {
  display: none !important;
}

.row-action-cell {
  display: inline-flex;
  max-width: 100%;
  align-items: center;
}

@media (max-width: 767px) {
  .platform-login-brand h1 {
    font-size: 20px;
    line-height: 1.35;
  }

  .page-presentation-analysis {
    width: 100%;
    overflow-x: hidden;
  }

  .analysis-content-viewport {
    width: 100%;
    padding-bottom: 4px;
  }

  .page-presentation-analysis .metric-card-grid,
  .page-presentation-analysis .analysis-summary-grid {
    grid-template-columns: repeat(2, minmax(136px, 1fr));
  }

  .page-presentation-analysis .metric-comparison-grid,
  .page-presentation-analysis .metric-trend-grid {
    grid-template-columns: minmax(244px, 1fr);
  }

  .page-presentation-analysis .metric-planning-baseline,
  .page-presentation-analysis .metric-quality-strip {
    flex-wrap: wrap;
  }

  .workbench.detail-collapsed .detail-rail {
    width: 0;
    min-width: 0;
    overflow: hidden;
    border-left: 0;
    box-shadow: none;
    pointer-events: none;
  }

  .detail-tabs .ant-tabs-nav {
    padding-inline: 10px;
  }
}

/* City and grid maps share one stable control layout. Keep this block last so legacy map rules cannot move it. */
.map-page-new > .map-stage > .map-floating-actions {
  top: 12px !important;
  right: auto !important;
  bottom: auto !important;
  left: 12px !important;
}

.map-page-new > .map-stage > .geospatial-map-shell > .spatial-plan-trigger,
.map-page-new > .map-stage > .geospatial-map-shell > .spatial-plan-edit-trigger {
  top: 54px !important;
  right: auto !important;
  bottom: auto !important;
  left: 12px !important;
}

.map-page-new > .map-stage > .geospatial-map-shell > .spatial-plan-edit-trigger {
  left: 128px !important;
}

.map-page-new > .map-stage > .map-navigation-actions {
  top: auto !important;
  bottom: 12px !important;
}

@media (max-width: 767px) {
  .map-page-new > .map-stage > .map-floating-actions {
    top: 8px !important;
    left: 8px !important;
  }

  .map-page-new > .map-stage > .map-navigation-actions {
    right: 8px !important;
    bottom: 8px !important;
  }
}

/* v049.9.0 city spatial visual language. Keep last to protect the shared map contract. */
.map-page-new > .map-stage > .map-floating-actions,
.map-page-new > .map-stage > .geospatial-map-shell > .spatial-plan-trigger,
.map-page-new > .map-stage > .geospatial-map-shell > .spatial-plan-edit-trigger,
.map-page-new > .map-stage > .map-navigation-actions {
  border-color: rgba(188, 203, 216, 0.82);
  background: rgba(250, 252, 253, 0.9);
  box-shadow: 0 5px 16px rgba(43, 64, 83, 0.09);
  backdrop-filter: blur(14px) saturate(115%);
}

.map-page-new > .map-stage > .geospatial-map-shell > .spatial-plan-trigger,
.map-page-new > .map-stage > .geospatial-map-shell > .spatial-plan-edit-trigger {
  color: #354f63;
  font-weight: 500;
}

.geospatial-map-canvas .maplibregl-canvas {
  cursor: grab;
}

.geospatial-map-canvas .maplibregl-canvas:active {
  cursor: grabbing;
}

.geospatial-map-shell .map-hover-card {
  width: 218px;
  padding: 10px 11px;
  border-color: rgba(190, 204, 215, 0.84);
  border-radius: 6px;
  background: rgba(252, 253, 254, 0.93);
  box-shadow: 0 10px 26px rgba(37, 57, 75, 0.12);
  backdrop-filter: blur(16px) saturate(112%);
}

.geospatial-map-shell .map-hover-card > strong {
  color: #263d50;
  font-size: 13px;
  font-weight: 600;
}

.geospatial-map-shell .map-hover-card > span {
  color: #728394;
}

.geospatial-map-shell .map-hover-card dl {
  padding-top: 7px;
  border-top: 1px solid rgba(211, 220, 228, 0.72);
}

@media (max-width: 767px) {
  .geospatial-map-shell .map-hover-card {
    width: min(218px, calc(100% - 16px));
    max-height: min(210px, calc(100% - 24px));
    overflow-y: auto;
  }
}