/**
 * 进港指南详情 Google 风格 — detail.html / sghExamples.html
 * 参考 docs/hifleet-sgh-google-preview.html
 */
@import url('./port-google-tokens.css?v=20260729');

:root {
  --shadow: 0 1px 2px rgba(60, 64, 67, .12), 0 2px 8px rgba(60, 64, 67, .08);
}

html {
  scroll-behavior: smooth;
}

body.port-sgh-beta-body {
  background: var(--page-bg) !important;
  color: var(--text);
  font-family: var(--font-sans);
  letter-spacing: 0;
}

.port-sgh-page {
  max-width: 1440px;
  margin: 0 auto;
  padding: 28px 32px 72px;
  min-width: 0;
}

.port-sgh-container.container {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
}

.port-sgh-container > .row {
  margin: 0 !important;
}

.port-sgh-container .line_bottom_der {
  display: none;
}

/* ==================== Top row ==================== */
.port-sgh-top-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.port-sgh-breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--sub);
  font-size: 13px;
}

.port-sgh-breadcrumb a {
  color: var(--g-blue) !important;
  font-weight: 500;
  text-decoration: none !important;
}

.port-sgh-breadcrumb-current {
  color: var(--text);
}

.port-sgh-top-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.port-sgh-icon-btn,
.port-sgh-btn {
  border: 1px solid var(--line);
  background: #fff;
  color: var(--g-blue);
  cursor: pointer;
  transition: background .16s, box-shadow .16s, border-color .16s;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

.port-sgh-icon-btn {
  width: 40px;
  height: 40px;
  border-radius: 20px;
  font-size: 18px;
  padding: 0;
}

.port-sgh-btn {
  height: 40px;
  border-radius: 20px;
  padding: 0 18px;
  font-size: 14px;
  font-weight: 500;
}

.port-sgh-btn-primary {
  border-color: var(--g-blue) !important;
  background: var(--g-blue) !important;
  color: #fff !important;
}

.port-sgh-btn-outline:hover,
.port-sgh-icon-btn:hover,
.port-sgh-btn-primary:hover {
  background: var(--g-blue-soft) !important;
  border-color: #c6dafc !important;
}

.port-sgh-btn-primary:hover {
  background: var(--g-blue-600) !important;
  color: #fff !important;
}

/* ==================== Hero 通栏 ==================== */
.port-sgh-hero-card {
  border: 1px solid var(--line-soft);
  border-radius: 20px;
  background: var(--card);
  box-shadow: var(--shadow);
  overflow: hidden;
  margin-bottom: 22px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.port-sgh-hero-main {
  display: grid;
  /* minmax(520px) 在窄屏会抬高整页 min-content，导致横向裁切后左右留白不对称 */
  grid-template-columns: minmax(0, 1fr) minmax(0, 46%);
  gap: 28px;
  padding: 28px;
  align-items: stretch;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.port-sgh-hero-main.port-sgh-hero-main--lcr {
  grid-template-columns: minmax(0, 1fr) minmax(0, 46%);
}

.port-sgh-hero-left {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.port-sgh-hero-weather {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
  height: 100%;
}

.port-sgh-hero-side {
  display: grid;
  grid-template-columns: minmax(230px, 0.9fr) minmax(260px, 1.1fr);
  gap: 16px;
  align-items: stretch;
  min-width: 0;
}

.port-sgh-hero-weather,
.port-sgh-hero-side .port-sgh-hero-map-card {
  min-height: 230px;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.port-sgh-hero-side .port-sgh-hero-map-card {
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(60, 64, 67, .08);
  padding: 0;
  min-width: 0;
  height: 100%;
  overflow: hidden;
}

.port-sgh-hero-main--lcr .port-sgh-hero-map-card {
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: #fff;
  box-shadow: var(--shadow);
  padding: 0;
  min-width: 0;
  height: 100%;
  overflow: hidden;
}

.port-sgh-hero-main--lcr .port-sgh-hero-map-card .pre_title {
  display: none;
}

.port-sgh-hero-metrics {
  border-top: 1px solid var(--line-soft);
  background: #fff;
}

.port-sgh-hero-quick-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  padding: 14px 28px 22px;
  border-top: 1px solid var(--line-soft);
  background: #fff;
}

.port-sgh-hero-quick-nav .port-sgh-btn {
  height: 36px;
  padding: 0 14px;
  font-size: 13px;
}

.port-sgh-hero-quick-nav .port-sgh-btn-primary,
.port-sgh-page.ui-v2 .port-sgh-hero-quick-nav .port-sgh-btn-primary {
  height: 36px !important;
  padding: 0 14px !important;
  font-size: 13px !important;
  background: #2563eb !important;
  border: 1px solid #2563eb !important;
  color: #fff !important;
  box-shadow: none !important;
}

.port-sgh-hero-quick-nav .port-sgh-btn-primary:hover,
.port-sgh-page.ui-v2 .port-sgh-hero-quick-nav .port-sgh-btn-primary:hover {
  background: #1d4ed8 !important;
  border-color: #1d4ed8 !important;
  color: #fff !important;
}

@media only screen and (max-width: 767.98px) {
  .port-sgh-hero-quick-nav {
    justify-content: flex-start;
    padding: 12px 16px 18px;
    gap: 8px;
  }

  .port-sgh-hero-quick-nav .port-sgh-btn {
    height: 34px;
    padding: 0 12px;
    font-size: 12px;
  }
}

/* ===== portInfo 头部区（国旗 + Shanghai + PortCode胶囊 + 本地时间） ===== */
.port-sgh-page .port-sgh-hero-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.port-sgh-page .port-sgh-hero-identity {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.port-sgh-page .port-sgh-hero-flag {
  width: 36px;
  height: 24px;
  border-radius: 4px;
  object-fit: cover;
  border: 1px solid #e8eaed;
  flex: 0 0 auto;
}
.port-sgh-page .port-sgh-hero-name {
  font-size: 36px;
  font-weight: 700;
  line-height: 1.1;
  color: #202124;
  margin: 0;
  letter-spacing: -0.3px;
}
.port-sgh-page .port-sgh-hero-code {
  background: #e8f0fe;
  color: #1967d2;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  align-self: center;
  white-space: nowrap;
}
.port-sgh-page .port-sgh-hero-time {
  font-size: 13px;
  color: #5f6368;
  align-self: center;
  white-space: nowrap;
}
.port-sgh-page .port-sgh-hero-time-label {
  color: #5f6368;
  font-weight: 500;
}

/* ===== Hero 内 weather 大卡片（左：icon+desc  右：Now+27°C+Shanghai） ===== */
.port-sgh-page .port-sgh-weather-hero-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 230px;
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(60, 64, 67, .08);
  padding: 18px 18px 16px;
  box-sizing: border-box;
  justify-content: space-between;
}
.port-sgh-page .port-sgh-weather-hero-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}
.port-sgh-page .port-sgh-weather-hero-icon {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.port-sgh-page .port-sgh-weather-hero-icon img {
  width: 56px;
  height: 56px;
  flex: 0 0 auto;
}
.port-sgh-page .port-sgh-weather-hero-cond {
  font-size: 13px;
  color: #5f6368;
  display: inline-block;
  max-width: 140px;
}
.port-sgh-page .port-sgh-weather-hero-temp-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}
.port-sgh-page .port-sgh-weather-hero-temp {
  font-size: 32px;
  font-weight: 700;
  color: #202124;
  line-height: 1;
}
.port-sgh-page .port-sgh-weather-hero-now {
  background: #e8f0fe;
  color: #1967d2;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}
.port-sgh-page .port-sgh-weather-hero-city {
  font-size: 11px;
  color: #5f6368;
  font-weight: 500;
  text-align: right;
}
.port-sgh-page .port-sgh-weather-hero-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 10px;
}
.port-sgh-page .port-sgh-weather-hero-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  border-radius: 8px;
  background: #f8fafd;
  font-size: 13px;
  color: #3c4043;
  margin: 0;
}
.port-sgh-page .port-sgh-weather-hero-item span:first-child {
  color: #5f6368;
  font-size: 12px;
}
.port-sgh-page .port-sgh-weather-hero-alarm {
  background: #fff;
  border: 1px dashed #e8eaed;
  text-align: center;
  justify-content: center;
  padding: 8px;
}
.port-sgh-page .port-sgh-weather-hero-alarm-label {
  color: #9aa0a6;
  font-size: 12px;
  text-align: center;
}

/* ===== Weather Forecast 5天卡片网格 ===== */
.port-sgh-page .port-sgh-weather-forecast-head {
  margin: 0 0 12px;
}
.port-sgh-page .port-sgh-weather-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 16px;
  padding: 12px 0;
}
.port-sgh-page .port-sgh-weather-card {
  min-width: 170px;
  flex: 1 1 170px;
  border: 1px solid #e8eaed;
  border-radius: 12px;
  padding: 14px 16px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(60, 64, 67, .06);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}
.port-sgh-page .port-sgh-weather-card-date {
  font-weight: 600;
  color: #202124;
  font-size: 13px;
  margin: 0;
}
.port-sgh-page .port-sgh-weather-card-desc {
  color: #5f6368;
  margin: 0 0 4px;
  font-size: 12px;
}
.port-sgh-page .port-sgh-weather-card-icon {
  margin: 4px auto;
  display: block;
}
.port-sgh-page .port-sgh-weather-card-temp {
  font-size: 14px;
  font-weight: 600;
  color: #202124;
  margin: 2px 0 6px;
  text-align: center;
  width: 100%;
}
.port-sgh-page .port-sgh-weather-card-line {
  margin: 0;
  color: #5f6368;
  font-size: 11px;
  line-height: 1.6;
  width: 100%;
}
.port-sgh-page .port-sgh-weather-card-line span:first-child {
  color: #3c4043;
  font-weight: 500;
  margin-right: 4px;
}

.port-sgh-hero-summary {
  max-width: 780px;
  margin: 14px 0 0;
  color: #3c4043;
  font-size: 15px;
  line-height: 1.75;
  text-align: justify;
  text-justify: inter-word;
}

.port-sgh-search-panel {
  max-width: 760px;
  margin-top: 22px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  position: relative;
  z-index: 20;
  padding-left: 0;
  padding-right: 0;
}

.port-sgh-page .port-sgh-search-box.input_item_text_long {
  width: 100% !important;
  height: 48px;
  display: flex;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #fff;
  padding: 0 16px;
  position: relative;
  color: var(--text);
  transition: box-shadow .16s, border-color .16s;
}

.port-sgh-page .port-sgh-search-box.input_item_text_long:focus-within {
  border-color: var(--g-blue);
  box-shadow: 0 1px 6px rgba(26, 115, 232, .22);
}

.port-sgh-search-icon {
  width: 20px;
  height: 20px;
  border: 2px solid var(--sub);
  border-radius: 50%;
  margin-right: 13px;
  position: relative;
  flex: 0 0 auto;
}

.port-sgh-search-icon:after {
  content: "";
  width: 9px;
  height: 2px;
  position: absolute;
  right: -7px;
  bottom: -4px;
  border-radius: 2px;
  background: var(--sub);
  transform: rotate(45deg);
}

.port-sgh-page .port-sgh-search-box input {
  width: 100%;
  height: auto;
  border: 0;
  outline: 0;
  color: var(--text);
  font-size: 14px;
  background: transparent;
  padding: 0;
}

.port-sgh-search-btn {
  height: 48px !important;
  border-radius: 24px !important;
  padding: 0 22px !important;
}

.port-sgh-page .port-sgh-autocomplete,
.port-sgh-page #completeShow.port-sgh-autocomplete {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  width: 100% !important;
  display: none;
  overflow: hidden;
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: #fff;
  box-shadow: var(--shadow);
  z-index: 30;
}

.port-sgh-page .port-sgh-autocomplete .list-group {
  margin: 0;
  max-height: 280px;
  overflow: auto;
}

.port-sgh-page .port-sgh-autocomplete .list-group-item {
  border: 0;
  border-bottom: 1px solid var(--line-soft);
  padding: 12px 16px;
  font-size: 14px;
  color: var(--text);
  cursor: pointer;
}

.port-sgh-page .port-sgh-autocomplete .list-group-item:last-child {
  border-bottom: 0;
}

.port-sgh-page .port-sgh-autocomplete .list-group-item:hover {
  background: var(--g-blue-soft);
}

.port-sgh-hero-map-card {
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: #f8fafd;
  padding: 14px;
  min-height: 0;
}

.port-sgh-hero-map-card .pre_title {
  margin-bottom: 10px;
}

.port-sgh-page #portInfo {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  margin: 0;
  background: transparent;
}

/* ==================== 下方左右布局 ==================== */
.port-sgh-page .port-sgh-layout.g_detail_box {
  display: grid !important;
  grid-template-columns: 280px minmax(0, 1fr) !important;
  grid-template-areas: "side main";
  gap: 22px;
  align-items: start;
  float: none !important;
  margin-top: 0;
  width: 100%;
}

.port-sgh-page .port-sgh-layout.g_detail_box::before,
.port-sgh-page .port-sgh-layout.g_detail_box::after {
  display: none !important;
  content: none !important;
}

.port-sgh-page .port-sgh-layout > .port-sgh-side {
  grid-area: side;
  float: none !important;
  width: 280px;
  max-width: 280px;
  min-width: 0;
}

.port-sgh-page .port-sgh-layout > .port-sgh-main {
  grid-area: main;
  float: none !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0;
}

.port-sgh-side {
  position: sticky;
  top: 16px;
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 14px;
  /* PC：侧栏独立滚动，目录过长时不必拖动整页正文 */
  max-height: calc(100vh - 32px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.port-sgh-side::-webkit-scrollbar {
  width: 6px;
}

.port-sgh-side::-webkit-scrollbar-thumb {
  background: #c5cdd8;
  border-radius: 999px;
}

.port-sgh-side::-webkit-scrollbar-track {
  background: transparent;
}

.port-sgh-page .port-sgh-side > #nav.mao_a_nav,
.port-sgh-page .port-sgh-side > .port-sgh-ace-nav-card {
  flex: 0 0 auto;
  min-height: 0;
  max-height: none;
}

.port-sgh-main {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
}

.port-sgh-page .port-sgh-side #nav.mao_a_nav {
  position: static !important;
  width: 100% !important;
  max-width: none !important;
  transform: none !important;
  z-index: auto !important;
  float: none !important;
  /* 滚动交给外层 .port-sgh-side，内层保持可见避免目录被裁空 */
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
  flex: 0 0 auto;
}

.port-sgh-page #nav.mao_a_nav {
  width: 100% !important;
  float: none !important;
}

.port-sgh-content {
  min-width: 0;
}

.port-sgh-content.port-sgh-content--empty {
  display: none;
  min-height: 0 !important;
  margin: 0;
  padding: 0;
}

/* 无权限提示在正文区时，禁止被 --empty 整块隐藏 */
.port-sgh-content.port-sgh-content--empty:has(.port-guide-noauth),
.port-sgh-page.port-guide-fun-denied .port-sgh-content {
  display: block !important;
  min-height: 0 !important;
  margin: initial;
  padding: initial;
}

.port-sgh-page .mao_a_detail {
  float: none !important;
  width: 100% !important;
  min-width: 0;
}

.port-sgh-live-modules {
  display: flex;
  flex-direction: column;
  gap: 28px;
  float: none !important;
  width: 100% !important;
}

.port-sgh-page .port-sgh-live-modules.weather {
  width: 100% !important;
  max-width: none !important;
  float: none !important;
}

.port-sgh-page .port-sgh-module-weather {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box;
}

.port-sgh-live-modules.weather {
  margin-top: 28px;
}

/* ==================== Hero: portInfo ==================== */
.port-sgh-page #portInfo .title_box_detail {
  margin-bottom: 12px;
  padding-left: 0;
}

.port-sgh-page .port-sgh-port-title-line {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.port-sgh-page .port-sgh-port-title-main {
  float: none !important;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  min-width: 0;
}

.port-sgh-page .port-sgh-port-flag {
  width: 28px;
  height: 20px;
  object-fit: cover;
  border-radius: 2px;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08);
  flex: 0 0 auto;
  margin-left: 0;
}

.port-sgh-page .port-sgh-port-name {
  margin: 0;
  font-size: 42px;
  line-height: 1.15;
  font-weight: 500;
  color: var(--text);
}

.port-sgh-page .port-sgh-port-code-chip {
  display: inline-flex;
  align-items: center;
  height: 28px;
  border-radius: 14px;
  padding: 0 12px;
  background: var(--g-blue-soft);
  color: var(--g-blue);
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
}

.port-sgh-page #portInfo .title_box_detail .fl-left {
  float: none !important;
  font-size: 42px;
  line-height: 1.15;
  font-weight: 500;
  color: var(--text);
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.port-sgh-page #portInfo .title_box_detail .fl-left img {
  /* border-radius: 4px;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08); */
  border: none;
}

/* Hero 底部指标条 box_op */
.port-sgh-page .port-sgh-hero-metrics .box_op {
  margin: 0;
  padding: 0;
  border: 0;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
}

.port-sgh-page .port-sgh-hero-metrics .dis_f_j {
  display: contents;
}

.port-sgh-page .port-sgh-hero-metrics .t {
  min-height: 88px;
  padding: 16px 18px;
  border: 0;
  border-right: 1px solid var(--line-soft);
  border-radius: 0;
  background: #fff;
  line-height: 1.5;
}

.port-sgh-page .port-sgh-hero-metrics .port-sgh-metric {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.port-sgh-page .port-sgh-hero-metrics .port-sgh-metric-label {
  display: block;
  margin: 0;
  color: var(--sub) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.35;
}

.port-sgh-page .port-sgh-hero-metrics .port-sgh-metric-value {
  display: block;
  margin: 0;
  color: var(--text) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.25;
}

.port-sgh-page .port-sgh-hero-metrics .t:last-child {
  border-right: 0;
}

.port-sgh-page .port-sgh-hero-metrics .colo_blur,
.port-sgh-page .port-sgh-hero-metrics #vip,
.port-sgh-page .port-sgh-hero-metrics #eas {
  color: var(--text) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}

.port-sgh-beta-body .port-sgh-page .port-sgh-hero-metrics .port-sgh-metric-label {
  font-size: 12px !important;
  font-weight: 400 !important;
  color: var(--sub) !important;
}

.port-sgh-beta-body .port-sgh-page .port-sgh-hero-metrics .port-sgh-metric-value,
.port-sgh-beta-body .port-sgh-page .port-sgh-hero-metrics #portCode,
.port-sgh-beta-body .port-sgh-page .port-sgh-hero-metrics #portSghWeatherMetric,
.port-sgh-beta-body .port-sgh-page .port-sgh-hero-metrics #vip,
.port-sgh-beta-body .port-sgh-page .port-sgh-hero-metrics #eas {
  color: var(--text) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}

/* Hero current weather card */
.port-sgh-page #weather_top .port-sgh-current-weather.weather_top {
  display: block !important;
  min-height: 230px;
  box-sizing: border-box;
}

.port-sgh-page .port-sgh-weather-now-head {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 10px;
  margin-bottom: 12px;
  width: 100%;
  box-sizing: border-box;
}

.port-sgh-page .port-sgh-weather-temp-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  min-width: 0;
  width: 100%;
}

.port-sgh-page .port-sgh-weather-now-main {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  width: 100%;
  flex: 0 1 auto;
}

.port-sgh-page .port-sgh-weather-icon {
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  object-fit: contain;
}

.port-sgh-page .port-sgh-weather-temp {
  color: var(--text);
  font-size: 32px;
  line-height: 1;
  font-weight: 600;
  flex: 0 0 auto;
}

.port-sgh-page .port-sgh-weather-condition {
  margin-top: 0;
  color: var(--sub);
  font-size: 13px;
  line-height: 1.35;
  min-width: 0;
  flex: 1 1 auto;
}

.port-sgh-page .port-sgh-weather-chip {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  height: 26px;
  line-height: 26px;
  border-radius: 13px;
  padding: 0 12px;
  background: var(--g-blue-soft);
  color: var(--g-blue);
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  position: static;
}

.port-sgh-page .port-sgh-weather-now-meta {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.port-sgh-page .port-sgh-weather-mini {
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: rgba(255, 255, 255, .72);
  padding: 9px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  box-sizing: border-box;
  min-width: 0;
}

.port-sgh-page .port-sgh-weather-mini span {
  color: var(--sub);
  font-size: 11px;
  margin: 0;
  flex: 0 0 auto;
}

.port-sgh-page .port-sgh-weather-mini strong {
  color: var(--text);
  font-size: 13px;
  font-weight: 600;
  text-align: right;
  margin-left: auto;
  flex: 1 1 auto;
  min-width: 0;
}

.port-sgh-page .port-sgh-weather-alarm {
  margin-top: 10px;
  min-width: 0;
}

.port-sgh-page .port-sgh-weather-alarm-panel {
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: rgba(255, 255, 255, .82);
  overflow: hidden;
}

.port-sgh-page .port-sgh-weather-alarm-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line-soft);
  background: #fbfcff;
}

.port-sgh-page .port-sgh-weather-alarm-label {
  color: var(--text);
  font-size: 12px;
  font-weight: 600;
}

.port-sgh-page .port-sgh-weather-alarm-count {
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 10px;
  background: var(--g-blue-soft);
  color: var(--g-blue);
  font-size: 11px;
  font-weight: 600;
  display: inline-grid;
  place-items: center;
}

.port-sgh-page .port-sgh-weather-alarm-track {
  display: grid;
  gap: 0;
}

.port-sgh-page .port-sgh-weather-alarm-track--multi {
  grid-auto-flow: column;
  grid-auto-columns: 100%;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  cursor: grab;
}

.port-sgh-page .port-sgh-weather-alarm-track--multi::-webkit-scrollbar {
  display: none;
}

.port-sgh-page .port-sgh-weather-alarm-track--multi.is-dragging {
  cursor: grabbing;
  scroll-snap-type: none;
}

.port-sgh-page .port-sgh-weather-alarm-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  min-height: 72px;
  max-height: 88px;
  box-sizing: border-box;
}

.port-sgh-page .port-sgh-weather-alarm-track--multi .port-sgh-weather-alarm-card {
  scroll-snap-align: start;
}

.port-sgh-page .port-sgh-weather-alarm-card-main {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
}

.port-sgh-page .port-sgh-weather-alarm-icon {
  flex: 0 0 auto;
  width: 40px;
  height: 36px;
  object-fit: contain;
}

.port-sgh-page .port-sgh-weather-alarm-icon--empty {
  display: inline-block;
  border-radius: 8px;
  background: #eef3fd;
}

.port-sgh-page .port-sgh-weather-alarm-copy {
  min-width: 0;
  flex: 1 1 auto;
}

.port-sgh-page .port-sgh-weather-alarm-time {
  color: var(--sub);
  font-size: 11px;
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.port-sgh-page .port-sgh-weather-alarm-title {
  margin-top: 2px;
  color: var(--text);
  font-size: 12px;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  word-break: break-word;
}

.port-sgh-page .port-sgh-weather-alarm-btn {
  flex: 0 0 auto;
  height: 28px;
  padding: 0 10px;
  border: 1px solid var(--g-blue);
  border-radius: 14px;
  background: #fff;
  color: var(--g-blue);
  font-size: 11px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  transition: background .16s, color .16s;
}

.port-sgh-page .port-sgh-weather-alarm-btn:hover {
  background: var(--g-blue);
  color: #fff;
}

.port-sgh-page .port-sgh-weather-alarm-empty {
  padding: 10px 12px;
  border: 1px dashed var(--line-soft);
  border-radius: 12px;
  background: rgba(255, 255, 255, .72);
  color: var(--sub);
  font-size: 12px;
  text-align: center;
}

.port-sgh-drawer-body--alarm .port-sgh-alarm-drawer-icon {
  display: block;
  width: 72px;
  height: 64px;
  object-fit: contain;
  margin: 0 0 14px;
}

.port-sgh-drawer-body--alarm .port-sgh-alarm-drawer-time {
  margin: 0 0 12px;
  color: var(--sub);
  font-size: 13px;
  line-height: 1.5;
}

.port-sgh-drawer-body--alarm .port-sgh-alarm-drawer-desc {
  color: #3c4043;
  font-size: 14px;
  line-height: 1.75;
  word-break: break-word;
}

/* ==================== Sidebar nav ==================== */
.port-sgh-page .mao_a_nav {
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: var(--card);
  box-shadow: var(--shadow);
  padding: 14px;
  /* 必须 visible：hidden 会在高度被挤压时把 Contents 目录裁成空白 */
  overflow: visible;
}

.port-sgh-page .port-sgh-side #nav.mao_a_nav {
  overflow: visible !important;
}

.port-sgh-page #label_contents.port-sgh-nav-list,
.port-sgh-page .port-sgh-side #label_contents {
  display: block !important;
  visibility: visible !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  min-height: 0;
}

.port-sgh-page .dao_ld_ {
  display: none;
}

.port-sgh-page .box_nav_a_mao {
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0;
}

.port-sgh-page .box_nav_a_mao #Top {
  display: none;
}

.port-sgh-page #nav.mao_a_nav {
  max-width: none;
  width: 100%;
}

.port-sgh-page .box_nav_a_mao table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 0;
  border-radius: 0;
  overflow: visible;
  margin-top: 0 !important;
}

.port-sgh-page .box_nav_a_mao td {
  width: auto;
  height: auto;
  text-align: left;
  font-size: 14px;
  font-weight: 600;
  cursor: default;
  transition: background .16s;
  padding: 2px 0 12px;
  color: #3c4043;
}

.port-sgh-page .box_nav_a_mao td strong {
  font-weight: 600;
}

.port-sgh-page .change_backcolor1 {
  background: transparent !important;
  color: #3c4043 !important;
}

.port-sgh-page .change_backcolor2 {
  background: #f1f3f4 !important;
  color: var(--sub) !important;
}

.port-sgh-page #label_contents,
.port-sgh-page #label_Report {
  padding-top: 0 !important;
  background: transparent !important;
}

.port-sgh-page .port-sgh-nav-contents {
  margin: 0 0 12px;
  padding: 0;
  color: #3c4043;
  font-size: 14px;
  font-weight: 600;
  background: transparent !important;
}

.port-sgh-page .port-sgh-nav-list {
  padding-top: 0 !important;
  background: transparent !important;
}

.port-sgh-beta-body .port-sgh-page .box_nav_a_mao .change_backcolor1,
.port-sgh-beta-body .port-sgh-page .port-sgh-nav-contents,
.port-sgh-page .box_nav_a_mao .change_backcolor1 {
  background: transparent !important;
  color: #3c4043 !important;
}

.port-sgh-page .setion_p_al {
  margin-top: 12px;
  border-top: 1px solid var(--line-soft);
  padding-top: 12px;
  padding-left: 0 !important;
  position: static !important;
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}

.port-sgh-page .setion_p_al::after {
  display: none !important;
  content: none !important;
}

.port-sgh-page .setion_p_al p:not(.ppp)::after {
  display: none !important;
  content: none !important;
}

.port-sgh-page .setion_p_al:first-child {
  border-top: 0;
  padding-top: 0;
  margin-top: 0;
}

.port-sgh-page .setion_p.ppp {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px;
  padding: 0;
  color: var(--sub) !important;
  font-size: 12px !important;
  font-weight: 600;
  cursor: pointer;
  position: relative;
}

.port-sgh-page .setion_p.ppp::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--g-blue);
  flex: 0 0 auto;
}

.port-sgh-page .setion_p.ppp::after {
  display: none !important;
  content: none !important;
}

.port-sgh-page .setion_p .setion_img {
  display: none !important;
}

.port-sgh-page .ul_li_pp_0 {
  list-style: none;
  margin: 0;
  padding: 0;
  display: block !important;
}

.port-sgh-page .ul_li_pp_0.hide {
  display: none !important;
}

.port-sgh-page .ul_li_pp_0 li,
.port-sgh-page .ul_li_pp_0li {
  float: none !important;
  display: block !important;
  width: auto !important;
  margin: 2px 0 !important;
  padding: 0 !important;
  overflow: visible;
  white-space: normal;
  text-overflow: clip;
  font-size: 13px !important;
  color: #3c4043;
  background: transparent !important;
}

.port-sgh-page .ul_li_pp_0 li a,
.port-sgh-page .ul_li_pp_0li a {
  display: block;
  padding: 7px 10px;
  border-radius: 8px;
  color: #3c4043 !important;
  font-size: 13px !important;
  line-height: 1.35;
  text-decoration: none !important;
  transition: background .12s, color .12s;
  word-break: keep-all;
  overflow-wrap: normal;
  background: transparent !important;
}

.port-sgh-page .ul_li_pp_0 li.active a,
.port-sgh-page .ul_li_pp_0 li a.active,
.port-sgh-page .ul_li_pp_0li.active a,
.port-sgh-page .ul_li_pp_0li a.active {
  background: var(--g-blue-soft) !important;
  color: var(--g-blue) !important;
}

.port-sgh-page .ul_li_pp_0 li:not(.active) a:not(.active):hover,
.port-sgh-page .ul_li_pp_0li:not(.active) a:not(.active):hover {
  color: var(--g-blue) !important;
  background: transparent !important;
}

.port-sgh-page a.setion_p.ppp {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 8px;
  margin: 2px 0 8px;
  transition: background .12s, color .12s;
  background: transparent;
  color: var(--sub) !important;
}
.port-sgh-page a.setion_p.ppp.active {
  background: var(--g-blue-soft) !important;
  color: var(--g-blue) !important;
}
.port-sgh-page a.setion_p.ppp:not(.active):hover {
  color: var(--g-blue) !important;
}

/* 顶级模块导航（ACE / Port Plans 等，p.setion_p）命中态与子项一致 */
.port-sgh-page #label_contents [data-sgh-module-nav] .setion_p.ppp.active,
.port-sgh-page #label_contents [data-sgh-top-level].active,
.port-sgh-page.ui-v2 #label_contents [data-sgh-module-nav] .setion_p.ppp.active,
.port-sgh-page.ui-v2 #label_contents [data-sgh-top-level].active {
  background: #2563eb !important;
  color: #fff !important;
  border-radius: 8px;
  padding: 7px 10px !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 3px rgba(37, 99, 235, .28) !important;
}
.port-sgh-page #label_contents [data-sgh-module-nav] .setion_p.ppp.active::before,
.port-sgh-page.ui-v2 #label_contents [data-sgh-top-level].active::before {
  background: #fff !important;
}

/* ==================== Section headings（title_act / pre_title 统一 section-head） ==================== */
.port-sgh-page .title_act,
.port-sgh-page .pre_title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 0 0 14px;
  float: none !important;
}

.port-sgh-page .title_act,
.port-sgh-page .pre_title .span_aree,
.port-sgh-page .pre_title > .fl-left.span_aree {
  margin: 0;
  padding: 0;
  color: var(--text);
  font-size: 22px;
  line-height: 1.35;
  font-weight: 500;
  float: none !important;
}

.port-sgh-page .title_act {
  position: static;
  padding-left: 0;
}

.port-sgh-page .title_act:after {
  display: none !important;
  content: none !important;
}

.port-sgh-page .pre_title .fl-right {
  float: none !important;
}

/* ==================== Content sections ==================== */
.port-sgh-page .mao_a_detail .actrcle {
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-lg);
  background: var(--card);
  box-shadow: var(--shadow);
  padding: 22px 24px;
  margin-bottom: 18px !important;
  scroll-margin-top: 20px;
}

.port-sgh-page .mao_a_detail .actrcle .p,
.port-sgh-page .mao_a_detail .actrcle p,
.port-sgh-page .mao_a_detail .actrcle .pfirst {
  color: var(--text-body);
  font-size: 14px;
  line-height: 1.8;
}

.port-sgh-page .mao_a_detail .actrcle .hd2,
.port-sgh-page .mao_a_detail .actrcle .hd3,
.port-sgh-page .mao_a_detail .actrcle .hd4,
.port-sgh-page .mao_a_detail .actrcle .h0text {
  color: var(--text);
  font-weight: 600;
}

.port-sgh-page .mao_a_detail .actrcle table.secondary {
  border-radius: var(--radius-md);
  margin-top: 14px;
}

.port-sgh-page .mao_a_detail .actrcle table.secondary th,
.port-sgh-page .mao_a_detail .actrcle table.secondary td {
  height: 44px;
  padding: 0 14px;
  font-size: 13px;
  border-bottom: 1px solid var(--line-soft);
}

.port-sgh-page .mao_a_detail .actrcle table.secondary th {
  background: var(--table-head-bg-alt);
  color: var(--sub);
  font-weight: 600;
}

.port-sgh-page .mao_a_detail .actrcle table.secondary td {
  color: var(--text-body);
}

.port-sgh-page .mao_a_detail .actrcle table.secondary tr:last-child td,
.port-sgh-page .mao_a_detail .actrcle table.secondary tr:last-child th {
  border-bottom: 0;
}

/* ==================== Section body / reference-style data blocks ==================== */
.port-sgh-page .port-sgh-section-body {
  margin-top: 2px;
  color: var(--text-body);
  font-size: 14px;
  line-height: 1.8;
}

.port-sgh-page .port-sgh-section-body > .pfirst {
  display: block;
  margin: 0 0 12px;
  color: var(--text-body);
}

.port-sgh-page .port-sgh-section-body .hd2,
.port-sgh-page .port-sgh-section-body .hd3,
.port-sgh-page .port-sgh-section-body .hd4 {
  margin: 16px 0 8px;
  color: var(--text);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.6;
}

.port-sgh-page .port-sgh-section-body .hd2 .hd2,
.port-sgh-page .port-sgh-section-body .hd3 .hd3,
.port-sgh-page .port-sgh-section-body .hd4 .hd4 {
  margin: 0;
}

.port-sgh-page .port-sgh-note {
  margin: 14px 0 0;
  padding: 12px 14px;
  border-left: 4px solid var(--g-yellow);
  border-radius: 10px;
  background: #fff8e1;
  color: var(--text-body);
  font-size: 13px;
  line-height: 1.7;
}

.port-sgh-page .port-sgh-data-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 4px;
}

.port-sgh-page .port-sgh-data-item {
  min-height: 70px;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: #fbfcff;
  padding: 12px;
}

.port-sgh-page .port-sgh-data-label {
  display: block;
  color: var(--sub);
  font-size: 12px;
  margin-bottom: 6px;
}

.port-sgh-page .port-sgh-data-value {
  display: block;
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
  font-weight: 500;
}

.port-sgh-page .port-sgh-kv-table {
  overflow: hidden;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: #fff;
  margin-top: 4px;
}

.port-sgh-page .port-sgh-kv-head,
.port-sgh-page .port-sgh-kv-row {
  display: grid;
  grid-template-columns: minmax(200px, 34%) 1fr;
  gap: 12px;
  align-items: start;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-soft);
}

.port-sgh-page .port-sgh-kv-head {
  background: #f8fafd;
  color: var(--sub);
  font-size: 12px;
  font-weight: 600;
}

.port-sgh-page .port-sgh-kv-row:last-child {
  border-bottom: 0;
}

.port-sgh-page .port-sgh-kv-label {
  color: var(--sub);
  font-size: 13px;
  font-weight: 600;
}

.port-sgh-page .port-sgh-kv-value {
  color: #3c4043;
  font-size: 13px;
  line-height: 1.6;
}

.port-sgh-page .port-sgh-kv-table--compact {
  margin-top: 8px;
}

/* Legacy key-value rows still using hd4 wrappers */
.port-sgh-page .port-sgh-section-body > .hd4 {
  display: grid;
  grid-template-columns: minmax(200px, 34%) 1fr;
  gap: 12px;
  align-items: start;
  margin: 0;
  padding: 10px 14px;
  border-bottom: 1px solid var(--line-soft);
  font-weight: 400;
}

.port-sgh-page .port-sgh-section-body > .hd4:first-of-type {
  border-top: 1px solid var(--line-soft);
  border-radius: 12px 12px 0 0;
  background: #f8fafd;
}

.port-sgh-page .port-sgh-section-body > .hd4 .hd4 {
  color: var(--sub);
  font-size: 13px;
  font-weight: 600;
}

.port-sgh-page .port-sgh-section-body > .hd4 .pfirst {
  margin: 0;
  color: #3c4043;
  font-size: 13px;
  font-weight: 400;
}

/* ==================== Content tables (table.secondary) ==================== */
.port-sgh-page .mao_a_detail .actrcle table.secondary {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  background: #fff;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  overflow: hidden;
  margin: 14px 0;
}

.port-sgh-page .mao_a_detail .actrcle table.secondary td,
.port-sgh-page .mao_a_detail .actrcle table.secondary th {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.port-sgh-page .mao_a_detail .actrcle table.secondary th,
.port-sgh-page .mao_a_detail .actrcle table.secondary td {
  padding: 0 14px;
  height: 44px;
  border-bottom: 1px solid var(--line-soft);
  border-left: 0 !important;
  border-right: 0 !important;
  background: #fff !important;
  background-color: #fff !important;
  color: var(--text-body) !important;
  font-size: 13px;
  line-height: 1.55;
  vertical-align: middle;
  text-align: left;
}

.port-sgh-page .mao_a_detail .actrcle table.secondary th {
  background: var(--table-head-bg-alt) !important;
  background-color: var(--table-head-bg-alt) !important;
  color: var(--sub) !important;
  font-weight: 600;
}

.port-sgh-page .mao_a_detail .actrcle table.secondary tr:last-child td,
.port-sgh-page .mao_a_detail .actrcle table.secondary tr:last-child th {
  border-bottom: 0;
}

.port-sgh-page .mao_a_detail .actrcle table.secondary .field,
.port-sgh-page .mao_a_detail .actrcle table.secondary .data,
.port-sgh-page .mao_a_detail .actrcle table.secondary .altdata,
.port-sgh-page .mao_a_detail .actrcle table.secondary tr.row-posn-0 td,
.port-sgh-page .mao_a_detail .actrcle table.secondary tr.row-posn-1 td,
.port-sgh-page .mao_a_detail .actrcle table.secondary tr.row-posn-0 th,
.port-sgh-page .mao_a_detail .actrcle table.secondary tr.row-posn-1 th {
  background: #fff !important;
  background-color: #fff !important;
}

.port-sgh-page .mao_a_detail .actrcle table.secondary thead th {
  background: #f8fafd !important;
  background-color: #f8fafd !important;
}

.port-sgh-page .mao_a_detail .actrcle table.secondary td:first-child,
.port-sgh-page .mao_a_detail .actrcle table.secondary th:first-child {
  color: var(--sub);
  font-weight: 600;
  white-space: nowrap;
  width: 200px;
  min-width: 200px;
}

.port-sgh-page .mao_a_detail .actrcle ol.a {
  margin: 10px 0 14px;
  padding-left: 22px;
  color: #3c4043;
  font-size: 13px;
  line-height: 1.7;
}

.port-sgh-page .mao_a_detail .actrcle ol.a .hd {
  display: block;
  margin-bottom: 6px;
  color: var(--text);
  font-weight: 600;
}

/* ==================== Right live modules（内容区下方） ==================== */
.port-sgh-page .port-sgh-live-modules .pre_arriavl,
.port-sgh-page .port-sgh-module-plans {
  width: 100% !important;
  float: none !important;
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: var(--card);
  box-shadow: var(--shadow);
  padding: 16px;
  margin: 0 !important;
}

.port-sgh-page .port-sgh-hero-side #weather_top,
.port-sgh-page .port-sgh-hero-weather #weather_top {
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(60, 64, 67, .08);
  padding: 16px;
  overflow: hidden;
  flex: 1 1 auto;
  width: 100%;
  height: 100%;
  min-height: 230px;
  box-sizing: border-box;
  min-width: 0;
  display: flex;
  flex-direction: column;
  position: relative;
}

/* 空态：外框与地图卡完全一致，内层铺满同款浅蓝灰底（不另加虚线框造成高低错位） */
.port-sgh-page .port-sgh-hero-side #weather_top:has(.port-sgh-weather-empty),
.port-sgh-page .port-sgh-hero-weather #weather_top:has(.port-sgh-weather-empty) {
  padding: 0;
  background: #fff;
}

.port-sgh-page .port-sgh-weather-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  flex: 1 1 auto;
  min-height: 230px;
  height: 100%;
  margin: 0;
  padding: 20px 24px;
  box-sizing: border-box;
  text-align: center;
  background: linear-gradient(135deg, #f4f7fb 0%, #eef3fa 100%);
  border: 0;
  border-radius: 15px;
}

.port-sgh-page .port-sgh-weather-empty-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(95, 126, 168, .12);
  color: #5f7ea8;
  font-size: 20px;
  line-height: 1;
}

.port-sgh-page .port-sgh-weather-empty-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #80868b;
}

.port-sgh-page .port-sgh-weather-empty-text {
  margin: 0;
  max-width: 14em;
  font-size: 13px;
  line-height: 1.45;
  color: #5f6b7a;
  font-weight: 500;
}

/* 通栏气象与地图同高 */
.port-sgh-page .port-sgh-hero-side {
  align-items: stretch;
}

.port-sgh-page .port-sgh-hero-weather,
.port-sgh-page .port-sgh-hero-side .port-sgh-hero-map-card {
  height: 100%;
  min-height: 230px;
  align-self: stretch;
}

.port-sgh-page .port-sgh-hero-side #weather_top .weather_top,
.port-sgh-page .port-sgh-hero-weather #weather_top .weather_top {
  min-width: 0;
}

.port-sgh-page .port-sgh-hero-side #weather_top .img_suuny,
.port-sgh-page .port-sgh-hero-weather #weather_top .img_suuny {
  flex-wrap: wrap;
  min-width: 0;
}

.port-sgh-page .port-sgh-hero-side #weather_top .weather_detail,
.port-sgh-page .port-sgh-hero-weather #weather_top .weather_detail {
  min-width: 0;
}

.port-sgh-page .port-sgh-hero-side #weather_top .weather_detail p,
.port-sgh-page .port-sgh-hero-weather #weather_top .weather_detail p {
  font-size: 12px;
  padding: 8px 10px;
  gap: 8px;
  word-break: break-word;
}

.port-sgh-page .port-sgh-hero-side #weather_top .weather_detail p span:last-child,
.port-sgh-page .port-sgh-hero-weather #weather_top .weather_detail p span:last-child {
  text-align: right;
  flex-shrink: 0;
}

.port-sgh-page .port-sgh-hero-map-card #port_map,
.port-sgh-page .port-sgh-hero-side .port-sgh-hero-map-card #port_map {
  width: 100% !important;
  flex: 1 1 auto;
  height: 100% !important;
  min-height: 230px;
  border-radius: 0;
  overflow: hidden;
  background: #d8ecff !important;
  border: 0;
  margin: 0;
  box-sizing: border-box;
}

.port-sgh-page .port-sgh-live-modules.fl-right.weather,
.port-sgh-page .fl-right.weather {
  display: flex;
  flex-direction: column;
  gap: 28px;
  float: none !important;
  width: 100% !important;
}

/* 旧 weather 列样式兼容 */
.port-sgh-page #weather_top {
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: linear-gradient(135deg, #fff 0%, #f8fbff 56%, #e8f0fe 100%);
  box-shadow: var(--shadow);
  padding: 16px;
  overflow: hidden;
  box-sizing: border-box;
}

.port-sgh-page #weather_top .weather_top {
  display: block !important;
}

.port-sgh-page #weather_top .img_suuny {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.port-sgh-page #weather_top .img_suuny > div:first-child {
  display: flex;
  align-items: center;
  gap: 12px;
}

.port-sgh-page #weather_top .suunt_span {
  color: var(--text) !important;
  font-size: 14px;
  font-weight: 600;
}

.port-sgh-page #weather_top .weather_detail p {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 8px;
  padding: 9px 10px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: rgba(255, 255, 255, .72);
  font-size: 13px;
  color: var(--sub);
}

.port-sgh-page #weather_top .weather_detail p span:last-child {
  color: var(--text);
  font-weight: 600;
}

.port-sgh-page .pre_arriavl {
  width: 100% !important;
  float: none !important;
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: var(--card);
  box-shadow: var(--shadow);
  padding: 16px;
  margin: 0 !important;
}

.port-sgh-page .pre_arriavl .pre_title,
.port-sgh-page .pre_arriavl .span_aree,
.port-sgh-page .van-cell-group__title .span_aree {
  float: none !important;
}

.port-sgh-page .port-sgh-hero-side .port-sgh-hero-map-card #port_map,
.port-sgh-page #port_map.port-sgh-hero-map-canvas {
  width: 100% !important;
  height: 230px !important;
  min-height: 230px !important;
  background-color: #d8ecff !important;
  border-radius: 16px;
  overflow: hidden;
}

.port-sgh-page #port_plan_map.port-sgh-plan-map-canvas {
  width: 100% !important;
  max-width: 100% !important;
  height: 260px !important;
  background-color: #fff !important;
  box-sizing: border-box;
}
.port-sgh-page #port_plan_map.map_img_003.port-sgh-plan-map {
  margin-top: 0;
}
.port-sgh-page #port_plan.map_img_003,
.port-sgh-page #port_plan.port-sgh-plan-list {
  width: 100% !important;
  min-height: auto !important;
  margin-top: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent !important;
  font-size: 13px;
  line-height: 1.5;
  color: #3c4043;
}

.port-sgh-plan-list {
  display: grid;
  gap: 10px;
  height: 100%;
  align-content: start;
}

.port-sgh-plan-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 72px;
  padding: 12px 14px;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: #fbfcff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.port-sgh-plan-item:hover {
  border-color: #c6dafc;
  box-shadow: 0 1px 4px rgba(26, 115, 232, 0.08);
}

.port-sgh-plan-item-main {
  min-width: 0;
}

.port-sgh-plan-label {
  display: block;
  color: var(--text);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
}

.port-sgh-plan-desc {
  display: block;
  margin-top: 4px;
  color: var(--sub);
  font-size: 12px;
  line-height: 1.45;
}

.port-sgh-plan-action {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border: 1px solid #c6dafc;
  border-radius: 999px;
  background: #fff;
  color: var(--accent);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.port-sgh-plan-action:hover {
  background: #e8f0fe;
}

.port-sgh-plan-action img {
  width: 16px;
  height: 16px;
  margin: 0;
  vertical-align: middle;
}

.port-sgh-page #port_plan img {
  vertical-align: middle;
  margin-left: 0;
}

.port-sgh-page .e_chart {
  width: 100% !important;
  height: 260px !important;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: #fff;
  margin-top: 8px;
}

.port-sgh-page .weater_detail,
.port-sgh-page #weater_detail {
  margin-top: 0;
}

.port-sgh-page .port-sgh-module-weather .port-sgh-weather-grid-wrap,
.port-sgh-page .port-sgh-module-weather#weater_detail,
.port-sgh-page .port-sgh-module-weather #weater_detail,
.port-sgh-page #weater_detail.port-sgh-weather-grid-wrap {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  justify-content: initial !important;
}

.port-sgh-page .tide_table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.port-sgh-page .tide_table th,
.port-sgh-page .tide_table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line-soft);
}

/* ==================== Public messages ==================== */
.port-sgh-page .kai-remark {
  border: 0;
  background: transparent;
}

.port-sgh-page .h-ui-toolbar .title .content {
  float: none !important;
}

.port-sgh-page .van-cell-group {
  border: 0 !important;
  background: transparent !important;
}

.port-sgh-page .van-cell {
  border: 1px solid var(--line-soft) !important;
  border-radius: 14px !important;
  margin-bottom: 10px;
  box-shadow: none !important;
}

.port-sgh-page .van-button--primary {
  background: var(--g-blue) !important;
  border-color: var(--g-blue) !important;
  border-radius: 18px !important;
}

/* ==================== Modal ==================== */
#myModal.modal {
  background-color: rgba(0, 0, 0, .72) !important;
}

#myModal .modal-content {
  border-radius: 12px;
}

#myModal .close {
  color: #fff;
}

/* ==================== Misc overrides ==================== */
.port-sgh-page .detail_mian_g {
  float: none !important;
}

.port-sgh-page .floatClear {
  clear: both;
}

.port-sgh-page .serch_div {
  margin-top: 16px !important;
}

/* ==================== ACE source (hidden) ==================== */
.port-sgh-page .port-sgh-ace-source {
  display: none !important;
}

.port-sgh-page .port-sgh-van-source {
  display: none !important;
}

/* ==================== Sidebar ACE nav card ==================== */
.port-sgh-ace-nav-card {
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: var(--card);
  box-shadow: var(--shadow);
  padding: 14px;
}

.port-sgh-side-title {
  margin: 2px 0 12px;
  color: #3c4043;
  font-size: 14px;
  font-weight: 600;
}

.port-sgh-report-list {
  display: grid;
  gap: 8px;
}

.port-sgh-report-link {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 9px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: #fff;
  color: #3c4043;
  font-size: 12px;
  line-height: 1.45;
  text-decoration: none !important;
  cursor: pointer;
  transition: background .12s, border-color .12s;
}

.port-sgh-report-link:before {
  content: "";
  width: 8px;
  height: 8px;
  margin-top: 4px;
  border-radius: 50%;
  background: var(--g-yellow, #fbbc04);
  flex: 0 0 auto;
}

.port-sgh-report-link:hover {
  background: var(--g-blue-soft);
  border-color: #c6dafc;
  color: var(--g-blue);
}

/* ==================== Live module section heads ==================== */
.port-sgh-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 0 0 14px;
}

.port-sgh-section-title {
  margin: 0;
  color: var(--text);
  font-size: 22px;
  line-height: 1.35;
  font-weight: 500;
}

.port-sgh-section-chip {
  height: 24px;
  border-radius: 12px;
  background: #f1f3f4;
  color: var(--sub);
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  white-space: nowrap;
  flex-shrink: 0;
}

.port-sgh-module-lead {
  margin: 0 0 16px;
  color: #3c4043;
  font-size: 14px;
  line-height: 1.75;
}

/* ==================== ACE cards + drawer ==================== */
.port-sgh-ace-module-head {
  align-items: center;
}

.port-sgh-ace-carousel {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(300px, 36%);
  gap: 14px;
  overflow-x: auto;
  scroll-snap-type: inline mandatory;
  padding: 4px 2px 12px;
  margin-top: 12px;
  cursor: grab;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.port-sgh-ace-carousel::-webkit-scrollbar {
  display: none;
}

.port-sgh-ace-carousel.is-dragging {
  scroll-snap-type: none;
  cursor: grabbing;
}

.port-sgh-ace-carousel .port-sgh-ace-card {
  scroll-snap-align: start;
  min-height: 176px;
}

.port-sgh-ace-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.port-sgh-ace-card {
  display: flex;
  flex-direction: column;
  min-height: 176px;
  gap: 8px;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  background: #f8fafd;
  padding: 16px;
  cursor: pointer;
  transition: box-shadow .16s, border-color .16s;
}

.port-sgh-ace-card:hover {
  border-color: #c6dafc;
  box-shadow: 0 2px 8px rgba(60, 64, 67, .1);
}

.port-sgh-ace-label {
  color: var(--sub);
  font-size: 12px;
  font-weight: 600;
}

.port-sgh-ace-value {
  color: #3c4043;
  font-size: 14px;
  line-height: 1.5;
  flex: 1;
}

.port-sgh-report-more {
  align-self: flex-start;
  margin-top: auto;
  height: 32px;
  border: 1px solid #c6dafc;
  border-radius: 18px;
  background: var(--g-blue-soft);
  color: var(--g-blue);
  cursor: pointer;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 600;
}

.port-sgh-report-more:hover {
  background: #d2e3fc;
}

.port-sgh-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10050;
  background: rgba(32, 33, 36, .42);
  opacity: 0;
  transition: opacity .18s ease;
}

.port-sgh-drawer-backdrop.is-visible {
  opacity: 1;
}

.port-sgh-report-drawer {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 10051;
  width: min(560px, 92vw);
  height: 100%;
  border-left: 1px solid var(--line-soft);
  background: #fff;
  box-shadow: -8px 0 32px rgba(60, 64, 67, .18);
  transform: translateX(100%);
  transition: transform .22s ease;
  display: flex;
  flex-direction: column;
}

.port-sgh-report-drawer.is-open {
  transform: translateX(0);
}

body.port-sgh-drawer-open {
  overflow: hidden;
}

.port-sgh-drawer-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 22px 24px;
  border-bottom: 1px solid var(--line-soft);
}

.port-sgh-drawer-head h2 {
  margin: 8px 0 0;
  color: var(--text);
  font-size: 22px;
  font-weight: 500;
  line-height: 1.35;
}

.port-sgh-drawer-head p {
  margin: 6px 0 0;
  color: var(--sub);
  font-size: 13px;
}

.port-sgh-drawer-close {
  width: 40px;
  height: 40px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: #fff;
  color: var(--sub);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}

.port-sgh-drawer-body {
  flex: 1;
  overflow: auto;
  padding: 20px 24px 28px;
  color: #3c4043;
  font-size: 14px;
  line-height: 1.75;
  background: #fff;
}

.port-sgh-drawer-body h1 {
  display: none;
}

.port-sgh-drawer-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 12px 0;
  font-size: 13px;
}

.port-sgh-drawer-body td,
.port-sgh-drawer-body th {
  border: 1px solid var(--line-soft);
  padding: 8px 10px;
}

.port-sgh-drawer-body--plan .port-sgh-plan-drawer-img {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  min-height: 200px;
  padding: 8px 0;
  background: #f8fafd;
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  overflow: auto;
}

.port-sgh-drawer-body--plan .port-sgh-plan-drawer-img img {
  max-width: 100%;
  width: auto;
  height: auto;
  display: block;
}

.port-sgh-drawer-loading,
.port-sgh-drawer-error {
  padding: 24px 0;
  text-align: center;
  color: var(--sub);
  font-size: 14px;
}

/* ==================== Port plans two-col ==================== */
.port-sgh-two-col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 4px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.port-sgh-plan-map-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}

.port-sgh-plan-map {
  border: 1px solid var(--line-soft) !important;
  border-radius: 14px !important;
  overflow: hidden;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}

.port-sgh-plan-links .map_img_003 {
  margin-top: 0;
  height: 100%;
}

.port-sgh-page .port-sgh-plan-links .data-item,
.port-sgh-page #port_plan.port-sgh-plan-list {
  border: 0;
  border-radius: 0;
  background: transparent !important;
  padding: 0;
  font-size: 13px;
  line-height: 1.5;
}

/* ==================== Public Message (unique title) ==================== */
.port-sgh-message-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 4px;
}

.port-sgh-message-title {
  margin: 0;
  color: var(--text);
  font-size: 24px;
  line-height: 1.3;
  font-weight: 500;
}

.port-sgh-message-lead {
  margin: 6px 0 0;
  color: var(--sub);
  font-size: 13px;
  line-height: 1.6;
  max-width: 640px;
}

.port-sgh-message-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.port-sgh-scroll-button {
  width: 34px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 17px;
  background: #fff;
  color: var(--g-blue);
  cursor: pointer;
  font-size: 20px;
  line-height: 30px;
}

.port-sgh-scroll-button:hover {
  background: var(--g-blue-soft);
  border-color: #c6dafc;
}

.port-sgh-add-message-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 6px 14px;
  border: 1px solid var(--g-blue);
  border-radius: 6px;
  background: var(--g-blue);
  color: #fff;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
  transition: all .2s ease;
  white-space: nowrap;
}

.port-sgh-add-message-btn:hover {
  background: #1d4ed8;
  border-color: #1d4ed8;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(37, 99, 235, .3);
}

.port-sgh-add-message-btn:active {
  transform: translateY(0);
  box-shadow: none;
}

.port-sgh-add-message-icon {
  font-size: 16px;
  font-weight: 300;
}

.port-sgh-add-message-text {
  letter-spacing: .2px;
}

.port-sgh-message-drawer-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, .5);
  z-index: 10000;
  backdrop-filter: blur(2px);
}

.port-sgh-message-drawer-overlay.active {
  display: block;
}

.port-sgh-message-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: 360px;
  max-width: 90vw;
  background: #fff;
  border-radius: 16px 0 0 16px;
  box-shadow: -4px 0 24px rgba(0, 0, 0, .15);
  z-index: 10001;
  transform: translateX(100%);
  transition: transform .3s ease;
  overflow-y: auto;
  visibility: hidden;
  pointer-events: none;
}

.port-sgh-message-drawer.active {
  transform: translateX(0);
  visibility: visible;
  pointer-events: auto;
}

@media only screen and (min-width: 768px) {
  .port-sgh-message-drawer {
    width: 400px;
  }
}

.port-sgh-message-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--line-soft);
}

.port-sgh-message-drawer-title {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
}

.port-sgh-message-drawer-close {
  width: 32px;
  height: 32px;
  border: none;
  border-radius: 50%;
  background: #f1f5f9;
  color: #64748b;
  font-size: 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .2s ease;
}

.port-sgh-message-drawer-close:hover {
  background: #e2e8f0;
  color: #334155;
}

.port-sgh-message-drawer-body {
  padding: 16px 20px 20px;
}

.port-sgh-message-textarea {
  width: 100%;
  min-height: 100px;
  padding: 12px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.6;
  color: #1e293b;
  resize: vertical;
  box-sizing: border-box;
  outline: none;
  transition: border-color .2s ease;
}

.port-sgh-message-textarea:focus {
  border-color: var(--g-blue);
  box-shadow: 0 0 0 3px rgba(26, 115, 232, .1);
}

.port-sgh-message-textarea::placeholder {
  color: #94a3b8;
}

.port-sgh-message-word-limit {
  text-align: right;
  font-size: 12px;
  color: #94a3b8;
  margin-top: 6px;
}

.port-sgh-message-submit-btn {
  width: 100%;
  margin-top: 16px;
  padding: 12px;
  border: none;
  border-radius: 8px;
  background: var(--g-blue);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all .2s ease;
}

.port-sgh-message-submit-btn:hover {
  background: #1d4ed8;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(37, 99, 235, .3);
}

.port-sgh-message-submit-btn:active {
  transform: translateY(0);
  box-shadow: none;
}

.port-sgh-message-carousel {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(300px, 36%);
  gap: 14px;
  overflow-x: auto;
  scroll-snap-type: inline mandatory;
  padding: 4px 2px 12px;
  margin-top: 12px;
  cursor: grab;
  scrollbar-width: none;
}

.port-sgh-message-carousel::-webkit-scrollbar {
  display: none;
}

.port-sgh-message-carousel.is-dragging {
  cursor: grabbing;
  scroll-snap-type: none;
}

.port-sgh-message-card {
  scroll-snap-align: start;
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  background: #fff;
  padding: 16px;
  min-height: 178px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.port-sgh-message-meta {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--sub);
  font-size: 12px;
}

.port-sgh-message-author {
  color: var(--g-blue);
  font-weight: 600;
}

.port-sgh-message-author:before {
  content: "@";
}

.port-sgh-message-card-title {
  color: var(--text);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
}

.port-sgh-message-body {
  color: #3c4043;
  font-size: 14px;
  line-height: 1.55;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  word-break: break-word;
  flex: 1;
}

.port-sgh-message-detail-btn {
  margin-top: 8px;
}

.port-sgh-float-top {
  position: fixed;
  right: 28px;
  bottom: 28px;
  z-index: 10040;
  width: 48px;
  height: 48px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: #fff;
  box-shadow: var(--shadow);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity .2s ease, visibility .2s ease, transform .2s ease, background .16s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  overflow: hidden;
}

.port-sgh-float-top img {
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.port-sgh-float-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.port-sgh-float-top:hover {
  background: var(--g-blue-soft);
  border-color: #c6dafc;
}

/* ==================== Fullscreen image preview ==================== */
.port-sgh-img-overlay {
  position: fixed;
  inset: 0;
  z-index: 10100;
  background: rgba(0, 0, 0, 0.9);
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s ease, visibility .25s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: zoom-out;
}

.port-sgh-img-overlay.is-visible {
  opacity: 1;
  visibility: visible;
}

.port-sgh-img-overlay-close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 24px;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s ease, border-color .15s ease;
  z-index: 10101;
}

.port-sgh-img-overlay-close:hover {
  background: rgba(255, 255, 255, 0.2);
  border-color: rgba(255, 255, 255, 0.5);
}

.port-sgh-img-overlay-content {
  max-width: 95vw;
  max-height: 95vh;
  width: auto;
  height: auto;
  cursor: zoom-in;
  transition: transform .2s ease;
  image-rendering: high-quality;
}

.port-sgh-img-overlay-content.zoomed {
  cursor: zoom-out;
}

.port-sgh-message-store {
  display: none !important;
}

/* ==================== PSC module ==================== */
.port-sgh-module-psc .port-sgh-psc-panel {
  margin-top: 8px;
  border: 1px solid var(--line-soft);
  border-radius: 16px;
  background: #fff;
  overflow: hidden;
}

.port-sgh-module-psc .port-sgh-psc-tabs {
  margin: 0;
  padding: 0 18px;
  border-bottom: 1px solid var(--line-soft);
  background: #f8fafd;
}

.port-sgh-module-psc .port-sgh-psc-tabs li {
  position: relative;
  min-width: 0;
  margin: 0 28px 0 0;
  padding: 0 2px;
  line-height: 46px;
  color: var(--sub) !important;
  font-size: 14px;
  font-weight: 500;
  border: 0 !important;
  background: transparent !important;
}

.port-sgh-module-psc .port-sgh-psc-tabs li:last-child {
  margin-right: 0;
}

.port-sgh-module-psc .layui-tab-brief > .port-sgh-psc-tabs .layui-this {
  color: var(--g-blue) !important;
  border: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  background: transparent !important;
}

.port-sgh-module-psc .layui-tab-brief > .port-sgh-psc-tabs .layui-this:before {
  display: none !important;
  content: none !important;
}

.port-sgh-module-psc .layui-tab-brief > .port-sgh-psc-tabs .layui-this:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: auto !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 3px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 3px 3px 0 0;
  background: var(--g-blue) !important;
  transform: none !important;
}

.port-sgh-module-psc .port-sgh-psc-tabs li:hover {
  color: var(--g-blue) !important;
}

.port-sgh-module-psc .port-sgh-psc-tab-content {
  padding: 0;
}

.port-sgh-psc-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.port-sgh-psc-table thead th {
  padding: 12px 16px;
  border-bottom: 1px solid var(--line-soft);
  background: #fff;
  color: var(--sub);
  font-size: 12px;
  font-weight: 600;
  text-align: left;
}

.port-sgh-psc-table tbody td {
  padding: 14px 16px;
  border-bottom: 1px solid var(--line-soft);
  color: #3c4043;
  font-size: 14px;
  line-height: 1.5;
  vertical-align: middle;
  word-break: break-word;
}

.port-sgh-psc-table tbody tr:last-child td {
  border-bottom: 0;
}

.port-sgh-psc-table .port-sgh-psc-action-col {
  width: 96px;
}

.port-sgh-psc-table--inspect tbody td:last-child,
.port-sgh-psc-table--inspect thead th:last-child {
  text-align: right;
}

.port-sgh-psc-table tbody td:nth-child(2),
.port-sgh-psc-table tbody td:nth-child(3),
.port-sgh-psc-table thead th:nth-child(2),
.port-sgh-psc-table thead th:nth-child(3) {
  width: 88px;
}

.port-sgh-psc-table .port-sgh-psc-action-cell {
  text-align: right;
  white-space: nowrap;
}

.port-sgh-psc-detail-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: auto;
  margin-top: 0;
  min-width: 56px;
  height: 32px;
  padding: 0 12px;
  white-space: nowrap;
  line-height: 1;
}

.port-sgh-psc-pagination {
  padding: 14px 16px 18px;
  border-top: 1px solid var(--line-soft);
}

.port-sgh-module-psc .layui-laypage {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin: 0;
}

.port-sgh-module-psc .layui-laypage > * {
  margin: 0 !important;
  float: none !important;
}

.port-sgh-module-psc .layui-laypage a,
.port-sgh-module-psc .layui-laypage span:not(.layui-laypage-curr) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 14px;
  line-height: 1;
  border: 1px solid var(--line) !important;
  border-radius: 18px;
  color: var(--g-blue) !important;
  background: #fff !important;
  font-size: 13px;
  font-weight: 500;
  box-sizing: border-box;
  transition: background .16s ease, border-color .16s ease;
}

.port-sgh-module-psc .layui-laypage .layui-laypage-curr {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 14px;
  line-height: 1;
  border: 0 !important;
  border-radius: 18px;
  background: var(--g-blue) !important;
  color: #fff !important;
  font-size: 13px;
  font-weight: 600;
  box-sizing: border-box;
}

.port-sgh-module-psc .layui-laypage .layui-laypage-curr .layui-laypage-em {
  display: none !important;
}

.port-sgh-module-psc .layui-laypage .layui-laypage-curr em {
  position: static !important;
  font-style: normal;
  color: #fff !important;
  background: transparent !important;
}
.port-sgh-module-psc .layui-laypage a:hover {
  background: var(--g-blue-soft) !important;
  border-color: #c6dafc !important;
}

.port-sgh-module-psc .layui-laypage .layui-disabled,
.port-sgh-module-psc .layui-laypage .layui-disabled:hover {
  color: #9aa0a6 !important;
  border-color: var(--line-soft) !important;
  background: #f8fafd !important;
  cursor: not-allowed;
}

.port-sgh-module-psc .layui-laypage .layui-laypage-limits,
.port-sgh-module-psc .layui-laypage .layui-laypage-skip,
.port-sgh-module-psc .layui-laypage .layui-laypage-count {
  height: 36px;
  line-height: 36px;
  color: var(--sub) !important;
  border: 0 !important;
  background: transparent !important;
  padding: 0 4px;
}

.port-sgh-psc-detail-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.port-sgh-psc-detail-table th,
.port-sgh-psc-detail-table td {
  border: 1px solid var(--line-soft);
  padding: 8px 10px;
  text-align: left;
}

.port-sgh-psc-detail-table th {
  background: #f8fafd;
  color: var(--sub);
  font-weight: 600;
}

.port-sgh-drawer-body--psc .port-sgh-drawer-empty {
  color: var(--sub);
  font-size: 14px;
}

.port-sgh-message-tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.port-sgh-message-tag {
  height: 24px;
  padding: 0 10px;
  border-radius: 12px;
  background: #f1f3f4;
  color: var(--sub);
  font-size: 12px;
  display: inline-flex;
  align-items: center;
}

/* ==================== Weather forecast module ==================== */
.port-sgh-weather-grid-wrap {
  margin-top: 4px;
  width: 100%;
}

.port-sgh-weather-forecast.port-sgh-chart-layout {
  display: grid;
  width: 100%;
  max-width: none;
  grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr);
  align-items: stretch;
  margin-top: 0;
}

.port-sgh-weather-forecast .port-sgh-chart-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  width: 100%;
  min-height: 268px;
  height: 100%;
}

.port-sgh-weather-forecast .port-sgh-chart-title {
  flex: 0 0 auto;
  margin-bottom: 10px;
}

.port-sgh-weather-forecast .port-sgh-chart-note {
  max-width: 58%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.port-sgh-temp-chart {
  display: grid;
  gap: 10px;
  flex: 1 1 auto;
}

.port-sgh-forecast-row {
  display: grid;
  grid-template-columns: 72px 1fr 58px;
  align-items: center;
  gap: 10px;
  min-height: 32px;
}

.port-sgh-forecast-day {
  color: #3c4043;
  font-size: 13px;
  font-weight: 600;
}

.port-sgh-range-track {
  height: 10px;
  border-radius: 999px;
  background: #eef3fb;
  overflow: hidden;
}

.port-sgh-range-bar {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #4285f4, #fbbc04, #ea4335);
  margin-left: var(--start);
  width: var(--size);
}

.port-sgh-forecast-value {
  color: var(--sub);
  font-size: 12px;
  text-align: right;
  white-space: nowrap;
}

.port-sgh-wind-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
  margin-top: auto;
  padding-top: 12px;
}

.port-sgh-wind-chip {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  height: 28px;
  border-radius: 14px;
  padding: 0 4px;
  background: #f1f3f4;
  color: #3c4043;
  font-size: 11px;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.port-sgh-humidity-bars {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  align-items: end;
  flex: 1 1 auto;
  min-height: 168px;
  padding-top: 4px;
}

.port-sgh-humidity-bar {
  display: grid;
  grid-template-rows: 1fr auto auto;
  gap: 6px;
  justify-items: center;
  height: 100%;
  min-height: 148px;
  max-height: 168px;
}

.port-sgh-humidity-fill {
  align-self: end;
  width: 100%;
  max-width: 30px;
  height: var(--height);
  min-height: 20px;
  border-radius: 10px 10px 4px 4px;
  background: linear-gradient(180deg, #1a73e8, #8ab4f8);
}

.port-sgh-humidity-value,
.port-sgh-humidity-day {
  color: var(--sub);
  font-size: 11px;
  text-align: center;
  white-space: nowrap;
}

/* ==================== Traffic ==================== */
.port-sgh-traffic-overview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 4px 0 16px;
}

.port-sgh-ring-card {
  display: grid;
  grid-template-columns: 112px 1fr;
  align-items: center;
  gap: 16px;
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  background: #fff;
  padding: 16px;
}

.port-sgh-ring {
  width: 112px;
  height: 112px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  position: relative;
}

.port-sgh-ring--blue {
  background: conic-gradient(#1a73e8 74%, #edf2f7 0);
}

.port-sgh-ring--green {
  background: conic-gradient(#34a853 88%, #edf2f7 0);
}

.port-sgh-ring:after {
  content: "";
  position: absolute;
  inset: 14px;
  border-radius: 50%;
  background: #fff;
}

.port-sgh-ring strong {
  position: relative;
  z-index: 1;
  color: var(--text);
  font-size: 22px;
  line-height: 1;
}

.port-sgh-ring-meta span {
  display: block;
  color: var(--sub);
  font-size: 12px;
  margin-bottom: 6px;
}

.port-sgh-ring-meta b {
  display: block;
  color: var(--text);
  font-size: 16px;
}

.port-sgh-chart-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
}

.port-sgh-chart-layout--traffic .port-sgh-e-chart.e_chart {
  height: 260px !important;
}

.port-sgh-traffic-source {
  display: none !important;
}

.port-sgh-chart-card {
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  background: #fff;
  padding: 16px;
  min-width: 0;
}

.port-sgh-chart-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  color: #3c4043;
  font-size: 14px;
  font-weight: 600;
}

.port-sgh-chart-note {
  color: var(--sub);
  font-size: 12px;
  font-weight: 400;
}

.port-sgh-chart-stack {
  display: grid;
  gap: 12px;
}

.port-sgh-page .port-sgh-e-chart.e_chart {
  width: 100% !important;
  height: 220px !important;
  margin-top: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.port-sgh-chart-layout--traffic .port-sgh-e-chart#shipInportInfo.e_chart {
  height: 200px !important;
  box-shadow: none;
}

.port-sgh-chart-layout--traffic .port-sgh-e-chart#arrivalShipInfo.e_chart {
  height: 240px !important;
  box-shadow: none;
}

.port-sgh-distance-list .clearfix {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line-soft);
}

.port-sgh-distance-list .clearfix:last-child {
  border-bottom: 0;
}

.port-sgh-distance-list .span_p0_2 {
  float: none !important;
  color: #3c4043;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
}

.port-sgh-distance-list .spna_P00 {
  float: none !important;
  color: var(--sub);
  font-size: 12px;
  font-weight: 600;
}

/* ==================== Responsive ==================== */
@media (max-width: 1180px) {
  .port-sgh-hero-main,
  .port-sgh-hero-main.port-sgh-hero-main--lcr {
    grid-template-columns: 1fr;
  }

  .port-sgh-hero-side {
    grid-template-columns: 1fr 1fr;
  }

  .port-sgh-hero-side .port-sgh-hero-map-card #port_map,
  .port-sgh-page .port-sgh-hero-side .port-sgh-hero-map-card #port_map {
    min-height: 220px;
    height: 220px !important;
  }

  .port-sgh-page .port-sgh-hero-side #weather_top,
  .port-sgh-page .port-sgh-hero-weather #weather_top {
    min-height: 220px;
  }

  .port-sgh-search-panel {
    grid-template-columns: 1fr;
  }

  .port-sgh-page .port-sgh-layout.g_detail_box {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "side"
      "main";
  }

  .port-sgh-page .port-sgh-layout > .port-sgh-side {
    width: 100%;
    max-width: none;
  }

  .port-sgh-hero-main,
  .port-sgh-hero-main.port-sgh-hero-main--lcr {
    grid-template-columns: 1fr !important;
    min-width: 0 !important;
    width: 100% !important;
  }

  .port-sgh-ace-grid,
  .port-sgh-two-col,
  .port-sgh-chart-layout,
  .port-sgh-weather-forecast.port-sgh-chart-layout,
  .port-sgh-traffic-overview,
  .port-sgh-page .port-sgh-data-grid {
    grid-template-columns: 1fr;
  }

  .port-sgh-page .port-sgh-kv-head,
  .port-sgh-page .port-sgh-kv-row {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .port-sgh-humidity-bars {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    min-height: 140px;
  }

  .port-sgh-wind-row {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .port-sgh-wind-chip {
    font-size: 10px;
    padding: 0 2px;
  }

  .port-sgh-message-carousel,
  .port-sgh-ace-carousel {
    grid-auto-columns: minmax(260px, 78%);
  }

  .port-sgh-side {
    position: static !important;
    max-height: none;
    overflow: visible;
  }

  .port-sgh-page .port-sgh-side .mao_a_nav {
    width: 100% !important;
    transform: none !important;
  }

  .port-sgh-page .port-sgh-hero-metrics .box_op {
    grid-template-columns: repeat(3, 1fr);
  }

  .port-sgh-page .port-sgh-hero-metrics .t:nth-child(3) {
    border-right: 0;
  }

  .port-sgh-page .port-sgh-hero-metrics .t:nth-child(n+4) {
    border-top: 1px solid var(--line-soft);
  }
}

@media (max-width: 720px) {
  .port-sgh-page {
    padding: 20px 16px 56px;
  }

  .port-sgh-top-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .port-sgh-hero-main {
    padding: 20px;
  }

  .port-sgh-hero-side {
    grid-template-columns: 1fr;
  }

  .port-sgh-hero-summary {
    font-size: 14px;
  }

  .port-sgh-page #portInfo .title_box_detail .fl-left,
  .port-sgh-page .port-sgh-port-name {
    font-size: 30px;
  }

  .port-sgh-page .port-sgh-hero-metrics .box_op {
    grid-template-columns: 1fr;
  }

  .port-sgh-page .port-sgh-hero-metrics .t {
    border-right: 0;
    border-bottom: 1px solid var(--line-soft);
  }

  .port-sgh-page .port-sgh-hero-metrics .t:nth-child(n+4) {
    border-top: 0;
  }

  .port-sgh-weather-forecast .port-sgh-chart-card {
    min-height: 0;
  }

  .port-sgh-forecast-row {
    grid-template-columns: 64px 1fr 52px;
    gap: 8px;
  }

  .port-sgh-wind-row {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    overflow-x: auto;
    padding-bottom: 2px;
  }

  .port-sgh-humidity-bars {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    min-height: 120px;
  }

  .port-sgh-humidity-bar {
    min-height: 110px;
    max-height: none;
  }

  .port-sgh-top-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .port-sgh-top-actions {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .port-sgh-report-drawer {
    width: 100%;
  }
}
.port-sgh-beta-body .port-sgh-page #setion_p.box_mao_a_tail,
.port-sgh-beta-body .box_mao_a_tail {
  padding: 0;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* ==================== Legacy inline style migration (detail + region) ==================== */
.port-sgh-beta-body,
.port-sgh-beta-body * {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.port-sgh-beta-body tr {
  transition: opacity .5s;
}

/* ==================== 正文区域（后端接口填充的 XML/HTML）样式增强 ==================== */
/* 作用域严格限制在 setion_p_content，不影响页面其他部分 */

/* ---------- 全局重置：清除 port-region.css 第1058行的 text-indent:2em 继承 ---------- */
.port-sgh-page .setion_p_content,
.port-sgh-page .setion_p_content * {
  text-indent: 0 !important;
}

/* 精确覆盖 port-region-page .port-region-guide-body .p / p 的 2em 缩进 */
.port-region-page.port-sgh-page .port-region-guide-body .setion_p_content .p,
.port-region-page.port-sgh-page .port-region-guide-body .setion_p_content p,
.port-region-page.port-sgh-page .port-region-guide-body .setion_p_content .h0text,
.port-region-page.port-sgh-page .port-region-guide-body .setion_p_content .hd2,
.port-region-page.port-sgh-page .port-region-guide-body .setion_p_content .hd3,
.port-region-page.port-sgh-page .port-region-guide-body .setion_p_content .hd4,
.port-region-page.port-sgh-page .port-region-guide-body .setion_p_content .cidb-h2,
.port-region-page.port-sgh-page .port-region-guide-body .setion_p_content .cidb-h3,
.port-region-page.port-sgh-page .port-region-guide-body .setion_p_content .cidb-item,
.port-region-page.port-sgh-page .port-region-guide-body .setion_p_content .pfirst,
.port-region-page.port-sgh-page .port-region-guide-body .setion_p_content .port-sgh-note,
.port-region-page.port-sgh-page .port-region-guide-body .setion_p_content .title_act {
  text-indent: 0 !important;
}

/* ---------- 通用容器节奏控制 ---------- */
.port-sgh-page .setion_p_content {
  position: relative;
  line-height: 1.8;
  color: var(--text-body);
}

/* ---------- Detail 页面：每个 section 卡片（actrcle）装饰 ---------- */
.port-sgh-page .setion_p_content .actrcle {
  position: relative;
  overflow: hidden;
  padding-top: 24px !important;
}

.port-sgh-page .setion_p_content .actrcle::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #1a73e8 0%, #34a853 45%, #fbbc04 75%, #ea4335 100%);
  opacity: .88;
}

/* ---------- Section 标题（title_act）：左侧色条 + 装饰 ---------- */
.port-sgh-page .setion_p_content .title_act {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 6px 0 10px 22px !important;
  margin-bottom: 18px !important;
  color: #202124;
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: .2px;
  border-bottom: 1px solid rgba(60, 64, 67, .08);
  text-indent: 0 !important;
}

.port-sgh-page .setion_p_content .title_act::before {
  content: "";
  position: absolute;
  top: 6px;
  bottom: 10px;
  left: 0;
  width: 6px;
  border-radius: 6px;
  background: linear-gradient(180deg, #1a73e8 0%, #4285f4 100%);
  box-shadow: 0 2px 6px rgba(26, 115, 232, .28);
}

.port-sgh-page .setion_p_content .title_act::after {
  display: inline-block !important;
  content: "" !important;
  width: 34px;
  height: 34px;
  margin-left: auto;
  border-radius: 10px;
  background:
    radial-gradient(circle at 30% 30%, rgba(26, 115, 232, .14) 0%, transparent 55%),
    radial-gradient(circle at 70% 70%, rgba(52, 168, 83, .12) 0%, transparent 55%),
    linear-gradient(135deg, #eef3fc 0%, #f5f8f5 100%);
  position: relative;
  flex: 0 0 auto;
}

/* ---------- 首段（pfirst）：左侧色条 + 浅蓝背景 ---------- */

/* 【清零】嵌套在子容器内部的 pfirst（不是顶级直接子）：去掉底部外间距
   只命中：在 .port-sgh-section-body / .h0 内部，但不是它们的直接孩子的 pfirst
   精确覆盖 screenshot 中 <div class="boh_sea"> 内部 pfirst 等场景 */
.port-sgh-page .setion_p_content .port-sgh-section-body > *:not(.pfirst):not([class*="port-sgh-section"]):not(.h0) > .pfirst,
.port-sgh-page .setion_p_content .port-sgh-section-body > *:not(.pfirst) > *:not(.pfirst) > .pfirst,
.port-sgh-page .setion_p_content .port-sgh-section-body > div:not([class^="port-sgh"]) > .pfirst,
.port-sgh-page .setion_p_content .port-sgh-section-body .boh_sea > .pfirst,
.port-sgh-page .setion_p_content .h0 > *:not(.pfirst) > .pfirst,
.port-sgh-page .setion_p_content .actrcle > *:not(.port-sgh-section-body) > .pfirst,
.port-sgh-page .setion_p_content > *:not(.actrcle):not(.h0):not(.pfirst) > *:not(.pfirst) > .pfirst,
.port-sgh-page .setion_p_content td > .pfirst,
.port-sgh-page .setion_p_content li > .pfirst {
  margin-bottom: 0 !important;
}

/* 【保留】直接子元素的 pfirst：必须有 margin-bottom:14px
   规则放在清零之后，相同特异性时后写生效，确保不被上面误覆盖
   包含：setion_p_content / port-sgh-section-body / h0 / actrcle 下的直接孩子 */
.port-sgh-page .setion_p_content > .pfirst,
.port-sgh-page .setion_p_content .port-sgh-section-body > .pfirst,
.port-sgh-page .setion_p_content .h0 > .pfirst,
.port-sgh-page .setion_p_content .actrcle > .port-sgh-section-body > .pfirst,
.port-sgh-page .setion_p_content .pfirst {
  display: block !important;
  position: relative;
  padding: 12px 16px 12px 18px !important;
  margin: 0 0 14px !important;
  border-left: 4px solid #1a73e8;
  border-radius: 0 12px 12px 0;
  background: linear-gradient(135deg, #f3f7fd 0%, #eef6ff 100%);
  color: #2b3644;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.85;
}

/* 空的 pfirst（没有文字内容）不显示左边框和背景 */
.port-sgh-page .setion_p_content .pfirst:empty,
.port-sgh-page .setion_p_content .port-sgh-section-body > .pfirst:empty {
  display: none !important;
  visibility: hidden;
  height: 0;
  padding: 0 !important;
  margin: 0 !important;
  border-left: 0 !important;
  background: transparent !important;
}

/* ---------- 普通段落（p）：段间距增强 ---------- */
.port-sgh-page .setion_p_content .p,
.port-sgh-page .setion_p_content p,
.port-sgh-page .setion_p_content .port-sgh-section-body > p,
.port-sgh-page .setion_p_content .port-sgh-section-body > .p {
  margin: 0 0 12px !important;
  color: #3c4043;
  font-size: 14px;
  line-height: 1.85;
}

.port-sgh-page .setion_p_content .p:last-child,
.port-sgh-page .setion_p_content p:last-child {
  margin-bottom: 0 !important;
}

/* ---------- 二级标题（hd2/hd3/hd4）：胶囊标签风格 ---------- */
.port-sgh-page .setion_p_content .port-sgh-section-body {
  display: block !important;
}
.port-sgh-page .setion_p_content .hd2,
.port-sgh-page .setion_p_content .hd3,
.port-sgh-page .setion_p_content .hd4,
.port-sgh-page .setion_p_content .port-sgh-section-body .hd2,
.port-sgh-page .setion_p_content .port-sgh-section-body .hd3,
.port-sgh-page .setion_p_content .port-sgh-section-body .hd4 {
  display: block !important;
  margin: 20px 0 8px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #1e3a8a !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  letter-spacing: .2px;
  position: relative;
  box-shadow: none !important;
  text-indent: 0 !important;
  clear: both !important;
}

.port-sgh-page .setion_p_content .hd2::before,
.port-sgh-page .setion_p_content .hd3::before,
.port-sgh-page .setion_p_content .hd4::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #1a73e8;
  box-shadow: 0 0 0 2px rgba(26, 115, 232, .18);
}

.port-sgh-page .setion_p_content .hd2 .hd2,
.port-sgh-page .setion_p_content .hd3 .hd3,
.port-sgh-page .setion_p_content .hd4 .hd4 {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  display: inline !important;
}

/* ======================= 全局强禁内层标签的::before（解决双圆点根因） =======================
   外层 div.hd2/hd3/hd4 一个 ::before 蓝点就够了；
   内层 span.hd2/b.hd2/span.hd3/... 无论屏宽、无论是否在 .boh_sea/.actrcle 内部，一律不准再出圆点 */
.port-sgh-page .setion_p_content .hd2 .hd2::before,
.port-sgh-page .setion_p_content .hd3 .hd3::before,
.port-sgh-page .setion_p_content .hd4 .hd4::before,
.port-sgh-page .setion_p_content .h0text .h0text::before,
.port-sgh-page .setion_p_content .title_act .title_act::before,
.port-sgh-page .setion_p_content .boh_sea .hd2 .hd2::before,
.port-sgh-page .setion_p_content .boh_sea .hd3 .hd3::before,
.port-sgh-page .setion_p_content .boh_sea .hd4 .hd4::before,
.port-sgh-page .setion_p_content .actrcle .hd2 .hd2::before,
.port-sgh-page .setion_p_content .actrcle .hd3 .hd3::before,
.port-sgh-page .setion_p_content .actrcle .hd4 .hd4::before,
.port-sgh-page.ui-v2 .setion_p_content .hd2 .hd2::before,
.port-sgh-page.ui-v2 .setion_p_content .hd3 .hd3::before,
.port-sgh-page.ui-v2 .setion_p_content .hd4 .hd4::before,
.port-sgh-page.ui-v2 .setion_p_content .h0text .h0text::before,
.port-sgh-page.ui-v2 .setion_p_content .title_act .title_act::before,
.port-region-page.ui-v2 .setion_p_content .hd2 .hd2::before,
.port-region-page.ui-v2 .setion_p_content .hd3 .hd3::before,
.port-region-page.ui-v2 .setion_p_content .hd4 .hd4::before,
.port-region-page.ui-v2 .setion_p_content .h0text .h0text::before,
.port-region-page.ui-v2 .setion_p_content .title_act .title_act::before {
  display: none !important;
  content: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

/* ---------- 链接：高亮下划线 ---------- */
.port-sgh-page .setion_p_content a,
.port-sgh-page .setion_p_content a.link,
.port-sgh-page .setion_p_content .p a,
.port-sgh-page .setion_p_content .pfirst a {
  color: #1a73e8;
  text-decoration: none;
  border-bottom: 1px solid rgba(26, 115, 232, .28);
  padding-bottom: 1px;
  transition: all .15s ease;
  font-weight: 500;
}

.port-sgh-page .setion_p_content a:hover,
.port-sgh-page .setion_p_content a.link:hover {
  color: #1967d2;
  border-bottom-color: #1a73e8;
  background: rgba(26, 115, 232, .06);
  border-radius: 3px;
  padding: 1px 3px;
  margin: 0 -3px;
}

/* ---------- 注释/备注：彩色便签 ---------- */
.port-sgh-page .setion_p_content .port-sgh-note,
.port-sgh-page .setion_p_content .port-sgh-section-body .port-sgh-note {
  position: relative;
  margin: 18px 0 4px !important;
  padding: 14px 16px 14px 44px !important;
  border-radius: 14px;
  background: linear-gradient(135deg, #fff8e1 0%, #fff3c4 100%) !important;
  border-left: 0 !important;
  box-shadow: 0 2px 8px rgba(251, 188, 4, .18), inset 0 0 0 1px rgba(251, 188, 4, .2);
  color: #5d4037 !important;
  font-size: 13px !important;
  line-height: 1.75 !important;
}

.port-sgh-page .setion_p_content .port-sgh-note::before {
  content: "✓";
  position: absolute;
  left: 14px;
  top: 14px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fbbc04;
  color: #fff;
  font-weight: 700;
  font-size: 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(251, 188, 4, .35);
}

/* ---------- Data Grid 卡片：渐变边框 + 悬浮高亮 ---------- */
.port-sgh-page .setion_p_content .port-sgh-data-grid {
  margin: 8px 0 10px;
  gap: 14px;
}

.port-sgh-page .setion_p_content .port-sgh-data-item {
  position: relative;
  padding: 14px 15px;
  border-radius: 14px;
  border: 0 !important;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(135deg, #4285f4 0%, #34a853 100%) border-box;
  border: 1px solid transparent;
  transition: transform .18s ease, box-shadow .18s ease;
}

.port-sgh-page .setion_p_content .port-sgh-data-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(26, 115, 232, .14);
}

.port-sgh-page .setion_p_content .port-sgh-data-label {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  padding: 2px 8px;
  margin-bottom: 10px;
  border-radius: 6px;
  background: rgba(26, 115, 232, .08);
  color: #1a73e8;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .5px;
  text-transform: uppercase;
}

.port-sgh-page .setion_p_content .port-sgh-data-label::before {
  content: "";
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #1a73e8;
}

.port-sgh-page .setion_p_content .port-sgh-data-value {
  color: #202124;
  font-size: 13.5px;
  line-height: 1.6;
  font-weight: 600;
}

/* ---------- KV 表格：斑马纹 + 头部渐变 ---------- */
.port-sgh-page .setion_p_content .port-sgh-kv-table {
  margin: 10px 0 6px !important;
  border-radius: 14px;
  overflow: hidden;
  border: 0 !important;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(135deg, rgba(66, 133, 244, .35) 0%, rgba(52, 168, 83, .3) 100%) border-box;
  border: 1px solid transparent;
  box-shadow: 0 2px 10px rgba(60, 64, 67, .06);
}

.port-sgh-page .setion_p_content .port-sgh-kv-head {
  background: linear-gradient(135deg, #1a73e8 0%, #4285f4 100%) !important;
  color: #fff;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: .3px;
  padding: 12px 16px !important;
  border-bottom: 0 !important;
}

.port-sgh-page .setion_p_content .port-sgh-kv-head span {
  color: #fff;
}

.port-sgh-page .setion_p_content .port-sgh-kv-row {
  padding: 11px 16px !important;
  border-bottom: 1px solid rgba(60, 64, 67, .06) !important;
  transition: background .12s ease;
}

.port-sgh-page .setion_p_content .port-sgh-kv-row:nth-child(even) {
  background: #f8fafd;
}

.port-sgh-page .setion_p_content .port-sgh-kv-row:hover {
  background: #eef5ff !important;
}

.port-sgh-page .setion_p_content .port-sgh-kv-label {
  position: relative;
  padding-left: 14px;
  color: #5f6368;
  font-size: 13px;
  font-weight: 600;
}

.port-sgh-page .setion_p_content .port-sgh-kv-label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  border-radius: 2px;
  background: #34a853;
}

.port-sgh-page .setion_p_content .port-sgh-kv-value {
  color: #202124;
  font-size: 13.5px;
  line-height: 1.65;
  font-weight: 500;
}

/* ---------- HTML 原生 table.secondary：圆角包裹 + 斑马纹 ---------- */
.port-sgh-page .setion_p_content table.secondary {
  width: 100% !important;
  border: 0 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(135deg, rgba(66, 133, 244, .35) 0%, rgba(234, 67, 53, .25) 100%) border-box;
  border: 1px solid transparent !important;
  box-shadow: 0 2px 10px rgba(60, 64, 67, .06) !important;
  margin: 14px 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

.port-sgh-page .setion_p_content table.secondary thead th,
.port-sgh-page .setion_p_content table.secondary th {
  background: linear-gradient(135deg, #1a73e8 0%, #4285f4 100%) !important;
  color: #fff !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  letter-spacing: .3px;
  height: 46px !important;
  padding: 0 16px !important;
  border-bottom: 0 !important;
  /* --- 垂直居中覆盖 valign=top --- */
  vertical-align: middle !important;
}

.port-sgh-page .setion_p_content table.secondary thead th *,
.port-sgh-page .setion_p_content table.secondary th * {
  vertical-align: middle !important;
}

.port-sgh-page .setion_p_content table.secondary tbody td,
.port-sgh-page .setion_p_content table.secondary td {
  background: #fff !important;
  background-color: #fff !important;
  color: #202124 !important;
  font-size: 13px !important;
  height: 44px !important;
  padding: 8px 16px !important;
  border-bottom: 1px solid rgba(60, 64, 67, .06) !important;
  transition: background .12s ease;
  /* --- 垂直居中覆盖 valign=top --- */
  vertical-align: middle !important;
}

/* td 内部的 p / span / div 子元素也强制垂直居中，避免 p 默认 margin 导致贴顶 */
.port-sgh-page .setion_p_content table.secondary tbody td > *,
.port-sgh-page .setion_p_content table.secondary td > p,
.port-sgh-page .setion_p_content table.secondary td > span,
.port-sgh-page .setion_p_content table.secondary td > div,
.port-sgh-page .setion_p_content table.secondary td p,
.port-sgh-page .setion_p_content table.secondary td span {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 1.6 !important;
  vertical-align: middle !important;
  display: inline-block;
}

.port-sgh-page .setion_p_content table.secondary tbody tr:nth-child(even) td,
.port-sgh-page .setion_p_content table.secondary tr.row-posn-1 td {
  background: #f8fafd !important;
  background-color: #f8fafd !important;
}

.port-sgh-page .setion_p_content table.secondary tbody tr:hover td {
  background: #eef5ff !important;
  background-color: #eef5ff !important;
}

.port-sgh-page .setion_p_content table.secondary td:first-child,
.port-sgh-page .setion_p_content table.secondary th:first-child {
  color: #1a73e8 !important;
  font-weight: 600;
}

/* ---------- Region 页面：CIDB wrapper 大卡片 ---------- */
.port-sgh-page .setion_p_content .cidb-wrapper {
  padding: 24px 26px;
  margin: 0 0 22px;
  border-radius: 18px;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(135deg, #4285f4 0%, #34a853 50%, #fbbc04 100%) border-box;
  border: 1px solid transparent;
  box-shadow: 0 4px 18px rgba(60, 64, 67, .08);
  position: relative;
  overflow: hidden;
}

.port-sgh-page .setion_p_content .cidb-wrapper::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 5px;
  background: linear-gradient(90deg, #1a73e8, #34a853 45%, #fbbc04 75%, #ea4335);
}

.port-sgh-page .setion_p_content .cidb-h1 {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 4px 0 18px 24px;
  margin: 0 0 22px;
  color: #202124;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: .2px;
  border-bottom: 1px dashed rgba(60, 64, 67, .1);
}

.port-sgh-page .setion_p_content .cidb-h1::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  bottom: 18px;
  width: 7px;
  border-radius: 7px;
  background: linear-gradient(180deg, #1a73e8 0%, #ea4335 100%);
  box-shadow: 0 2px 8px rgba(26, 115, 232, .3);
}

.port-sgh-page .setion_p_content .cidb-h1::after {
  content: "i";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: linear-gradient(135deg, #1a73e8, #4285f4);
  color: #fff;
  font-style: italic;
  font-weight: 700;
  font-size: 15px;
  box-shadow: 0 3px 10px rgba(26, 115, 232, .32);
}

/* ---------- CIDB 分组卡片 ---------- */
.port-sgh-page .setion_p_content .cidb-grp {
  padding: 18px 18px 10px;
  margin: 0 0 16px;
  border-radius: 14px;
  background: linear-gradient(135deg, #fafcff 0%, #f5faf6 100%);
  box-shadow: inset 0 0 0 1px rgba(26, 115, 232, .08);
  position: relative;
}

.port-sgh-page .setion_p_content .cidb-grp:last-child {
  margin-bottom: 0;
}

.port-sgh-page .setion_p_content .cidb-grp::before {
  content: "";
  position: absolute;
  top: 18px;
  left: 0;
  bottom: 10px;
  width: 3px;
  border-radius: 3px;
  background: linear-gradient(180deg, #34a853 0%, #1a73e8 100%);
}

/* ---------- CIDB 分组标题 ---------- */
.port-sgh-page .setion_p_content .cidb-h2 {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 14px 6px 10px;
  margin: 0 0 14px;
  border-radius: 999px;
  background: linear-gradient(135deg, #e6f4ea 0%, #e8f0fe 100%);
  color: #137333;
  font-size: 14.5px;
  font-weight: 700;
  letter-spacing: .2px;
  box-shadow: inset 0 0 0 1px rgba(52, 168, 83, .2);
  text-indent: 0 !important;
}

.port-sgh-page .setion_p_content .cidb-h2::before {
  content: "";
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 30%, #fff 0%, transparent 40%),
    linear-gradient(135deg, #34a853, #1a73e8);
  box-shadow: 0 2px 6px rgba(52, 168, 83, .3);
}

/* ---------- CIDB 条目行 ---------- */
.port-sgh-page .setion_p_content .cidb-item {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
  padding: 10px 6px 10px 8px;
  margin: 0 0 6px;
  border-bottom: 1px dashed rgba(60, 64, 67, .07);
  color: #3c4043;
  font-size: 13.5px;
  line-height: 1.8;
}

.port-sgh-page .setion_p_content .cidb-item:last-child {
  border-bottom: 0;
  margin-bottom: 0;
}

.port-sgh-page .setion_p_content .cidb-item:hover {
  background: rgba(26, 115, 232, .04);
  border-radius: 8px;
  padding-left: 12px;
}

/* ---------- CIDB 标签 ---------- */
.port-sgh-page .setion_p_content .cidb-h3 {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 180px;
  padding: 2px 10px;
  border-radius: 6px;
  background: rgba(26, 115, 232, .08);
  color: #1a73e8;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .2px;
}

.port-sgh-page .setion_p_content .cidb-h3::after {
  content: "";
  margin-left: auto;
}

/* ---------- CIDB 汇率专属样式 ---------- */
.port-sgh-page .setion_p_content .cidb-erdate {
  display: inline-block;
  padding: 2px 8px;
  margin-left: 4px;
  border-radius: 999px;
  background: #fbbc04;
  color: #5d4037;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .3px;
  vertical-align: middle;
}

.port-sgh-page .setion_p_content .cidb-er {
  display: block;
  flex: 1 1 100%;
  margin: 10px 0 6px;
  padding: 12px 16px;
  border-radius: 10px;
  background: linear-gradient(135deg, #1a73e8 0%, #4285f4 100%);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .3px;
  text-align: center;
  box-shadow: 0 3px 12px rgba(26, 115, 232, .28);
}

.port-sgh-page .setion_p_content .cidb-ack {
  display: block;
  flex: 1 1 100%;
  padding: 0 2px;
  color: #5f6368;
  font-size: 11.5px;
  text-align: right;
}

.port-sgh-page .setion_p_content .cidb-ack a {
  color: #1a73e8;
}

/* ---------- Region 页面：.h0 大 section 卡片化（POLLUTION / MEDICAL 等） ---------- */
.port-sgh-page .setion_p_content .h0 {
  position: relative;
  padding: 24px 24px 18px;
  margin: 0 0 18px;
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-lg);
  background: var(--card);
  box-shadow: var(--shadow);
  overflow: hidden;
  scroll-margin-top: 20px;
}

.port-sgh-page .setion_p_content .h0::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #ea4335 0%, #fbbc04 50%, #34a853 100%);
  opacity: .9;
}

/* ---------- Region .h0 标题 ---------- */
.port-sgh-page .setion_p_content .h0text {
  display: flex !important;
  align-items: center;
  align-content: center;
  gap: 12px;
  position: relative;
  padding: 10px 18px;
  margin: 0 0 16px !important;
  border-radius: 14px;
  background: linear-gradient(135deg, #fce8e6 0%, #fef7e0 50%, #e6f4ea 100%);
  color: #b3261e;
  font-size: 15.5px !important;
  font-weight: 700 !important;
  letter-spacing: .4px;
  text-transform: uppercase;
  box-shadow: inset 0 0 0 1px rgba(234, 67, 53, .18);
  width: 100%;
  box-sizing: border-box;
  flex-wrap: wrap;
  line-height: 1.5;
  white-space: normal;
  text-indent: 0 !important;
}

.port-sgh-page .setion_p_content .h0text::before {
  content: "";
  display: inline-flex;
  flex: 0 0 auto;
  position: static;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ea4335;
  box-shadow: 0 0 0 3px rgba(234, 67, 53, .18), 0 0 12px rgba(234, 67, 53, .4);
  animation: sgh-h0-pulse 2.2s ease-in-out infinite;
  transform: none;
}

@keyframes sgh-h0-pulse {
  0%, 100% { box-shadow: 0 0 0 3px rgba(234, 67, 53, .18), 0 0 8px rgba(234, 67, 53, .35); }
  50%      { box-shadow: 0 0 0 5px rgba(234, 67, 53, .08), 0 0 16px rgba(234, 67, 53, .5); }
}

.port-sgh-page .setion_p_content .h0 .pfirst {
  margin-top: 0 !important;
}

/* ---------- Region .h0 内段落 ---------- */
.port-sgh-page .setion_p_content .h0 .p,
.port-sgh-page .setion_p_content .h0 p {
  margin: 0 0 12px !important;
  color: #3c4043;
  font-size: 14px;
  line-height: 1.85;
}

.port-sgh-page .setion_p_content .h0 .p:last-child {
  margin-bottom: 0 !important;
}

.port-sgh-beta-body tr.hidden {
  opacity: 0;
}

.port-sgh-beta-body .captcheBtnBox button {
  opacity: 0;
  width: 1px;
  height: 1px;
  line-height: 1px;
  overflow: hidden;
}

.port-sgh-beta-body .modal {
  display: none;
  position: fixed;
  z-index: 1000;
  padding-top: 10%;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, .6);
}

.port-sgh-beta-body .modal .caption,
.port-sgh-beta-body #myModal .caption {
  font-size: 16px;
  text-align: center;
  width: min(340px, calc(100vw - 32px));
  background: #fff;
  margin: 0 auto;
  padding: 24px 20px;
  border: 0;
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, .2);
  color: var(--text);
}

.port-sgh-beta-body .modal .caption2 {
  font-size: 16px;
  color: var(--g-blue);
  text-align: center;
  width: min(280px, calc(100vw - 32px));
  background: #fff;
  margin: 0 auto;
  border-radius: 16px;
}

.port-sgh-beta-body .modal .know,
.port-sgh-beta-body #myModal .know {
  width: 120px;
  height: 34px;
  border: 0;
  background: var(--g-blue);
  color: #fff;
  cursor: pointer;
  border-radius: 17px;
  font-size: 14px;
  margin: 0 5px;
}

.port-sgh-beta-body .modal .captionlogin {
  font-size: 16px;
  text-align: center;
  width: 130px;
  background: #fff;
  margin: 0 auto;
  border-radius: 10px;
}

.port-sgh-beta-body .modal .captionLoginClick {
  font-size: 16px;
  height: 50px;
  padding-top: 15px;
  border: 1px solid #c6dafc;
  border-radius: 10px;
  cursor: pointer;
  color: var(--g-blue);
}

.port-sgh-beta-body .maoDetail {
  padding-top: 0 !important;
  width: 100%;
  min-height: auto !important;
  background: var(--page-bg) !important;
}

/* getJurisdiction funStart=false / 未登录：正文区明确提示 */
.port-guide-noauth {
  display: flex !important;
  justify-content: stretch;
  align-items: flex-start;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 280px;
  padding: 8px 0 24px !important;
  margin: 0 !important;
  box-sizing: border-box;
  background: transparent !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
}

/* 注意：勿使用 *card* 类名，避免命中 ui-v2 [class*="card"] 的通用 padding 规则 */
.port-guide-noauth-panel {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 28px 24px 24px !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  background: #fff !important;
  box-shadow: 0 2px 12px rgba(15, 23, 42, .06) !important;
  text-align: center;
  box-sizing: border-box !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.port-guide-noauth-badge {
  display: inline-block !important;
  margin: 0 0 14px !important;
  padding: 4px 12px !important;
  border-radius: 999px;
  background: #fef2f2 !important;
  color: #b91c1c !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  letter-spacing: .02em;
  visibility: visible !important;
}

.port-guide-noauth-title {
  display: block !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  color: #0f172a !important;
  font-size: 20px !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
  visibility: visible !important;
}

.port-guide-noauth-desc {
  display: block !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  color: #475569 !important;
  font-size: 14.5px !important;
  line-height: 1.7 !important;
  font-weight: 400 !important;
  text-indent: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-height: none !important;
  overflow: visible !important;
  white-space: normal !important;
}

.port-guide-noauth-contact {
  display: block !important;
  margin: 0 0 22px !important;
  padding: 16px 14px !important;
  border-radius: 12px !important;
  background: #f1f5f9 !important;
  color: #334155 !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
  visibility: visible !important;
}

.port-guide-noauth-contact-label {
  display: block !important;
  margin-bottom: 6px !important;
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.port-guide-noauth-contact-line {
  display: block !important;
  margin: 2px 0 !important;
  font-weight: 600 !important;
  color: #0f172a !important;
  font-size: 14px !important;
}

.port-guide-noauth-actions {
  display: flex !important;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  align-items: center;
  visibility: visible !important;
}

.port-guide-noauth-btn,
.port-guide-noauth-btn-ghost {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 18px !important;
  border-radius: 10px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  cursor: pointer;
  border: 1px solid transparent;
  visibility: visible !important;
  white-space: nowrap;
}

.port-guide-noauth-btn {
  background: #2563eb !important;
  color: #fff !important;
  border-color: #2563eb !important;
}

.port-guide-noauth-btn:hover {
  background: #1d4ed8 !important;
}

.port-guide-noauth-btn-ghost {
  background: #fff !important;
  color: #334155 !important;
  border-color: #cbd5e1 !important;
}

.port-guide-noauth-btn-ghost:hover {
  border-color: #94a3b8 !important;
  background: #f8fafc !important;
}

.port-sgh-page.ui-v2 .port-guide-noauth,
.port-region-page.ui-v2 .port-guide-noauth {
  background: transparent !important;
  padding: 0 0 8px !important;
  min-height: 240px;
}

/* 无权限 / 未登录：隐藏 Port Plans 及以下 live 模块 */
.port-sgh-page.port-guide-fun-denied .port-sgh-live-modules,
.port-sgh-page.port-guide-fun-denied #portSghAceNav,
body.port-guide-fun-denied .port-sgh-live-modules,
/* 未授权前默认隐藏，避免首屏先露出空模块壳 */
.port-sgh-page:not(.port-guide-authorized) .port-sgh-live-modules,
.port-sgh-page:not(.port-guide-authorized) #portSghAceNav {
  display: none !important;
}

.port-sgh-guide-gate {
  display: none;
  width: 100%;
  margin: 0 0 20px;
  box-sizing: border-box;
}

.port-sgh-guide-gate.is-visible,
.port-sgh-guide-gate:not([hidden]) {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

.port-sgh-guide-gate .port-guide-noauth {
  padding: 0 !important;
  min-height: 0 !important;
  display: flex !important;
}

.port-sgh-guide-gate .port-guide-noauth-panel {
  max-width: 100% !important;
  display: block !important;
}

/* 正文区内登录/无权限提示（无独立 gate 时的兜底）：强制可见 */
.port-sgh-page .setion_p_content > .port-guide-noauth {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.port-sgh-page.port-guide-fun-denied .port-sgh-content:has(.port-guide-noauth),
.port-sgh-page.port-guide-login-required .port-sgh-content:has(.port-guide-noauth) {
  display: block !important;
  visibility: visible !important;
  min-height: 0 !important;
}

/* 未登录：侧栏目录保持空壳，不展示模块锚点 */
.port-sgh-page.port-guide-login-required #label_contents,
body.port-guide-login-required #label_contents {
  min-height: 0;
}

/* 无权限：隐藏港口索引及相关入口 */
.port-region-page.port-guide-fun-denied #portRegionIndex,
.port-region-page.port-guide-fun-denied .port-region-map-legend a[href="#portRegionIndex"],
.port-region-page.port-guide-fun-denied .port-region-metric:has(#portRegionResultCount),
body.port-guide-fun-denied #portRegionIndex,
body.port-guide-fun-denied .port-region-map-legend a[href="#portRegionIndex"],
body.port-guide-fun-denied .port-region-metric:has(#portRegionResultCount) {
  display: none !important;
}

.port-sgh-beta-body .change_backcolor1 {
  background-color: transparent !important;
  color: #3c4043 !important;
  text-align: left;
}

.port-sgh-beta-body .change_backcolor2 {
  background-color: #f1f3f4 !important;
  color: var(--sub) !important;
  text-align: left;
}

.port-sgh-beta-body .lable_show {
  display: block !important;
  visibility: visible !important;
}

.port-sgh-beta-body .lable_hide {
  display: none !important;
  visibility: hidden !important;
}

.port-sgh-beta-body .lable_color1 {
  color: var(--g-blue) !important;
}

.port-sgh-beta-body .lable_color2 {
  color: var(--text) !important;
}

.port-sgh-beta-body .auth-mask-field .disabled-noauth {
  position: absolute;
}

.port-sgh-beta-body .auth-mask-field .disabled-noauth .auth_mask_field_content {
  position: absolute;
  padding: 4px;
  z-index: 4;
  background-color: #fff;
  text-align: center;
  border: 1px solid #c6dafc;
  border-radius: 8px;
  font-size: 12px;
  width: 80px;
}

.port-sgh-beta-body .auth-mask-field .noauth {
  color: var(--g-blue);
  cursor: pointer;
}

.port-sgh-beta-body .auth-mask-field .auth_mask_field_suffix {
  color: #323233;
}

.port-sgh-beta-body .van-cell {
  box-sizing: border-box;
  width: 100%;
  padding: 10px 16px;
  overflow: hidden;
  color: #323233;
  font-size: 14px;
  line-height: 18px;
  background-color: #fff;
}

.port-sgh-beta-body .port-sgh-module-psc .layui-table th {
  position: relative;
  padding: 9px 5px;
  min-height: 20px;
  line-height: 20px;
  font-size: 12px;
}

.port-sgh-beta-body .port-sgh-module-psc .layui-tab-item table tr {
  border-bottom: 1px solid var(--line-soft);
  line-height: 20px;
}

.port-sgh-beta-body .port-sgh-page .pre_arriavl {
  background: var(--card) !important;
}
.port-sgh-beta-body .port-sgh-page .pre_arriavl#weather-module{
  display: block;
}
.port-sgh-beta-body .proportion {
  text-align: center;
}

.port-sgh-beta-body #myImg {
  border-radius: 5px;
  cursor: pointer;
  transition: .3s;
}

.port-sgh-beta-body #myImg:hover {
  opacity: .7;
}

.port-sgh-beta-body .modal-content,
.port-sgh-beta-body #caption {
  -webkit-animation-name: port-sgh-modal-zoom;
  -webkit-animation-duration: .6s;
  animation-name: port-sgh-modal-zoom;
  animation-duration: .6s;
}

@-webkit-keyframes port-sgh-modal-zoom {
  from { -webkit-transform: scale(0); }
  to { -webkit-transform: scale(1); }
}

@keyframes port-sgh-modal-zoom {
  from { transform: scale(0); }
  to { transform: scale(1); }
}

.port-sgh-beta-body .modal .close {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  transition: .3s;
}

.port-sgh-beta-body .modal .close:hover,
.port-sgh-beta-body .modal .close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}

.port-sgh-beta-body .modal-content {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
}

.port-sgh-beta-body #caption {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
  text-align: center;
  color: #ccc;
  padding: 10px 0;
  height: 150px;
}

@media only screen and (max-width: 700px) {
  .port-sgh-beta-body .modal-content {
    width: 100%;
  }
}

/* ================================================================
   UI 评审整改 V2 —— 全局设计 tokens（作用域：.port-sgh-page.ui-v2）
   移植到动态页（detail.html / regionInfo.html）：只需给 <main class="port-sgh-page"> 加 .ui-v2 类即可
   ================================================================ */

/* ---------- 1. 全局字体 & 基础排版 token ---------- */
.port-sgh-page.ui-v2,
.port-sgh-page.ui-v2 *,
.port-region-page.ui-v2,
.port-region-page.ui-v2 * {
  font-family: Arial, "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.port-sgh-page.ui-v2,
.port-region-page.ui-v2 {
  color: #1f2937;
  line-height: 1.65;
}

/* 页面主容器：收紧留白，桌面 padding 24px，最大宽度更合理（detail/regionInfo 1280 就够） */
.port-sgh-page.ui-v2,
.port-region-page.ui-v2 {
  padding: 24px 28px 64px !important;
  max-width: 1280px !important;
  box-sizing: border-box;
}

/* ---------- 2. 标题行高统一 ---------- */
/* hero 大标题（H1 级） */
.port-sgh-page.ui-v2 .port-sgh-hero-title,
.port-sgh-page.ui-v2 [class*="hero"] [class*="title"],
.port-sgh-page.ui-v2 h1.port-sgh-hero-title,
.port-region-page.ui-v2 [class*="intro"] [class*="title"],
.port-region-page.ui-v2 [class*="title_row"] h1,
.port-region-page.ui-v2 [class*="hero"] [class*="title"] {
  font-size: 36px !important;
  line-height: 1.22 !important;
  letter-spacing: -0.02em;
  font-weight: 700;
}

/* section 一级标题（ACE Report/Weather 等大模块标题） */
.port-sgh-page.ui-v2 section > h2,
.port-sgh-page.ui-v2 [class*="panel"] > [class*="head"] h2,
.port-sgh-page.ui-v2 .port-sgh-section-head h2,
.port-region-page.ui-v2 section > h2,
.port-region-page.ui-v2 [class*="panel"] > [class*="head"] h2 {
  font-size: 22px !important;
  line-height: 1.35 !important;
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* ---------- 3. 统一 section / 卡片 / 段落间距节奏 ---------- */
.port-sgh-page.ui-v2 > section,
.port-region-page.ui-v2 > section {
  margin-top: 24px !important;
  margin-bottom: 0 !important;
}
.port-sgh-page.ui-v2 > section:first-of-type,
.port-region-page.ui-v2 > section:first-of-type {
  margin-top: 0 !important;
}
.port-sgh-page.ui-v2 [class*="panel"],
.port-sgh-page.ui-v2 [class*="card"],
.port-region-page.ui-v2 [class*="panel"],
.port-region-page.ui-v2 [class*="card"] {
  padding: 24px !important;
}

/* 正文段落间距 12-16px（避免页面过3w px）；左右与 .pfirst / .hd2 的 16px 内边距对齐 */
.port-sgh-page.ui-v2 .setion_p_content .p,
.port-sgh-page.ui-v2 .setion_p_content p,
.port-sgh-page.ui-v2 .setion_p_content div.p,
.port-region-page.ui-v2 .setion_p_content .p,
.port-region-page.ui-v2 .setion_p_content p,
.port-region-page.ui-v2 .setion_p_content div.p {
  margin: 0 0 14px !important;
  line-height: 1.7 !important;
}
.port-sgh-page.ui-v2 .setion_p_content .port-sgh-section-body > .p,
.port-sgh-page.ui-v2 .setion_p_content .port-sgh-section-body > div.p,
.port-sgh-page.ui-v2 .setion_p_content .port-sgh-section-body > p,
.port-region-page.ui-v2 .setion_p_content .port-sgh-section-body > .p,
.port-region-page.ui-v2 .setion_p_content .port-sgh-section-body > div.p,
.port-region-page.ui-v2 .setion_p_content .port-sgh-section-body > p {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  box-sizing: border-box !important;
}
.port-sgh-page.ui-v2 .setion_p_content .p:last-child,
.port-sgh-page.ui-v2 .setion_p_content p:last-child,
.port-region-page.ui-v2 .setion_p_content .p:last-child,
.port-region-page.ui-v2 .setion_p_content p:last-child {
  margin-bottom: 0 !important;
}

/* actrcle / h0 section 卡片之间统一 24px（detail.html 也是如此） */
.port-sgh-page.ui-v2 .setion_p_content .actrcle,
.port-sgh-page.ui-v2 .setion_p_content .h0,
.port-region-page.ui-v2 .setion_p_content .actrcle,
.port-region-page.ui-v2 .setion_p_content .h0 {
  margin: 24px 0 0 !important;
}
.port-sgh-page.ui-v2 .setion_p_content > *:first-child.actrcle,
.port-sgh-page.ui-v2 .setion_p_content > *:first-child.h0,
.port-region-page.ui-v2 .setion_p_content > *:first-child.actrcle,
.port-region-page.ui-v2 .setion_p_content > *:first-child.h0 {
  margin-top: 0 !important;
}

/* ================================================================
   V2 — 移动端响应式（< 768px）  解决移动端横向溢出 487px
   ================================================================ */
@media only screen and (max-width: 767.98px) {
  html, body {
    /* 只在 ui-v2 时生效，不影响其它页面（用下面的选择器包起来） */
  }

  /* 彻底禁止整页横向溢出（用父级选择器，用 body>.port-sgh-page.ui-v2 反推） */
  body:has(.port-sgh-page.ui-v2) { overflow-x: hidden !important; width: 100% !important; max-width: 100% !important; }

  .port-sgh-page.ui-v2 {
    width: 100% !important;
    max-width: none !important;
    padding: 16px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
    overflow-x: clip !important;
  }

  /* 链式重置：避免 zui .row 负 margin / 撑宽的 hero 栅格把卡片挤偏，造成左右留白不对称 */
  .port-sgh-page.ui-v2 .port-sgh-container.container,
  .port-sgh-page.ui-v2 .port-sgh-container > .row,
  .port-sgh-page.ui-v2 .port-sgh-top-row,
  .port-sgh-page.ui-v2 .port-sgh-hero-card,
  .port-sgh-page.ui-v2 .port-sgh-layout.g_detail_box,
  .port-sgh-page.ui-v2 .port-sgh-main,
  .port-sgh-page.ui-v2 .port-sgh-content {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-container > .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-hero-main,
  .port-sgh-page.ui-v2 .port-sgh-hero-main.port-sgh-hero-main--lcr {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-hero-side {
    grid-template-columns: 1fr !important;
    min-width: 0 !important;
    width: 100% !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-layout.g_detail_box {
    grid-template-columns: 1fr !important;
    grid-template-areas: "main" !important;
  }

  .port-sgh-page.ui-v2 > *,
  .port-sgh-page.ui-v2 main > * {
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  /* panel / card 移动端 16px 内边距 */
  .port-sgh-page.ui-v2 [class*="panel"],
  .port-sgh-page.ui-v2 [class*="card"] {
    padding: 16px !important;
    box-sizing: border-box !important;
  }

  /* Hero / 正文内容区：移动端单列堆叠 */
  .port-sgh-page.ui-v2 .port-sgh-hero-grid,
  .port-sgh-page.ui-v2 [class*="hero-grid"],
  .port-sgh-page.ui-v2 .port-sgh-content-grid {
    grid-template-columns: 1fr !important;
    display: grid !important;
    gap: 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  /* regionInfo.html 两列也是 1fr */
  .port-region-page.ui-v2 .port-region-hero-grid,
  .port-region-page.ui-v2 .port-region-content-grid {
    grid-template-columns: 1fr !important;
    display: grid !important;
    gap: 16px !important;
  }

  /* 侧边导航（左侧目录移动端隐藏节省空间 */
  .port-sgh-page.ui-v2 [class*="side-nav"],
  .port-sgh-page.ui-v2 [class*="port-sgh-nav-list"],
  .port-sgh-page.ui-v2 aside[aria-label="目录导航"],
  .port-sgh-page.ui-v2 .port-region-panel[aria-label="目录导航"] {
    display: none !important;
  }

  /* 移动端 H1 降到 28px / 1.25 */
  .port-sgh-page.ui-v2 .port-sgh-hero-title,
  .port-sgh-page.ui-v2 [class*="hero"] [class*="title"] {
    font-size: 28px !important;
    line-height: 1.25 !important;
  }
  .port-sgh-page.ui-v2 section > h2,
  .port-sgh-page.ui-v2 [class*="panel"] > [class*="head"] h2 {
    font-size: 20px !important;
    line-height: 1.3 !important;
  }

  /* ========================================================================
     Anchorages / Pilotage 说明胶囊（移动端修正版）
     - 标签 + pfirst 上下结构（用户要求：Contact: 蓝色独占一行，黑色正文下一行）
     - 外层 div.hd2/hd3 一个圆点 ::before；内层 span.hd2/hd3 是文字，禁止再生成 ::before（双圆点根因！）
     - 外层 div padding-left 预留圆点位置，标签和正文左边都对齐在同一条竖线
     ======================================================================== */
  .port-sgh-page.ui-v2 .setion_p_content .hd2,
  .port-sgh-page.ui-v2 .setion_p_content .hd3,
  .port-sgh-page.ui-v2 .setion_p_content .hd4,
  .port-region-page.ui-v2 .setion_p_content .hd2,
  .port-region-page.ui-v2 .setion_p_content .hd3,
  .port-region-page.ui-v2 .setion_p_content .hd4 {
    display: block !important;
    position: relative !important;
    padding: 10px 14px 10px calc(14px + 22px) !important; /* 左 padding 多 22px 给圆点 + 间距 */
    border-radius: 14px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    line-height: 1.55 !important;
    text-indent: 0 !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content .hd2 *,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 *,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 *,
  .port-region-page.ui-v2 .setion_p_content .hd2 *,
  .port-region-page.ui-v2 .setion_p_content .hd3 *,
  .port-region-page.ui-v2 .setion_p_content .hd4 * {
    text-indent: 0 !important;
  }
  /* ------------- 关键修复 1：内层标签元素禁止生成 ::before，解决双蓝色圆点！
     不管是 port-sgh-page 还是 port-region-page，不管是直接子还是后代嵌套 ------------- */
  .port-sgh-page.ui-v2 .setion_p_content .hd2 > .hd2::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 > .hd3::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 > .hd4::before,
  .port-sgh-page.ui-v2 .setion_p_content .h0text > .h0text::before,
  .port-sgh-page.ui-v2 .setion_p_content .title_act > .title_act::before,
  .port-region-page.ui-v2 .setion_p_content .hd2 > .hd2::before,
  .port-region-page.ui-v2 .setion_p_content .hd3 > .hd3::before,
  .port-region-page.ui-v2 .setion_p_content .hd4 > .hd4::before,
  .port-region-page.ui-v2 .setion_p_content .h0text > .h0text::before,
  .port-region-page.ui-v2 .setion_p_content .title_act > .title_act::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 .hd2::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 .hd3::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 .hd4::before,
  .port-sgh-page.ui-v2 .setion_p_content .h0text .h0text::before,
  .port-sgh-page.ui-v2 .setion_p_content .title_act .title_act::before,
  .port-region-page.ui-v2 .setion_p_content .hd2 .hd2::before,
  .port-region-page.ui-v2 .setion_p_content .hd3 .hd3::before,
  .port-region-page.ui-v2 .setion_p_content .hd4 .hd4::before,
  .port-region-page.ui-v2 .setion_p_content .h0text .h0text::before,
  .port-region-page.ui-v2 .setion_p_content .title_act .title_act::before {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
  }
  /* ::before 圆点绝对定位到左边 padding-left 区域里，只在外层容器生效一次（.port-region-page 也补上） */
  .port-sgh-page.ui-v2 .setion_p_content .hd2::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd3::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd4::before,
  .port-region-page.ui-v2 .setion_p_content .hd2::before,
  .port-region-page.ui-v2 .setion_p_content .hd3::before,
  .port-region-page.ui-v2 .setion_p_content .hd4::before {
    position: absolute !important;
    left: 14px !important;
    top: calc(10px + 0.78em) !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    float: none !important;
    display: inline-block !important;
  }
  /* h0text / title_act 外层容器圆点绝对定位（两张页面都补） */
  .port-sgh-page.ui-v2 .setion_p_content .h0text::before,
  .port-sgh-page.ui-v2 .setion_p_content .title_act::before,
  .port-region-page.ui-v2 .setion_p_content .h0text::before,
  .port-region-page.ui-v2 .setion_p_content .title_act::before {
    position: absolute !important;
    left: 14px !important;
    top: calc(12px + 0.78em) !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
    float: none !important;
    display: inline-block !important;
    white-space: nowrap !important;
  }
  /* ------------- 关键修复 2：内层标签（蓝色文字）强制 display:block 独占一行！
     暴力覆盖：无论 > 直接子 或 后代嵌套（boh_sea / actrcle / h0 内部），
     无论元素是 span / b / strong / label，只要携带 hd2/hd3/hd4 类，外层祖先也有同名类 => block 换行 ------------- */
  .port-sgh-page.ui-v2 .setion_p_content .hd2 span.hd2,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 span.hd3,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 span.hd4,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 b.hd2,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 b.hd3,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 b.hd4,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 strong.hd2,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 strong.hd3,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 strong.hd4,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 label.hd2,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 label.hd3,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 label.hd4,
  .port-sgh-page.ui-v2 .setion_p_content .boh_sea .hd2 span.hd2,
  .port-sgh-page.ui-v2 .setion_p_content .boh_sea .hd3 span.hd3,
  .port-sgh-page.ui-v2 .setion_p_content .boh_sea .hd4 span.hd4,
  .port-sgh-page.ui-v2 .setion_p_content .actrcle .hd2 span.hd2,
  .port-sgh-page.ui-v2 .setion_p_content .actrcle .hd3 span.hd3,
  .port-sgh-page.ui-v2 .setion_p_content .actrcle .hd4 span.hd4,
  .port-region-page.ui-v2 .setion_p_content .hd2 span.hd2,
  .port-region-page.ui-v2 .setion_p_content .hd3 span.hd3,
  .port-region-page.ui-v2 .setion_p_content .hd4 span.hd4,
  .port-region-page.ui-v2 .setion_p_content .hd2 b.hd2,
  .port-region-page.ui-v2 .setion_p_content .hd3 b.hd3,
  .port-region-page.ui-v2 .setion_p_content .hd4 b.hd4,
  .port-region-page.ui-v2 .setion_p_content .boh_sea .hd2 span.hd2,
  .port-region-page.ui-v2 .setion_p_content .boh_sea .hd3 span.hd3,
  .port-region-page.ui-v2 .setion_p_content .actrcle .hd2 span.hd2,
  .port-region-page.ui-v2 .setion_p_content .actrcle .hd3 span.hd3 {
    display: block !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 0 6px 0 !important;
    line-height: 1.5 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    font-weight: 600 !important;
  }
  /* 非 .hd2 类的子 span（如果有）正常 inline，正常文字流 */
  .port-sgh-page.ui-v2 .setion_p_content .hd2 > span:not(.hd2):not(.pfirst):not(.hd3):not(.hd4),
  .port-sgh-page.ui-v2 .setion_p_content .hd3 > span:not(.hd2):not(.pfirst):not(.hd3):not(.hd4),
  .port-sgh-page.ui-v2 .setion_p_content .hd4 > span:not(.hd2):not(.pfirst):not(.hd3):not(.hd4) {
    display: inline !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  /* ------------- 关键修复 3：pfirst 正文黑色 display:block 独占下一行，和标签左边对齐
     暴力覆盖：无论是 hd2 直接子、或后代嵌套结构里 ------------- */
  .port-sgh-page.ui-v2 .setion_p_content .hd2 span.pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 span.pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 span.pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .boh_sea .hd2 span.pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .boh_sea .hd3 span.pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .actrcle .hd2 span.pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .actrcle .hd3 span.pfirst,
  .port-region-page.ui-v2 .setion_p_content .hd2 span.pfirst,
  .port-region-page.ui-v2 .setion_p_content .hd3 span.pfirst,
  .port-region-page.ui-v2 .setion_p_content .hd4 span.pfirst,
  .port-region-page.ui-v2 .setion_p_content .boh_sea .hd2 span.pfirst,
  .port-region-page.ui-v2 .setion_p_content .boh_sea .hd3 span.pfirst,
  .port-region-page.ui-v2 .setion_p_content .actrcle .hd2 span.pfirst,
  .port-region-page.ui-v2 .setion_p_content .actrcle .hd3 span.pfirst {
    display: block !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 6px 0 0 0 !important;
    margin: 0 !important;
    border-left: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
    line-height: 1.65 !important;
    box-sizing: border-box !important;
    text-indent: 0 !important;
    padding-left: 0 !important;
  }

  /* ---- h0text / title_act 移动端同上（两张页面都补） ---- */
  .port-sgh-page.ui-v2 .setion_p_content .h0text,
  .port-sgh-page.ui-v2 .setion_p_content .title_act,
  .port-region-page.ui-v2 .setion_p_content .h0text,
  .port-region-page.ui-v2 .setion_p_content .title_act {
    display: block !important;
    position: relative !important;
    padding: 12px 14px 12px calc(14px + 22px) !important;
    border-radius: 16px !important;
    box-sizing: border-box !important;
    width: 100% !important;
    line-height: 1.55 !important;
    text-indent: 0 !important;
  }
  /* 内层 h0text/title_act 标签：block 换行（含 boh_sea/actrcle 嵌套） */
  .port-sgh-page.ui-v2 .setion_p_content .h0text span.h0text,
  .port-sgh-page.ui-v2 .setion_p_content .title_act span.title_act,
  .port-sgh-page.ui-v2 .setion_p_content .h0text b.h0text,
  .port-sgh-page.ui-v2 .setion_p_content .title_act b.title_act,
  .port-sgh-page.ui-v2 .setion_p_content .h0text strong.h0text,
  .port-sgh-page.ui-v2 .setion_p_content .title_act strong.title_act,
  .port-sgh-page.ui-v2 .setion_p_content .boh_sea .h0text span.h0text,
  .port-sgh-page.ui-v2 .setion_p_content .boh_sea .title_act span.title_act,
  .port-sgh-page.ui-v2 .setion_p_content .actrcle .h0text span.h0text,
  .port-sgh-page.ui-v2 .setion_p_content .actrcle .title_act span.title_act,
  .port-region-page.ui-v2 .setion_p_content .h0text span.h0text,
  .port-region-page.ui-v2 .setion_p_content .title_act span.title_act,
  .port-region-page.ui-v2 .setion_p_content .h0text b.h0text,
  .port-region-page.ui-v2 .setion_p_content .title_act b.title_act,
  .port-region-page.ui-v2 .setion_p_content .boh_sea .h0text span.h0text,
  .port-region-page.ui-v2 .setion_p_content .actrcle .h0text span.h0text {
    display: block !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 0 6px 0 !important;
    line-height: 1.5 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    font-weight: 600 !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content .h0text > span:not(.h0text):not(.pfirst):not(.title_act),
  .port-sgh-page.ui-v2 .setion_p_content .title_act > span:not(.h0text):not(.pfirst):not(.title_act),
  .port-region-page.ui-v2 .setion_p_content .h0text > span:not(.h0text):not(.pfirst):not(.title_act),
  .port-region-page.ui-v2 .setion_p_content .title_act > span:not(.h0text):not(.pfirst):not(.title_act) {
    display: inline !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  /* 内层 pfirst 换行（h0text/title_act 下的黑色正文） */
  .port-sgh-page.ui-v2 .setion_p_content .h0text span.pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .title_act span.pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .h0text .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .title_act .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .boh_sea .h0text span.pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .boh_sea .title_act span.pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .actrcle .h0text span.pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .actrcle .title_act span.pfirst,
  .port-region-page.ui-v2 .setion_p_content .h0text span.pfirst,
  .port-region-page.ui-v2 .setion_p_content .title_act span.pfirst,
  .port-region-page.ui-v2 .setion_p_content .h0text .pfirst,
  .port-region-page.ui-v2 .setion_p_content .title_act .pfirst,
  .port-region-page.ui-v2 .setion_p_content .boh_sea .h0text span.pfirst,
  .port-region-page.ui-v2 .setion_p_content .boh_sea .title_act span.pfirst,
  .port-region-page.ui-v2 .setion_p_content .actrcle .h0text span.pfirst,
  .port-region-page.ui-v2 .setion_p_content .actrcle .title_act span.pfirst {
    display: block !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 6px 0 0 0 !important;
    margin: 0 !important;
    border-left: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
    line-height: 1.65 !important;
    box-sizing: border-box !important;
    text-indent: 0 !important;
    padding-left: 0 !important;
  }

  /* pfirst 是 hd2/h0text/... 外部兄弟元素（独立 <p class=pfirst>）的情况：
     补同样的左缩进对齐竖线（.port-region-page 也补上） */
  .port-sgh-page.ui-v2 .setion_p_content .hd2 + .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 + .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 + .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .h0text + .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .title_act + .pfirst,
  .port-region-page.ui-v2 .setion_p_content .hd2 + .pfirst,
  .port-region-page.ui-v2 .setion_p_content .hd3 + .pfirst,
  .port-region-page.ui-v2 .setion_p_content .hd4 + .pfirst,
  .port-region-page.ui-v2 .setion_p_content .h0text + .pfirst,
  .port-region-page.ui-v2 .setion_p_content .title_act + .pfirst {
    padding-left: calc(14px + 22px) !important;
    margin-top: 0 !important;
    padding-top: 6px !important;
  }

  /* 地图 iframe 移动端保持 16:9 */
  .port-sgh-page.ui-v2 [class*="map-wrap"],
  .port-sgh-page.ui-v2 [class*="map-panel"] [class*="iframe-host"],
  .port-sgh-page.ui-v2 .port-region-map-iframe-host {
    width: 100% !important;
    aspect-ratio: 16 / 9;
    height: auto !important;
    box-sizing: border-box !important;
  }
  .port-sgh-page.ui-v2 iframe[title*="Port map"],
  .port-sgh-page.ui-v2 iframe.port-region-map-iframe {
    width: 100% !important;
    height: 100% !important;
    border: 0;
  }
}

/* ================================================================
   V2 — 地图区域 skeleton / error 状态（两张地图都适用）
   ================================================================ */
.port-sgh-page.ui-v2 .port-sgh-map-state {
  position: relative;
  overflow: hidden;
}

/* --- 加载中（skeleton）：浅灰渐变波浪动效 --- */
.port-sgh-page.ui-v2 .port-sgh-map-state .port-sgh-map-skeleton { display: none; }
.port-sgh-page.ui-v2 .port-sgh-map-state.is-loading .port-sgh-map-skeleton {
  display: flex !important;
  flex-direction: column;
  gap: 12px;
  justify-content: center;
  align-items: center;
  position: absolute;
  inset: 0;
  padding: 20px 24px;
  background: linear-gradient(135deg, #f4f7fb 0%, #eef3fa 100%);
  z-index: 2;
  animation: sgh-map-skel-bg 2.2s ease-in-out infinite;
}
@keyframes sgh-map-skel-bg {
  0%, 100% { background: linear-gradient(135deg, #f4f7fb 0%, #eef3fa 100%); }
  50%      { background: linear-gradient(135deg, #eef3fa 0%, #e6eef8 100%); }
}
.port-sgh-page.ui-v2 .port-sgh-map-state.is-loading .port-sgh-map-skel-bar {
  display: block;
  height: 10px;
  border-radius: 10px;
  background: linear-gradient(90deg, #dbe6f3 0%, #eef4fb 50%, #dbe6f3 100%);
  background-size: 200% 100%;
  animation: sgh-map-skel-shimmer 1.6s linear infinite;
}
.port-sgh-page.ui-v2 .port-sgh-map-state.is-loading .port-sgh-map-skel-bar.s1 { width: 76%; height: 14px; }
.port-sgh-page.ui-v2 .port-sgh-map-state.is-loading .port-sgh-map-skel-bar.s2 { width: 64%; }
.port-sgh-page.ui-v2 .port-sgh-map-state.is-loading .port-sgh-map-skel-bar.s3 { width: 48%; }
@keyframes sgh-map-skel-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
.port-sgh-page.ui-v2 .port-sgh-map-state.is-loading .port-sgh-map-skel-text {
  margin-top: 6px;
  color: #5f6b7a;
  font-size: 13px;
  letter-spacing: .3px;
}

/* --- 加载失败：浅灰错误提示 + 警告图标 --- */
.port-sgh-page.ui-v2 .port-sgh-map-state .port-sgh-map-error { display: none; }
.port-sgh-page.ui-v2 .port-sgh-map-state.is-error .port-sgh-map-error {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #fafafa 0%, #f1f3f6 100%);
  border: 1px dashed #cfd5de;
  z-index: 2;
  padding: 20px;
  text-align: center;
}
.port-sgh-page.ui-v2 .port-sgh-map-state.is-error .port-sgh-map-error-icon {
  width: 40px; height: 40px; line-height: 36px;
  border-radius: 50%;
  background: rgba(234, 67, 53, .08);
  color: #ea4335;
  font-size: 20px;
  text-align: center;
}
.port-sgh-page.ui-v2 .port-sgh-map-state.is-error .port-sgh-map-error-text {
  color: #5f6b7a;
  font-size: 13px;
  font-weight: 500;
}
.port-sgh-page.ui-v2 .port-sgh-map-state.is-ready .port-sgh-map-skeleton,
.port-sgh-page.ui-v2 .port-sgh-map-state.is-ready .port-sgh-map-error { display: none !important; }

/* ================================================================
   V2 — 表格专项整改（桌面 + 移动）
   ================================================================ */

/* 1. 表格外包滚动容器 .table-scroll（JS给每个table包） */
.port-sgh-page.ui-v2 .setion_p_content .table-scroll {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  margin: 14px 0 24px !important;
  border-radius: 14px;
  box-sizing: border-box;
  -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 24px), transparent);
  mask-image: linear-gradient(to right, #000 calc(100% - 24px), transparent);
}

/* 表格最小宽度 560-640：避免列挤压（Dry Dock） */
.port-sgh-page.ui-v2 .setion_p_content table.secondary,
.port-sgh-page.ui-v2 .setion_p_content table.kv-table,
.port-sgh-page.ui-v2 .setion_p_content .port-sgh-kv-table,
.port-sgh-page.ui-v2 .setion_p_content table[class*="dry"],
.port-sgh-page.ui-v2 .setion_p_content table.drydock {
  min-width: 620px;
  width: 100%;
  max-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

/* --- 2. 表头规范：#F1F6FD 背景 + #1A73E8 蓝字 + 下边框 D8E6F8 --- */
.port-sgh-page.ui-v2 .setion_p_content table.secondary thead th,
.port-sgh-page.ui-v2 .setion_p_content table.secondary th,
.port-sgh-page.ui-v2 .setion_p_content table.kv-table thead th,
.port-sgh-page.ui-v2 .setion_p_content .port-sgh-kv-table thead th,
.port-sgh-page.ui-v2 .setion_p_content table thead th,
.port-sgh-page.ui-v2 .setion_p_content table th,
.port-sgh-page.ui-v2 .setion_p_content table tr.header td,
.port-sgh-page.ui-v2 .setion_p_content table tr[class*="header"] td,
.port-sgh-page.ui-v2 .setion_p_content table tr:nth-child(1):first-child td[style*="font-weight:bold"],
.port-sgh-page.ui-v2 .setion_p_content table tr:nth-child(1):first-child td[style*="font-weight: bold"] {
  background: #f1f6fd !important;
  background-color: #f1f6fd !important;
  color: #1a73e8 !important;
  font-weight: 600 !important;
  border-bottom: 1px solid #d8e6f8 !important;
  border-top: 1px solid transparent !important;
  font-size: 12.5px;
  letter-spacing: .2px;
  vertical-align: middle !important;
}

/* 表头双行 → 单位用同一单元格里 <span class="unit">(m.)</span> 灰字展示 */
.port-sgh-page.ui-v2 .setion_p_content table th .unit,
.port-sgh-page.ui-v2 .setion_p_content table td .unit,
.port-sgh-page.ui-v2 .setion_p_content table th > span:last-child,
.port-sgh-page.ui-v2 .setion_p_content table th > small {
  color: #6b7280 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

/* --- 3. 统一 th/td padding：桌面 10-12 --- */
.port-sgh-page.ui-v2 .setion_p_content table th,
.port-sgh-page.ui-v2 .setion_p_content table td,
.port-sgh-page.ui-v2 .setion_p_content table.secondary thead th,
.port-sgh-page.ui-v2 .setion_p_content table.secondary tbody td {
  padding: 10px 12px !important;
  height: auto !important;
  min-height: 44px;
  box-sizing: border-box;
}

/* --- 4. 边框规范：外框 1px #E5EAF2，行分隔 #EEF2F6 --- */
.port-sgh-page.ui-v2 .setion_p_content table {
  border: 1px solid #e5eaf2 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  background: #fff !important;
}
.port-sgh-page.ui-v2 .setion_p_content table tbody tr td {
  border-bottom: 1px solid #eef2f6 !important;
  background: #fff !important;
  vertical-align: middle !important;
  color: #2b3644;
  font-size: 13px;
}
.port-sgh-page.ui-v2 .setion_p_content table tbody tr:nth-child(even) td,
.port-sgh-page.ui-v2 .setion_p_content table tbody tr.row-posn-1 td {
  background: #fafbfd !important;
  background-color: #fafbfd !important;
}
.port-sgh-page.ui-v2 .setion_p_content table tbody tr:hover td { background: #eef5ff !important; }
.port-sgh-page.ui-v2 .setion_p_content table tbody tr:last-child td { border-bottom: 0 !important; }

/* 列分隔线（密集表格列多的表格使用 #F0F3F7） */
.port-sgh-page.ui-v2 .setion_p_content table td:not(:last-child),
.port-sgh-page.ui-v2 .setion_p_content table th:not(:last-child) {
  border-right: 1px solid #f0f3f7;
}

/* --- 5. 空列隐藏：sgh-empty-col（JS 加） --- */
.port-sgh-page.ui-v2 .setion_p_content table th.sgh-empty-col,
.port-sgh-page.ui-v2 .setion_p_content table td.sgh-empty-col {
  display: none !important;
  width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* --- 6. 数字列：text-align:right + tabular-nums --- */
.port-sgh-page.ui-v2 .setion_p_content table td.is-number,
.port-sgh-page.ui-v2 .setion_p_content table th.is-number,
.port-sgh-page.ui-v2 .setion_p_content table td[data-type="number"],
.port-sgh-page.ui-v2 .setion_p_content table th[data-type="number"] {
  /* text-align: right !important; */
  font-variant-numeric: tabular-nums;
  -webkit-font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
  padding-right: 14px !important;
  white-space: nowrap;
}
.port-sgh-page.ui-v2 .setion_p_content table th:first-child,
.port-sgh-page.ui-v2 .setion_p_content table td:first-child {
  text-align: left !important;
  color: #1a73e8;
  font-weight: 500;
}

/* --- 7. Dry Dock 连续表格分组：标题/表格间距统一 24px --- */
.port-sgh-page.ui-v2 .setion_p_content h3 + table,
.port-sgh-page.ui-v2 .setion_p_content h4 + table,
.port-sgh-page.ui-v2 .setion_p_content .hd2 + table,
.port-sgh-page.ui-v2 .setion_p_content .hd3 + table,
.port-sgh-page.ui-v2 .setion_p_content .title_act + table { margin-top: 12px !important; }
.port-sgh-page.ui-v2 .setion_p_content table + .hd2,
.port-sgh-page.ui-v2 .setion_p_content table + .hd3,
.port-sgh-page.ui-v2 .setion_p_content table + h3,
.port-sgh-page.ui-v2 .setion_p_content table + h4 { margin-top: 28px !important; }
.port-sgh-page.ui-v2 .setion_p_content [class*="drydock-title"],
.port-sgh-page.ui-v2 .setion_p_content [class*="dry-dock-sub"],
.port-sgh-page.ui-v2 .setion_p_content [class*="drydock"] > [class*="head"] {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  border-radius: 10px;
  background: #eef5ff;
  color: #1a73e8;
  font-size: 12.5px;
  font-weight: 600;
  margin: 0 0 10px !important;
}

/* ========================================================================
   UI 评审 V2 落地补丁（P0 / P1 可移植到 detail.html + regionInfo.html）
   作用域：:is(.port-sgh-page, .port-region-page).ui-v2
   说明：两页 example 和动态详情页均只需在 body / main 根容器加 ui-v2 class 即可复用
   ======================================================================== */

/* ========================================================================
   P0-1 卡片装饰重构：去彩虹顶边 / 右上角渐变方块 → 标题左侧 3px 主色竖条
   ======================================================================== */
.port-sgh-page.ui-v2 .setion_p_content .actrcle::before,
.port-region-page.ui-v2 .setion_p_content .actrcle::before {
  /* 去彩虹顶边（actrcle::before 是之前的彩虹横条） */
  display: none !important;
  background: none !important;
  content: none !important;
}
.port-sgh-page.ui-v2 .setion_p_content .title_act::after,
.port-region-page.ui-v2 .setion_p_content .title_act::after {
  /* 去右上角渐变方块装饰 */
  display: none !important;
  background: none !important;
  content: none !important;
  opacity: 0 !important;
}
/* 标题卡片统一改为「左侧 3px 主色竖条 + 轻微蓝灰背景」，只在第 1 个 section 保留顶边锚点 */
.port-sgh-page.ui-v2 .setion_p_content .actrcle,
.port-region-page.ui-v2 .setion_p_content .actrcle {
  border-radius: 14px !important;
  box-shadow: 0 1px 2px rgba(60, 64, 67, .08), 0 2px 10px rgba(60, 64, 67, .06) !important;
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  padding: 20px 24px !important;
  margin: 28px 0 0 !important;
  overflow: visible !important;
}
/* 兼容 actrcle 包在 #overview_N 等包裹层内，避免首卡相对侧栏多出 28px 顶距 */
.port-sgh-page.ui-v2 .setion_p_content > .actrcle:first-child,
.port-region-page.ui-v2 .setion_p_content > .actrcle:first-child,
.port-sgh-page.ui-v2 .setion_p_content > *:first-child > .actrcle:first-child,
.port-region-page.ui-v2 .setion_p_content > *:first-child > .actrcle:first-child {
  margin-top: 0 !important;
  border-top: 2px solid #2563eb !important;
}
/* 标题文字左侧 3px 主色竖条 */
.port-sgh-page.ui-v2 .setion_p_content .title_act,
.port-region-page.ui-v2 .setion_p_content .title_act {
  position: relative !important;
  padding: 0 0 0 14px !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 0 12px !important;
  border-radius: 0 !important;
}
.port-sgh-page.ui-v2 .setion_p_content .title_act::before,
.port-region-page.ui-v2 .setion_p_content .title_act::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 4px !important;
  width: 3px !important;
  height: 22px !important;
  border-radius: 2px !important;
  background: linear-gradient(180deg, #2563eb 0%, #3b82f6 100%) !important;
  box-shadow: none !important;
  transform: none !important;
}
/* 标题字号与行高：只打在标题节点上，勿让 .h0 整块继承大字号/粗体（动态正文会炸版） */
.port-sgh-page.ui-v2 .setion_p_content .title_act,
.port-region-page.ui-v2 .setion_p_content .title_act,
.port-sgh-page.ui-v2 .setion_p_content .title_act > span,
.port-region-page.ui-v2 .setion_p_content .title_act > span,
.port-sgh-page.ui-v2 .setion_p_content .title_act > b,
.port-region-page.ui-v2 .setion_p_content .title_act > b {
  font-size: 22px !important;
  line-height: 1.35 !important;
  font-weight: 600 !important;
  letter-spacing: .1px !important;
  color: #0f172a !important;
}
.port-sgh-page.ui-v2 .setion_p_content .h0,
.port-region-page.ui-v2 .setion_p_content .h0 {
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
  color: #3c4043 !important;
}
.port-sgh-page.ui-v2 .setion_p_content .h0 > .h0text,
.port-region-page.ui-v2 .setion_p_content .h0 > .h0text,
.port-sgh-page.ui-v2 .setion_p_content span.h0text,
.port-region-page.ui-v2 .setion_p_content span.h0text {
  font-size: 15px !important;
  line-height: 1.4 !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  color: #0f172a !important;
}

/* ========================================================================
   P0-2 胶囊系统统一化（PC Grid 双列 + 移动端 block 换行 + 去双色拼接胶囊）
   ======================================================================== */
/* 1) 去胶囊内部的「| 竖线 + 双色拼接」内联样式：无论拼接多深，容器都是单色胶囊 */
.port-sgh-page.ui-v2 .setion_p_content .hd2,
.port-region-page.ui-v2 .setion_p_content .hd2,
.port-sgh-page.ui-v2 .setion_p_content .hd3,
.port-region-page.ui-v2 .setion_p_content .hd3,
.port-sgh-page.ui-v2 .setion_p_content .hd4,
.port-region-page.ui-v2 .setion_p_content .hd4 {
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: 20px 0 14px !important;
  padding: 10px 14px !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .1px !important;
}
/* 绿色语义胶囊：匹配 Geo-political / 环境类章节（通过祖先 class 或文本颜色匹配标记） */
.port-sgh-page.ui-v2 .setion_p_content [class*="geo"] .hd2,
.port-sgh-page.ui-v2 .setion_p_content [class*="politic"] .hd2,
.port-region-page.ui-v2 .setion_p_content [class*="geo"] .hd2,
.port-region-page.ui-v2 .setion_p_content [class*="politic"] .hd2,
.port-sgh-page.ui-v2 .setion_p_content [style*="background:#e8f5e9"] .hd2,
.port-sgh-page.ui-v2 .setion_p_content [style*="background: #e8f5e9"] .hd2 {
  background: #ecfdf5 !important;
  color: #047857 !important;
}
.port-sgh-page.ui-v2 .setion_p_content .hd2::before,
.port-region-page.ui-v2 .setion_p_content .hd2::before,
.port-sgh-page.ui-v2 .setion_p_content .hd3::before,
.port-region-page.ui-v2 .setion_p_content .hd3::before,
.port-sgh-page.ui-v2 .setion_p_content .hd4::before,
.port-region-page.ui-v2 .setion_p_content .hd4::before {
  /* 圆点颜色同步胶囊语义（蓝胶囊→蓝圆点 / 绿胶囊→绿圆点） */
  content: "" !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #2563eb !important;
  left: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}
/* 胶囊内部标签文字禁止再出圆点：PC + 移动端都统一（之前只有移动端规则，补 PC） */
.port-sgh-page.ui-v2 .setion_p_content .hd2 > .hd2::before,
.port-sgh-page.ui-v2 .setion_p_content .hd3 > .hd3::before,
.port-sgh-page.ui-v2 .setion_p_content .hd4 > .hd4::before,
.port-region-page.ui-v2 .setion_p_content .hd2 > .hd2::before,
.port-region-page.ui-v2 .setion_p_content .hd3 > .hd3::before,
.port-region-page.ui-v2 .setion_p_content .hd4 > .hd4::before { display: none !important; content: none !important; }

/* 正文为空（空 pfirst / is-empty-body）时不显示圆点，避免「孤点」悬在标签上方 */
.port-sgh-page.ui-v2 .setion_p_content .hd2:has(> .pfirst:empty)::before,
.port-sgh-page.ui-v2 .setion_p_content .hd3:has(> .pfirst:empty)::before,
.port-sgh-page.ui-v2 .setion_p_content .hd4:has(> .pfirst:empty)::before,
.port-region-page.ui-v2 .setion_p_content .hd2:has(> .pfirst:empty)::before,
.port-region-page.ui-v2 .setion_p_content .hd3:has(> .pfirst:empty)::before,
.port-region-page.ui-v2 .setion_p_content .hd4:has(> .pfirst:empty)::before,
.port-sgh-page.ui-v2 .setion_p_content .hd2.is-empty-body::before,
.port-sgh-page.ui-v2 .setion_p_content .hd3.is-empty-body::before,
.port-sgh-page.ui-v2 .setion_p_content .hd4.is-empty-body::before,
.port-region-page.ui-v2 .setion_p_content .hd2.is-empty-body::before,
.port-region-page.ui-v2 .setion_p_content .hd3.is-empty-body::before,
.port-region-page.ui-v2 .setion_p_content .hd4.is-empty-body::before {
  display: none !important;
  content: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
}
/* ui-v2 下取消旧两列 grid，避免 ::before 与标签被拆到不同格子 */
.port-sgh-page.ui-v2 .setion_p_content .port-sgh-section-body > .hd4,
.port-region-page.ui-v2 .setion_p_content .port-sgh-section-body > .hd4 {
  display: block !important;
  grid-template-columns: none !important;
}

/* 2) PC 端（≥ 992px）：hd2/hd3 整块浅底卡片（标题+正文），无左边框 */
@media only screen and (min-width: 992px) {
  .port-sgh-page.ui-v2 .setion_p_content .hd2,
  .port-region-page.ui-v2 .setion_p_content .hd2,
  .port-sgh-page.ui-v2 .setion_p_content .hd3,
  .port-region-page.ui-v2 .setion_p_content .hd3,
  .port-sgh-page.ui-v2 .setion_p_content .hd4,
  .port-region-page.ui-v2 .setion_p_content .hd4 {
    display: block !important;
    grid-template-columns: none !important;
    background: #f5f8fc !important;
    color: #1e3a8a !important;
    padding: 12px 16px !important;
    margin: 16px 0 12px !important;
    border-radius: 10px !important;
    border: 0 !important;
    border-left: 0 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
    position: relative !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content .hd2::before,
  .port-region-page.ui-v2 .setion_p_content .hd2::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd3::before,
  .port-region-page.ui-v2 .setion_p_content .hd3::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd4::before,
  .port-region-page.ui-v2 .setion_p_content .hd4::before {
    position: static !important;
    display: inline-block !important;
    margin: 0 8px 0 0 !important;
    transform: none !important;
    left: auto !important;
    top: auto !important;
    vertical-align: middle !important;
  }
  /* 胶囊标签文字元素：改为普通粗体文字，与圆点同行（含 hd4，如 Berths:） */
  .port-sgh-page.ui-v2 .setion_p_content .hd2 > span.hd2,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 > b.hd2,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 > label.hd2,
  .port-region-page.ui-v2 .setion_p_content .hd2 > span.hd2,
  .port-region-page.ui-v2 .setion_p_content .hd2 > b.hd2,
  .port-region-page.ui-v2 .setion_p_content .hd2 > label.hd2,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 > span.hd3,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 > b.hd3,
  .port-region-page.ui-v2 .setion_p_content .hd3 > span.hd3,
  .port-region-page.ui-v2 .setion_p_content .hd3 > b.hd3,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 > span.hd4,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 > b.hd4,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 > label.hd4,
  .port-region-page.ui-v2 .setion_p_content .hd4 > span.hd4,
  .port-region-page.ui-v2 .setion_p_content .hd4 > b.hd4,
  .port-region-page.ui-v2 .setion_p_content .hd4 > label.hd4 {
    grid-column: auto !important;
    grid-row: auto !important;
    align-self: center !important;
    display: inline !important;
    width: auto !important;
    max-width: none !important;
    align-items: center !important;
    padding: 0 !important;
    background: transparent !important;
    color: inherit !important;
    border-radius: 0 !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    word-break: normal !important;
    position: static !important;
    padding-left: 0 !important;
    min-height: auto !important;
    line-height: inherit !important;
    box-shadow: none !important;
    margin: 0 !important;
  }
  /* 去掉内层标签的圆点（外层保留），去掉竖条装饰 */
  .port-sgh-page.ui-v2 .setion_p_content .hd2 > span.hd2::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 > b.hd2::before,
  .port-region-page.ui-v2 .setion_p_content .hd2 > span.hd2::before,
  .port-region-page.ui-v2 .setion_p_content .hd2 > b.hd2::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 > span.hd3::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 > b.hd3::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 > span.hd4::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 > b.hd4::before,
  .port-region-page.ui-v2 .setion_p_content .hd4 > span.hd4::before,
  .port-region-page.ui-v2 .setion_p_content .hd4 > b.hd4::before {
    display: none !important;
    content: none !important;
  }
  /* 正文在标签下方；嵌套/兄弟 pfirst 均去掉左边框，只保留浅底由父级承载 */
  .port-sgh-page.ui-v2 .setion_p_content .hd2 + .pfirst,
  .port-region-page.ui-v2 .setion_p_content .hd2 + .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 + .pfirst,
  .port-region-page.ui-v2 .setion_p_content .hd3 + .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 + .p,
  .port-region-page.ui-v2 .setion_p_content .hd2 + .p,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 + p,
  .port-region-page.ui-v2 .setion_p_content .hd2 + p,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 .pfirst,
  .port-region-page.ui-v2 .setion_p_content .hd2 .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 .pfirst,
  .port-region-page.ui-v2 .setion_p_content .hd3 .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .hd4 .pfirst,
  .port-region-page.ui-v2 .setion_p_content .hd4 .pfirst {
    grid-column: auto !important;
    grid-row: auto !important;
    padding: 6px 0 0 !important;
    margin: 0 !important;
    text-indent: 0 !important;
    font-size: 14.5px !important;
    line-height: 1.68 !important;
    color: #374151 !important;
    border-left: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
    font-weight: 500 !important;
  }
}

/* ========================================================================
   P1-5 间距 Token 化（卡片外 32 / 内 20；标题下 12；段落后 12）
   ======================================================================== */
.port-sgh-page.ui-v2,
.port-region-page.ui-v2 {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
}
/* section 卡片纵向间距统一 28px（包含 ACE report / 下方 live modules） */
.port-sgh-page.ui-v2 .setion_p_content > .actrcle + .actrcle,
.port-region-page.ui-v2 .setion_p_content > .actrcle + .actrcle {
  margin-top: 28px !important;
}
.port-sgh-page.ui-v2 .port-sgh-live-modules,
.port-sgh-page.ui-v2 .port-sgh-live-modules.weather,
.port-sgh-page.ui-v2 .port-sgh-live-modules.fl-right.weather {
  margin-top: 28px !important;
  gap: 28px !important;
}
.port-sgh-page.ui-v2 .mao_a_detail .actrcle {
  margin-bottom: 0 !important;
}
/* section 内部 padding：PC 20-24，移动端 16（由先前 media query 覆盖为 16） */
.port-sgh-page.ui-v2 .setion_p_content .port-sgh-section-body,
.port-region-page.ui-v2 .setion_p_content .port-sgh-section-body {
  padding: 0 !important;
}
/* 段落：p / .pfirst 行高 1.65 + 段落后 12px；去掉左色条，改浅色卡片底 */
.port-sgh-page.ui-v2 .setion_p_content .p,
.port-region-page.ui-v2 .setion_p_content .p,
.port-sgh-page.ui-v2 .setion_p_content p,
.port-region-page.ui-v2 .setion_p_content p {
  font-size: 14.5px !important;
  line-height: 1.68 !important;
  margin: 0 0 12px !important;
  color: #1f2937 !important;
  max-width: none !important;
  text-align: justify !important;
  text-justify: inter-word !important;
}
/* section-body 直属段落与 .pfirst / .hd2 左右对齐（均为 16px） */
.port-sgh-page.ui-v2 .setion_p_content .port-sgh-section-body > .p,
.port-region-page.ui-v2 .setion_p_content .port-sgh-section-body > .p,
.port-sgh-page.ui-v2 .setion_p_content .port-sgh-section-body > div.p,
.port-region-page.ui-v2 .setion_p_content .port-sgh-section-body > div.p,
.port-sgh-page.ui-v2 .setion_p_content .port-sgh-section-body > p,
.port-region-page.ui-v2 .setion_p_content .port-sgh-section-body > p {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  box-sizing: border-box !important;
}
.port-sgh-page.ui-v2 .setion_p_content .pfirst,
.port-region-page.ui-v2 .setion_p_content .pfirst {
  font-size: 14.5px !important;
  line-height: 1.68 !important;
  margin: 0 0 12px !important;
  color: #1f2937 !important;
  max-width: none !important;
  text-align: justify !important;
  text-justify: inter-word !important;
  border-left: 0 !important;
  background: #f5f8fc !important;
  border-radius: 10px !important;
  padding: 12px 16px !important;
}
/* hd2/h0text 内部的 pfirst 由父级提供背景，自身透明 */
.port-sgh-page.ui-v2 .setion_p_content .hd2 .pfirst,
.port-region-page.ui-v2 .setion_p_content .hd2 .pfirst,
.port-sgh-page.ui-v2 .setion_p_content .hd3 .pfirst,
.port-region-page.ui-v2 .setion_p_content .hd3 .pfirst,
.port-sgh-page.ui-v2 .setion_p_content .hd4 .pfirst,
.port-region-page.ui-v2 .setion_p_content .hd4 .pfirst,
.port-sgh-page.ui-v2 .setion_p_content .h0text .pfirst,
.port-region-page.ui-v2 .setion_p_content .h0text .pfirst {
  background: transparent !important;
  border-radius: 0 !important;
  padding: 6px 0 0 !important;
  margin: 0 !important;
  border-left: 0 !important;
}
/* Overview 三列信息块：浅底无描边 */
.port-sgh-page.ui-v2 .setion_p_content .port-sgh-data-item,
.port-region-page.ui-v2 .setion_p_content .port-sgh-data-item {
  border: 0 !important;
  background: #f5f8fc !important;
  box-shadow: none !important;
  border-radius: 12px !important;
}
.port-sgh-page.ui-v2 .setion_p_content .port-sgh-data-item:hover,
.port-region-page.ui-v2 .setion_p_content .port-sgh-data-item:hover {
  transform: none !important;
  box-shadow: none !important;
  background: #eef4fb !important;
}
.port-sgh-page.ui-v2 .setion_p_content .p:empty,
.port-region-page.ui-v2 .setion_p_content .p:empty,
.port-sgh-page.ui-v2 .setion_p_content p:empty,
.port-region-page.ui-v2 .setion_p_content p:empty,
.port-sgh-page.ui-v2 .setion_p_content .pfirst:empty,
.port-region-page.ui-v2 .setion_p_content .pfirst:empty,
.port-sgh-page.ui-v2 .setion_p_content .hd2 > .pfirst:empty,
.port-sgh-page.ui-v2 .setion_p_content .hd3 > .pfirst:empty,
.port-sgh-page.ui-v2 .setion_p_content .hd4 > .pfirst:empty,
.port-region-page.ui-v2 .setion_p_content .hd2 > .pfirst:empty,
.port-region-page.ui-v2 .setion_p_content .hd3 > .pfirst:empty,
.port-region-page.ui-v2 .setion_p_content .hd4 > .pfirst:empty {
  display: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  height: 0 !important;
}
/* 标题下方 12px 间距（h0 / title_act 后） */
.port-sgh-page.ui-v2 .setion_p_content .h0 + *,
.port-region-page.ui-v2 .setion_p_content .h0 + *,
.port-sgh-page.ui-v2 .setion_p_content .title_act + *,
.port-region-page.ui-v2 .setion_p_content .title_act + * {
  margin-top: 12px !important;
}

/* ========================================================================
   P1-7 按钮体系三档 + 字体栈 + 行高统一
   ======================================================================== */
:is(.port-sgh-page.ui-v2, .port-region-page.ui-v2) body,
body:has(.port-sgh-page.ui-v2),
body:has(.port-region-page.ui-v2) {
  font-family: Arial, "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif !important;
}
:is(.port-sgh-page.ui-v2, .port-region-page.ui-v2) {
  font-family: Arial, "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif !important;
  letter-spacing: 0 !important;
}
/* 按钮三档 Token（btn-primary / secondary / ghost 三档，同时兼容现有命名 port-sgh-btn-primary / port-sgh-btn-outline） */
.port-sgh-page.ui-v2 .btn-primary,
.port-region-page.ui-v2 .btn-primary,
.port-sgh-page.ui-v2 .port-sgh-btn-primary,
.port-region-page.ui-v2 .port-sgh-btn-primary {
  background: linear-gradient(180deg, #2563eb 0%, #1d4ed8 100%) !important;
  border: 1px solid #1d4ed8 !important;
  color: #fff !important;
  box-shadow: 0 1px 2px rgba(37, 99, 235, .25), inset 0 1px 0 rgba(255,255,255,.18) !important;
  border-radius: 8px !important;
  height: 40px !important;
  padding: 0 18px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all .15s ease !important;
  text-decoration: none !important;
}
.port-sgh-page.ui-v2 .btn-primary:hover,
.port-region-page.ui-v2 .btn-primary:hover {
  background: linear-gradient(180deg, #1d4ed8 0%, #1e40af 100%) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(37, 99, 235, .3) !important;
}
.port-sgh-page.ui-v2 .btn-secondary,
.port-region-page.ui-v2 .btn-secondary,
.port-sgh-page.ui-v2 .port-sgh-btn-outline,
.port-region-page.ui-v2 .port-sgh-btn-outline {
  background: #fff !important;
  border: 1px solid #cbd5e1 !important;
  color: #1e40af !important;
  border-radius: 8px !important;
  height: 40px !important;
  padding: 0 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all .15s ease !important;
  text-decoration: none !important;
}
.port-sgh-page.ui-v2 .btn-secondary:hover,
.port-region-page.ui-v2 .btn-secondary:hover {
  border-color: #2563eb !important;
  color: #1d4ed8 !important;
  background: #eff6ff !important;
}
.port-sgh-page.ui-v2 .btn-ghost,
.port-region-page.ui-v2 .btn-ghost,
.port-sgh-page.ui-v2 .port-sgh-icon-btn,
.port-region-page.ui-v2 .port-sgh-icon-btn {
  background: transparent !important;
  border: 1px solid transparent !important;
  color: #334155 !important;
  border-radius: 8px !important;
  width: 40px !important;
  height: 40px !important;
  padding: 0 !important;
  font-size: 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all .15s ease !important;
}
.port-sgh-page.ui-v2 .btn-ghost:hover,
.port-region-page.ui-v2 .btn-ghost:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}
/* 搜索框 + 搜索按钮高度统一（兼容 region 页 Hero） */
/* 1) 搜索框容器：去除双层边框，统一高度 */
.port-sgh-page.ui-v2 .port-sgh-search-box.input_item_text_long,
.port-region-page.ui-v2 .port-region-search-box {
  width: 100% !important;
  height: 44px !important;
  display: flex !important;
  align-items: center !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  background: #fff !important;
  padding: 0 16px !important;
  position: relative !important;
  color: #374151 !important;
  box-shadow: none !important;
  outline: none !important;
}
.port-sgh-page.ui-v2 .port-sgh-search-box.input_item_text_long:focus-within,
.port-region-page.ui-v2 .port-region-search-box:focus-within {
  border-color: #2563eb !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12) !important;
}
/* 2) 搜索框内部 input：透明无边框 */
.port-sgh-page.ui-v2 .port-sgh-search-box input,
.port-region-page.ui-v2 .port-region-search-box input {
  width: 100% !important;
  height: auto !important;
  border: 0 !important;
  outline: 0 !important;
  color: #1f2937 !important;
  font-size: 14px !important;
  background: transparent !important;
  padding: 0 !important;
  line-height: 42px !important;
  box-shadow: none !important;
}
/* 3) 搜索按钮：确保与输入框等高 */
.port-sgh-page.ui-v2 .port-sgh-search-btn,
.port-region-page.ui-v2 .port-region-search-btn,
.port-sgh-page.ui-v2 .port-sgh-btn-primary,
.port-region-page.ui-v2 .port-region-btn-primary {
  height: 44px !important;
  padding: 0 20px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  border: 1px solid #2563eb !important;
  background: #2563eb !important;
  color: #fff !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  vertical-align: middle !important;
}
/* 4) 搜索框容器和按钮容器：确保垂直居中对齐；覆盖 [class*="panel"] 的 24px padding，与上方 summary 左右对齐 */
.port-sgh-page.ui-v2 .port-sgh-search-panel,
.port-region-page.ui-v2 .port-region-search-tool {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.port-sgh-page.ui-v2 .port-sgh-hero-summary {
  text-align: justify !important;
  text-justify: inter-word !important;
}
/* 5) completeShow 隐藏时移除边框 */
.port-sgh-page.ui-v2 .port-sgh-autocomplete,
.port-region-page.ui-v2 #completeShow {
  border: 0 !important;
  box-shadow: none !important;
}
.port-sgh-page.ui-v2 .port-sgh-autocomplete[style*="display:none"],
.port-region-page.ui-v2 #completeShow[style*="display:none"] {
  border: 0 !important;
  box-shadow: none !important;
  height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
}
/* 6) 全局 input[type="text"] 不影响搜索框内部 */
.port-sgh-page.ui-v2 input[type="text"]:not(.port-sgh-search-box input):not(.port-region-search-box input),
.port-region-page.ui-v2 input[type="text"]:not(.port-sgh-search-box input):not(.port-region-search-box input) {
  height: 40px !important;
  padding: 0 14px !important;
  border-radius: 8px !important;
  border: 1px solid #cbd5e1 !important;
  font-size: 14px !important;
  box-sizing: border-box !important;
  line-height: 38px !important;
  outline: none !important;
  box-shadow: none !important;
}
/* Hero 天气卡片：与右侧地图同高、同外框；勿当成「指标行」布局 */
.port-sgh-page.ui-v2 .port-sgh-hero-side {
  align-items: stretch !important;
}

.port-sgh-page.ui-v2 .port-sgh-hero-weather,
.port-sgh-page.ui-v2 .port-sgh-hero-side .port-sgh-hero-map-card {
  display: flex !important;
  flex-direction: column !important;
  align-self: stretch !important;
  height: 100% !important;
  min-height: 230px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.port-sgh-page.ui-v2 .port-sgh-hero-weather > #weather_top {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  justify-content: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 230px !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

.port-sgh-page.ui-v2 .port-sgh-hero-weather:has(.port-sgh-weather-empty) > #alarmData {
  display: none !important;
}

/* 有实时气象数据时再恢复内边距（空态除外） */
.port-sgh-page.ui-v2 .port-sgh-hero-weather > #weather_top:not(:has(.port-sgh-weather-empty)) {
  padding: 16px !important;
}

.port-sgh-page.ui-v2 .port-sgh-hero-weather .port-sgh-weather-empty {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 230px !important;
  padding: 20px !important;
  margin: 0 !important;
  text-align: center !important;
}

.port-sgh-page.ui-v2 .port-sgh-hero-weather .port-sgh-weather-empty > *:not(.port-sgh-weather-empty-icon) {
  display: block !important;
  flex: 0 0 auto !important;
  width: auto !important;
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  text-align: center !important;
}

.port-sgh-page.ui-v2 .port-sgh-hero-weather .port-sgh-weather-empty-icon,
.port-sgh-page .port-sgh-weather-empty-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 40px !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  max-width: 40px !important;
  max-height: 40px !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  line-height: 40px !important;
  font-size: 20px !important;
  overflow: hidden !important;
}

/* 指标行样式仅作用于真实行内容，避开 #weather_top / 空态 */
.port-sgh-page.ui-v2 .port-sgh-hero-weather .weather_detail [class*="row"],
.port-sgh-page.ui-v2 .port-sgh-hero-weather .weather_detail [class*="line"] {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  padding: 4px 0 !important;
}

/* Wind / Pressure / Humidity：label 左、value 右，覆盖上方误伤的 flex-start */
.port-sgh-page.ui-v2 .port-sgh-hero-weather .port-sgh-weather-now-meta > .port-sgh-weather-mini,
.port-sgh-page .port-sgh-hero-weather .port-sgh-weather-now-meta > .port-sgh-weather-mini {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 9px 12px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.port-sgh-page.ui-v2 .port-sgh-hero-weather .port-sgh-weather-temp-row {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
}

.port-sgh-page.ui-v2 .port-sgh-hero-weather .port-sgh-weather-chip {
  position: static !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
  display: none;
}
/* Hero 指标条（6 列）数值左对齐，恢复原有视觉 */
.port-sgh-page.ui-v2 [class*="hero-metric"] [class*="value"],
.port-region-page.ui-v2 [class*="hero-metric"] [class*="value"],
.port-sgh-page.ui-v2 [class*="stat"] [class*="value"],
.port-region-page.ui-v2 [class*="stat"] [class*="value"],
.port-sgh-page.ui-v2 .port-sgh-metric-value,
.port-region-page.ui-v2 .port-region-metric-value {
  text-align: left !important;
  font-variant-numeric: normal !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
}

/* ========================================================================
   P1-6 Contents 左侧目录重做：分组标题大写灰字 / 链接 hover 蓝底左边框 / sticky 顶部
   ======================================================================== */
/* 仅小屏/平板隐藏 region 侧栏，避免桌面端与 padding:!important 互相覆盖
   注意：不要用 .lable_show — 正文 .setion_p_content 也带这个 class */
@media only screen and (max-width: 991.98px) {
  .port-region-page.ui-v2 [class*="side-nav"],
  .port-region-page.ui-v2 [class*="port-sgh-nav-list"],
  .port-region-page.ui-v2 aside[aria-label="目录导航"],
  .port-region-page.ui-v2 aside #label_contents,
  .port-region-page.ui-v2 aside .lable_show,
  .port-region-page.ui-v2 .port-sgh-side-title,
  .port-region-page.ui-v2 .port-sgh-nav-contents,
  .port-region-page.ui-v2 .port-region-side-nav,
  .port-region-page.ui-v2 .port-region-nav,
  .port-region-page.ui-v2 aside #nav {
    display: none !important;
    visibility: hidden !important;
    position: static !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }
}

/* PC端 region 页面侧边导航：标题+国家分层，分组卡片增强层次 */
@media only screen and (min-width: 992px) {
  .port-region-page.ui-v2 .port-region-content-grid {
    grid-template-columns: 252px minmax(0, 1fr) !important;
    gap: 18px !important;
    margin-bottom: 18px !important;
  }
  .port-region-page.ui-v2 .port-region-hero-grid {
    gap: 18px !important;
    margin-bottom: 18px !important;
  }
  /* 外层白卡片：左右直接内边距，保证灰块与右边界一定有空隙 */
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] {
    display: flex !important;
    flex-direction: column !important;
    visibility: visible !important;
    position: sticky !important;
    top: 72px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    /* 覆盖全局 [class*="panel"] { padding: 24px !important } */
    padding: 0 14px 14px !important;
    margin: 0 !important;
    border-radius: 14px !important;
    background: #fff !important;
    border: 1px solid #e2e8f0 !important;
    max-height: none !important;
    overflow: hidden !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .05) !important;
    box-sizing: border-box !important;
  }
  /* 标题条拉满外框，不受左右 padding 影响 */
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] > .port-region-panel-head {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    flex: 0 0 auto !important;
    min-height: 0 !important;
    width: auto !important;
    margin: 0 -14px 0 !important;
    padding: 16px 16px 14px !important;
    border-bottom: 1px solid #eef2f7 !important;
    background: linear-gradient(180deg, #f8fafc 0%, #fff 100%) !important;
    box-sizing: border-box !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] > .port-region-side-nav {
    display: block !important;
    visibility: visible !important;
    position: static !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    /* 与港口索引等高后不再内部滚动，去掉垂直滚动条 */
    padding: 12px 0 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    box-sizing: border-box !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav,
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] #nav,
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] #label_contents,
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .lable_show,
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] #details_doc,
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .toc {
    display: block !important;
    visibility: visible !important;
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-panel-head h2 {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    writing-mode: horizontal-tb !important;
    letter-spacing: .02em !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-panel-sub {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #1d4ed8 !important;
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 4px 10px !important;
    border-radius: 999px !important;
    background: #eff6ff !important;
    border: 1px solid #dbeafe !important;
    white-space: nowrap !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean > li {
    margin: 0 !important;
    padding: 0 !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean > li.nav-group {
    background: #f8fafc !important;
    border: 1px solid #eef2f7 !important;
    border-radius: 10px !important;
    padding: 8px 6px 6px !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean .nav-group-title {
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    letter-spacing: .08em !important;
    padding: 2px 8px 6px !important;
    margin: 0 !important;
    display: block !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean .nav-group-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean .nav-group-list li {
    margin: 0 !important;
    padding: 0 !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean a {
    font-size: 13px !important;
    color: #334155 !important;
    text-decoration: none !important;
    padding: 7px 10px 7px 14px !important;
    margin: 1px 0 !important;
    border-radius: 8px !important;
    display: block !important;
    transition: background .15s ease, color .15s ease !important;
    border-left: 0 !important;
    line-height: 1.45 !important;
    position: relative !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean a::before {
    content: "" !important;
    position: absolute !important;
    left: 6px !important;
    top: 50% !important;
    width: 4px !important;
    height: 4px !important;
    margin-top: -2px !important;
    border-radius: 50% !important;
    background: #cbd5e1 !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean a:hover {
    background: #eff6ff !important;
    color: #1d4ed8 !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean a:hover::before {
    background: #3b82f6 !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean a:active,
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean a.active {
    background: #2563eb !important;
    color: #fff !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean a:active::before,
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean a.active::before {
    background: #fff !important;
  }
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .toc .cat,
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .toc .catstr,
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .toc .scentitem,
  .port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .toc_seperator {
    display: none !important;
  }
}

/* 移动端隐藏 region 页面侧边导航，使用浮动按钮代替
   不要选择全局 .lable_show，否则会误伤正文 .setion_p_content.lable_show */
@media only screen and (max-width: 767.98px) {
  .port-region-page.ui-v2 aside[aria-label="目录导航"],
  .port-region-page.ui-v2 .port-region-panel[aria-label="目录导航"],
  .port-region-page.ui-v2 .port-region-side-nav,
  .port-region-page.ui-v2 .port-region-nav,
  .port-region-page.ui-v2 aside #nav,
  .port-region-page.ui-v2 aside #label_contents,
  .port-region-page.ui-v2 aside .lable_show {
    display: none !important;
    visibility: hidden !important;
    position: static !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }
}
/* 导航容器内 ul / ol 无默认间距 */
.port-sgh-page.ui-v2 [class*="side-nav"] ul,
.port-region-page.ui-v2 [class*="side-nav"] ul,
.port-sgh-page.ui-v2 [class*="port-sgh-nav-list"] ul,
.port-region-page.ui-v2 [class*="port-sgh-nav-list"] ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* 分组标题：大写 + 灰字 + 8px 左缩进 */
.port-sgh-page.ui-v2 [class*="side-nav"] [class*="group-title"],
.port-region-page.ui-v2 [class*="side-nav"] [class*="group-title"],
.port-sgh-page.ui-v2 [class*="port-sgh-nav-list"] [class*="group"],
.port-region-page.ui-v2 [class*="port-sgh-nav-list"] [class*="group"],
.port-sgh-page.ui-v2 [class*="side-nav"] > ul > li > span:not(a),
.port-region-page.ui-v2 [class*="side-nav"] > ul > li > span:not(a) {
  display: block !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: #64748b !important;
  padding: 10px 10px 6px !important;
  margin: 4px 0 2px !important;
}
/* 链接项：14px 正常字，hover 浅蓝底 + 左边框 3px 主色 */
.port-sgh-page.ui-v2 [class*="side-nav"] a,
.port-region-page.ui-v2 [class*="side-nav"] a,
.port-sgh-page.ui-v2 [class*="port-sgh-nav-list"] a,
.port-region-page.ui-v2 [class*="port-sgh-nav-list"] a,
.port-sgh-page.ui-v2 aside[aria-label="目录导航"] a,
.port-region-page.ui-v2 aside[aria-label="目录导航"] a,
.port-sgh-page.ui-v2 .port-region-panel[aria-label="目录导航"] a,
.port-region-page.ui-v2 .port-region-panel[aria-label="目录导航"] a {
  display: block !important;
  font-size: 14px !important;
  color: #1e293b !important;
  text-decoration: none !important;
  padding: 8px 12px 8px 16px !important;
  margin: 2px 0 !important;
  border-radius: 6px !important;
  border-left: 3px solid transparent !important;
  font-weight: 400 !important;
  transition: all .12s ease !important;
  line-height: 1.5 !important;
  word-break: break-word !important;
}
.port-sgh-page.ui-v2 [class*="side-nav"] a:hover,
.port-region-page.ui-v2 [class*="side-nav"] a:hover,
.port-sgh-page.ui-v2 [class*="port-sgh-nav-list"] a:hover,
.port-region-page.ui-v2 [class*="port-sgh-nav-list"] a:hover {
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  border-left-color: #2563eb !important;
  font-weight: 500 !important;
}
.port-sgh-page.ui-v2 [class*="side-nav"] a.active,
.port-region-page.ui-v2 [class*="side-nav"] a.active,
.port-sgh-page.ui-v2 [class*="port-sgh-nav-list"] a.active,
.port-region-page.ui-v2 [class*="port-sgh-nav-list"] a.active,
.port-sgh-page.ui-v2 aside[aria-label="目录导航"] a[aria-current="true"],
.port-region-page.ui-v2 aside[aria-label="目录导航"] a[aria-current="true"] {
  background: #2563eb !important;
  color: #fff !important;
  border-left-color: #1e40af !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 3px rgba(37, 99, 235, .3) !important;
}

/* ========================================================================
   P0-3 移动端断点补全（≤768px）：Hero 天气+地图堆叠单列 + 表格首列 sticky
   （先前已有 hero-grid 单列，这里补充 .port-sgh-hero-side 的两列 → 单列）
   ======================================================================== */
@media only screen and (max-width: 767.98px) {
  /* 1) Hero 右侧：天气 + 地图从双列 → 上下堆叠 */
  .port-sgh-page.ui-v2 .port-sgh-hero-side,
  .port-region-page.ui-v2 .port-sgh-hero-side {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-hero-side .port-sgh-hero-weather,
  .port-sgh-page.ui-v2 .port-sgh-hero-side .port-sgh-hero-map-card,
  .port-region-page.ui-v2 .port-sgh-hero-side .port-sgh-hero-weather,
  .port-region-page.ui-v2 .port-sgh-hero-side .port-sgh-hero-map-card {
    min-height: 240px !important;
    height: 240px !important;
  }
  /* 2) 表格首列 sticky：横向滚动时保留字段上下文（Dry Dock / Bridge 等多列表） */
  .port-sgh-page.ui-v2 .setion_p_content table.secondary thead th:first-child,
  .port-region-page.ui-v2 .setion_p_content table.secondary thead th:first-child,
  .port-sgh-page.ui-v2 .setion_p_content table.kv-table thead th:first-child,
  .port-region-page.ui-v2 .setion_p_content table.kv-table thead th:first-child,
  .port-sgh-page.ui-v2 .setion_p_content .port-sgh-kv-table thead th:first-child,
  .port-region-page.ui-v2 .setion_p_content .port-sgh-kv-table thead th:first-child,
  .port-sgh-page.ui-v2 .setion_p_content table tbody td:first-child,
  .port-region-page.ui-v2 .setion_p_content table tbody td:first-child {
    position: sticky !important;
    left: 0 !important;
    z-index: 2 !important;
    background: inherit !important;
    box-shadow: 2px 0 4px rgba(15, 23, 42, .06) !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content .table-scroll,
  .port-region-page.ui-v2 .setion_p_content .table-scroll {
    padding: 0 2px !important;
    border-radius: 10px !important;
  }
  /* 3) 长段落行宽在移动端保证 14.5px / 行高 1.72 提高可读性 */
  .port-sgh-page.ui-v2 .setion_p_content p,
  .port-region-page.ui-v2 .setion_p_content p,
  .port-sgh-page.ui-v2 .setion_p_content .p,
  .port-region-page.ui-v2 .setion_p_content .p,
  .port-sgh-page.ui-v2 .setion_p_content .pfirst,
  .port-region-page.ui-v2 .setion_p_content .pfirst {
    font-size: 14px !important;
    line-height: 1.72 !important;
  }
  /* 4) 卡片 section 在移动端 16px 内距，overflow:hidden 防止内容超出 */
  .port-sgh-page.ui-v2 .setion_p_content .actrcle,
  .port-region-page.ui-v2 .setion_p_content .actrcle {
    padding: 16px !important;
    margin: 20px 0 0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    position: relative !important;
    box-sizing: border-box !important;
  }
  /* 移动端第一个卡片去除上边距，与导航对齐 */
  .port-sgh-page.ui-v2 .setion_p_content > .actrcle:first-child,
  .port-region-page.ui-v2 .setion_p_content > .actrcle:first-child,
  .port-sgh-page.ui-v2 .setion_p_content > *:first-child > .actrcle:first-child,
  .port-region-page.ui-v2 .setion_p_content > *:first-child > .actrcle:first-child {
    margin-top: 0 !important;
  }
  /* 卡片之间的间距：正文 / ACE 及下方模块统一 20px */
  .port-sgh-page.ui-v2 .setion_p_content .actrcle + .actrcle,
  .port-region-page.ui-v2 .setion_p_content .actrcle + .actrcle {
    margin-top: 20px !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-live-modules,
  .port-sgh-page.ui-v2 .port-sgh-live-modules.weather,
  .port-sgh-page.ui-v2 .port-sgh-live-modules.fl-right.weather {
    margin-top: 20px !important;
    gap: 20px !important;
  }
  /* 5) H1/H2 移动端阶梯：title_act 20px；h0 正文容器勿放大 */
  .port-sgh-page.ui-v2 .setion_p_content .h0,
  .port-region-page.ui-v2 .setion_p_content .h0 {
    font-size: 14px !important;
    line-height: 1.7 !important;
    font-weight: 400 !important;
    margin-bottom: 10px !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content .h0 > .h0text,
  .port-region-page.ui-v2 .setion_p_content .h0 > .h0text {
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content .title_act,
  .port-region-page.ui-v2 .setion_p_content .title_act {
    font-size: 20px !important;
    line-height: 1.3 !important;
    padding-left: 12px !important;
    margin-bottom: 10px !important;
  }
  /* 6) 移动端：hd2 浅底卡片（与 PC 一致），无左边框 */
  .port-sgh-page.ui-v2 .setion_p_content .hd2,
  .port-region-page.ui-v2 .setion_p_content .hd2,
  .port-sgh-page.ui-v2 .setion_p_content .hd3,
  .port-region-page.ui-v2 .setion_p_content .hd3,
  .port-sgh-page.ui-v2 .setion_p_content .hd4,
  .port-region-page.ui-v2 .setion_p_content .hd4 {
    display: block !important;
    grid-template-columns: none !important;
    background: #f5f8fc !important;
    border: 0 !important;
    border-left: 0 !important;
    padding: 12px 14px !important;
    border-radius: 10px !important;
    margin: 16px 0 10px !important;
    color: #1e3a8a !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
  }
  /* 7) Weather 模块：两个统计图改为上下排版，减少高度 */
  .port-sgh-page.ui-v2 .setion_p_content [class*="weather"],
  .port-region-page.ui-v2 .setion_p_content [class*="weather"],
  .port-sgh-page.ui-v2 .setion_p_content [class*="Weather"],
  .port-region-page.ui-v2 .setion_p_content [class*="Weather"] {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content [class*="weather"] > div,
  .port-region-page.ui-v2 .setion_p_content [class*="weather"] > div,
  .port-sgh-page.ui-v2 .setion_p_content [class*="Weather"] > div,
  .port-region-page.ui-v2 .setion_p_content [class*="Weather"] > div {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 140px !important;
    height: 140px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content [class*="weather"] canvas,
  .port-region-page.ui-v2 .setion_p_content [class*="weather"] canvas,
  .port-sgh-page.ui-v2 .setion_p_content [class*="Weather"] canvas,
  .port-region-page.ui-v2 .setion_p_content [class*="Weather"] canvas {
    max-height: 120px !important;
    height: 120px !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content .hd2 > span.hd2,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 > b.hd2,
  .port-region-page.ui-v2 .setion_p_content .hd2 > span.hd2,
  .port-region-page.ui-v2 .setion_p_content .hd2 > b.hd2,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 > span.hd3,
  .port-region-page.ui-v2 .setion_p_content .hd3 > span.hd3 {
    display: inline !important;
    grid-column: auto !important;
    grid-row: auto !important;
    background: transparent !important;
    color: inherit !important;
    padding: 0 !important;
    border-radius: 0 !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    margin-bottom: 0 !important;
    padding-left: 0 !important;
    line-height: inherit !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content .hd2 > span.hd2::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 > b.hd2::before,
  .port-region-page.ui-v2 .setion_p_content .hd2 > span.hd2::before,
  .port-region-page.ui-v2 .setion_p_content .hd2 > b.hd2::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 > span.hd3::before,
  .port-region-page.ui-v2 .setion_p_content .hd3 > span.hd3::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd2::before,
  .port-region-page.ui-v2 .setion_p_content .hd2::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd3::before,
  .port-region-page.ui-v2 .setion_p_content .hd3::before {
    display: none !important;
    content: none !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content .hd2 + .pfirst,
  .port-region-page.ui-v2 .setion_p_content .hd2 + .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .hd3 + .pfirst,
  .port-region-page.ui-v2 .setion_p_content .hd3 + .pfirst,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 + .p,
  .port-region-page.ui-v2 .setion_p_content .hd2 + .p,
  .port-sgh-page.ui-v2 .setion_p_content .hd2 + p,
  .port-region-page.ui-v2 .setion_p_content .hd2 + p {
    grid-column: auto !important;
    grid-row: auto !important;
    padding-left: 0 !important;
    margin: 0 !important;
    text-indent: 0 !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    color: #334155 !important;
  }
}

/* PC 默认隐藏移动端目录（避免页脚上方露出未样式化的清单） */
.port-sgh-mobile-nav-btn,
.port-sgh-mobile-nav-overlay,
.port-sgh-mobile-nav-panel {
  display: none !important;
}

/* ========================================================================
   手机端导航优化：隐藏侧边栏，改用浮动按钮 + 底部弹出目录面板
   ======================================================================== */
@media only screen and (max-width: 767.98px) {
  /* 1) 隐藏原有侧边导航及所有相关容器（勿用全局 .lable_show，正文也带该 class） */
  .port-region-page.ui-v2 [class*="side-nav"],
  .port-region-page.ui-v2 [class*="port-sgh-nav-list"],
  .port-region-page.ui-v2 aside[aria-label="目录导航"],
  .port-region-page.ui-v2 .port-region-panel[aria-label="目录导航"],
  .port-region-page.ui-v2 aside #label_contents,
  .port-region-page.ui-v2 aside .lable_show,
  .port-region-page.ui-v2 .port-sgh-side-title,
  .port-region-page.ui-v2 .port-sgh-nav-contents {
    display: none !important;
    visibility: hidden !important;
    position: static !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  /* 确保进港指南正文在手机端可见 */
  .port-region-page.ui-v2 .port-region-guide-body,
  .port-region-page.ui-v2 .port-region-guide-body .mao_a_detail,
  .port-region-page.ui-v2 .port-region-guide-body .setion_p_content,
  .port-region-page.ui-v2 .port-region-guide-body .lable_show {
    display: block !important;
    visibility: visible !important;
    position: static !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: revert !important;
    margin: revert !important;
  }
  /* 2) 浮动目录按钮：右下角固定定位 */
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-btn,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: fixed !important;
    bottom: 24px !important;
    right: 20px !important;
    width: 50px !important;
    height: 50px !important;
    border-radius: 50% !important;
    background: linear-gradient(180deg, #2563eb 0%, #1d4ed8 100%) !important;
    color: #fff !important;
    box-shadow: 0 4px 16px rgba(37, 99, 235, .4) !important;
    cursor: pointer !important;
    z-index: 9999 !important;
    font-size: 22px !important;
    border: 2px solid #fff !important;
    transition: all .2s ease !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-btn:hover,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-btn:hover {
    transform: translateY(-2px) scale(1.05) !important;
    box-shadow: 0 6px 20px rgba(37, 99, 235, .5) !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-btn:active,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-btn:active {
    transform: scale(0.95) !important;
  }
  /* 3) 底部弹出目录面板 */
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-panel,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-panel {
    display: none !important;
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: #fff !important;
    border-radius: 20px 20px 0 0 !important;
    box-shadow: 0 -4px 24px rgba(0, 0, 0, .1) !important;
    padding: 24px 20px 32px !important;
    max-height: 70vh !important;
    overflow-y: auto !important;
    z-index: 9998 !important;
    transform: translateY(100%) !important;
    transition: transform .3s ease !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-panel.active,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-panel.active {
    display: block !important;
    transform: translateY(0) !important;
  }
  /* 4) 目录面板标题 */
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-panel .nav-panel-title,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-panel .nav-panel-title {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    margin: 0 0 16px !important;
    padding-bottom: 12px !important;
    border-bottom: 1px solid #e2e8f0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }
  /* 5) 目录面板关闭按钮 */
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-panel .nav-panel-close,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-panel .nav-panel-close {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    background: #f1f5f9 !important;
    color: #64748b !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    font-size: 18px !important;
  }
  /* 6) 目录面板链接列表 */
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-panel ul,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-panel ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-panel li,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-panel li {
    margin: 4px 0 !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-panel a,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-panel a {
    display: block !important;
    padding: 10px 14px !important;
    color: #334155 !important;
    text-decoration: none !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    transition: all .15s ease !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-panel a:hover,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-panel a:hover {
    background: #eff6ff !important;
    color: #1d4ed8 !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-panel a.active,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-panel a.active {
    background: #2563eb !important;
    color: #fff !important;
  }
  /* 7) 目录面板分组标题 */
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-panel .nav-group-title,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-panel .nav-group-title {
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: #94a3b8 !important;
    padding: 12px 14px 6px !important;
    margin: 8px 0 4px !important;
  }
  /* 8) 遮罩层 */
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-overlay,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-overlay {
    display: none !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: rgba(0, 0, 0, .4) !important;
    z-index: 9997 !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-mobile-nav-overlay.active,
  .port-region-page.ui-v2 .port-sgh-mobile-nav-overlay.active {
    display: block !important;
  }
}

/* ========================================================================
   P0-3 + P1 PC 端 > 1440px 超宽屏行宽控制：正文 max-width 820 不拉长
   ======================================================================== */
@media only screen and (min-width: 1440px) {
  .port-sgh-page.ui-v2 {
    max-width: 1440px !important;
    padding: 32px 48px 80px !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-container > .row > [class*="col-md-9"],
  .port-region-page.ui-v2 .port-region-content-grid > [class*="main"] {
    max-width: 100% !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content,
  .port-region-page.ui-v2 .setion_p_content {
    max-width: 100% !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content .p,
  .port-region-page.ui-v2 .setion_p_content .p,
  .port-sgh-page.ui-v2 .setion_p_content p,
  .port-region-page.ui-v2 .setion_p_content p,
  .port-sgh-page.ui-v2 .setion_p_content .pfirst,
  .port-region-page.ui-v2 .setion_p_content .pfirst {
    max-width: none !important;
    text-align: justify !important;
    text-justify: inter-word !important;
  }
  /* 导航侧栏在超宽屏 300px 宽度 gutter 40px（仅 sgh 固定侧栏；region 列宽由 grid 约束，不可套用） */
  .port-sgh-page.ui-v2 [class*="side-nav"] {
    min-width: 290px !important;
    max-width: 300px !important;
  }
  .port-region-page.ui-v2 [class*="side-nav"],
  .port-region-page.ui-v2 .port-region-side-nav {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }
}

/* ========================================================================
   过渡微交互（低优先级，只在支持 hover 的设备生效）
   ======================================================================== */
@media (hover: hover) {
  .port-sgh-page.ui-v2 .actrcle,
  .port-region-page.ui-v2 .actrcle {
    transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease !important;
  }
  .port-sgh-page.ui-v2 .actrcle:hover,
  .port-region-page.ui-v2 .actrcle:hover {
    box-shadow: 0 4px 18px rgba(15, 23, 42, .08) !important;
    border-color: #dbeafe !important;
  }
}

/* ========================================================================
   表格边框增强：确保两页所有表格都有清晰边框
   ======================================================================== */
.port-sgh-page.ui-v2 .setion_p_content table,
.port-region-page.ui-v2 .setion_p_content table,
.port-sgh-page.ui-v2 .setion_p_content table.secondary,
.port-region-page.ui-v2 .setion_p_content table.secondary,
.port-sgh-page.ui-v2 .setion_p_content table.kv-table,
.port-region-page.ui-v2 .setion_p_content table.kv-table {
  border: 1px solid #d1d5db !important;
  border-collapse: collapse !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #fff !important;
  width: 100% !important;
  margin: 16px 0 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .04) !important;
}
.port-sgh-page.ui-v2 .setion_p_content table th,
.port-region-page.ui-v2 .setion_p_content table th,
.port-sgh-page.ui-v2 .setion_p_content table.secondary thead th,
.port-region-page.ui-v2 .setion_p_content table.secondary thead th {
  border-bottom: 2px solid #9ca3af !important;
  border-right: 1px solid #e5e7eb !important;
  background: #f9fafb !important;
  color: #374151 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  padding: 12px 14px !important;
  text-align: left !important;
  vertical-align: middle !important;
}
.port-sgh-page.ui-v2 .setion_p_content table th:last-child,
.port-region-page.ui-v2 .setion_p_content table th:last-child {
  border-right: 0 !important;
}
.port-sgh-page.ui-v2 .setion_p_content table td,
.port-region-page.ui-v2 .setion_p_content table td,
.port-sgh-page.ui-v2 .setion_p_content table.secondary tbody td,
.port-region-page.ui-v2 .setion_p_content table.secondary tbody td {
  border-bottom: 1px solid #e5e7eb !important;
  border-right: 1px solid #f3f4f6 !important;
  background: #fff !important;
  color: #1f2937 !important;
  font-size: 13.5px !important;
  padding: 10px 14px !important;
  vertical-align: middle !important;
}
.port-sgh-page.ui-v2 .setion_p_content table td:last-child,
.port-region-page.ui-v2 .setion_p_content table td:last-child {
  border-right: 0 !important;
}
.port-sgh-page.ui-v2 .setion_p_content table tbody tr:last-child td,
.port-region-page.ui-v2 .setion_p_content table tbody tr:last-child td {
  border-bottom: 0 !important;
}
.port-sgh-page.ui-v2 .setion_p_content table tbody tr:nth-child(even) td,
.port-region-page.ui-v2 .setion_p_content table tbody tr:nth-child(even) td {
  background: #fafafa !important;
}
.port-sgh-page.ui-v2 .setion_p_content table tbody tr:hover td,
.port-region-page.ui-v2 .setion_p_content table tbody tr:hover td {
  background: #f0f9ff !important;
}

/* ================================================================
   UI 评审整改 V2.1 —— 保守可移植优化（仅样式；动态页加 .ui-v2 即生效）
   原则：不改正文 HTML/文案；低风险；examples 与 detail/regionInfo 共用本文件
   ================================================================ */

/* 1) 导航分组标题对比度：#94a3b8 → #64748b（约 AA） */
.port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean .nav-group-title,
.port-sgh-page.ui-v2 .port-sgh-mobile-nav-panel .nav-group-title,
.port-region-page.ui-v2 .port-sgh-mobile-nav-panel .nav-group-title {
  color: #64748b !important;
}

/* 2) 侧栏链接小圆点稍淡，少抢正文 */
.port-region-page.ui-v2 aside.port-region-panel[aria-label="目录导航"] .port-region-nav-clean a::before {
  background: #94a3b8 !important;
}

/* 3) Hero metrics 降权：缩小数字与内边距，减弱与主标题竞争 */
.port-region-page.ui-v2 .port-region-mini-metrics {
  gap: 8px !important;
  margin-top: 16px !important;
}
.port-region-page.ui-v2 .port-region-metric {
  padding: 10px 12px !important;
  background: #f8fafc !important;
  border-color: #eef2f7 !important;
}
.port-region-page.ui-v2 .port-region-metric b {
  font-size: 17px !important;
  font-weight: 600 !important;
  color: #334155 !important;
}
.port-region-page.ui-v2 .port-region-metric span {
  font-size: 11px !important;
  color: #64748b !important;
}

/* 4) 面板副标降重：避免与 kicker「Guide to Port Entry」同权重复 */
.port-region-page.ui-v2 .port-region-panel-sub,
.port-sgh-page.ui-v2 .port-region-panel-sub {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #64748b !important;
}

/* 5) Region 正文：取消英文段落首行缩进（region.css 默认 2em，英文难读） */
.port-region-page.ui-v2 .port-region-guide-body .p,
.port-region-page.ui-v2 .port-region-guide-body p,
.port-region-page.ui-v2 .port-region-guide-body .pfirst,
.port-region-page.ui-v2 .port-region-guide-body .h0text,
.port-region-page.ui-v2 .port-region-guide-body .cidb-item {
  text-indent: 0 !important;
}

/* 6) Region CIDB：与 sgh 小节同调的冷静卡片（覆盖花哨渐变/装饰 i） */
.port-region-page.ui-v2 .port-region-guide-body .cidb-h1 {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  letter-spacing: -0.01em !important;
  padding: 0 0 12px !important;
  margin: 0 0 16px !important;
  border-bottom: 1px solid #eef2f7 !important;
}
.port-region-page.ui-v2 .port-region-guide-body .cidb-h1::before,
.port-region-page.ui-v2 .port-region-guide-body .cidb-h1::after,
.port-sgh-page.port-region-page.ui-v2 .setion_p_content .cidb-h1::before,
.port-sgh-page.port-region-page.ui-v2 .setion_p_content .cidb-h1::after {
  display: none !important;
  content: none !important;
}
.port-region-page.ui-v2 .port-region-guide-body .cidb-grp,
.port-sgh-page.port-region-page.ui-v2 .setion_p_content .cidb-grp {
  background: #f8fafc !important;
  border-radius: 12px !important;
  box-shadow: inset 0 0 0 1px #eef2f7 !important;
  padding: 14px 16px 8px !important;
  margin: 0 0 14px !important;
}
.port-region-page.ui-v2 .port-region-guide-body .cidb-grp::before,
.port-sgh-page.port-region-page.ui-v2 .setion_p_content .cidb-grp::before {
  display: none !important;
  content: none !important;
}
.port-region-page.ui-v2 .port-region-guide-body .cidb-h2,
.port-sgh-page.port-region-page.ui-v2 .setion_p_content .cidb-h2 {
  display: block !important;
  background: transparent !important;
  border-radius: 0 !important;
  padding: 8px !important;
  margin: 0 0 8px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #64748b !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}
.port-region-page.ui-v2 .port-region-guide-body .cidb-h2::before,
.port-sgh-page.port-region-page.ui-v2 .setion_p_content .cidb-h2::before {
  display: none !important;
  content: none !important;
}
.port-region-page.ui-v2 .port-region-guide-body .cidb-h3 {
  color: #334155 !important;
  font-weight: 600 !important;
}
.port-region-page.ui-v2 .port-region-guide-body .cidb-item {
  color: #3c4043 !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  margin: 0 0 10px !important;
}

/* 7) Region .h0（POLLUTION 等）：去掉彩虹顶条/脉冲红点，对齐冷静小节块 */
.port-region-page.ui-v2 .setion_p_content .h0,
.port-sgh-page.port-region-page.ui-v2 .setion_p_content .h0 {
  border: 1px solid #eef2f7 !important;
  background: #fff !important;
  box-shadow: none !important;
  border-radius: 12px !important;
  padding: 14px 16px 12px !important;
  margin: 0 0 14px !important;
}
.port-region-page.ui-v2 .setion_p_content .h0::before,
.port-sgh-page.port-region-page.ui-v2 .setion_p_content .h0::before {
  display: none !important;
  content: none !important;
}
.port-region-page.ui-v2 .setion_p_content .h0text,
.port-sgh-page.port-region-page.ui-v2 .setion_p_content .h0text {
  background: #f8fafc !important;
  color: #0f172a !important;
  box-shadow: inset 0 0 0 1px #eef2f7 !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .05em !important;
  padding: 8px 12px 8px 14px !important;
  margin: 0 0 10px !important;
}
.port-region-page.ui-v2 .setion_p_content .h0text::before,
.port-sgh-page.port-region-page.ui-v2 .setion_p_content .h0text::before {
  background: #3b82f6 !important;
  box-shadow: none !important;
  animation: none !important;
  width: 6px !important;
  height: 6px !important;
  flex: 0 0 6px !important;
}

/* 8) 手机端：回顶与目录浮钮错开（目录在右下，回顶抬高） */
@media only screen and (max-width: 767.98px) {
  .port-region-page.ui-v2 .port-region-float-top,
  .port-sgh-page.ui-v2 .port-sgh-float-top {
    right: 20px !important;
    bottom: 88px !important;
    width: 44px !important;
    height: 44px !important;
    z-index: 9998 !important;
  }
}

/* 9) 表格工具区空态文案对比略加强 */
.port-region-page.ui-v2 .port-region-table-empty,
.port-region-page.ui-v2 [class*="empty"] {
  color: #64748b !important;
}

/* ================================================================
   Bugfix：active 导航 / 动态大正文 / 手机圆点叠字 / 手机空 Contents
   ================================================================ */

/* 1) detail 目录 active：scrollFloor / 自研 spy 加在 li 或 a 上都能高亮 */
.port-sgh-page.ui-v2 .port-sgh-nav-list li.active > a,
.port-sgh-page.ui-v2 .port-sgh-nav-list a.active,
.port-sgh-page.ui-v2 .ul_li_pp_0 li.active > a,
.port-sgh-page.ui-v2 .ul_li_pp_0li.active > a,
.port-sgh-page.ui-v2 li.ul_li_pp_0li.active > a,
.port-sgh-page.ui-v2 .ul_li_pp_0li.active a,
.port-sgh-page.ui-v2 .port-sgh-nav-list a[aria-current="true"],
.port-sgh-page.ui-v2 #label_contents [data-sgh-module-nav] .setion_p.ppp.active,
.port-sgh-page.ui-v2 #label_contents [data-sgh-top-level].active {
  background: #2563eb !important;
  color: #fff !important;
  border-left-color: #1e40af !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 3px rgba(37, 99, 235, .28) !important;
}

/* 2) 动态正文：压制字号/粗体继承与 font/b/strong 脏标签 */
.port-sgh-page.ui-v2 .setion_p_content .h0 > *:not(.h0text),
.port-region-page.ui-v2 .setion_p_content .h0 > *:not(.h0text),
.port-sgh-page.ui-v2 .setion_p_content .h0 .p,
.port-region-page.ui-v2 .setion_p_content .h0 .p,
.port-sgh-page.ui-v2 .setion_p_content .h0 .pfirst,
.port-region-page.ui-v2 .setion_p_content .h0 .pfirst,
.port-sgh-page.ui-v2 .setion_p_content .h0 li,
.port-region-page.ui-v2 .setion_p_content .h0 li,
.port-sgh-page.ui-v2 .setion_p_content .h0 div,
.port-region-page.ui-v2 .setion_p_content .h0 div {
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
  color: #3c4043 !important;
}
.port-sgh-page.ui-v2 .setion_p_content font,
.port-region-page.ui-v2 .setion_p_content font {
  font-size: inherit !important;
  font-family: inherit !important;
  color: inherit !important;
}
.port-sgh-page.ui-v2 .setion_p_content b,
.port-sgh-page.ui-v2 .setion_p_content strong,
.port-region-page.ui-v2 .setion_p_content b,
.port-region-page.ui-v2 .setion_p_content strong {
  font-size: inherit !important;
  font-weight: 600 !important;
  line-height: inherit !important;
}
/* 列表项被包进 hd2/h0 时，避免整段变成「大标题」 */
.port-sgh-page.ui-v2 .setion_p_content .h0 ol,
.port-sgh-page.ui-v2 .setion_p_content .h0 ul,
.port-region-page.ui-v2 .setion_p_content .h0 ol,
.port-region-page.ui-v2 .setion_p_content .h0 ul {
  margin: 0 0 12px !important;
  padding-left: 1.25em !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}

@media only screen and (max-width: 767.98px) {
  /* 4) 手机端整块隐藏左侧 Contents（列表在 #label_contents，之前只藏了 list，留下空壳） */
  .port-sgh-page.ui-v2 .port-sgh-side,
  .port-sgh-page.ui-v2 aside.port-sgh-side,
  .port-sgh-page.ui-v2 .port-sgh-layout > .port-sgh-side {
    display: none !important;
  }

  /* 3) 手机端 hd 圆点改为与 PC 一致的行内点，杜绝绝对定位叠字 */
  .port-sgh-page.ui-v2 .setion_p_content .hd2,
  .port-region-page.ui-v2 .setion_p_content .hd2,
  .port-sgh-page.ui-v2 .setion_p_content .hd3,
  .port-region-page.ui-v2 .setion_p_content .hd3,
  .port-sgh-page.ui-v2 .setion_p_content .hd4,
  .port-region-page.ui-v2 .setion_p_content .hd4 {
    padding: 12px 14px !important;
    position: relative !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content .hd2::before,
  .port-region-page.ui-v2 .setion_p_content .hd2::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd3::before,
  .port-region-page.ui-v2 .setion_p_content .hd3::before,
  .port-sgh-page.ui-v2 .setion_p_content .hd4::before,
  .port-region-page.ui-v2 .setion_p_content .hd4::before {
    position: static !important;
    display: inline-block !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    margin: 0 8px 0 0 !important;
    width: 6px !important;
    height: 6px !important;
    vertical-align: middle !important;
    content: "" !important;
    background: #2563eb !important;
    border-radius: 50% !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content .h0,
  .port-region-page.ui-v2 .setion_p_content .h0 {
    font-size: 14px !important;
    font-weight: 400 !important;
  }
  .port-sgh-page.ui-v2 .setion_p_content .h0 > .h0text,
  .port-region-page.ui-v2 .setion_p_content .h0 > .h0text {
    font-size: 14px !important;
    font-weight: 700 !important;
  }

  /* Port Plans：地图勿撑破卡片右缘 */
  .port-sgh-page.ui-v2 .port-sgh-module-plans,
  .port-sgh-page.ui-v2 .port-sgh-module-plans .port-sgh-two-col,
  .port-sgh-page.ui-v2 .port-sgh-module-plans .port-sgh-plan-map-wrap,
  .port-sgh-page.ui-v2 .port-sgh-module-plans .port-sgh-plan-links {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-module-plans .port-sgh-two-col {
    grid-template-columns: 1fr !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-module-plans .port-sgh-plan-map-wrap {
    overflow: hidden !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-module-plans #port_plan_map,
  .port-sgh-page.ui-v2 .port-sgh-module-plans .port-sgh-plan-map,
  .port-sgh-page.ui-v2 .port-sgh-module-plans #port_plan_map .leaflet-container,
  .port-sgh-page.ui-v2 .port-sgh-module-plans #port_plan_map .leaflet-pane,
  .port-sgh-page.ui-v2 .port-sgh-module-plans #port_plan_map canvas {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* PSC：横向滚动 + 禁止按字母竖排撕碎单元格 */
  .port-sgh-page.ui-v2 .port-sgh-module-psc .port-sgh-psc-panel {
    overflow: hidden !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-module-psc .layui-tab-item {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }
  .port-sgh-page.ui-v2 .port-sgh-psc-table {
    table-layout: auto !important;
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-psc-table thead th,
  .port-sgh-page.ui-v2 .port-sgh-psc-table tbody td {
    word-break: normal !important;
    overflow-wrap: normal !important;
    white-space: nowrap !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-psc-table thead th:first-child,
  .port-sgh-page.ui-v2 .port-sgh-psc-table tbody td:first-child {
    min-width: 148px !important;
    max-width: none !important;
    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: break-word !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-psc-table tbody td:nth-child(2),
  .port-sgh-page.ui-v2 .port-sgh-psc-table tbody td:nth-child(3),
  .port-sgh-page.ui-v2 .port-sgh-psc-table thead th:nth-child(2),
  .port-sgh-page.ui-v2 .port-sgh-psc-table thead th:nth-child(3) {
    width: auto !important;
    min-width: 72px !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-psc-table .port-sgh-psc-action-col,
  .port-sgh-page.ui-v2 .port-sgh-psc-table .port-sgh-psc-action-cell {
    width: auto !important;
    min-width: 88px !important;
  }

  /* Weather：温度 / 湿度上下堆叠（覆盖更高优先级的双列 grid） */
  .port-sgh-page.ui-v2 .port-sgh-weather-forecast.port-sgh-chart-layout,
  .port-sgh-page.ui-v2 #weater_detail .port-sgh-weather-forecast,
  .port-sgh-page.ui-v2 #weater_detail .port-sgh-chart-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-weather-forecast .port-sgh-chart-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 220px !important;
    height: auto !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-weather-forecast .port-sgh-chart-note {
    max-width: 100% !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-humidity-bars {
    min-height: 160px !important;
  }
  .port-sgh-page.ui-v2 .port-sgh-humidity-bar {
    min-height: 140px !important;
  }
}

/* ============================================================================
   安全抛光轮（非破坏）：标签降噪 / 侧栏分区 / 指标呼吸 / 表字段列 / 字体微调
   detail + sghExamples + region 共享；不改 DOM、不清 !important 大盘
   ============================================================================ */

/* 1) h0text 大红脉冲胶囊 → 安静灰蓝标签（减少与 | OVERVIEW 标题抢戏） */
.port-sgh-page .setion_p_content .h0text,
.port-region-page .setion_p_content .h0text,
.port-sgh-page.ui-v2 .setion_p_content .h0text,
.port-region-page.ui-v2 .setion_p_content .h0text {
  background: #f4f6f9 !important;
  color: #5f6368 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 8px 14px !important;
  margin: 0 0 12px !important;
  border-radius: 10px !important;
  box-shadow: inset 0 0 0 1px rgba(60, 64, 67, 0.08) !important;
  gap: 8px !important;
}

.port-sgh-page .setion_p_content .h0text::before,
.port-region-page .setion_p_content .h0text::before,
.port-sgh-page.ui-v2 .setion_p_content .h0text::before,
.port-region-page.ui-v2 .setion_p_content .h0text::before {
  width: 6px !important;
  height: 6px !important;
  background: #94a3b8 !important;
  box-shadow: none !important;
  animation: none !important;
}

/* .h0 卡片顶条改柔和蓝，去掉红黄绿彩虹压场 */
.port-sgh-page .setion_p_content .h0::before,
.port-region-page .setion_p_content .h0::before {
  background: linear-gradient(90deg, #1a73e8 0%, #8ab4f8 100%) !important;
  opacity: 0.75 !important;
}

/* title_act 右侧装饰块略收敛 */
.port-sgh-page .setion_p_content .title_act::after,
.port-region-page .setion_p_content .title_act::after {
  opacity: 0.45 !important;
  width: 28px !important;
  height: 28px !important;
}

/* 2) 字体层次：标题微收紧字距，正文行高略松 */
.port-sgh-page .setion_p_content .title_act,
.port-region-page .setion_p_content .title_act {
  letter-spacing: -0.01em !important;
}

.port-sgh-page .setion_p_content .p,
.port-sgh-page .setion_p_content p,
.port-sgh-page .setion_p_content .pfirst,
.port-region-page .setion_p_content .p,
.port-region-page .setion_p_content p,
.port-region-page .setion_p_content .pfirst {
  line-height: 1.72 !important;
}

/* 临时隐藏 Public Message 模块（detail / sghExamples），恢复时删除本规则 */
.port-sgh-page .port-sgh-module-messages,
.port-sgh-page article#messages {
  display: none !important;
}

/* ACE Report 已并入 Contents（与 Port Plans 同级），隐藏底部独立侧栏卡片 */
.port-sgh-page .port-sgh-ace-nav-card,
.port-sgh-page #portSghAceNav {
  display: none !important;
}

/* 3) Contents / ACE 分区更清楚 */
.port-sgh-side {
  gap: 16px;
}

.port-sgh-page .port-sgh-side > .port-sgh-ace-nav-card,
.port-sgh-ace-nav-card {
  margin-top: 0;
  padding-top: 14px;
  border-top: 0;
}

.port-sgh-page .port-sgh-side > #nav.mao_a_nav {
  margin-bottom: 0;
}

.port-sgh-page .port-sgh-ace-nav-card .port-sgh-side-title {
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 10px;
}

.port-sgh-page .port-sgh-nav-contents.port-sgh-side-title {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #f1f3f4;
  color: #3c4043;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

/* Contents 分组标题统一 */
.port-sgh-page .setion_p.ppp {
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  margin: 0 0 6px;
  padding: 0 2px;
}

.port-sgh-page .setion_p.ppp::before {
  width: 6px;
  height: 6px;
  background: #94a3b8;
}

.port-sgh-page .ul_li_pp_0 li a,
.port-sgh-page .ul_li_pp_0li a {
  font-size: 13px !important;
  line-height: 1.4;
  padding: 6px 10px;
}

/* ACE 列表点略收，降低与目录主区抢色 */
.port-sgh-report-link:before {
  width: 6px;
  height: 6px;
  margin-top: 5px;
  background: #f9ab00;
  opacity: 0.85;
}

/* 4) Hero 指标条：防裁切 + 单元格呼吸 */
.port-sgh-hero-metrics {
  overflow: hidden;
}

.port-sgh-page .port-sgh-hero-metrics .box_op {
  width: 100%;
  min-width: 0;
}

.port-sgh-page .port-sgh-hero-metrics .t {
  min-width: 0;
  box-sizing: border-box;
  padding: 16px 14px;
}

.port-sgh-page .port-sgh-hero-metrics .port-sgh-metric-value,
.port-sgh-beta-body .port-sgh-page .port-sgh-hero-metrics .port-sgh-metric-value,
.port-sgh-beta-body .port-sgh-page .port-sgh-hero-metrics #portCode,
.port-sgh-beta-body .port-sgh-page .port-sgh-hero-metrics #portSghWeatherMetric,
.port-sgh-beta-body .port-sgh-page .port-sgh-hero-metrics #vip,
.port-sgh-beta-body .port-sgh-page .port-sgh-hero-metrics #eas {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 5) 表格首列字段呼吸 */
.port-sgh-page .mao_a_detail .actrcle table.secondary td:first-child,
.port-sgh-page .mao_a_detail .actrcle table.secondary th:first-child,
.port-sgh-page .setion_p_content table.secondary td:first-child,
.port-sgh-page .setion_p_content table.secondary th:first-child,
.port-region-page .setion_p_content table.secondary td:first-child,
.port-region-page .setion_p_content table.secondary th:first-child,
.port-sgh-page.ui-v2 .setion_p_content table.secondary td:first-child,
.port-sgh-page.ui-v2 .setion_p_content table.secondary th:first-child,
.port-region-page.ui-v2 .setion_p_content table.secondary td:first-child,
.port-region-page.ui-v2 .setion_p_content table.secondary th:first-child {
  padding-right: 18px !important;
  min-width: 7.5em;
}

/* 6) 门禁 / 空态垂直节奏 */
.port-sgh-guide-gate {
  margin: 0 0 18px;
}

.port-sgh-guide-gate .port-guide-noauth-panel,
.port-region-guide-gate .port-guide-noauth-panel {
  margin: 0;
}

.port-sgh-page .port-sgh-weather-empty,
.port-sgh-page.ui-v2 .port-sgh-hero-weather .port-sgh-weather-empty {
  gap: 10px !important;
}

/* hd2 与正文间距略收，减少标签堆叠空档 */
.port-sgh-page .setion_p_content .hd2,
.port-sgh-page .setion_p_content .hd3,
.port-sgh-page .setion_p_content .hd4,
.port-region-page .setion_p_content .hd2,
.port-region-page .setion_p_content .hd3,
.port-region-page .setion_p_content .hd4 {
  margin-top: 16px !important;
  margin-bottom: 6px !important;
  color: #334155 !important;
  font-weight: 600 !important;
}

/* ============================================================================
   打印专用（不影响屏幕样式）
   覆盖 detail / sghExamples；region 在 port-region.css 补充
   ============================================================================ */
@media print {
  @page {
    size: auto;
    margin: 12mm 14mm;
  }

  html,
  body,
  body.port-sgh-beta-body,
  body.port-region-beta-body {
    background: #fff !important;
    color: #111 !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  /* 站点壳 / 交互控件：打印时隐藏 */
  header,
  footer,
  .header,
  #header,
  .footer,
  #footer,
  .bx-header,
  .bx-footer,
  .port-sgh-top-row,
  .port-sgh-top-actions,
  .port-sgh-hero-quick-nav,
  .port-sgh-search-panel,
  .port-sgh-autocomplete,
  #completeShow,
  .port-sgh-side,
  aside.port-sgh-side,
  .port-sgh-ace-nav-card,
  .port-sgh-float-top,
  .port-sgh-mobile-nav-btn,
  .port-sgh-mobile-nav-overlay,
  .port-sgh-mobile-nav-panel,
  .port-sgh-drawer-backdrop,
  .port-sgh-report-drawer,
  .port-sgh-guide-gate,
  .port-guide-noauth,
  .modal,
  #myModal2,
  .dao_ld_,
  #Top,
  .btn_l_bx_top,
  .line_bottom_der,
  .port-sgh-hero-map-card,
  .map_img_003,
  #port_map,
  .port-sgh-map-skeleton,
  .port-sgh-map-error,
  .leaflet-control-container,
  .port-sgh-plan-map-wrap,
  #port_plan_map,
  .port-sgh-message-carousel-controls,
  .port-sgh-ace-carousel-controls,
  .port-sgh-carousel-btn,
  button.print,
  a.print,
  .port-sgh-btn,
  .port-sgh-icon-btn,
  .port-sgh-search-btn {
    display: none !important;
  }

  /* 页面容器拉满纸面 */
  .port-sgh-page,
  .port-print-root,
  .port-sgh-container,
  .port-sgh-container.container {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    background: #fff !important;
  }

  .port-sgh-container > .row {
    margin: 0 !important;
    display: block !important;
  }

  /* Hero：单列，去掉地图列后天气可保留或一起藏 */
  .port-sgh-hero-card {
    box-shadow: none !important;
    border: 1px solid #ddd !important;
    break-inside: avoid;
    page-break-inside: avoid;
    margin-bottom: 12px !important;
  }

  .port-sgh-hero-main,
  .port-sgh-hero-main.port-sgh-hero-main--lcr {
    display: block !important;
    grid-template-columns: none !important;
    padding: 12px 0 !important;
    gap: 0 !important;
  }

  .port-sgh-hero-side {
    display: none !important;
  }

  .port-sgh-hero-metrics {
    border-top: 1px solid #ddd !important;
    overflow: visible !important;
  }

  .port-sgh-page .port-sgh-hero-metrics .box_op {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
  }

  .port-sgh-page .port-sgh-hero-metrics .t {
    min-height: 0 !important;
    padding: 8px 10px !important;
    border-right: 1px solid #e5e7eb !important;
    background: #fff !important;
    box-shadow: none !important;
  }

  /* 主栏全宽，去掉侧栏后的双栏 */
  .port-sgh-layout,
  .port-sgh-layout.g_detail_box,
  .port-sgh-page .port-sgh-layout.g_detail_box {
    display: block !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
    gap: 0 !important;
  }

  .port-sgh-main,
  .port-sgh-page .port-sgh-layout > .port-sgh-main {
    width: 100% !important;
    max-width: none !important;
    float: none !important;
  }

  .port-sgh-content {
    display: block !important;
    min-height: 0 !important;
  }

  /* 正文卡片：去阴影、避免拦腰分页 */
  .port-sgh-page .mao_a_detail .actrcle,
  .port-sgh-page .setion_p_content .actrcle,
  .port-sgh-page .pre_arriavl,
  .port-sgh-live-modules .pre_arriavl,
  .port-sgh-page .port-sgh-module-ace,
  .port-sgh-page .port-sgh-module-psc,
  .port-sgh-page .port-sgh-module-weather,
  .port-sgh-page .port-sgh-module-plans {
    box-shadow: none !important;
    border: 1px solid #ddd !important;
    background: #fff !important;
    break-inside: avoid;
    page-break-inside: avoid;
    margin-bottom: 12px !important;
  }

  .port-sgh-page .setion_p_content .title_act {
    break-after: avoid;
    page-break-after: avoid;
    color: #111 !important;
    border-bottom-color: #ccc !important;
  }

  .port-sgh-page .setion_p_content .title_act::after {
    display: none !important;
  }

  .port-sgh-page .setion_p_content .h0text,
  .port-sgh-page.ui-v2 .setion_p_content .h0text {
    background: #f3f4f6 !important;
    color: #333 !important;
    box-shadow: none !important;
    animation: none !important;
  }

  .port-sgh-page .setion_p_content .h0text::before {
    animation: none !important;
    box-shadow: none !important;
  }

  .port-sgh-page .setion_p_content .pfirst {
    background: #f8fafc !important;
    border-left-color: #666 !important;
    box-shadow: none !important;
  }

  /* 表格可读 */
  .port-sgh-page .setion_p_content table,
  .port-sgh-page .setion_p_content table.secondary,
  .port-sgh-page .mao_a_detail table.secondary {
    width: 100% !important;
    max-width: 100% !important;
    box-shadow: none !important;
    border: 1px solid #ccc !important;
    break-inside: auto;
  }

  .port-sgh-page .setion_p_content table th,
  .port-sgh-page .setion_p_content table td,
  .port-sgh-page .setion_p_content table.secondary th,
  .port-sgh-page .setion_p_content table.secondary td {
    background: #fff !important;
    color: #111 !important;
    border-color: #ccc !important;
  }

  .port-sgh-page .setion_p_content table thead th,
  .port-sgh-page .setion_p_content table.secondary thead th {
    background: #f3f4f6 !important;
  }

  tr {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* 动态模块：图表/交互控件不适合纸面；轮播改为纵向可读列表（对齐 detail 观感） */
  .port-sgh-live-modules .e_chart,
  .port-sgh-traffic-source,
  #arrivalShipInfo,
  #shipInportInfo,
  .port-sgh-weather-forecast .port-sgh-chart-card canvas,
  canvas,
  .port-sgh-scroll-button,
  .port-sgh-message-head-actions,
  .port-sgh-plan-action,
  .port-sgh-report-more,
  .port-sgh-plan-map-wrap,
  .port-sgh-map-skeleton,
  .port-sgh-map-error,
  .van-button,
  .van-pagination,
  #page,
  #btnAddMessage,
  .addMessageTop,
  #addMessageTop {
    display: none !important;
  }

  .port-sgh-ace-carousel,
  .port-sgh-message-carousel {
    display: block !important;
    grid-auto-flow: unset !important;
    grid-auto-columns: unset !important;
    overflow: visible !important;
    white-space: normal !important;
  }

  .port-sgh-ace-carousel .port-sgh-ace-card,
  .port-sgh-message-carousel .port-sgh-message-card,
  .port-sgh-ace-card,
  .port-sgh-message-card {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 10px !important;
    box-shadow: none !important;
    border: 1px solid #ddd !important;
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .port-sgh-two-col {
    display: block !important;
    grid-template-columns: none !important;
  }

  .port-sgh-plan-links,
  .port-sgh-plan-list {
    width: 100% !important;
  }

  .port-sgh-plan-item {
    box-shadow: none !important;
    border: 1px solid #e5e7eb !important;
    break-inside: avoid;
  }

  .port-sgh-page .port-sgh-data-grid {
    display: block !important;
    grid-template-columns: none !important;
  }

  .port-sgh-page .port-sgh-data-item {
    display: flex !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding: 6px 0 !important;
    border-bottom: 1px solid #eee !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  .port-sgh-traffic-overview {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }

  .port-sgh-ring-card,
  .port-sgh-chart-card {
    box-shadow: none !important;
    border: 1px solid #ddd !important;
  }

  .port-sgh-chart-layout,
  .port-sgh-chart-layout--traffic {
    display: none !important;
  }

  .port-sgh-page .ul_li_pp_0.hide {
    display: block !important;
  }

  a,
  a:link,
  a:visited {
    color: #111 !important;
    text-decoration: none !important;
    border-bottom: 0 !important;
  }

  /* 链接 URL 不额外展开，避免正文被刷花 */
  a[href]::after {
    content: none !important;
  }
}

