/* =========================================================
   《翠屏新闻》稿分公示表 — 正式 CSS 等价重构版
   重构日期：2026-07-30

   维护原则：
   1. 本文件保持现有 HTML、JavaScript 类名和状态契约不变。
   2. .hidden、body.modal-open、viewer-mode、admin-mode 等为功能接口。
   3. 统计中心四页共享基础规则，后续调整应修改对应现有章节，
      不应再次在文件末尾追加同选择器补丁。
   4. 固定桌面宽度、矮屏断点、打印及减少动画规则均为产品现状。
   5. 重构仅清除不可达规则与被同选择器后续声明完全覆盖的属性。
   ========================================================= */
/* =========================================================
   《翠屏新闻》稿分公示表
   优化整理版样式
   版本：20260771
   ========================================================= */


/* =========================================================
   一、页面基础
   ========================================================= */

html {
  min-width: 1470px;
  overflow-x: auto;
  overflow-y: scroll;
  background: #f4f7fb;
}

body {
  min-width: 1470px;
  margin: 0;
  overflow-x: visible;
  overflow-y: visible;
  background: #f4f7fb;
  color: #1f2933;
  font-family:
    "Microsoft YaHei",
    "PingFang SC",
    Arial,
    sans-serif;
}

body.modal-open,
body.reporter-modal-open,
body.gate-locked {
  overflow: hidden;
}

.hidden {
  display: none !important;
}

.small {
  color: #5f6f7f;
  font-size: 13px;
}

.danger-text {
  color: #c0392b;
  font-weight: 700;
}

.file-input {
  display: none;
}

.loading-cell {
  padding: 28px !important;
  color: #667586;
  text-align: center;
}


/* =========================================================
   二、顶部标题区域
   ========================================================= */

header {
  min-width: 1470px;
  height: 92px;
  padding: 0 24px;
  box-sizing: border-box;
  background:
    radial-gradient(
      circle at 48% -70%,
      rgba(111, 188, 239, 0.25),
      transparent 54%
    ),
    linear-gradient(
      135deg,
      #235b8c 0%,
      #1f4e79 48%,
      #163f66 100%
    );
  color: #fff;
  box-shadow:
    0 4px 16px rgba(18, 52, 82, 0.20),
    inset 0 -1px 0 rgba(255, 255, 255, 0.08);
}

.header-inner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 16px;
  width: 100%;
  max-width: 1470px;
  height: 92px;
  margin: 0 auto;
}

header h1 {
  position: relative;
  left: 35px;
  margin: 0;
  color: #fff;
  font-size: 25px;
  line-height: 1.25;
  font-weight: 800;
  letter-spacing: 0.5px;
  text-shadow: 0 1px 2px rgba(5, 26, 44, 0.22);
  white-space: nowrap;
}


/* =========================================================
   三、顶部快捷功能卡片
   ========================================================= */

.header-quick-actions {
  display: grid;
  grid-template-columns: repeat(3, 166px);
  justify-content: center;
  gap: 10px;
  width: 518px;
  min-width: 518px;
  margin: 0 auto;
}

.header-feature-btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 11px;
  width: 166px;
  height: 62px;
  min-height: 62px;
  padding: 8px 12px;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 12px;
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.22),
      rgba(255, 255, 255, 0.10)
    );
  color: #fff;
  box-shadow:
    0 6px 18px rgba(4, 30, 52, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.26);
  text-align: left;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  transition:
    border-color 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.header-feature-btn::before {
  position: absolute;
  top: 0;
  right: 15px;
  left: 15px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(180, 226, 255, 0.90),
      transparent
    );
  content: "";
}

.header-feature-btn:hover {
  border-color: rgba(255, 255, 255, 0.70);
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.30),
      rgba(255, 255, 255, 0.15)
    );
  color: #fff;
  box-shadow:
    0 9px 22px rgba(4, 30, 52, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.36);
  transform: translateY(-2px);
}

.header-feature-btn:active {
  box-shadow:
    0 4px 12px rgba(4, 30, 52, 0.20),
    inset 0 1px 0 rgba(255, 255, 255, 0.28);
  transform: translateY(0);
}

.header-feature-btn:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

.header-feature-btn-icon {
  display: flex;
  flex: 0 0 34px;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.14);
  color: #dff3ff;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.header-feature-btn-icon svg {
  width: 21px;
  height: 21px;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.header-feature-btn:first-child
.header-feature-btn-icon svg {
  fill: currentColor;
  stroke: none;
}

.header-feature-btn-inner {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 3px;
}

.header-feature-btn-title {
  color: #fff;
  font-size: 15px;
  line-height: 1.25;
  font-weight: 800;
  letter-spacing: 0.2px;
  white-space: nowrap;
}

.header-feature-btn-sub {
  display: block;
  max-width: 96px;
  overflow: hidden;
  color: rgba(231, 245, 255, 0.82);
  font-size: 11px;
  line-height: 1.3;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.header-feature-btn.score-stats-open-btn {
  border-color: rgba(170, 221, 255, 0.58);
  background:
    linear-gradient(
      145deg,
      rgba(80, 167, 225, 0.32),
      rgba(255, 255, 255, 0.12)
    );
}

.header-feature-btn.score-stats-open-btn:hover {
  border-color: rgba(202, 237, 255, 0.90);
  background:
    linear-gradient(
      145deg,
      rgba(94, 183, 241, 0.42),
      rgba(255, 255, 255, 0.18)
    );
}

.header-feature-btn.is-active-filter {
  border-color: rgba(141, 221, 255, 0.90);
  background:
    linear-gradient(
      145deg,
      rgba(38, 148, 207, 0.48),
      rgba(255, 255, 255, 0.15)
    );
}

.header-feature-btn.is-active-filter
.header-feature-btn-sub {
  color: #e2f8ff;
}

.header-feature-btn.is-empty-filter {
  border-color: rgba(255, 188, 178, 0.92);
  background:
    linear-gradient(
      145deg,
      rgba(181, 67, 52, 0.56),
      rgba(255, 255, 255, 0.13)
    );
}

.header-feature-btn.is-empty-filter
.header-feature-btn-sub {
  color: #ffe3df;
}


/* =========================================================
   四、顶部管理员登录区域
   ========================================================= */

.header-auth-panel {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: flex-end;
  justify-self: end;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.header-auth-toggle,
.header-auth-collapse,
.header-auth-logout {
  height: 32px;
  padding: 5px 12px;
  border: 1px solid rgba(255, 255, 255, 0.55);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  box-shadow: none;
}

.header-auth-toggle:hover,
.header-auth-collapse:hover,
.header-auth-logout:hover {
  border-color: rgba(255, 255, 255, 0.9);
  background: rgba(255, 255, 255, 0.22);
  color: #fff;
  box-shadow: none;
}

.header-login-box,
.header-user-box {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.header-login-box.hidden,
.header-user-box.hidden {
  display: none !important;
}

.header-auth-label {
  color: rgba(255, 255, 255, 0.92);
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}

.header-login-box input {
  height: 32px;
  padding: 5px 9px;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.48);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.97);
  color: #1f2933;
  font-family: inherit;
  font-size: 13px;
}

.header-login-box input:focus {
  outline: none;
  border-color: #9dc9ef;
  box-shadow: 0 0 0 2px rgba(157, 201, 239, 0.26);
}

#emailInput {
  width: 205px;
}

#passwordInput {
  width: 145px;
}

#loginBtn {
  height: 32px;
  padding: 5px 14px;
  border-color: #fff;
  background: #fff;
  color: #1f4e79;
  font-weight: 800;
  box-shadow: none;
}

#loginBtn:hover {
  border-color: #d8eaff;
  background: #eaf4ff;
  color: #17456f;
  box-shadow: none;
}

.header-user-box strong {
  display: block;
  max-width: 270px;
  overflow: hidden;
  color: #fff;
  font-size: 13px;
  line-height: 32px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.viewer-mode
.header-auth-panel:not(.auth-open)
.header-login-box {
  display: none;
}

body.viewer-mode
.header-auth-panel.auth-open
.header-auth-toggle {
  display: none;
}

body.viewer-mode
.header-auth-panel.auth-open
.header-login-box {
  display: flex;
}

body.admin-mode .header-auth-toggle,
body.admin-mode .header-login-box {
  display: none;
}

body.admin-mode .header-user-box {
  display: flex;
}


/* =========================================================
   五、页面主体与通用面板
   ========================================================= */

main {
  max-width: 1470px;
  margin: 0 auto;
  padding: 14px 20px 28px;
  box-sizing: border-box;
}

.panel {
  margin-bottom: 10px;
  padding: 11px 14px;
  border: 1px solid rgba(217, 229, 242, 0.75);
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(31, 78, 121, 0.08);
}


/* =========================================================
   六、通用按钮、输入框与选择框
   ========================================================= */

button {
  padding: 6px 11px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: #1f78c1;
  color: #fff;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.2;
  cursor: pointer;
  flex: 0 0 auto;
  white-space: nowrap;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.15s ease;
}

button:hover {
  background: #17619c;
  box-shadow: 0 1px 4px rgba(31, 120, 193, 0.22);
}

button:active {
  transform: translateY(1px);
}

button.gray {
  border-color: #cfd9e5;
  background: #f3f6fa;
  color: #3b4a5a;
}

button.gray:hover {
  border-color: #b9c8d8;
  background: #e8eef5;
  color: #203040;
  box-shadow: none;
}

button.green {
  border-color: #2e8b57;
  background: #2e8b57;
  color: #fff;
}

button.green:hover {
  background: #257246;
}

button.red {
  border-color: #c0392b;
  background: #c0392b;
  color: #fff;
}

button.red:hover {
  background: #9f2f24;
}

button:disabled {
  border-color: #a8adb3 !important;
  background: #a8adb3 !important;
  color: #fff !important;
  cursor: not-allowed;
  box-shadow: none !important;
  transform: none !important;
}

input,
select {
  box-sizing: border-box;
  font-family: inherit;
  font-size: 13px;
}

.login-box input,
.modal-control input,
.modal-control select,
.month-query-controls input,
.month-query-controls select,
.filter-form input,
.filter-form select {
  height: 34px;
  padding: 6px 9px;
  border: 1px solid #cfd9e5;
  border-radius: 6px;
  background: #fff;
  color: #1f2933;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.login-box input:focus,
.modal-control input:focus,
.modal-control select:focus,
.month-query-controls input:focus,
.month-query-controls select:focus,
.filter-form input:focus,
.filter-form select:focus,
.edit-input:focus,
.reporter-add-box input:focus,
.reporter-row input:focus,
.reporter-row select:focus {
  outline: none;
  border-color: #5b9bd5;
  box-shadow: 0 0 0 2px rgba(91, 155, 213, 0.16);
}


/* =========================================================
   七、管理员操作面板
   ========================================================= */

body.viewer-mode .page-admin-panel {
  display: none;
}

body.admin-mode .page-admin-panel {
  display: block;
  margin-bottom: 10px;
  padding-top: 8px;
  padding-bottom: 9px;
}

.admin-actions {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
}

body.viewer-mode .admin-actions {
  display: none;
}

body.admin-mode .admin-actions {
  display: flex;
  flex-wrap: wrap;
}

.page-admin-panel .admin-actions {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.admin-actions::before {
  margin-right: 3px;
  color: #526779;
  font-size: 13px;
  font-weight: 700;
  content: "管理员操作：";
}

.admin-actions button {
  height: 30px;
  padding-right: 10px;
  padding-left: 10px;
}

#exportBtn {
  border-color: #1f78c1;
  background: #1f78c1;
  color: #fff;
}

#exportBtn:hover {
  background: #17619c;
}

#reporterManageBtn {
  border-color: #9c7a2d;
  background: #fff8e7;
  color: #765913;
  font-weight: 600;
}

#reporterManageBtn:hover {
  border-color: #c39a3e;
  background: #ffefc2;
  color: #60470d;
}

.admin-actions #dirtyTip {
  margin-left: 5px;
  line-height: 30px;
}


/* =========================================================
   八、通用弹窗
   ========================================================= */

.app-modal,
.reporter-modal {
  position: fixed;
  inset: 0;
  z-index: 20000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.app-modal-mask,
.reporter-modal-mask {
  position: absolute;
  inset: 0;
  background: rgba(20, 38, 55, 0.58);
  backdrop-filter: blur(2px);
}

.app-modal-box,
.reporter-modal-box {
  position: relative;
  z-index: 1;
  max-height: 88vh;
  padding: 20px;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
  border: 1px solid #d9e5f1;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.28);
}

.app-modal-header,
.reporter-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 16px;
  padding-bottom: 13px;
  border-bottom: 1px solid #dce6f0;
}

.app-modal-header-title,
.reporter-modal-header strong {
  display: block;
  margin-bottom: 4px;
  color: #1f4e79;
  font-size: 20px;
  line-height: 1.4;
  font-weight: 800;
}

.app-modal-description,
.reporter-modal-description {
  color: #657587;
  font-size: 13px;
  line-height: 1.65;
}

.app-modal-close {
  flex: 0 0 auto;
}

.app-modal-footer,
.reporter-modal-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 17px;
  padding-top: 13px;
  border-top: 1px solid #dce6f0;
}

.modal-primary-btn {
  min-width: 92px;
  height: 34px;
  font-weight: 700;
}

.modal-secondary-btn {
  min-width: 76px;
  height: 34px;
}

.modal-status-text {
  margin-right: auto;
  color: #667586;
  font-size: 13px;
  line-height: 1.5;
}


/* =========================================================
   九、月份查询弹窗
   ========================================================= */

.month-query-modal-box {
  width: 520px;
}

.month-current-card {
  margin-bottom: 15px;
  padding: 12px 14px;
  border: 1px solid #d9e5f1;
  border-radius: 8px;
  background: #f6f9fc;
  color: #4c6072;
  font-size: 14px;
}

.month-current-card strong {
  margin-left: 5px;
  color: #1f4e79;
  font-size: 16px;
}

.month-query-controls {
  display: grid;
  grid-template-columns: 105px 1fr;
  align-items: center;
  gap: 11px 12px;
}

.month-query-controls label {
  color: #34495e;
  font-size: 14px;
  font-weight: 700;
  text-align: right;
}

#monthInput {
  width: 190px;
}

.month-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.month-shortcuts button {
  height: 32px;
}

.month-refresh-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 15px;
  padding-top: 14px;
  border-top: 1px dashed #d8e3ed;
}

.month-refresh-row .small {
  line-height: 1.55;
}


/* =========================================================
   十、筛查弹窗
   ========================================================= */

.filter-modal-box {
  width: 590px;
}

.filter-form {
  display: grid;
  grid-template-columns: 80px 1fr;
  align-items: center;
  gap: 12px;
}

.filter-form label {
  color: #34495e;
  font-size: 14px;
  font-weight: 700;
  text-align: right;
}

#searchInput {
  width: 100%;
}

#reporterFilter {
  width: 170px;
  min-width: 170px;
  padding-right: 30px;
  text-align: left;
  text-align-last: left;
}

.filter-preview-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  margin-top: 16px;
  padding: 12px 14px;
  border: 1px solid #d7e4f2;
  border-radius: 8px;
  background: #f6f9fc;
}

.filter-preview-label {
  color: #53687a;
  font-size: 13px;
}

.filter-preview-count {
  color: #1f5f96;
  font-size: 15px;
  font-weight: 800;
}

.filter-preview-count.is-empty {
  color: #b03a2e;
}

.filter-active-summary {
  margin-top: 11px;
  color: #697b8c;
  font-size: 12px;
  line-height: 1.55;
}


/* =========================================================
   十一、稿分统计弹窗整体
   ========================================================= */

.score-stats-modal {
  z-index: 21000;
  padding: 22px;
  overflow: auto;
}

.score-stats-modal-box {
  padding: 18px 20px 16px;
  overflow-x: hidden;
  overflow-y: auto;
  border-radius: 13px;
  background:
    linear-gradient(
      180deg,
      #ffffff 0%,
      #fbfcfe 100%
    );
  box-shadow:
    0 24px 70px rgba(16, 38, 57, 0.30);
}

.score-stats-modal-header {
  align-items: center;
  margin-bottom: 13px;
  padding-bottom: 11px;
}

.score-stats-modal-header
.app-modal-header-title {
  margin-bottom: 2px;
  color: #1f4e79;
  font-size: 20px;
}

#scoreStatsModalMonthText {
  color: #718294;
  font-size: 13px;
}

#closeScoreStatsModalBtn {
  min-width: 68px;
  height: 32px;
}


.score-stats-modal-footer
.modal-status-text {
  color: #7b8995;
  font-size: 12px;
}


/* =========================================================
   十二、统计标题与三列布局
   ========================================================= */


.summary-left,
.summary-trend-column,
.summary-progress {
  min-width: 0;
}

.summary-left,
.score-stats-modal .summary-left {
  width: 525px;
}

.summary-left .score-summary {
  width: 100%;
  height: 290px;
}


.summary-progress,
.score-stats-modal .summary-progress {
  width: 310px;
  min-width: 310px;
}


/* =========================================================
   十三、记者基础稿分柱状图
   ========================================================= */

.score-summary {
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  gap: 0;
  height: 290px;
  padding: 8px 10px;
  overflow-x: auto;
  overflow-y: hidden;
  box-sizing: border-box;
  border: 1px solid #d7e4f2;
  border-radius: 8px;
  background: linear-gradient(to bottom, #fff, #f6faff);
  scrollbar-width: thin;
  scrollbar-color: #b9cadb transparent;
}

.score-summary::-webkit-scrollbar {
  height: 6px;
}

.score-summary::-webkit-scrollbar-track {
  background: transparent;
}

.score-summary::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #b9cadb;
}

.summary-topic-label-item {
  display: flex;
  flex: 0 0 72px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  height: 100%;
  padding-left: 10px;
  box-sizing: border-box;
}

.summary-topic-label-bar-spacer {
  position: relative;
  order: 1;
  width: 34px;
  height: 195px;
}

.summary-topic-label-spacer {
  order: 2;
  height: 20px;
  margin-top: 4px;
}

.summary-topic-label-name-spacer {
  order: 3;
  height: 20px;
  margin-top: 1px;
}

.summary-topic-label {
  order: 5;
  height: 22px;
  margin-top: 7px;
  color: #1f4e79;
  font-size: 13px;
  line-height: 22px;
  font-weight: 800;
  white-space: nowrap;
}


.summary-bar-item {
  display: flex;
  flex: 0 0 46px;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  width: 46px;
  height: 100%;
}

.summary-bar-wrap {
  position: relative;
  display: flex;
  order: 1;
  align-items: flex-end;
  justify-content: center;
  width: 34px;
  height: 195px;
  overflow: visible;
  border-radius: 7px;
  background: #edf3f9;
}

.summary-bar {
  position: relative;
  z-index: 1;
  width: 100%;
  min-height: 0;
  border-radius: 7px 7px 0 0;
  background: linear-gradient(to top, #5b9bd5, #9dc3e6);
}

.summary-bar-target-reached {
  background: linear-gradient(to top, #2e8b57, #8fd19e);
}

.summary-bar-value {
  order: 2;
  height: 20px;
  margin: 4px 0 0;
  color: #1f4e79;
  font-size: 13px;
  line-height: 20px;
  font-weight: 800;
  text-align: center;
  white-space: nowrap;
}

.summary-bar-name {
  order: 3;
  height: 20px;
  margin: 1px 0 0;
  color: #2e3a45;
  font-size: 13px;
  line-height: 20px;
  text-align: center;
  white-space: nowrap;
}

.summary-topic-number {
  order: 5;
  min-width: 25px;
  height: 22px;
  margin-top: 7px;
  padding: 0 5px;
  box-sizing: border-box;
  border-radius: 999px;
  background: #fff0ee;
  color: #c0392b;
  font-size: 16px;
  line-height: 22px;
  font-weight: 900;
  text-align: center;
}


.summary-shared-target-line {
  position: absolute;
  left: -36px;
  z-index: 5;
  height: 2px;
  background: #d35400;
  pointer-events: none;
  transform: translateY(1px);
}

.summary-shared-safety-line {
  position: absolute;
  left: -36px;
  z-index: 4;
  height: 0;
  border-top: 1px dashed #c0392b;
  pointer-events: none;
  transform: translateY(1px);
}

.summary-safety-label-text {
  position: absolute;
  right: 0;
  top: 0;
  transform: translate(calc(100% + 5px), -50%);
  color: #c0392b;
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
  line-height: 1;
}


.summary-target-label {
  position: absolute;
  left: 2px;
  color: #b34700;
  font-size: 10px;
  line-height: 1;
  font-weight: 700;
  white-space: nowrap;
  transform: translateY(50%);
}

.summary-safety-line {
  align-self: center;
  flex: 0 0 138px;
  min-width: 138px;
  margin-left: 28px;
  padding: 9px 13px;
  box-sizing: border-box;
  border: 1px solid #c2d8ef;
  border-radius: 8px;
  background: #eef4fb;
  box-shadow: 0 1px 6px rgba(31, 78, 121, 0.08);
  color: #1f4e79;
  font-size: 13px;
  line-height: 1.7;
  font-weight: 700;
  text-align: left;
}


.summary-safety-line strong {
  color: #d35400;
  font-size: 20px;
  font-weight: 800;
}

.safety-help-icon,
.score-forecast-help {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin: 0 4px;
  padding: 0;
  box-sizing: border-box;
  border: 1px solid #7d9cba;
  border-radius: 50%;
  background: #eef5fb;
  color: #1f4e79;
  font-size: 11px;
  line-height: 14px;
  font-weight: 900;
  vertical-align: 2px;
  cursor: help;
  user-select: none;
  box-shadow: none;
}


.safety-help-icon:hover,
.safety-help-icon:focus,
.score-forecast-help:hover,
.score-forecast-help:focus {
  outline: none;
  border-color: #1f78c1;
  background: #1f78c1;
  color: #fff;
  box-shadow: none;
  transform: none;
}
/* =========================================================
   十四、统计区内的稿分走势缩略图
   ========================================================= */


.summary-trend-preview-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 18px;
  box-sizing: border-box;
  color: #82909d;
  font-size: 12px;
  text-align: center;
}


/*
 * JavaScript可能根据空间为缩略图增加紧凑状态。
 * 在当前独立三列布局中，始终保留完整走势图。
 */


/* 缩略走势图坐标、网格与折线 */

.mini-trend-plot {
  fill: #fbfdff;
}

.mini-trend-grid {
  stroke: #e5edf4;
  stroke-width: 1;
  shape-rendering: crispEdges;
}

.mini-trend-axis {
  stroke: #9badbc;
  stroke-width: 1;
  shape-rendering: crispEdges;
}

.mini-trend-target {
  stroke: #d35400;
  stroke-width: 1.2;
  stroke-dasharray: 5 4;
  opacity: 0.85;
}

.mini-trend-future-zone {
  fill: #f2f5f7;
  opacity: 0.72;
}

.mini-trend-line-glow {
  fill: none;
  stroke-width: 5;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.07;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
}

.mini-trend-line {
  fill: none;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.94;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
}

.mini-trend-end-point {
  stroke: #fff;
  stroke-width: 1.3;
  vector-effect: non-scaling-stroke;
}

.mini-trend-axis-label {
  fill: #80909e;
  font-size: 9px;
  font-family:
    "Microsoft YaHei",
    "PingFang SC",
    Arial,
    sans-serif;
}


/* =========================================================
   十五、月份进度与稿分预测
   ========================================================= */

.summary-progress {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 15px 14px 17px;
  box-sizing: border-box;
  border: 1px solid #d7e4f2;
  border-radius: 8px;
  background: linear-gradient(to bottom, #fff, #f6faff);
}

.summary-progress .progress-title {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 5px;
  margin: 0 0 18px;
  pointer-events: none;
}

.summary-progress .progress-title strong {
  color: #1f4e79;
  font-size: 17px;
  font-weight: 700;
  white-space: nowrap;
}

.summary-progress .progress-title .small {
  color: #4f5f70;
  font-size: 14px;
  line-height: 19px;
  font-weight: 700;
  white-space: nowrap;
}

.month-progress-bar {
  width: 100%;
  height: 17px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8eef5;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
}

.month-progress-fill {
  width: 0%;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(to right, #5b9bd5, #1f78c1);
  transition: width 0.3s ease;
}

#monthProgressDesc {
  display: block;
  width: fit-content;
  margin: 21px auto 0;
  color: #1f4e79;
  font-size: 16px;
  line-height: 1.82;
  font-weight: 700;
  text-align: left;
}

#monthProgressDesc div {
  white-space: nowrap;
}


/* =========================================================
   十六、基础稿分占比条
   ========================================================= */

.score-share-card {
  position: relative;
  margin-top: 10px;
  padding: 9px 12px 8px;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid #d7e4ef;
  border-radius: 10px;
  background:
    radial-gradient(
      circle at 7% 0%,
      rgba(91, 155, 213, 0.10),
      transparent 31%
    ),
    linear-gradient(
      180deg,
      #ffffff 0%,
      #f7fafd 100%
    );
  box-shadow:
    0 2px 8px rgba(31, 78, 121, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.score-share-card::before {
  position: absolute;
  top: 0;
  left: 18px;
  width: 160px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      #2878c7,
      #159a9c,
      transparent
    );
  content: "";
}

.score-share-header {
  display: block;
  margin-bottom: 6px;
}


.score-share-total-number {
  margin: 0 1px;
  color: #d35400;
  font-size: 15px;
  font-weight: 900;
}

.score-share-caption {
  color: #8794a0;
  font-size: 12px;
  line-height: 1.4;
  font-weight: 400;
  white-space: nowrap;
}

.score-share-total {
  display: none;
}

.score-share-content {
  min-width: 0;
}


.score-share-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  box-sizing: border-box;
  border: 1px dashed #cad9e6;
  border-radius: 5px;
  background: rgba(247, 250, 253, 0.88);
  color: #7b8b99;
  font-size: 12px;
  text-align: center;
}


/* 统计弹窗内的占比条使用更淡雅的配色 */

.score-stats-modal .score-share-card {
  margin-top: 18px;
  padding: 9px 12px 8px;
  border-color: #dce5ec;
  background:
    linear-gradient(
      180deg,
      rgba(252, 253, 254, 0.98),
      rgba(247, 250, 252, 0.98)
    );
  box-shadow:
    0 1px 4px rgba(39, 67, 89, 0.045);
}

.score-stats-modal
.score-share-card::before {
  background:
    linear-gradient(
      90deg,
      rgba(89, 126, 154, 0.52),
      rgba(124, 155, 174, 0.24),
      transparent
    );
}


/* =========================================================
   十七、稿分走势图弹窗
   ========================================================= */

.trend-modal-box {
  width: 1180px;
  max-width: calc(100vw - 60px);
  max-height: 92vh;
  overflow: hidden;
}

.trend-modal-header {
  margin-bottom: 11px;
}


.trend-chart-status {
  color: #617487;
  font-size: 13px;
  font-weight: 600;
}

.trend-show-all-btn {
  height: 29px;
  padding: 4px 10px;
}

.trend-legend {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  margin-bottom: 9px;
}

.trend-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 29px;
  padding: 0 9px;
  box-sizing: border-box;
  border: 1px solid #d7e1ea;
  border-radius: 999px;
  background: #fff;
  color: #33485a;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  user-select: none;
  transition:
    opacity 0.15s ease,
    background-color 0.15s ease,
    border-color 0.15s ease;
}

.trend-legend-item:hover {
  border-color: #9dbbd5;
  background: #f3f8fc;
}

.trend-legend-item.is-hidden {
  opacity: 0.42;
  text-decoration: line-through;
}

.trend-legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: currentColor;
}

.trend-legend-score {
  color: #6b7d8e;
  font-weight: 600;
}

.trend-chart-shell {
  position: relative;
  width: 100%;
  height: 560px;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid #d7e4f2;
  border-radius: 9px;
  background: #fff;
}

#trendChart {
  display: block;
  width: 100%;
  height: 100%;
}

.trend-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 30px;
  box-sizing: border-box;
  color: #6a7c8c;
  font-size: 15px;
  text-align: center;
}

.trend-tooltip {
  position: absolute;
  z-index: 20;
  min-width: 155px;
  max-width: 230px;
  padding: 9px 11px;
  pointer-events: none;
  box-sizing: border-box;
  border: 1px solid rgba(63, 91, 115, 0.22);
  border-radius: 7px;
  background: rgba(28, 48, 65, 0.94);
  color: #fff;
  font-size: 12px;
  line-height: 1.65;
  box-shadow: 0 5px 18px rgba(15, 34, 50, 0.22);
  transform: translate(10px, -50%);
}

.trend-tooltip strong {
  display: block;
  margin-bottom: 2px;
  color: #fff;
  font-size: 13px;
}

.trend-tooltip-value {
  color: #ffd18a;
  font-weight: 800;
}


/* =========================================================
   十八、走势图 SVG 样式
   ========================================================= */

.trend-svg-background {
  fill: #fff;
}

.trend-svg-plot-background {
  fill: #fbfdff;
}

.trend-grid-line {
  stroke: #e2eaf2;
  stroke-width: 1;
  shape-rendering: crispEdges;
}

.trend-axis-line {
  stroke: #8297aa;
  stroke-width: 1.2;
  shape-rendering: crispEdges;
}

.trend-axis-label {
  fill: #617487;
  font-size: 12px;
  font-family:
    "Microsoft YaHei",
    "PingFang SC",
    Arial,
    sans-serif;
}

.trend-axis-title {
  fill: #34536d;
  font-size: 13px;
  font-weight: 700;
  font-family:
    "Microsoft YaHei",
    "PingFang SC",
    Arial,
    sans-serif;
}

.trend-target-line {
  stroke: #d35400;
  stroke-width: 1.7;
  stroke-dasharray: 7 5;
}

.trend-target-label {
  fill: #b34700;
  font-size: 12px;
  font-weight: 700;
}

.trend-safety-line {
  fill: none;
  stroke: #d6a15b;
  stroke-width: 1.7;
  stroke-dasharray: 4 5;
  opacity: 0.85;
}


.trend-today-line {
  stroke: #2878c7;
  stroke-width: 1.6;
  stroke-dasharray: 5 4;
  opacity: 0.5;
}

.trend-today-label {
  fill: #2878c7;
  font-size: 11px;
  font-weight: 700;
  opacity: 0.8;
}


.trend-reporter-line {
  fill: none;
  stroke-width: 2.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.96;
  vector-effect: non-scaling-stroke;
  transition:
    opacity 0.18s ease,
    stroke-width 0.18s ease;
}

.trend-reporter-glow {
  fill: none;
  stroke-width: 8;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.075;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
}


.trend-data-point {
  stroke: rgba(255, 255, 255, 0.96);
  stroke-width: 1.8;
  cursor: pointer;
  vector-effect: non-scaling-stroke;
  filter:
    drop-shadow(
      0 1px 2px rgba(25, 53, 76, 0.22)
    );
  transition:
    r 0.14s ease,
    opacity 0.14s ease,
    stroke-width 0.14s ease;
}

.trend-data-point.is-latest {
  stroke-width: 2.2;
  filter:
    drop-shadow(
      0 1px 3px rgba(25, 53, 76, 0.30)
    );
}

.trend-data-point:hover {
  r: 5.8px;
  stroke-width: 2.3;
}

.trend-data-hit {
  fill: transparent;
  stroke: transparent;
  stroke-width: 0;
  cursor: crosshair;
  pointer-events: all;
}

.trend-latest-label {
  font-size: 11px;
  font-weight: 900;
  pointer-events: none;
  paint-order: stroke;
  stroke: rgba(255, 255, 255, 0.97);
  stroke-width: 4px;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.trend-label-leader {
  fill: none;
  stroke-width: 1.1;
  stroke-linecap: round;
  opacity: 0.52;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
}

.trend-future-zone {
  fill: #f5f7f9;
  opacity: 0.72;
}

.trend-future-label {
  fill: #9aa7b2;
  font-size: 12px;
}


/* =========================================================
   十九、新闻明细表
   ========================================================= */

.table-stage,
body.viewer-mode .table-stage {
  display: block;
  width: 1320px;
  margin-right: auto;
  margin-left: auto;
  overflow: visible;
}

.table-wrap,
.table-stage .table-wrap,
body.viewer-mode .table-stage .table-wrap {
  width: 1320px;
  min-width: 1320px;
  max-width: 1320px;
  max-height: none;
  margin-right: auto;
  margin-left: auto;
  overflow: visible;
  box-sizing: border-box;
  border: 1px solid rgba(217, 229, 242, 0.75);
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 2px 10px rgba(31, 78, 121, 0.08);
}

body.admin-mode .table-stage {
  display: block;
  width: 1470px;
  margin-right: auto;
  margin-left: auto;
}

body.admin-mode
.table-stage
.table-wrap {
  width: 1470px;
  min-width: 1470px;
  max-width: 1470px;
  margin-right: auto;
  margin-left: auto;
}

table {
  width: 1320px;
  min-width: 1320px;
  border-spacing: 0;
  border-collapse: separate;
  table-layout: fixed;
  background: #fff;
}

body.viewer-mode table {
  width: 1320px;
  min-width: 1320px;
}

body.admin-mode table {
  width: 1470px;
  min-width: 1470px;
}

th,
td {
  padding: 5px 7px;
  border-right: 1px solid #dce6f0;
  border-bottom: 1px solid #dce6f0;
  vertical-align: middle;
  font-size: 14px;
}

th:first-child,
td:first-child {
  border-left: 0;
}

th:last-child,
td:last-child {
  border-right: 0;
}

tbody tr:last-child td {
  border-bottom: 0;
}

thead th {
  position: sticky;
  top: 0;
  z-index: 20;
  height: 32px;
  background: #e4edf7;
  color: #1c2f40;
  font-size: 13px;
  line-height: 1.2;
  font-weight: 700;
  text-align: center;
  white-space: nowrap;
  box-shadow: 0 1px 0 #cbd9e7;
}

thead th:first-child {
  border-top-left-radius: 8px;
}

thead th:last-child {
  border-top-right-radius: 8px;
}

td {
  height: 26px;
}


/* 表格列宽 */

th.drag-col,
td.drag {
  width: 45px;
  text-align: center;
}

th.date-col,
td.date {
  width: 115px;
  text-align: center;
}

th.title-col,
td.title {
  width: 550px;
  max-width: 550px;
  text-align: left;
}

th.reporters-col,
td.reporters {
  width: 220px;
  text-align: center;
}

th.score-col,
td.score {
  width: 58px;
  font-weight: 600;
  text-align: center;
}

th.reason-col,
td.reason {
  width: 140px;
  text-align: left;
}

th.topic-col,
td.topic {
  width: 68px;
  text-align: center;
}

th.remark-col,
td.remark {
  width: 90px;
  text-align: left;
}

th.action-col,
td.action {
  width: 55px;
  text-align: center;
}


/* 只读内容与编辑输入框 */

.readonly-cell {
  height: 22px;
  overflow: hidden;
  font-size: inherit;
  line-height: 1.25;
  text-align: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.edit-input {
  width: 100%;
  height: 27px;
  padding: 3px 6px;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid #cbd5df;
  border-radius: 5px;
  background: #fff;
  font-family: inherit;
  font-size: 13px;
  line-height: 20px;
  text-align: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}


/* 拖动排序 */

.drag-handle {
  display: inline-block;
  width: 28px;
  height: 24px;
  border-radius: 5px;
  background: #eef3f8;
  color: #1f4e79;
  line-height: 24px;
  font-weight: 700;
  cursor: grab;
  user-select: none;
}

.drag-handle:active {
  cursor: grabbing;
}

tr.dragging {
  opacity: 0.45;
}

tr.dragging td {
  background-color: #fff3cd !important;
}

tr.drag-over,
tr.drag-over td {
  outline: 2px dashed #1f78c1;
}


/* 按播出日期交替显示底色 */

tr.date-group-a td {
  background-color: #edf6ff;
}

tr.date-group-b td {
  background-color: #eef9ef;
}

tr.date-group-a td:first-child {
  border-left: 4px solid #5b9bd5;
}

tr.date-group-b td:first-child {
  border-left: 4px solid #70ad47;
}

tr.date-group-a:hover td {
  background-color: #dceeff;
}

tr.date-group-b:hover td {
  background-color: #def2df;
}


/* 主题报道为“是”时突出显示 */

td.topic.topic-yes {
  background-color: #fff2bf !important;
}

td.topic.topic-yes .readonly-cell,
td.topic.topic-yes select {
  display: inline-block;
  min-width: 26px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: #ffe08a;
  color: #8a5a00;
  line-height: 20px;
  font-weight: 700;
  text-align: center;
}


/* 数据更新时间 */

.data-update-footer {
  max-width: 1430px;
  margin: 10px auto 0;
  padding: 4px 0 8px;
  color: #667586;
  font-size: 12px;
  text-align: center;
}
/* =========================================================
   二十、记者人员管理弹窗
   ========================================================= */

.reporter-modal-box {
  width: 920px;
}

.reporter-modal-description {
  max-width: 720px;
}

.reporter-add-title {
  margin: 0 0 7px 2px;
  color: #1f4e79;
  font-size: 14px;
  font-weight: 700;
}

.reporter-add-box {
  display: grid;
  grid-template-columns: 170px 1fr auto;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  padding: 12px;
  border: 1px solid #d9e5f1;
  border-radius: 8px;
  background: #f6f9fc;
}

.reporter-add-box input,
.reporter-row input,
.reporter-row select {
  width: 100%;
  height: 33px;
  padding: 5px 8px;
  box-sizing: border-box;
  border: 1px solid #cfd9e5;
  border-radius: 6px;
  background: #fff;
  color: #1f2933;
  font-family: inherit;
}

.reporter-add-box button {
  height: 33px;
  white-space: nowrap;
}

.reporter-manage-tip {
  margin: 8px 0 12px;
  padding-left: 2px;
  line-height: 1.6;
}

.reporter-list-head,
.reporter-row {
  display: grid;
  grid-template-columns: 155px 1fr 95px 70px 160px;
  align-items: center;
  gap: 8px;
}

.reporter-list-head {
  padding: 9px 10px;
  border-radius: 7px 7px 0 0;
  background: #e4edf7;
  color: #1c2f40;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
}

.reporter-manage-list {
  max-height: 390px;
  overflow-x: hidden;
  overflow-y: auto;
}

.reporter-row {
  padding: 8px 10px;
  border-right: 1px solid #dce6f0;
  border-bottom: 1px solid #dce6f0;
  border-left: 1px solid #dce6f0;
  background: #fff;
}

.reporter-row:nth-child(even) {
  background: #f8fafc;
}

.reporter-row:hover {
  background: #f0f6fc;
}

.reporter-row.reporter-inactive {
  background: #f2f3f5;
  opacity: 0.78;
}

.reporter-row.reporter-inactive:hover {
  background: #e9ebee;
}

.reporter-row-actions {
  display: flex;
  justify-content: center;
  gap: 5px;
}

.reporter-row-actions button {
  min-width: 62px;
  height: 30px;
  padding: 4px 8px;
  white-space: nowrap;
}

.reporter-empty {
  padding: 28px;
  border-right: 1px solid #dce6f0;
  border-bottom: 1px solid #dce6f0;
  border-left: 1px solid #dce6f0;
  color: #6b7785;
  text-align: center;
}

.reporter-modal-footer {
  justify-content: space-between;
}

.reporter-modal-footer .small {
  line-height: 1.6;
}

.reporter-modal-footer button {
  min-width: 76px;
}


/* =========================================================
   二十一、网站访问口令界面
   ========================================================= */

#siteGate {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(111, 188, 239, 0.20),
      transparent 48%
    ),
    linear-gradient(
      135deg,
      #235b8c,
      #17456f
    );
}

.gate-box {
  width: 380px;
  padding: 30px 32px 32px;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.24);
}

.gate-title {
  margin-bottom: 8px;
  color: #1f4e79;
  font-size: 22px;
  line-height: 1.35;
  font-weight: 700;
  text-align: center;
}

.gate-subtitle {
  margin-bottom: 18px;
  color: #5f6f7f;
  font-size: 14px;
  text-align: center;
}

#siteGateInput {
  width: 100%;
  height: 40px;
  padding: 8px 11px;
  box-sizing: border-box;
  border: 1px solid #cfd9e5;
  border-radius: 6px;
  font-family: inherit;
  font-size: 15px;
}

#siteGateInput:focus {
  outline: none;
  border-color: #5b9bd5;
  box-shadow: 0 0 0 2px rgba(91, 155, 213, 0.18);
}

#siteGateBtn {
  width: 100%;
  height: 40px;
  margin-top: 14px;
  border: 0;
  border-radius: 6px;
  background: #1f4e79;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}

#siteGateBtn:hover {
  background: #17456f;
}

.gate-error {
  min-height: 20px;
  margin-top: 10px;
  color: #c0392b;
  font-size: 13px;
  text-align: center;
}


/* =========================================================
   二十二、DOCX导入预览弹窗整体
   ========================================================= */

.docx-preview-modal {
  z-index: 23000;
  padding: 22px;
  overflow: auto;
  box-sizing: border-box;
}

.docx-preview-modal-box {
  display: flex;
  width: 1280px;
  max-width: calc(100vw - 44px);
  height: auto;
  max-height: calc(100vh - 44px);
  padding: 18px 20px 16px;
  overflow: hidden;
  box-sizing: border-box;
  flex-direction: column;
  border: 1px solid #d7e2eb;
  border-radius: 13px;
  background:
    linear-gradient(
      180deg,
      #ffffff 0%,
      #fbfcfe 100%
    );
  box-shadow:
    0 24px 70px rgba(16, 38, 57, 0.32);
}

.docx-preview-modal-header {
  flex: 0 0 auto;
  align-items: center;
  margin-bottom: 12px;
  padding-bottom: 11px;
  border-bottom-color: #dce5ec;
}

.docx-preview-heading {
  min-width: 0;
  padding-right: 20px;
}

.docx-preview-heading
.app-modal-header-title {
  display: block;
  margin-bottom: 3px;
  color: #1f4e79;
  font-size: 20px;
  line-height: 1.4;
  font-weight: 800;
}

.docx-preview-heading
.app-modal-description {
  color: #6f7f8e;
  font-size: 13px;
  line-height: 1.65;
}

#closeDocxPreviewModalBtn {
  flex: 0 0 auto;
  min-width: 68px;
  height: 32px;
}


/* =========================================================
   二十三、DOCX解析总体摘要
   ========================================================= */

.docx-preview-summary {
  display: grid;
  flex: 0 0 auto;
  grid-template-columns:
    repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.docx-preview-summary-item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
  min-height: 56px;
  padding: 10px 14px;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid #d8e4ed;
  border-radius: 9px;
  background:
    radial-gradient(
      circle at 0% 0%,
      rgba(91, 155, 213, 0.09),
      transparent 42%
    ),
    linear-gradient(
      180deg,
      #ffffff,
      #f6f9fc
    );
  box-shadow:
    0 1px 4px rgba(31, 78, 121, 0.045);
}

.docx-preview-summary-item::before {
  position: absolute;
  top: 0;
  left: 13px;
  width: 62px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      #6b9ec6,
      rgba(107, 158, 198, 0.12)
    );
  content: "";
}

.docx-preview-summary-label {
  min-width: 0;
  color: #5f7181;
  font-size: 13px;
  line-height: 1.4;
  font-weight: 700;
  white-space: nowrap;
}

.docx-preview-summary-value {
  flex: 0 0 auto;
  margin-left: 12px;
  color: #1f5d91;
  font-size: 22px;
  line-height: 1;
  font-weight: 900;
}

.docx-preview-summary-item.has-overwrite {
  border-color: #e6cfae;
  background:
    linear-gradient(
      180deg,
      #fffdfa,
      #fdf8f0
    );
}

.docx-preview-summary-item.has-overwrite::before {
  background:
    linear-gradient(
      90deg,
      #c78a42,
      rgba(199, 138, 66, 0.10)
    );
}

.docx-preview-summary-item.has-overwrite
.docx-preview-summary-value {
  color: #af672b;
}

.docx-preview-summary-item.has-error {
  border-color: #e4b6b1;
  background:
    linear-gradient(
      180deg,
      #fffdfd,
      #fcf3f2
    );
}

.docx-preview-summary-item.has-error::before {
  background:
    linear-gradient(
      90deg,
      #c7675e,
      rgba(199, 103, 94, 0.10)
    );
}

.docx-preview-summary-item.has-error
.docx-preview-summary-value {
  color: #b54b42;
}


/* =========================================================
   二十四、DOCX全局提示与文件列表
   ========================================================= */

.docx-preview-global-message {
  flex: 0 0 auto;
  margin-bottom: 12px;
  padding: 10px 13px;
  box-sizing: border-box;
  border: 1px solid #e6c690;
  border-radius: 7px;
  background: #fff9ed;
  color: #8a5a18;
  font-size: 13px;
  line-height: 1.65;
}

.docx-preview-global-message.is-error {
  border-color: #dfa7a1;
  background: #fff2f1;
  color: #a83d34;
}

.docx-preview-global-message.is-warning {
  border-color: #e6c690;
  background: #fff9ed;
  color: #8a5a18;
}


.docx-preview-file-list {
  flex: 1 1 auto;
  min-height: 180px;
  max-height: calc(100vh - 335px);
  padding: 2px 7px 4px 2px;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
  scrollbar-color:
    #b8c9d7
    #eef3f7;
  scrollbar-width: thin;
}

.docx-preview-file-list::-webkit-scrollbar {
  width: 9px;
}

.docx-preview-file-list::-webkit-scrollbar-track {
  border-radius: 999px;
  background: #eef3f7;
}

.docx-preview-file-list::-webkit-scrollbar-thumb {
  border: 2px solid #eef3f7;
  border-radius: 999px;
  background: #b7c8d6;
}

.docx-preview-file-list::-webkit-scrollbar-thumb:hover {
  background: #95acbe;
}

.docx-preview-loading,
.docx-preview-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 180px;
  padding: 30px;
  box-sizing: border-box;
  border: 1px dashed #c9d8e4;
  border-radius: 9px;
  background:
    linear-gradient(
      180deg,
      #fafcfe,
      #f5f8fb
    );
  color: #708292;
  font-size: 14px;
  text-align: center;
}

.docx-preview-empty {
  border-color: #d1dce5;
  background: #f8fafc;
  color: #7c8a96;
}


/* =========================================================
   二十五、单个DOCX文件卡片
   ========================================================= */

.docx-preview-file-card {
  margin-bottom: 13px;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid #d5e1eb;
  border-radius: 10px;
  background: #fff;
  box-shadow:
    0 2px 8px rgba(31, 78, 121, 0.055);
}

.docx-preview-file-card:last-child {
  margin-bottom: 0;
}

.docx-preview-file-card.is-valid {
  border-color: #c9dce9;
}

.docx-preview-file-card.is-valid
.docx-preview-file-card-header {
  border-top-color: #6d9fc4;
}

.docx-preview-file-card.has-warning {
  border-color: #e4c99f;
}

.docx-preview-file-card.has-warning
.docx-preview-file-card-header {
  border-top-color: #c68a3f;
}

.docx-preview-file-card.is-invalid {
  border-color: #dfb1ac;
  background: #fffdfd;
}

.docx-preview-file-card.is-invalid
.docx-preview-file-card-header {
  border-top-color: #c45f56;
}

.docx-preview-file-card.has-duplicate-date {
  border-color: #d99c95;
  background:
    linear-gradient(
      180deg,
      #fffdfd,
      #fff8f7
    );
}

.docx-preview-file-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 11px 13px 10px;
  border-top: 3px solid #6d9fc4;
  border-bottom: 1px solid #e1e9ef;
  background:
    linear-gradient(
      180deg,
      #fbfdff,
      #f6f9fb
    );
}

.docx-preview-file-main {
  min-width: 0;
}

.docx-preview-file-name {
  display: block;
  max-width: 760px;
  margin-bottom: 5px;
  overflow: hidden;
  color: #254d6c;
  font-size: 14px;
  line-height: 1.45;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.docx-preview-file-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px 14px;
  color: #667888;
  font-size: 12px;
  line-height: 1.5;
}

.docx-preview-file-meta strong {
  color: #365b77;
  font-weight: 800;
}

.docx-preview-file-status {
  flex: 0 0 auto;
  padding: 4px 9px;
  border: 1px solid #bcd4e4;
  border-radius: 999px;
  background: #edf6fc;
  color: #3a7097;
  font-size: 12px;
  line-height: 1.35;
  font-weight: 800;
  white-space: nowrap;
}

.docx-preview-file-status.is-valid {
  border-color: #b9d8c5;
  background: #eef8f1;
  color: #37734a;
}

.docx-preview-file-status.is-warning {
  border-color: #e4c58f;
  background: #fff7e8;
  color: #93601e;
}

.docx-preview-file-status.is-error {
  border-color: #dfa9a3;
  background: #fff0ef;
  color: #ad4138;
}


/* =========================================================
   二十六、DOCX文件提示
   ========================================================= */

.docx-preview-file-message {
  margin: 10px 13px 0;
  padding: 8px 10px;
  box-sizing: border-box;
  border: 1px solid #e6c892;
  border-radius: 6px;
  background: #fff9ed;
  color: #855817;
  font-size: 12px;
  line-height: 1.6;
}

.docx-preview-file-message.is-error {
  border-color: #dfa9a3;
  background: #fff1f0;
  color: #a53f36;
}

.docx-preview-file-message.is-warning {
  border-color: #e6c892;
  background: #fff9ed;
  color: #855817;
}


.docx-preview-warning-list {
  margin: 0;
  padding-left: 18px;
}

.docx-preview-warning-list li {
  margin: 2px 0;
}
/* =========================================================
   二十七、DOCX新闻预览表格
   ========================================================= */

.docx-preview-table-wrap {
  margin: 10px 13px 12px;
  overflow-x: hidden;
  overflow-y: visible;
  border: 1px solid #dbe4eb;
  border-radius: 7px;
}

.docx-preview-table,
body.viewer-mode
.docx-preview-modal
.docx-preview-table,
body.admin-mode
.docx-preview-modal
.docx-preview-table {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  background: #fff;
}

.docx-preview-table th,
.docx-preview-table td,
.docx-preview-modal
.docx-preview-table th,
.docx-preview-modal
.docx-preview-table td {
  height: auto;
  padding: 7px 9px;
  box-sizing: border-box;
  border-right: 1px solid #e0e7ed;
  border-bottom: 1px solid #e0e7ed;
  color: #33495a;
  font-size: 12px;
  line-height: 1.55;
  vertical-align: top;
  white-space: normal;
}

.docx-preview-table th:last-child,
.docx-preview-table td:last-child {
  border-right: 0;
}

.docx-preview-table
tbody
tr:last-child td {
  border-bottom: 0;
}

.docx-preview-table th {
  position: static;
  z-index: auto;
  background:
    linear-gradient(
      180deg,
      #edf3f8,
      #e5edf4
    );
  color: #294b66;
  font-weight: 800;
  text-align: left;
  white-space: nowrap;
  box-shadow: none;
}

.docx-preview-table th:first-child,
.docx-preview-table th:last-child {
  border-radius: 0;
}

.docx-preview-table
tbody
tr:nth-child(even) {
  background: #f9fbfd;
}

.docx-preview-table
tbody
tr:hover {
  background: #f1f7fb;
}

.docx-preview-table
.docx-preview-sequence-col,
body.viewer-mode
.docx-preview-modal
.docx-preview-table
.docx-preview-sequence-col,
body.admin-mode
.docx-preview-modal
.docx-preview-table
.docx-preview-sequence-col {
  width: 58px;
  max-width: 58px;
  text-align: center;
}

.docx-preview-table
.docx-preview-reporters-col,
body.viewer-mode
.docx-preview-modal
.docx-preview-table
.docx-preview-reporters-col,
body.admin-mode
.docx-preview-modal
.docx-preview-table
.docx-preview-reporters-col {
  width: 190px;
  max-width: 190px;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.docx-preview-table
.docx-preview-title-col,
body.viewer-mode
.docx-preview-modal
.docx-preview-table
.docx-preview-title-col,
body.admin-mode
.docx-preview-modal
.docx-preview-table
.docx-preview-title-col {
  width: auto;
  max-width: none;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.docx-preview-reporters-empty {
  display: inline-block;
  padding: 2px 6px;
  border: 1px solid #e4c890;
  border-radius: 4px;
  background: #fff8e9;
  color: #96611d;
  font-size: 11px;
  font-weight: 700;
}

.docx-preview-reporters-value {
  color: #355c77;
  font-weight: 700;
}


/* =========================================================
   二十八、DOCX导入执行状态
   ========================================================= */

.docx-preview-import-status {
  flex: 0 0 auto;
  margin-top: 10px;
  padding: 10px 13px;
  box-sizing: border-box;
  border: 1px solid #b8d4e6;
  border-radius: 7px;
  background: #f0f7fc;
  color: #366b91;
  font-size: 13px;
  line-height: 1.6;
}

.docx-preview-import-status.is-working {
  border-color: #b8d4e6;
  background:
    linear-gradient(
      90deg,
      #eff7fc,
      #f8fbfd,
      #eff7fc
    );
  background-size: 200% 100%;
  color: #356b92;
  animation:
    docx-preview-working
    1.8s linear infinite;
}


.docx-preview-import-status.is-error {
  border-color: #dfa9a3;
  background: #fff1f0;
  color: #a53f36;
}

@keyframes docx-preview-working {

  0% {
    background-position: 100% 0;
  }

  100% {
    background-position: -100% 0;
  }
}


/* =========================================================
   二十九、DOCX弹窗底部操作
   ========================================================= */

.docx-preview-modal-footer {
  flex: 0 0 auto;
  align-items: center;
  gap: 18px;
  margin-top: 12px;
  padding-top: 11px;
  border-top-color: #dce5ec;
}

.docx-preview-modal-footer
.modal-status-text {
  flex: 1 1 auto;
  min-width: 0;
  color: #768592;
  font-size: 12px;
  line-height: 1.55;
}

.docx-preview-footer-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

#docxPreviewCancelBtn,
#docxPreviewReselectBtn,
#docxPreviewConfirmBtn {
  min-width: 92px;
  height: 34px;
  padding: 6px 13px;
  box-sizing: border-box;
  white-space: nowrap;
}

#docxPreviewConfirmBtn {
  min-width: 138px;
}

#docxPreviewConfirmBtn:disabled {
  border-color: #cbd4dc !important;
  background: #e8edf1 !important;
  color: #98a3ac !important;
  cursor: not-allowed;
  box-shadow: none;
  opacity: 1;
}

.docx-preview-modal.is-importing
#closeDocxPreviewModalBtn,
.docx-preview-modal.is-importing
#docxPreviewCancelBtn,
.docx-preview-modal.is-importing
#docxPreviewReselectBtn {
  cursor: not-allowed;
  opacity: 0.48;
  pointer-events: none;
}

.docx-preview-overwrite-note {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #a76527;
  font-weight: 800;
}

.docx-preview-new-date-note {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #3f7751;
  font-weight: 700;
}


/* =========================================================
   三十、较矮浏览器窗口
   ========================================================= */

@media (max-height: 820px) {

  .app-modal-box,
  .reporter-modal-box {
    max-height: 94vh;
  }


  .score-stats-modal-box {
    padding-top: 14px;
    padding-bottom: 13px;
  }


  .trend-chart-shell {
    height: 455px;
  }

  .reporter-manage-list {
    max-height: 300px;
  }

  .docx-preview-modal {
    align-items: flex-start;
    padding-top: 13px;
    padding-bottom: 13px;
  }

  .docx-preview-modal-box {
    max-height: calc(100vh - 26px);
    padding-top: 14px;
    padding-bottom: 12px;
  }

  .docx-preview-modal-header {
    margin-bottom: 9px;
    padding-bottom: 9px;
  }

  .docx-preview-summary {
    margin-bottom: 9px;
  }

  .docx-preview-summary-item {
    min-height: 48px;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .docx-preview-summary-value {
    font-size: 19px;
  }

  .docx-preview-file-list {
    max-height: calc(100vh - 292px);
  }

  .docx-preview-modal-footer {
    margin-top: 9px;
    padding-top: 9px;
  }
}


/* =========================================================
   三十一、较窄浏览器窗口
   ========================================================= */

/*
 * 网站主体采用固定桌面宽度。
 * 窗口不足时，弹窗外层允许滚动，
 * 不强行压缩图表和业务表单。
 */

@media (max-width: 1250px) {

  .trend-modal {
    align-items: flex-start;
    justify-content: flex-start;
    padding: 20px;
    overflow: auto;
    box-sizing: border-box;
  }

  .trend-modal-box {
    width: 1120px;
    min-width: 1120px;
    max-width: none;
    max-height: none;
  }
}

@media (max-width: 1240px) {

  .score-stats-modal {
    align-items: flex-start;
    justify-content: flex-start;
    overflow: auto;
  }

  .score-stats-modal-box {
    width: 1360px;
    min-width: 1360px;
    max-width: none;
    max-height: none;
  }
}

@media (max-width: 1100px) {

  .docx-preview-modal {
    align-items: flex-start;
    justify-content: flex-start;
    overflow: auto;
  }

  .docx-preview-modal-box {
    width: 1180px;
    min-width: 1180px;
    max-width: none;
  }
}

@media (max-width: 950px) {

  .app-modal,
  .reporter-modal {
    align-items: flex-start;
    justify-content: flex-start;
    padding: 20px;
    overflow: auto;
    box-sizing: border-box;
  }

  .month-query-modal-box {
    width: 520px;
    min-width: 520px;
    max-height: none;
  }

  .filter-modal-box {
    width: 590px;
    min-width: 590px;
    max-height: none;
  }

  .reporter-modal-box {
    width: 900px;
    min-width: 900px;
    max-height: none;
  }
}


/* =========================================================
   三十二、减少动态效果的系统偏好
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}
/* =========================================================
   三十三、动态内容与状态兼容
   ========================================================= */

/*
 * hidden必须保留最高优先级。
 * 弹窗、按钮和动态状态都依赖这个通用类。
 */

.app-modal.hidden,
.reporter-modal.hidden,
.docx-preview-global-message.hidden,
.docx-preview-import-status.hidden,
.trend-tooltip.hidden,
.hidden {
  display: none !important;
}


/*
 * 数据加载、空月份和异常状态可能会使用合并单元格。
 * 保证提示文字不会继承普通数据列的固定高度。
 */

#tableBody .loading-cell {
  height: auto;
  min-height: 70px;
  padding: 28px !important;
  color: #667586;
  font-size: 14px;
  line-height: 1.65;
  font-weight: 400;
  text-align: center;
  white-space: normal;
}


/*
 * 管理员动态生成的删除按钮保持紧凑，
 * 避免通用红色按钮把操作列撑宽。
 */

td.action button.red {
  width: auto;
  min-width: 42px;
  height: 27px;
  padding: 3px 7px;
  font-size: 12px;
  line-height: 19px;
  white-space: nowrap;
}


/*
 * 表格编辑控件中的下拉框保持与文本框一致。
 */

td.topic select.edit-input {
  padding-right: 22px;
  text-align: center;
  text-align-last: center;
}


/*
 * 日期输入框在不同浏览器中避免出现额外内边距，
 * 保持与其他编辑控件相同高度。
 */

td.date input[type="date"].edit-input {
  padding-right: 3px;
  padding-left: 3px;
}


/*
 * 记者姓名输入提示列表由浏览器原生显示。
 * 对应输入框文字较长时保持省略显示。
 */

td.reporters input.edit-input {
  text-align: center;
}


/* =========================================================
   三十四、动态记者管理内容兼容
   ========================================================= */

.reporter-name-input,
.reporter-aliases-input,
.reporter-active-input,
.reporter-order-input {
  min-width: 0;
}

.reporter-active-input {
  padding-right: 24px;
  text-align: center;
  text-align-last: center;
}

.reporter-order-input {
  text-align: center;
}

.reporter-row-actions
button.green,
.reporter-row-actions
button.gray {
  box-shadow: none;
}

.reporter-row-actions
button.green:hover {
  box-shadow:
    0 1px 4px rgba(46, 139, 87, 0.18);
}


/* =========================================================
   三十五、交互焦点和可操作状态
   ========================================================= */

/*
 * 鼠标点击时保持现有外观；
 * 使用键盘Tab导航时显示清晰焦点框。
 */

button:focus-visible,
input:focus-visible,
select:focus-visible,
[role="button"]:focus-visible {
  outline: 2px solid #5b9bd5;
  outline-offset: 2px;
}

header button:focus-visible,
.header-feature-btn:focus-visible {
  outline-color: #fff;
  outline-offset: 3px;
}

button.gray:focus-visible {
  outline-color: #4f86b3;
}

button.red:focus-visible {
  outline-color: #c0392b;
}

button.green:focus-visible {
  outline-color: #2e8b57;
}


/*
 * 只在浏览器支持focus-visible时，
 * 移除普通鼠标点击后可能出现的默认黑色边框。
 */

@supports selector(:focus-visible) {

  button:focus:not(:focus-visible),
  input:focus:not(:focus-visible),
  select:focus:not(:focus-visible),
  [role="button"]:focus:not(:focus-visible) {
    outline: none;
  }
}


/* =========================================================
   三十六、浏览器兼容性补充
   ========================================================= */

/*
 * color-mix用于稿分占比条的淡雅颜色。
 * 不支持color-mix的旧浏览器会使用前一条
 * background后备颜色，不影响功能。
 */


/*
 * 如果浏览器不支持毛玻璃效果，
 * 仍使用足够清晰的半透明背景。
 */

@supports not (
  backdrop-filter: blur(2px)
) {

  .app-modal-mask,
  .reporter-modal-mask {
    background: rgba(20, 38, 55, 0.68);
  }

  .header-feature-btn {
    background:
      linear-gradient(
        145deg,
        rgba(255, 255, 255, 0.25),
        rgba(255, 255, 255, 0.13)
      );
  }
}


/*
 * 滚动条配色只影响外观。
 * 不支持相关属性的浏览器会使用系统默认滚动条。
 */

.app-modal-box,
.reporter-modal-box,
.reporter-manage-list {
  scrollbar-width: thin;
  scrollbar-color: #b8c9d7 #eef3f7;
}

.app-modal-box::-webkit-scrollbar,
.reporter-modal-box::-webkit-scrollbar,
.reporter-manage-list::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}

.app-modal-box::-webkit-scrollbar-track,
.reporter-modal-box::-webkit-scrollbar-track,
.reporter-manage-list::-webkit-scrollbar-track {
  border-radius: 999px;
  background: #eef3f7;
}

.app-modal-box::-webkit-scrollbar-thumb,
.reporter-modal-box::-webkit-scrollbar-thumb,
.reporter-manage-list::-webkit-scrollbar-thumb {
  border: 2px solid #eef3f7;
  border-radius: 999px;
  background: #b7c8d6;
}

.app-modal-box::-webkit-scrollbar-thumb:hover,
.reporter-modal-box::-webkit-scrollbar-thumb:hover,
.reporter-manage-list::-webkit-scrollbar-thumb:hover {
  background: #95acbe;
}


/* =========================================================
   三十七、窗口高度特别小时的保险规则
   ========================================================= */

@media (max-height: 680px) {

  .app-modal,
  .reporter-modal {
    align-items: flex-start;
    padding-top: 10px;
    padding-bottom: 10px;
    overflow-y: auto;
    box-sizing: border-box;
  }

  .app-modal-box,
  .reporter-modal-box {
    max-height: none;
  }


  .trend-modal-box {
    max-height: none;
  }

  .trend-chart-shell {
    height: 410px;
  }

  .reporter-manage-list {
    max-height: 260px;
  }

  .docx-preview-modal-box {
    max-height: none;
  }

  .docx-preview-file-list {
    max-height: 360px;
  }
}


/* =========================================================
   三十八、打印保护
   ========================================================= */

/*
 * 网站主要用于电脑浏览器查看。
 * 如果误触浏览器打印，隐藏管理员操作、弹窗和顶栏按钮，
 * 避免把操作界面打印进稿件表。
 */

@media print {

  html,
  body {
    min-width: 0;
    overflow: visible;
    background: #fff;
  }

  header {
    min-width: 0;
    height: auto;
    padding: 12px 0;
    background: #fff;
    color: #000;
    box-shadow: none;
  }

  .header-inner {
    display: block;
    width: auto;
    max-width: none;
    height: auto;
  }

  header h1 {
    position: static;
    color: #000;
    text-align: center;
    text-shadow: none;
  }

  .header-quick-actions,
  .header-auth-panel,
  .page-admin-panel,
  .data-update-footer,
  .app-modal,
  .reporter-modal,
  #siteGate {
    display: none !important;
  }

  main {
    width: auto;
    max-width: none;
    padding: 0;
  }

  .table-stage,
  body.viewer-mode .table-stage,
  body.admin-mode .table-stage,
  .table-wrap,
  .table-stage .table-wrap,
  body.viewer-mode .table-stage .table-wrap,
  body.admin-mode .table-stage .table-wrap {
    width: 100%;
    min-width: 0;
    max-width: none;
    margin: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  table,
  body.viewer-mode table,
  body.admin-mode table {
    width: 100%;
    min-width: 0;
  }

  thead th {
    position: static;
  }

  tr.date-group-a td,
  tr.date-group-b td,
  td.topic.topic-yes {
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }
}

/* =========================================================
   稿分统计弹窗四宫格与饼状图
   ========================================================= */

.score-stats-modal-box {
  width: 1440px;
  min-width: 0;
  max-width: calc(100vw - 44px);
  max-height: calc(100vh - 44px);
  padding: 18px 20px 16px;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
}


.score-stats-modal-content {
  min-width: 0;
}


.stats-dashboard-card {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 0;
  padding: 14px;
  overflow: hidden;
  flex-direction: column;
  box-sizing: border-box;
  border: 1px solid #d7e4ef;
  border-radius: 11px;
  background:
    radial-gradient(
      circle at 8% 0%,
      rgba(91, 155, 213, 0.08),
      transparent 32%
    ),
    linear-gradient(
      180deg,
      #ffffff 0%,
      #f7fafe 100%
    );
  box-shadow:
    0 2px 8px rgba(31, 78, 121, 0.055),
    inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.stats-dashboard-card::before {
  position: absolute;
  top: 0;
  left: 17px;
  width: 125px;
  height: 2px;
  border-radius: 0 0 999px 999px;
  background:
    linear-gradient(
      90deg,
      rgba(40, 120, 199, 0.64),
      rgba(21, 154, 156, 0.30),
      transparent
    );
  content: "";
  pointer-events: none;
}

.stats-dashboard-card-header {
  display: flex;
  flex: 0 0 auto;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
  margin-bottom: 11px;
  padding: 1px 1px 9px;
  border-bottom: 1px solid #e3ebf2;
}

.stats-dashboard-card-title {
  display: block;
  color: #1f4e79;
  font-size: 16px;
  line-height: 1.35;
  font-weight: 800;
}

.stats-dashboard-card-description {
  margin-top: 3px;
  color: #7a8997;
  font-size: 12px;
  line-height: 1.45;
  font-weight: 400;
}

.stats-dashboard-card-description
.small {
  margin-left: 3px;
  color: #647586;
  font-size: inherit;
}

.stats-dashboard-card-body {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
}


/* 左上：基础稿分柱状图 */

.score-stats-modal
.summary-left {
  width: 100%;
  min-width: 0;
  height: 100%;
}

.score-stats-modal
.summary-left
.score-summary {
  width: 100%;
  height: 100%;
  min-width: 0;
}


.score-stats-modal
.stats-score-card
.stats-dashboard-card-body {
  min-height: 0;
}


/* 右上：基础稿分饼状图 */

.score-stats-modal
.score-share-card {
  margin: 0;
  padding: 14px;
  overflow: hidden;
  border-color: #d7e4ef;
  border-radius: 11px;
  background:
    radial-gradient(
      circle at 8% 0%,
      rgba(91, 155, 213, 0.08),
      transparent 32%
    ),
    linear-gradient(
      180deg,
      #ffffff 0%,
      #f7fafe 100%
    );
  box-shadow:
    0 2px 8px rgba(31, 78, 121, 0.055),
    inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.score-stats-modal
.score-share-card::before {
  left: 17px;
  width: 125px;
  height: 2px;
  background:
    linear-gradient(
      90deg,
      rgba(40, 120, 199, 0.64),
      rgba(21, 154, 156, 0.30),
      transparent
    );
}

.score-stats-modal
.score-share-header {
  display: flex;
  margin: 0 0 11px;
}

.score-share-card-total {
  flex: 0 0 auto;
  color: #718294;
  font-size: 12px;
  line-height: 1.45;
  text-align: right;
  white-space: nowrap;
}

.score-share-card-total
strong {
  display: block;
  color: #1f4e79;
  font-size: 15px;
  font-weight: 800;
}

.score-stats-modal
.score-share-total-number {
  margin: 0 1px;
  font-size: 18px;
  font-weight: 900;
}

.score-stats-modal
.score-share-caption {
  margin-top: 3px;
  color: #7a8997;
  font-size: 12px;
  line-height: 1.45;
  white-space: normal;
}

.score-stats-modal
.score-share-content {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
}

.score-pie-layout {
  display: grid;
  grid-template-columns:
    minmax(190px, 1fr)
    160px;
  align-items: center;
  gap: 16px;
  width: 100%;
  min-width: 0;
  min-height: 0;
}


.score-pie-chart-wrap {
  position: relative;
  width: 218px;
  max-width: 100%;
  aspect-ratio: 1 / 1;
  margin: 0 auto;
}

.score-pie-chart {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.score-pie-track {
  fill: none;
  stroke: #e8eef4;
  stroke-width: 31;
}

.score-pie-segment {
  fill: none;
  stroke-width: 31;
  stroke-linecap: butt;
  cursor: help;
  outline: none;
  transition:
    filter 0.16s ease,
    stroke-width 0.16s ease,
    opacity 0.16s ease;
}

.score-pie-segment:hover,
.score-pie-segment:focus {
  stroke-width: 35;
  filter:
    brightness(1.08)
    saturate(1.08);
}

.score-pie-legend {
  min-width: 0;
  max-height: 235px;
  padding-right: 3px;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
  scrollbar-width: thin;
  scrollbar-color: #b9cadb transparent;
}

.score-pie-legend::-webkit-scrollbar {
  width: 6px;
}

.score-pie-legend::-webkit-scrollbar-track {
  background: transparent;
}

.score-pie-legend::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #b9cadb;
}

.score-pie-legend-head,
.score-pie-legend-item {
  display: grid;
  grid-template-columns:
    11px
    62px
    55px;
  align-items: center;
  justify-content: center;
  column-gap: 7px;
  min-width: 0;
}


.score-pie-legend-head {
  margin-bottom: 3px;
  padding: 0 7px 5px;
  border-bottom: 1px solid #e5ecf2;
  color: #8a97a2;
  font-size: 11px;
  line-height: 1.3;
}

.score-pie-legend-head
span:nth-child(3),
.score-pie-legend-head
span:nth-child(4) {
  text-align: right;
}

.score-pie-legend-item {
  min-height: 31px;
  padding: 3px 7px;
  box-sizing: border-box;
  border-bottom: 1px solid rgba(226, 234, 241, 0.76);
  color: #435565;
  font-size: 12px;
  line-height: 1.35;
}

.score-pie-legend-item:last-child {
  border-bottom: 0;
}

.score-pie-legend-item:hover {
  border-radius: 6px;
  background: rgba(232, 242, 251, 0.72);
}

.score-pie-legend-item.is-zero {
  opacity: 0.48;
}

.score-pie-legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--share-color);
  box-shadow:
    0 0 0 2px rgba(255, 255, 255, 0.95),
    0 0 0 3px rgba(112, 137, 157, 0.16);
}

.score-pie-legend-name {
  min-width: 0;
  overflow: hidden;
  color: #314b61;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}


.score-pie-legend-percent {
  color: #d35400;
  font-weight: 800;
  text-align: right;
  white-space: nowrap;
}

.score-pie-layout.is-empty
.score-pie-track {
  stroke: #dfe7ee;
}

.score-stats-modal
.score-share-empty {
  width: 100%;
  min-height: 220px;
  border-radius: 8px;
  font-size: 13px;
}


/* 左下：累计稿分走势图 */


/* 右下：月份进度与预测 */

.score-stats-modal
.stats-progress-card {
  overflow: hidden;
}

.score-stats-modal
.stats-progress-body,
.score-stats-modal
.summary-progress {
  flex: 1 1 auto;
  min-height: 0;
  padding: 7px 17px 5px;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.score-stats-modal
.summary-progress
.progress-title {
  margin: 2px 0 17px;
}

.score-stats-modal
.summary-progress
.progress-title
strong {
  font-size: 17px;
}


.score-stats-modal
#monthProgressDesc {
  margin: 19px auto 0;
  font-size: 15px;
}


/* 统计弹窗页脚 */

.score-stats-modal-footer {
  margin-top: 14px;
  padding-top: 11px;
}


/* 窄窗口保持桌面尺寸并允许外层横向滚动 */

@media (max-width: 1440px) {

  .score-stats-modal {
    align-items: flex-start;
    justify-content: flex-start;
    overflow: auto;
  }

  .score-stats-modal-box {
    width: 1400px;
    min-width: 1400px;
    max-width: none;
    max-height: none;
  }
}


/* 高度不足时保持图表可读性，由弹窗内部滚动 */

@media (max-height: 820px) {

  .score-stats-modal {
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .score-stats-modal-box {
    max-height: calc(100vh - 28px);
    padding-top: 14px;
    padding-bottom: 13px;
  }

  .score-stats-modal-header {
    margin-bottom: 10px;
    padding-bottom: 9px;
  }

  .score-stats-modal-footer {
    margin-top: 11px;
    padding-top: 9px;
  }
}

@media (max-height: 680px) {

  .score-stats-modal {
    padding-top: 10px;
    padding-bottom: 10px;
    overflow: auto;
  }

  .score-stats-modal-box {
    max-height: none;
  }
}
/* =========================================================
   稿分统计弹窗第二次视觉优化
   ========================================================= */


/* 一、放大左上稿分警戒线区域 */

.score-stats-modal
.summary-safety-line {
  flex: 0 0 170px;
  min-width: 170px;
  margin-left: 34px;
  padding: 12px 16px;
  border: 1px solid #c2d8ef;
  border-radius: 10px;
  background: #eef4fb;
  box-shadow: 0 2px 8px rgba(31, 78, 121, 0.09);
  color: #1f4e79;
  font-size: 16px;
  line-height: 1.8;
  font-weight: 800;
  text-align: left;
}


.score-stats-modal
.summary-safety-line strong {
  color: #d35400;
  font-size: 25px;
  line-height: 1.25;
  font-weight: 900;
}

.score-stats-modal
.summary-safety-line
.safety-help-icon {
  width: 19px;
  height: 19px;
  margin: 0 5px;
  font-size: 12px;
  line-height: 17px;
}


/* 二、放大右上环形饼图 */

.score-stats-modal
.score-pie-layout {
  grid-template-columns:
    minmax(270px, 1fr)
    210px;
  gap: 15px;
}


.score-stats-modal
.score-pie-track,
.score-stats-modal
.score-pie-segment {
  stroke-width: 36;
}

.score-stats-modal
.score-pie-segment:hover,
.score-stats-modal
.score-pie-segment:focus {
  stroke-width: 40;
}


/* 三、记者图例只保留姓名和占比 */

.score-pie-legend-head,
.score-stats-modal
.score-pie-legend-item {
  grid-template-columns:
    12px
    92px
    70px;
}


.score-stats-modal
.score-pie-legend-item {
  padding: 5px 7px;
  font-size: 14px;
}

.score-stats-modal
.score-pie-legend-head {
  padding: 0 7px 6px;
  font-size: 12px;
}

.score-stats-modal
.score-pie-legend-name {
  font-size: 14px;
  font-weight: 800;
}

.score-stats-modal
.score-pie-legend-percent {
  font-size: 14px;
  font-weight: 900;
}


/*
 * 由于“稿分”列已经删除，
 * 防止旧规则对不存在的稿分列造成视觉影响。
 */


/* 四、放大右下月份进度的文字内容 */

.score-stats-modal
#monthProgressDesc {
  margin: 25px auto 0;
  font-size: 18px;
  font-weight: 800;
}


/* 五、月份进度标题也适度放大 */

.score-stats-modal
.summary-progress
.progress-title {
  margin-top: 5px;
  margin-bottom: 20px;
}

.score-stats-modal
.summary-progress
.progress-title
strong {
  font-size: 19px;
}

.score-stats-modal
.summary-progress
.progress-title
.small {
  color: #536b80;
  font-size: 16px;
  font-weight: 800;
}


/* 六、取消底部“完成”按钮后，页脚只保留说明文字 */

.score-stats-modal-footer {
  justify-content: flex-start;
}

.score-stats-modal-footer
.modal-status-text {
  font-size: 13px;
}
/* =========================================================
   本月基础稿分构成视觉升级
   ========================================================= */


/* 一、重新分配饼图与图例的空间 */

.score-stats-modal
.score-pie-layout {
  grid-template-columns:
    minmax(320px, 1fr)
    230px;
  align-items: center;
  column-gap: 22px;
}


.score-stats-modal
.score-pie-chart-wrap {
  width: 318px;
  max-width: 100%;
  isolation: isolate;
}

.score-stats-modal
.score-pie-chart-wrap::before {
  display: none;
  content: none;
}


.score-stats-modal
.score-pie-chart {
  animation:
    scorePieChartEnter
    0.46s
    ease-out
    both;
}


/* 二、环形图的背景层次 */


.score-stats-modal
.score-pie-track {
  fill: none;
  stroke-width: 37;
}


/* 三、渐变分段环形图 */

.score-stats-modal
.score-pie-segment {
  fill: none;
  stroke-width: 37;
  stroke-linecap: butt;
  cursor: help;
  outline: none;
  transition:
    opacity 0.20s ease,
    filter 0.20s ease,
    stroke-width 0.20s ease;
}

.score-stats-modal
.score-pie-segment:hover,
.score-stats-modal
.score-pie-segment:focus,
.score-stats-modal
.score-pie-segment.is-active {
  stroke-width: 42;
}


/* 五、图例整体向右移动并按降序自然展示 */

.score-stats-modal
.score-pie-legend {
  align-self: center;
  max-height: none;
  padding: 0 0 0 34px;
  overflow: visible;
  box-sizing: border-box;
  scrollbar-width: auto;
}

.score-stats-modal
.score-pie-legend::-webkit-scrollbar {
  display: none;
}

.score-pie-legend-head,
.score-stats-modal
.score-pie-legend-item {
  grid-template-columns:
    13px
    108px
    72px;
  justify-content: center;
  column-gap: 11px;
}


.score-stats-modal
.score-pie-legend-head {
  min-height: 29px;
  margin-bottom: 4px;
  padding: 0 9px 7px;
  border-bottom:
    1px solid
    rgba(205, 220, 232, 0.86);
  color: #8595a3;
  font-size: 12px;
}

.score-stats-modal
.score-pie-legend-head
span:nth-child(3) {
  text-align: right;
}

.score-stats-modal
.score-pie-legend-item {
  position: relative;
  min-height: 39px;
  padding: 5px 9px;
  border-bottom:
    1px solid
    rgba(224, 233, 241, 0.78);
  border-radius: 7px;
  font-size: 14px;
  line-height: 1.4;
  outline: none;
  cursor: default;
  transition:
    opacity 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease;
}

.score-stats-modal
.score-pie-legend-item:hover,
.score-stats-modal
.score-pie-legend-item:focus,
.score-stats-modal
.score-pie-legend-item.is-active {
  background:
    linear-gradient(
      90deg,
      rgba(226, 239, 250, 0.88),
      rgba(246, 250, 253, 0.72)
    );
  box-shadow:
    inset 3px 0 0 var(--share-color);
  transform: translateX(3px);
}

.score-stats-modal
.score-pie-layout.has-active-share
.score-pie-legend-item:not(.is-active) {
  opacity: 0.52;
}

.score-stats-modal
.score-pie-legend-item.is-zero {
  opacity: 0.46;
}

.score-stats-modal
.score-pie-legend-dot {
  width: 11px;
  height: 11px;
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.48),
      transparent 46%
    ),
    var(--share-color);
  box-shadow:
    0 0 0 2px rgba(255, 255, 255, 0.96),
    0 0 0 3px rgba(94, 122, 145, 0.17),
    0 2px 4px rgba(40, 71, 98, 0.14);
}

.score-stats-modal
.score-pie-legend-name {
  color: #294b67;
  font-size: 15px;
  font-weight: 800;
}

.score-stats-modal
.score-pie-legend-percent {
  color: #d35400;
  font-size: 15px;
  font-weight: 900;
  text-align: right;
}


/* 七、轻微进入动画 */

@keyframes scorePieChartEnter {

  from {
    opacity: 0;
    transform:
      scale(0.96)
      rotate(-2deg);
  }

  to {
    opacity: 1;
    transform:
      scale(1)
      rotate(0);
  }
}


/* 八、尊重系统的减少动画设置 */

@media (prefers-reduced-motion: reduce) {

  .score-stats-modal
  .score-pie-chart {
    animation: none;
  }

  .score-stats-modal
  .score-pie-segment,
  .score-stats-modal
  .score-pie-legend-item {
    transition: none;
  }
}
/* =========================================================
   本月基础稿分总计日期说明
   ========================================================= */

.score-stats-modal
.score-share-card-total {
  display: flex;
  max-width: 310px;
  align-items: flex-end;
  flex-direction: column;
  color: #667b8e;
  font-size: 13px;
  line-height: 1.55;
  text-align: right;
  white-space: normal;
}

.score-stats-modal
.score-share-latest-date {
  display: block;
  color: #63798c;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}

.score-stats-modal
.score-share-total-summary {
  display: block;
  color: #526b80;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}

.score-stats-modal
.score-share-card-total
.score-share-total-summary
strong {
  display: inline;
  margin-left: 3px;
  color: #d35400;
  font-size: 17px;
  line-height: inherit;
  font-weight: 900;
  white-space: nowrap;
}

.score-stats-modal
.score-share-total-number {
  margin: 0 1px;
  color: #d35400;
  font-size: 19px;
  font-weight: 900;
}


/* =========================================================
   自主选题标记
   ========================================================= */

/*
 * 日期单元格作为自主选题标记的定位基准。
 */
td.date {
  position: relative;
}

/*
 * 普通访客看到的✅。
 * 标记向日期列左侧伸出，不占用原表格列宽。
 */
.self-selected-marker {
  position: absolute;
  top: 50%;
  left: -31px;
  z-index: 9;
  display: block;
  width: 27px;
  height: 26px;
  padding: 0;
  overflow: visible;
  font-family:
    "Segoe UI Emoji",
    "Apple Color Emoji",
    "Noto Color Emoji",
    sans-serif;
  font-size: 17px;
  line-height: 26px;
  text-align: center;
  white-space: nowrap;
  transform: translateY(-50%);
}

/*
 * 管理员使用的自主选题开关。
 */
.self-selected-toggle {
  position: absolute;
  top: 50%;
  left: 4px;
  z-index: 10;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: #75889a;
  font-family:
    "Segoe UI Emoji",
    "Apple Color Emoji",
    "Noto Color Emoji",
    sans-serif;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  transform: translateY(-50%);
}

.self-selected-toggle:hover {
  border-color: #7aaed7;
  background: rgba(255, 255, 255, 0.88);
}

.self-selected-toggle.is-checked {
  color: #27864c;
  background: rgba(232, 247, 237, 0.9);
}

.self-selected-toggle:focus-visible {
  border-color: #1f78c1;
  outline: 2px solid #1f78c1;
  outline-offset: 1px;
}

/*
 * 管理员日期输入框左边留出标记位置，
 * 防止标记遮住日期。
 */
body.admin-mode td.date .edit-input {
  width: calc(100% - 29px);
  margin-left: 29px;
}


/* =========================================================
   自主选题数统计
   ========================================================= */

/*
 * 原柱状图区略微缩短，为新增的统计行留出空间。
 */
.summary-topic-label-bar-spacer,
.summary-bar-wrap {
  height: 168px;
}

/*
 * 左侧统计标签稍微加宽。
 */
.summary-topic-label-item {
  flex-basis: 82px;
  width: 82px;
  padding-left: 4px;
}

/*
 * 已播新闻数左侧文字。
 */
.summary-news-item-label {
  order: 4;
  height: 22px;
  margin-top: 7px;
  color: #1f4e79;
  font-size: 13px;
  line-height: 22px;
  font-weight: 800;
  white-space: nowrap;
}

/*
 * 每名记者的已播新闻数量。
 */
.summary-news-item-number {
  order: 4;
  min-width: 25px;
  height: 22px;
  margin-top: 7px;
  padding: 0 5px;
  box-sizing: border-box;
  border-radius: 999px;
  background: #e8f0fa;
  color: #1f4e79;
  font-size: 16px;
  line-height: 22px;
  font-weight: 900;
  text-align: center;
}

/*
 * 自主选题数左侧文字。
 */
.summary-self-selected-label {
  order: 6;
  height: 22px;
  margin-top: 5px;
  color: #287b4c;
  font-size: 13px;
  line-height: 22px;
  font-weight: 800;
  white-space: nowrap;
}

/*
 * 每名记者的自主选题数量。
 */
.summary-self-selected-number {
  order: 6;
  min-width: 25px;
  height: 22px;
  margin-top: 5px;
  padding: 0 5px;
  box-sizing: border-box;
  border-radius: 999px;
  background: #e8f7ed;
  color: #237a46;
  font-size: 16px;
  line-height: 22px;
  font-weight: 900;
  text-align: center;
}

/*
 * 自主选题占比左侧文字。
 */
.summary-self-selected-rate-label {
  order: 7;
  height: 22px;
  margin-top: 5px;
  color: #287b4c;
  font-size: 13px;
  line-height: 22px;
  font-weight: 800;
  white-space: nowrap;
}

/*
 * 每名记者的自主选题占比。
 */
.summary-self-selected-rate-number {
  order: 7;
  min-width: 25px;
  height: 22px;
  margin-top: 5px;
  padding: 0 5px;
  box-sizing: border-box;
  border-radius: 999px;
  background: #eef7f1;
  color: #2f7d55;
  font-size: 14px;
  line-height: 22px;
  font-weight: 900;
  text-align: center;
}


/* =========================================================
   打印自主选题标记
   ========================================================= */

@media print {
  .self-selected-toggle {
    border: 0;
    background: transparent;
  }

  .self-selected-marker,
  .self-selected-toggle.is-checked,
  .summary-self-selected-number,
  .summary-self-selected-rate-number {
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }
}


/* =========================================================
   稿分统计弹窗：100%缩放下适配较矮窗口
   ========================================================= */

/*
 * 当前四宫格原高度为418px和380px。
 * 在常见的1366×768、1280×768等屏幕上，
 * 适当压缩卡片高度、弹窗留白和卡片间距，
 * 使统计内容尽量在100%缩放下完整显示。
 */
@media (max-height: 900px) and (min-height: 681px) {

  .score-stats-modal {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .score-stats-modal-box {
    max-height: calc(100vh - 20px);
    padding-top: 12px;
    padding-bottom: 10px;
    overflow-y: auto;
  }

  .score-stats-modal-header {
    margin-bottom: 8px;
    padding-bottom: 7px;
  }


  .stats-dashboard-card,
  .score-stats-modal
  .score-share-card {
    padding-top: 11px;
    padding-bottom: 11px;
  }

  .score-stats-modal-footer {
    margin-top: 7px;
    padding-top: 6px;
  }
}


/* =========================================================
   月份进度与播出预测升级
   ========================================================= */


/* 右下卡片的主体布局 */

.score-stats-modal
.stats-progress-body,
.score-stats-modal
.summary-progress {
  padding: 8px 16px 8px;
}


/* “本月时间进度”标题 */

.score-stats-modal
.summary-progress
.progress-title {
  flex: 0 0 auto;
  margin: 0 0 8px;
}

.score-stats-modal
.summary-progress
.progress-title
strong {
  font-size: 16px;
  font-weight: 800;
}


/* 加高后的月份时间进度条 */

.score-stats-modal
.month-progress-bar {
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid rgba(92, 125, 157, 0.16);
  border-radius: 999px;
  background:
    linear-gradient(
      180deg,
      #edf2f7 0%,
      #e5ebf2 100%
    );
  box-shadow:
    inset 0 2px 5px rgba(31, 78, 121, 0.09),
    0 1px 0 rgba(255, 255, 255, 0.9);
}

.score-stats-modal
.month-progress-fill {
  border-radius: inherit;
  background:
    linear-gradient(
      90deg,
      #67a5dc 0%,
      #438bd0 55%,
      #2876bf 100%
    );
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
  transition: width 0.35s ease;
}


/* 进度条内部的百分比 */

.score-stats-modal
.month-progress-text {
  font-size: 14px;
  font-weight: 900;
  transform: translate(-50%, -50%);
}


/* 统计内容外层 */

.score-stats-modal
#monthProgressDesc {
  margin: 9px 0 0;
  font-size: 12px;
  font-weight: 600;
}


/* “截至x月x日”区域 */


/* 统计表格外框 */


/* 统计表格 */


/* 表格四列的宽度 */


/* 表格单元格 */


/* 鼠标经过表格行时的效果 */


/* 表格内的重要数字 */


/* 预计剩余稿分所在行 */


/* 预测项目旁边的问号 */


/* 当前月份没有新闻时的提示 */


/* =========================================================
   月份统计区域横向溢出修正
   ========================================================= */


/*
 * 适当压缩进度区域，
 * 为下面的统计项目留出更多空间。
 */

.score-stats-modal
.stats-progress-body,
.score-stats-modal
.summary-progress {
  padding: 7px 15px 7px;
}

.score-stats-modal
.summary-progress
.progress-title {
  margin: 0 0 6px;
}

.score-stats-modal
.summary-progress
.progress-title
strong {
  font-size: 15px;
}


/*
 * 统计内容占满右下卡片宽度。
 */

.score-stats-modal
#monthProgressDesc {
  margin: 7px 0 0;
  overflow: visible;
}


/*
 * 截止日期。
 */


/*
 * 新统计网格。
 *
 * 普通项目分成左右两列，
 * 较长的预测项目单独占一整行。
 */


/*
 * 每一个统计项目。
 */


/*
 * 项目名称。
 */


/*
 * 项目数值。
 */


/*
 * 两个较长的预测项目占满整行。
 */


/*
 * 新网格中的问号按钮。
 */


/*
 * 隐藏上一版四列表格不会再使用，
 * 保留这条规则可以避免旧缓存短暂闪现。
 */


/* =========================================================
   月份进度及上月同期对比：单列现代布局
   ========================================================= */


/*
 * 适当增加四宫格第二行高度。
 *
 * 上面一行保持418px，
 * 下面一行增加到440px，
 * 使统计文字可以清晰、舒展地显示。
 */


/*
 * 右下角卡片主体。
 */

.score-stats-modal
.stats-progress-body,
.score-stats-modal
.summary-progress {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 100%;
  min-width: 0;
  padding: 8px 18px 12px;
  overflow: hidden;
  box-sizing: border-box;
}


/*
 * “本月时间进度”标题。
 */

.score-stats-modal
.summary-progress
.progress-title {
  flex: 0 0 auto;
  justify-content: center;
  margin: 0 0 8px;
}

.score-stats-modal
.summary-progress
.progress-title
strong {
  color: #244f78;
  font-size: 16px;
  line-height: 1.4;
  font-weight: 800;
  letter-spacing: 0.02em;
}


/*
 * 月份时间进度条。
 */

.score-stats-modal
.month-progress-bar {
  position: relative;
  flex: 0 0 auto;
  width: 100%;
  height: 29px;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid rgba(83, 119, 152, 0.18);
  border-radius: 999px;
  background:
    linear-gradient(
      180deg,
      #edf2f7 0%,
      #e4ebf2 100%
    );
  box-shadow:
    inset 0 2px 5px rgba(31, 78, 121, 0.10),
    0 1px 0 rgba(255, 255, 255, 0.92);
}

.score-stats-modal
.month-progress-fill {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background:
    linear-gradient(
      90deg,
      #70a9dc 0%,
      #4c91d2 52%,
      #327cc5 100%
    );
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.25);
  transition: width 0.35s ease;
}

.score-stats-modal
.month-progress-text {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  color: #ffffff;
  font-size: 14px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: 0.03em;
  text-shadow:
    0 1px 3px rgba(20, 55, 86, 0.85);
  transform: translate(-50%, -50%);
  pointer-events: none;
  white-space: nowrap;
}


/*
 * 统计内容总区域。
 */

.score-stats-modal
#monthProgressDesc {
  display: block;
  width: 100%;
  min-width: 0;
  margin: 10px 0 0;
  color: #294f73;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 600;
  text-align: left;
}

.score-stats-modal
#monthProgressDesc
div {
  white-space: normal;
}


/*
 * “截至7月27日，本月”。
 */


/*
 * 五项正式统计的外框。
 */


/*
 * 每一行统计数据。
 */


/*
 * 左侧当前月份数据。
 */


/*
 * 右侧“与上月同期相比”。
 */


.score-stats-modal
.month-stat-comparison-prefix {
  margin-right: 5px;
  color: #6b7c8d;
  font-weight: 650;
}


/*
 * 持平使用黑色。
 */

.score-stats-modal
.month-stat-comparison.is-unchanged {
  color: #27313a;
  font-size: 14px;
  font-weight: 900;
}


/*
 * 增加使用红色。
 */

.score-stats-modal
.month-stat-comparison.is-increase {
  color: #d63c32;
  font-size: 14px;
  font-weight: 900;
}


/*
 * 减少使用绿色。
 */

.score-stats-modal
.month-stat-comparison.is-decrease {
  color: #25834d;
  font-size: 14px;
  font-weight: 900;
}


/*
 * 上月同期读取失败。
 */

.score-stats-modal
.month-stat-comparison.is-unavailable {
  color: #8a97a3;
  font-size: 13px;
  font-weight: 700;
}


/*
 * 下面两项预测统计与上面五项明显分隔。
 */


/*
 * 每一个预测项目。
 */


/*
 * 第二个预测项目使用轻微暖色，
 * 与新闻数量预测加以区分。
 */


/*
 * 预测项目名称。
 */


/*
 * 预测项目数字。
 */


/*
 * 上月同期加载状态。
 */

.score-stats-modal
.month-stat-loading {
  display: flex;
  min-height: 225px;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border: 1px dashed #c8d9e8;
  border-radius: 9px;
  background: #f7fafd;
  color: #708395;
  font-size: 14px;
  font-weight: 700;
}


/*
 * 当前月份没有新闻时的提示。
 */

.score-stats-modal
.month-stat-empty {
  display: flex;
  min-height: 225px;
  align-items: center;
  justify-content: center;
  padding: 20px;
  box-sizing: border-box;
  border: 1px dashed #c8d9e8;
  border-radius: 9px;
  background: #f7fafd;
  color: #708395;
  font-size: 14px;
  line-height: 1.7;
  font-weight: 700;
  text-align: center;
}


/*
 * 较矮的电脑屏幕允许统计弹窗纵向滚动，
 * 不强行压缩文字。
 */

@media (max-height: 900px) {

  .score-stats-modal {
    align-items: flex-start;
    padding-top: 10px;
    padding-bottom: 10px;
    overflow-y: auto;
  }

  .score-stats-modal-box {
    max-height: none;
    overflow-y: visible;
  }

  
}


/* =========================================================
   全屏稿分统计中心
   版本：20260775
   历史版本标识（已纳入当前统一样式表）
   ========================================================= */


/* =========================================================
   一、统计中心整体
   ========================================================= */

.score-stats-modal {
  padding: 10px;
  overflow: auto;
}

.score-stats-modal
.score-stats-modal-box,
.score-stats-modal
.app-modal-box.score-stats-modal-box {
  display: flex;
  flex-direction: column;
  padding: 14px 18px 10px;
  overflow: hidden;
  border: 1px solid
    rgba(189, 205, 219, 0.85);
  border-radius: 14px;
  background:
    radial-gradient(
      circle at 3% 0%,
      rgba(73, 147, 209, 0.07),
      transparent 30%
    ),
    linear-gradient(
      180deg,
      #ffffff 0%,
      #f7fafd 100%
    );
  box-shadow:
    0 24px 75px
    rgba(12, 36, 57, 0.34);
}


/* =========================================================
   二、标题栏
   ========================================================= */

.score-stats-modal
.score-stats-modal-header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin: 0 0 9px;
  padding: 0 2px 9px;
  box-sizing: border-box;
  border-bottom: 1px solid #dbe5ee;
}

.score-stats-modal
.score-stats-modal-header
.app-modal-header-title {
  display: block;
  margin: 0;
  color: #1f4e79;
  font-size: 21px;
  line-height: 1.3;
  font-weight: 900;
  letter-spacing: 0.01em;
}

.score-stats-modal
.score-stats-modal-header
.app-modal-description {
  margin-top: 3px;
  color: #65798b;
  font-size: 13px;
  line-height: 1.4;
  font-weight: 500;
}

.score-stats-modal
.score-stats-modal-header
.app-modal-close {
  flex: 0 0 auto;
  min-width: 72px;
  height: 34px;
  padding: 0 17px;
  box-sizing: border-box;
  border-radius: 7px;
  font-size: 14px;
  line-height: 1;
  font-weight: 700;
}

.score-stats-modal
.score-stats-modal-header
.app-modal-close:hover {
  transform: none;
}


/* =========================================================
   三、四个二级页面按钮
   ========================================================= */

.score-stats-tabs {
  display: grid;
  flex: 0 0 auto;
  grid-template-columns:
    repeat(4, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  margin: 0 0 10px;
  padding: 0;
  box-sizing: border-box;
}

.score-stats-tab {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 0;
  padding: 0 16px;
  box-sizing: border-box;
  border: 1px solid #cad9e6;
  border-radius: 9px;
  background:
    linear-gradient(
      180deg,
      #ffffff 0%,
      #f1f6fa 100%
    );
  color: #42617c;
  font-family: inherit;
  font-size: 15px;
  line-height: 1;
  font-weight: 800;
  cursor: pointer;
  box-shadow:
    0 2px 7px
    rgba(31, 78, 121, 0.055);
  transition:
    border-color 0.16s ease,
    background 0.16s ease,
    color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}

.score-stats-tab:hover {
  border-color: #8eb6d9;
  background: #edf6fd;
  color: #1f5b8a;
  transform: translateY(-1px);
}

.score-stats-tab.is-active {
  border-color: #2878c7;
  background:
    linear-gradient(
      135deg,
      #377fc1 0%,
      #2066a5 100%
    );
  color: #ffffff;
  box-shadow:
    0 5px 14px
    rgba(37, 107, 170, 0.22);
}

.score-stats-tab:focus-visible {
  outline: 3px solid
    rgba(48, 129, 201, 0.25);
  outline-offset: 2px;
}

.score-stats-tab-index {
  display: inline-flex;
  flex: 0 0 27px;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  background: #e5eff7;
  color: #2d689d;
  font-size: 12px;
  line-height: 1;
  font-weight: 900;
}

.score-stats-tab.is-active
.score-stats-tab-index {
  background:
    rgba(255, 255, 255, 0.18);
  color: #ffffff;
}

.score-stats-tab-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}


/* =========================================================
   四、二级页面主体
   ========================================================= */

.score-stats-modal
.score-stats-modal-content {
  display: block;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

.score-stats-page {
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  box-sizing: border-box;
}

.score-stats-page[hidden] {
  display: none !important;
}


/* =========================================================
   五、全尺寸统计卡片
   ========================================================= */

.score-stats-modal
.score-stats-full-card {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 14px 17px;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid #cfdeea;
  border-radius: 12px;
  background:
    radial-gradient(
      circle at 0% 0%,
      rgba(71, 143, 203, 0.065),
      transparent 32%
    ),
    linear-gradient(
      180deg,
      #ffffff 0%,
      #fbfdff 100%
    );
  box-shadow:
    0 5px 18px
    rgba(31, 78, 121, 0.07);
}

.score-stats-modal
.score-stats-full-card::before {
  position: absolute;
  top: 0;
  left: 18px;
  width: 150px;
  height: 2px;
  border-radius: 999px;
  background:
    linear-gradient(
      90deg,
      #3988cc,
      rgba(57, 136, 204, 0)
    );
  content: "";
}

.score-stats-modal
.score-stats-full-card
.stats-dashboard-card-header {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 10px;
  padding: 0 0 9px;
  box-sizing: border-box;
  border-bottom: 1px solid #dce7f0;
}

.score-stats-modal
.score-stats-full-card
.stats-dashboard-card-title {
  color: #234f76;
  font-size: 19px;
  line-height: 1.35;
  font-weight: 900;
}

.score-stats-modal
.score-stats-full-card
.stats-dashboard-card-description {
  margin-top: 3px;
  color: #697d8f;
  font-size: 13px;
  line-height: 1.4;
}


/* =========================================================
   六、记者稿分统计页面
   ========================================================= */

.score-stats-reporters-body {
  display: flex;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  min-height: 0;
}

.score-stats-reporters-page
.summary-left {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
}

.score-stats-reporters-page
.summary-left
.score-summary,
.score-stats-reporters-page
.score-summary {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  padding: 20px 32px 16px;
  overflow-x: auto;
  overflow-y: hidden;
  box-sizing: border-box;
  border: 1px solid #d7e4f2;
  border-radius: 10px;
  background:
    linear-gradient(
      180deg,
      #ffffff 0%,
      #f4f9fd 100%
    );
}

.score-stats-reporters-page
.summary-bar-item {
  flex-basis: 82px;
}

.score-stats-reporters-page
.summary-topic-label-item {
  flex-basis: 105px;
}

.score-stats-reporters-page
.summary-safety-line {
  flex: 0 0 230px;
  margin-left: 48px;
  padding: 18px 21px;
  box-sizing: border-box;
  border: 1px solid #bed5ea;
  border-radius: 11px;
  background:
    linear-gradient(
      145deg,
      #eef6fd 0%,
      #ffffff 100%
    );
  color: #244f76;
  font-size: 18px;
  font-weight: 800;
  box-shadow:
    0 5px 16px
    rgba(31, 78, 121, 0.10);
}

.score-stats-reporters-page
.summary-safety-line
strong {
  color: #d35400;
  font-size: 25px;
  font-weight: 900;
}


/* =========================================================
   七、本月稿分构成页面
   ========================================================= */

.score-stats-share-page
.score-share-card {
  overflow: hidden;
}

.score-stats-share-page
.score-share-header {
  flex: 0 0 auto;
}

.score-stats-share-page
.score-share-card-total {
  font-size: 14px;
}

.score-stats-share-page
.score-share-card-total
strong {
  font-size: 18px;
}

.score-stats-share-page
.score-share-total-number {
  font-size: 24px;
  font-weight: 900;
}

.score-stats-share-page
.score-share-content {
  flex: 1 1 auto;
  padding: 8px 45px 14px;
}

.score-stats-share-page
.score-pie-layout {
  grid-template-columns:
    minmax(430px, 1fr)
    minmax(390px, 0.8fr);
  gap: 70px;
  min-height: 0;
}

.score-stats-share-page
.score-pie-legend {
  font-size: 15px;
}

.score-stats-share-page
.score-pie-legend-item {
  padding: 8px 5px;
}


/* =========================================================
   八、完整累计稿分走势页面
   ========================================================= */

.score-stats-trend-mount {
  flex: 1 1 auto;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
}


.score-stats-trend-mount
.trend-chart-status {
  font-size: 14px;
}

.score-stats-trend-mount
.trend-show-all-btn {
  min-width: 86px;
  height: 30px;
}

.score-stats-trend-mount
.trend-legend {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  flex-wrap: wrap;
  margin: 0 0 8px;
  padding: 5px 8px;
  box-sizing: border-box;
}

.score-stats-trend-mount
.trend-chart-shell {
  position: relative;
  flex: 1 1 auto;
  margin: 0;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid #d4e2ee;
  border-radius: 10px;
  background: #ffffff;
}


.score-stats-trend-mount
.app-modal-footer {
  flex: 0 0 auto;
  margin: 7px 0 0;
  padding: 7px 2px 0;
  border-top: 1px solid #e0e8ef;
}


/* =========================================================
   九、月度播出分析：主体和进度条
   ========================================================= */

.score-stats-progress-page
.score-stats-full-card {
  overflow: hidden;
}

.score-stats-progress-page
.stats-progress-body,
.score-stats-progress-page
.summary-progress {
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: flex-start;
  padding: 3px 70px 8px;
  overflow-y: auto;
}

.score-stats-progress-page
.progress-title {
  display: flex;
  flex: 0 0 auto;
  justify-content: center;
  margin: 0 0 8px;
}

.score-stats-progress-page
.progress-title
strong {
  color: #234f76;
  font-size: 17px;
  line-height: 1.4;
  font-weight: 900;
}

.score-stats-progress-page
.month-progress-bar {
  position: relative;
  flex: 0 0 auto;
  width: 100%;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid
    rgba(76, 111, 143, 0.18);
  border-radius: 999px;
  background:
    linear-gradient(
      180deg,
      #edf2f7 0%,
      #e3eaf1 100%
    );
  box-shadow:
    inset 0 2px 5px
      rgba(31, 78, 121, 0.10);
}

.score-stats-progress-page
.month-progress-fill {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  height: 100%;
  border-radius: inherit;
  background:
    linear-gradient(
      90deg,
      #70a9dc 0%,
      #4a90d1 52%,
      #317bc4 100%
    );
}

.score-stats-progress-page
.month-progress-text {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  color: #ffffff;
  font-size: 15px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: 0.02em;
  text-shadow:
    0 1px 3px
      rgba(18, 51, 81, 0.85);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.score-stats-progress-page
#monthProgressDesc {
  min-width: 0;
  margin: 12px 0 0;
  color: #294f73;
  font-size: 15px;
  line-height: 1.4;
  text-align: left;
}


/* =========================================================
   十、月度播出分析：截止日期和统计列表
   ========================================================= */


.score-stats-progress-page
.month-stat-comparison-prefix {
  margin-right: 6px;
  color: #687b8c;
  font-weight: 700;
}

.score-stats-progress-page
.month-stat-comparison {
  font-size: 16px;
  font-weight: 900;
}

.score-stats-progress-page
.month-stat-comparison.is-unchanged {
  color: #242b31;
}

.score-stats-progress-page
.month-stat-comparison.is-increase {
  color: #d23c32;
}

.score-stats-progress-page
.month-stat-comparison.is-decrease {
  color: #25834d;
}

.score-stats-progress-page
.month-stat-comparison.is-unavailable {
  color: #8794a0;
}


/* =========================================================
   十一、本月剩余天数和预测
   ========================================================= */


/* =========================================================
   十二、加载状态和无数据状态
   ========================================================= */

.score-stats-progress-page
.month-stat-loading,
.score-stats-progress-page
.month-stat-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  box-sizing: border-box;
  border: 1px dashed #c5d8e8;
  border-radius: 10px;
  background: #f6fafd;
  color: #6d8192;
  font-size: 15px;
  line-height: 1.7;
  font-weight: 700;
  text-align: center;
}


/* =========================================================
   十三、统计中心底部说明
   ========================================================= */

.score-stats-modal
.score-stats-modal-footer {
  flex: 0 0 auto;
  margin: 8px 0 0;
  padding: 7px 2px 0;
  box-sizing: border-box;
  border-top: 1px solid #e0e8ef;
}

.score-stats-modal
.score-stats-modal-footer
.modal-status-text {
  color: #738493;
  font-size: 12px;
  line-height: 1.4;
}


/* =========================================================
   十四、原完整走势图弹窗的空壳
   ========================================================= */

/*
 * 完整走势图已经由 app.js 移入统计中心第三页。
 * 原弹窗仍保留在HTML中，以维持现有元素和事件引用。
 * 这条规则避免空弹窗意外显示。
 */

.trend-modal:not(.hidden)
.trend-modal-box:empty {
  display: none;
}


/* =========================================================
   十五、较矮屏幕适配
   ========================================================= */

@media (max-height: 820px) {

  .score-stats-modal {
    align-items: flex-start;
    padding: 8px;
  }

  .score-stats-modal
  .score-stats-modal-box,
  .score-stats-modal
  .app-modal-box.score-stats-modal-box {
    width: calc(100vw - 16px);
    height: calc(100vh - 16px);
    min-height: 650px;
    padding:
      10px
      15px
      8px;
  }

  .score-stats-modal
  .score-stats-modal-header {
    min-height: 43px;
    margin-bottom: 7px;
    padding-bottom: 7px;
  }

  .score-stats-modal
  .score-stats-modal-header
  .app-modal-header-title {
    font-size: 18px;
  }

  .score-stats-modal
  .score-stats-modal-header
  .app-modal-description {
    font-size: 12px;
  }

  .score-stats-tabs {
    gap: 8px;
    margin-bottom: 8px;
  }

  .score-stats-tab {
    height: 40px;
    font-size: 14px;
  }

  .score-stats-tab-index {
    width: 24px;
    height: 24px;
    flex-basis: 24px;
  }

  .score-stats-modal
  .score-stats-full-card {
    padding:
      10px
      14px;
  }

  .score-stats-modal
  .score-stats-full-card
  .stats-dashboard-card-header {
    min-height: 38px;
    margin-bottom: 7px;
    padding-bottom: 6px;
  }

  .score-stats-modal
  .score-stats-full-card
  .stats-dashboard-card-title {
    font-size: 17px;
  }

  .score-stats-progress-page
  .stats-progress-body,
  .score-stats-progress-page
  .summary-progress {
    padding:
      1px
      45px
      5px;
  }


  .score-stats-modal
  .score-stats-modal-footer {
    margin-top: 5px;
    padding-top: 4px;
  }
}


/* =========================================================
   十六、非常矮的屏幕
   ========================================================= */

@media (max-height: 680px) {

  .score-stats-modal {
    align-items: flex-start;
    overflow: auto;
  }

  .score-stats-modal
  .score-stats-modal-box,
  .score-stats-modal
  .app-modal-box.score-stats-modal-box {
    height: 650px;
    min-height: 650px;
  }
}


/* =========================================================
   稿分统计中心：紧凑居中大弹窗修正
   版本：20260776
   ========================================================= */


/* =========================================================
   一、统计中心改为居中大弹窗
   ========================================================= */

.score-stats-modal {
  padding: 20px;
  overflow: auto;
  box-sizing: border-box;
}

.score-stats-modal
.score-stats-modal-box,
.score-stats-modal
.app-modal-box.score-stats-modal-box {
  padding: 15px 18px 11px;
  overflow: hidden;
  box-sizing: border-box;
  border-radius: 14px;
}


/* =========================================================
   二、适当压缩标题栏和标签栏
   ========================================================= */

.score-stats-modal
.score-stats-modal-header {
  margin-bottom: 8px;
  padding-bottom: 8px;
}


.score-stats-tabs {
  gap: 8px;
  margin-bottom: 9px;
}

.score-stats-tab {
  padding-right: 14px;
  padding-left: 14px;
  font-size: 14px;
}

.score-stats-tab-index {
  flex-basis: 25px;
  width: 25px;
  height: 25px;
}


/* =========================================================
   三、统计页面主体及通用卡片
   ========================================================= */

.score-stats-modal
.score-stats-modal-content {
  flex: 1 1 auto;
  min-height: 0;
}

.score-stats-modal
.score-stats-full-card {
  padding: 12px 14px;
}

.score-stats-modal
.score-stats-full-card
.stats-dashboard-card-header {
  margin-bottom: 8px;
  padding-bottom: 7px;
}

.score-stats-modal
.score-stats-full-card
.stats-dashboard-card-title {
  font-size: 17px;
}

.score-stats-modal
.score-stats-full-card
.stats-dashboard-card-description {
  margin-top: 2px;
  font-size: 12px;
}


/* =========================================================
   四、记者稿分统计页面
   ========================================================= */

/*
 * 图表不再撑满整个页面高度，
 * 而是在内容区域内垂直居中。
 */


.score-stats-reporters-page
.summary-left {
  display: flex;
  flex: 0 1 auto;
  width: 100%;
}

.score-stats-reporters-page
.summary-left
.score-summary,
.score-stats-reporters-page
.score-summary {
  flex: 0 0 auto;
  padding: 16px 22px 13px;
}


/*
 * 六名记者在缩小后的弹窗中均匀排列。
 */

.score-stats-reporters-page
.summary-bar-item {
  flex-basis: 68px;
}

.score-stats-reporters-page
.summary-topic-label-item {
  flex-basis: 92px;
}


/*
 * 右侧安全线说明保持清晰，
 * 但不再占用过大的横向空间。
 */

.score-stats-reporters-page
.summary-safety-line {
  flex: 0 0 195px;
  margin-left: 35px;
  padding: 15px 18px;
  font-size: 16px;
  line-height: 1.75;
}

.score-stats-reporters-page
.summary-safety-line
strong {
  font-size: 23px;
}


/* =========================================================
   五、本月稿分构成页面
   ========================================================= */

/*
 * 环形图和图例整体居中，
 * 不再使用全屏页面下的超大间距。
 */

.score-stats-share-page
.score-share-content {
  padding: 8px 28px 12px;
}

.score-stats-share-page
.score-pie-layout {
  grid-template-columns:
    360px
    330px;
  gap: 58px;
  margin: 0 auto;
}

.score-stats-share-page
.score-pie-legend {
  padding-left: 12px;
}

.score-stats-share-page
.score-pie-legend-head,
.score-stats-share-page
.score-pie-legend-item {
  grid-template-columns:
    13px
    120px
    76px;
}

.score-stats-share-page
.score-pie-legend-item {
  min-height: 38px;
}


/* =========================================================
   六、完整累计稿分走势页面
   ========================================================= */

/*
 * 第三个页面继续显示完整走势图，
 * 但尺寸适应居中大弹窗。
 */


.score-stats-trend-mount
.trend-legend {
  margin-bottom: 6px;
  padding: 3px 7px;
}


.score-stats-trend-mount
.app-modal-footer {
  margin-top: 5px;
  padding-top: 5px;
}


/* =========================================================
   七、月度播出分析页面
   ========================================================= */

/*
 * 分析内容限制在合适宽度并居中，
 * 避免进度条和表格横跨整个屏幕。
 */

.score-stats-progress-page
.stats-progress-body,
.score-stats-progress-page
.summary-progress {
  padding: 2px 35px 6px;
}


.score-stats-progress-page
.progress-title
strong {
  font-size: 16px;
}


.score-stats-progress-page
.month-progress-text {
  font-size: 14px;
}

.score-stats-progress-page
#monthProgressDesc {
  margin-top: 9px;
}


/*
 * 截止日期。
 */


/*
 * 五项统计。
 */


.score-stats-progress-page
.month-stat-comparison {
  font-size: 15px;
}


/*
 * 剩余天数及两项预测。
 */


/* =========================================================
   八、底部说明
   ========================================================= */

.score-stats-modal
.score-stats-modal-footer {
  margin-top: 6px;
  padding-top: 5px;
}

.score-stats-modal
.score-stats-modal-footer
.modal-status-text {
  font-size: 11px;
}


/* =========================================================
   九、屏幕高度不足时自适应
   ========================================================= */

@media (max-height: 730px) {

  .score-stats-modal {
    align-items: flex-start;
    padding: 10px;
  }

  .score-stats-modal
  .score-stats-modal-box,
  .score-stats-modal
  .app-modal-box.score-stats-modal-box {
    height: 650px;
    max-height: none;
    padding-top: 11px;
    padding-bottom: 8px;
  }

  .score-stats-reporters-page
  .summary-left
  .score-summary,
  .score-stats-reporters-page
  .score-summary {
    height: 370px;
    min-height: 370px;
    max-height: 370px;
  }


}


/* =========================================================
   稿分统计中心第三次布局优化
   版本：20260777

   主要调整：
   1. 增加统计中心垂直显示高度
   2. 增加记者柱状图有效高度
   3. 增加累计走势图有效高度
   4. 月度分析改为左右分栏
   5. 取消月度分析内部滚动条
   ========================================================= */


/* =========================================================
   一、增加整个统计中心的垂直高度
   ========================================================= */

.score-stats-modal {
  padding-top: 12px;
  padding-bottom: 12px;
}


/* =========================================================
   二、适度压缩外围区域
   把更多垂直空间留给二级页面内容
   ========================================================= */

.score-stats-modal
.score-stats-modal-header {
  margin-bottom: 7px;
  padding-bottom: 7px;
}


.score-stats-tabs {
  margin-bottom: 8px;
}


.score-stats-modal
.score-stats-full-card {
  padding: 11px 14px;
}

.score-stats-modal
.score-stats-full-card
.stats-dashboard-card-header {
  margin-bottom: 7px;
  padding-bottom: 6px;
}

.score-stats-modal
.score-stats-modal-footer {
  margin-top: 5px;
  padding-top: 4px;
}


/* =========================================================
   三、01记者稿分统计：增加柱状图有效高度
   ========================================================= */

.score-stats-reporters-body {
  align-items: center;
  justify-content: center;
}

.score-stats-reporters-page
.summary-left {
  align-items: center;
  justify-content: center;
  height: 100%;
}

.score-stats-reporters-page
.summary-left
.score-summary,
.score-stats-reporters-page
.score-summary {
  flex: 0 0 auto;
  align-items: flex-end;
  justify-content: center;
  padding: 15px 24px 13px;
  overflow-y: hidden;
}


/*
 * 柱状图主体原来约195px，
 * 现在增加到285px。
 */

.score-stats-reporters-page
.summary-bar-wrap {
  height: 285px;
}


/*
 * 左侧指标名称占位区域必须与柱体等高，
 * 否则三行统计名称会发生错位。
 */

.score-stats-reporters-page
.summary-topic-label-bar-spacer {
  height: 285px;
}


/*
 * 适当加宽记者之间的距离，
 * 让加高后的柱体看起来更舒展。
 */

.score-stats-reporters-page
.summary-bar-item {
  flex-basis: 72px;
}

.score-stats-reporters-page
.summary-topic-label-item {
  flex-basis: 100px;
  width: 100px;
}


/*
 * 稿分警戒线说明保持在右侧居中位置。
 */

.score-stats-reporters-page
.summary-safety-line {
  align-self: center;
  flex: 0 0 195px;
  min-width: 195px;
  margin-left: 38px;
}


/* =========================================================
   四、03累计稿分走势：增加图表垂直空间
   ========================================================= */


.score-stats-trend-mount
.trend-legend {
  margin-bottom: 6px;
}

.score-stats-trend-mount
.trend-chart-shell {
  flex: 1 1 auto;
}


.score-stats-trend-mount
.app-modal-footer {
  margin-top: 4px;
  padding-top: 4px;
}


/* =========================================================
   五、04月度播出分析：取消内部滚动条
   ========================================================= */

.score-stats-progress-page
.stats-progress-body,
.score-stats-progress-page
.summary-progress {
  flex-direction: column;
  padding: 2px 22px 5px;
  overflow: hidden;
}


/*
 * 标题和进度条仍然占据页面上方全部宽度。
 */


/* =========================================================
   六、04页面主体改成左右分栏
   ========================================================= */

/* 已移除：04页失效的左右分栏规则（DOM 已改为纵向 section 结构） */


/*
 * 左上：“截至7月27日，本月”。
 */


/*
 * 左下：五项正式统计。
 */


/*
 * 右侧：剩余天数和两项预测。
 * 从第一行一直延伸到第二行。
 */


/* =========================================================
   七、04页面左侧统计表变得紧凑
   ========================================================= */

/*
 * 当前数据和同期比较两列不再拉得过宽。
 */


/*
 * 当前月份数据。
 */


/*
 * 同期比较改为左对齐，
 * 不再贴在表格最右边。
 */


.score-stats-progress-page
.month-stat-comparison-prefix {
  margin-right: 6px;
}


/* =========================================================
   八、04页面右侧预测卡片
   ========================================================= */

/*
 * “本月还剩4天”。
 */


/*
 * 两项预测在右侧上下排列。
 */


/* =========================================================
   九、较矮屏幕适配
   ========================================================= */

@media (max-height: 740px) {

  .score-stats-modal {
    align-items: flex-start;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .score-stats-modal
  .score-stats-modal-box,
  .score-stats-modal
  .app-modal-box.score-stats-modal-box {
    height: 700px;
    max-height: calc(100vh - 16px);
  }

  .score-stats-reporters-page
  .summary-left
  .score-summary,
  .score-stats-reporters-page
  .score-summary {
    height: 425px;
    min-height: 425px;
    max-height: 425px;
  }

  .score-stats-reporters-page
  .summary-bar-wrap,
  .score-stats-reporters-page
  .summary-topic-label-bar-spacer {
    height: 260px;
  }

  .score-stats-trend-mount
  .trend-chart-shell {
    height: 400px;
    min-height: 400px;
  }
}


/* =========================================================
   稿分统计中心第四次布局优化
   版本：20260778

   主要调整：
   1. 修正记者柱状图目标线和警戒线布局
   2. 进一步增加二级页面垂直高度
   3. 确保累计走势图横坐标完整显示
   4. 缩窄月度分析的同期对比列
   5. 三个预测项目改为横向并列卡片
   ========================================================= */


/* =========================================================
   一、进一步增加统计中心垂直高度
   ========================================================= */


/*
 * 略微压缩统计中心外围区域，
 * 把增加的高度尽量留给二级页面。
 */

.score-stats-modal
.score-stats-modal-header {
  margin-bottom: 6px;
  padding-bottom: 6px;
}


.score-stats-modal
.score-stats-full-card {
  padding-top: 10px;
  padding-bottom: 10px;
}

.score-stats-modal
.score-stats-full-card
.stats-dashboard-card-header {
  min-height: 37px;
  margin-bottom: 6px;
  padding-bottom: 5px;
}

.score-stats-modal
.score-stats-modal-footer {
  margin-top: 4px;
  padding-top: 3px;
}


/* =========================================================
   二、01页面：柱状图与横线对齐
   ========================================================= */

/*
 * 柱状图继续使用放大后的高度。
 */

.score-stats-reporters-page
.summary-left
.score-summary,
.score-stats-reporters-page
.score-summary {
  width: 100%;
  padding-top: 14px;
  padding-bottom: 12px;
}


/*
 * 柱体和左侧刻度占位使用完全相同的高度。
 * “100分”文字、目标线和警戒线因而处在同一坐标系。
 */


/*
 * 记者柱体间距必须与app.js中的72一致。
 */

.score-stats-reporters-page
.summary-bar-item {
  flex: 0 0 72px;
  width: 72px;
}


/*
 * 目标线和警戒线的起点保持一致。
 */

.score-stats-reporters-page
.summary-shared-target-line,
.score-stats-reporters-page
.summary-shared-safety-line {
  left: -36px;
}


/*
 * 100分文字垂直居中对准目标线。
 */

.score-stats-reporters-page
.summary-target-label {
  line-height: 1;
  transform: translateY(50%);
}


/*
 * 警戒线文字固定显示在虚线右端，
 * 避免和柱体数据重叠。
 */

.score-stats-reporters-page
.summary-safety-label-text {
  right: 0;
  transform:
    translate(
      calc(100% + 6px),
      -50%
    );
}


/* =========================================================
   三、03页面：进一步增加走势图高度
   ========================================================= */

.score-stats-trend-mount {
  overflow: hidden;
}


.score-stats-trend-mount
.trend-legend {
  margin-bottom: 5px;
  padding-top: 3px;
  padding-bottom: 3px;
}


/*
 * 走势图高度提高到465px。
 * app.js同时将横轴底部边距增加到72px。
 */

.score-stats-trend-mount
.trend-chart-shell {
  flex: 1 1 auto;
  overflow: hidden;
}

.score-stats-trend-mount
#trendChart {
  overflow: visible;
}

.score-stats-trend-mount
.app-modal-footer {
  margin-top: 3px;
  padding-top: 3px;
}


/* =========================================================
   四、04页面：取消内部滚动条
   ========================================================= */

.score-stats-progress-page
.stats-progress-body,
.score-stats-progress-page
.summary-progress {
  flex-direction: column;
  padding: 2px 18px 5px;
  overflow-x: hidden;
  overflow-y: hidden;
}


/*
 * 进度标题和进度条使用主体区域全宽。
 */

.score-stats-progress-page
.progress-title,
.score-stats-progress-page
.month-progress-bar {
  width: 100%;
  max-width: 1060px;
}


/* =========================================================
   五、04页面：左侧统计表与右侧预测区域
   ========================================================= */

/*
 * 左侧统计表固定为470px。
 * 右侧剩余空间全部用于三个并列预测卡片。
 */

/* 已移除：04页失效的左右分栏规则（DOM 已改为纵向 section 结构） */


/*
 * 左侧截止日期。
 */


/*
 * 左侧五项统计。
 */


/*
 * 右侧预测区域跨越上下两行。
 */


/* =========================================================
   六、04页面：缩窄同期比较列
   ========================================================= */

/*
 * 左侧当前统计列为220px；
 * 同期比较列只保留约250px。
 */


.score-stats-progress-page
.month-stat-comparison-prefix {
  margin-right: 4px;
}

.score-stats-progress-page
.month-stat-comparison {
  font-size: 13px;
}


/* =========================================================
   七、04页面：三个预测卡片横向并列
   ========================================================= */

/*
 * 清除上一版“本月还剩”跨整行的规则。
 */


/*
 * 两项预测卡片与“本月还剩”并排显示。
 */


/* =========================================================
   八、较矮屏幕仍优先保证图表和横坐标完整
   ========================================================= */

@media (max-height: 760px) {

  .score-stats-modal {
    padding-top: 4px;
    padding-bottom: 4px;
  }


  .score-stats-reporters-page
  .summary-bar-wrap,
  .score-stats-reporters-page
  .summary-topic-label-bar-spacer {
    height: 295px;
  }

}


/* =========================================================
   月度播出分析：现代数据卡片布局
   版本：20260779
   ========================================================= */


/* =========================================================
   一、04页面主体
   ========================================================= */

.score-stats-progress-page
.stats-progress-body,
.score-stats-progress-page
.summary-progress {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  min-width: 0;
  min-height: 0;
  padding: 2px 18px 7px;
  overflow: hidden;
  box-sizing: border-box;
}

.score-stats-progress-page
.progress-title,
.score-stats-progress-page
.month-progress-bar,
.score-stats-progress-page
#monthProgressDesc {
  width: 100%;
  max-width: 1060px;
}

.score-stats-progress-page
.progress-title {
  margin-bottom: 7px;
}

.score-stats-progress-page
.month-progress-bar {
  height: 32px;
}

.score-stats-progress-page
#monthProgressDesc {
  display: block;
  min-height: 0;
  margin-top: 9px;
  overflow: visible;
}


/* =========================================================
   二、统计区间和上月同期说明
   ========================================================= */

.score-stats-progress-page
.month-analysis-overview {
  display: grid;
  grid-template-columns:
    minmax(0, 1fr)
    auto;
  align-items: center;
  gap: 14px;
  min-height: 46px;
  padding: 7px 13px;
  box-sizing: border-box;
  border: 1px solid #d4e3ef;
  border-radius: 9px;
  background:
    linear-gradient(
      90deg,
      #edf6fd 0%,
      #ffffff 58%,
      #f5f9fc 100%
    );
}

.score-stats-progress-page
.month-analysis-date {
  display: flex;
  align-items: baseline;
  min-width: 0;
  color: #46647d;
  font-size: 13px;
  line-height: 1.4;
  font-weight: 700;
  white-space: nowrap;
}

.score-stats-progress-page
.month-analysis-date-label {
  color: #617588;
}

.score-stats-progress-page
.month-analysis-date
strong {
  margin: 0 5px;
  color: #1f4e79;
  font-size: 17px;
  font-weight: 900;
}

.score-stats-progress-page
.month-analysis-period {
  margin-left: 12px;
  padding-left: 12px;
  border-left: 1px solid #cbdce9;
  color: #627789;
  font-size: 12px;
  font-weight: 650;
}

.score-stats-progress-page
.month-analysis-comparison-notice {
  min-width: 0;
  padding: 5px 9px;
  box-sizing: border-box;
  border: 1px solid #cddfec;
  border-radius: 7px;
  background: #f3f8fc;
  color: #506f89;
  font-size: 11px;
  line-height: 1.35;
  font-weight: 700;
  text-align: right;
  white-space: nowrap;
}

.score-stats-progress-page
.month-analysis-comparison-notice.is-unavailable {
  border-color: #d9e0e6;
  background: #f6f7f8;
  color: #7d8994;
}

.score-stats-progress-page
.month-analysis-comparison-notice.is-error {
  border-color: #ecd7d4;
  background: #fff6f5;
  color: #a35c54;
}


/* =========================================================
   三、区块标题
   ========================================================= */

.score-stats-progress-page
.month-analysis-section-heading {
  display: flex;
  align-items: baseline;
  min-height: 28px;
  margin-bottom: 5px;
}

.score-stats-progress-page
.month-analysis-section-heading
strong {
  color: #284f72;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 900;
}

.score-stats-progress-page
.month-analysis-section-heading
span {
  margin-left: 10px;
  color: #7a8a98;
  font-size: 11px;
  line-height: 1.4;
  font-weight: 600;
}


/* =========================================================
   四、本月核心数据
   ========================================================= */

.score-stats-progress-page
.month-analysis-kpi-section {
  margin-top: 7px;
}

.score-stats-progress-page
.month-analysis-kpi-grid {
  display: grid;
  grid-template-columns:
    repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.score-stats-progress-page
.month-analysis-kpi-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 9px 7px;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid #d7e4ef;
  border-radius: 10px;
  background:
    radial-gradient(
      circle at 0% 0%,
      rgba(70, 142, 204, 0.08),
      transparent 47%
    ),
    linear-gradient(
      145deg,
      #f7fbfe 0%,
      #ffffff 100%
    );
  box-shadow:
    0 3px 10px
    rgba(31, 78, 121, 0.055);
  text-align: center;
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}

.score-stats-progress-page
.month-analysis-kpi-card::before {
  position: absolute;
  top: 0;
  left: 18%;
  width: 64%;
  height: 2px;
  border-radius: 999px;
  background:
    linear-gradient(
      90deg,
      rgba(55, 132, 197, 0),
      #438fd0,
      rgba(55, 132, 197, 0)
    );
  content: "";
}

.score-stats-progress-page
.month-analysis-kpi-card:hover {
  border-color: #b8d1e5;
  box-shadow:
    0 6px 16px
    rgba(31, 78, 121, 0.09);
  transform: translateY(-1px);
}

.score-stats-progress-page
.month-analysis-kpi-label {
  color: #45637d;
  font-size: 13px;
  line-height: 1.35;
  font-weight: 800;
}

.score-stats-progress-page
.month-analysis-kpi-value {
  display: flex;
  align-items: baseline;
  justify-content: center;
  margin-top: 7px;
}

.score-stats-progress-page
.month-analysis-kpi-value
strong {
  color: #d35400;
  font-size: 25px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -0.02em;
}

.score-stats-progress-page
.month-analysis-kpi-value
span {
  margin-left: 4px;
  color: #315673;
  font-size: 13px;
  font-weight: 800;
}


/* =========================================================
   五、核心数据卡片底部说明和同期比较
   ========================================================= */

.score-stats-progress-page
.month-analysis-kpi-placeholder,
.score-stats-progress-page
.month-analysis-kpi-compare {
  display: flex;
  align-items: baseline;
  justify-content: center;
  min-height: 17px;
  margin-top: 7px;
  color: #82909c;
  font-size: 10px;
  line-height: 1.3;
  font-weight: 600;
  white-space: nowrap;
}

.score-stats-progress-page
.month-analysis-kpi-compare
.month-stat-comparison-prefix {
  margin-right: 3px;
  color: #738391;
  font-size: 10px;
  font-weight: 650;
}

.score-stats-progress-page
.month-analysis-kpi-compare
.month-stat-comparison {
  font-size: 11px;
  font-weight: 900;
}

.score-stats-progress-page
.month-analysis-kpi-compare
.month-stat-comparison.is-unchanged {
  color: #27313a;
}

.score-stats-progress-page
.month-analysis-kpi-compare
.month-stat-comparison.is-increase {
  color: #d23c32;
}

.score-stats-progress-page
.month-analysis-kpi-compare
.month-stat-comparison.is-decrease {
  color: #25834d;
}


/* =========================================================
   六、本月剩余预测
   ========================================================= */

.score-stats-progress-page
.month-analysis-forecast-section {
  margin-top: 9px;
  padding-top: 7px;
  border-top: 2px solid #d3e1ec;
}

.score-stats-progress-page
.month-analysis-forecast-grid {
  display: grid;
  grid-template-columns:
    0.7fr
    1.15fr
    1.15fr;
  gap: 9px;
}

.score-stats-progress-page
.month-analysis-forecast-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 106px;
  padding: 9px 11px;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid #d5e3ee;
  border-radius: 10px;
  background:
    radial-gradient(
      circle at 0% 0%,
      rgba(78, 148, 207, 0.10),
      transparent 47%
    ),
    linear-gradient(
      145deg,
      #f4faff 0%,
      #ffffff 100%
    );
  box-shadow:
    0 3px 10px
    rgba(31, 78, 121, 0.06);
  text-align: center;
}

.score-stats-progress-page
.month-analysis-forecast-card.is-score {
  border-color: #ead7c4;
  background:
    radial-gradient(
      circle at 0% 0%,
      rgba(220, 127, 42, 0.11),
      transparent 47%
    ),
    linear-gradient(
      145deg,
      #fff8f1 0%,
      #fffdf9 100%
    );
}

.score-stats-progress-page
.month-analysis-forecast-label {
  color: #42627d;
  font-size: 13px;
  line-height: 1.35;
  font-weight: 800;
}

.score-stats-progress-page
.month-analysis-forecast-value {
  display: flex;
  align-items: baseline;
  justify-content: center;
  margin-top: 7px;
}

.score-stats-progress-page
.month-analysis-forecast-value
strong {
  color: #d35400;
  font-size: 26px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -0.02em;
}

.score-stats-progress-page
.month-analysis-forecast-card.is-score
.month-analysis-forecast-value
strong {
  color: #c7441b;
}

.score-stats-progress-page
.month-analysis-forecast-value
span {
  margin-left: 5px;
  color: #315673;
  font-size: 14px;
  font-weight: 900;
}

.score-stats-progress-page
.month-analysis-forecast-card
small {
  margin-top: 7px;
  color: #82909c;
  font-size: 10px;
  line-height: 1.35;
  font-weight: 600;
}


/* ---------------------------------------------------------
   选题来源构成：自主选题与安排选题的条数和稿分
   --------------------------------------------------------- */

.score-stats-progress-page
.month-analysis-source-section {
  margin-top: 9px;
  padding-top: 7px;
  border-top: 2px solid #d3e1ec;
}

.score-stats-progress-page
.month-analysis-source-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.score-stats-progress-page
.month-analysis-source-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 92px;
  padding: 8px 11px;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid #d5e3ee;
  border-radius: 10px;
  box-shadow: 0 3px 10px rgba(31, 78, 121, 0.06);
  text-align: center;
}

.score-stats-progress-page
.month-analysis-source-card.is-self-selected {
  border-color: #c9e2d2;
  background:
    radial-gradient(
      circle at 0% 0%,
      rgba(39, 141, 84, 0.11),
      transparent 47%
    ),
    linear-gradient(145deg, #f2fbf5 0%, #ffffff 100%);
}

.score-stats-progress-page
.month-analysis-source-card.is-assigned {
  border-color: #d5e3ee;
  background:
    radial-gradient(
      circle at 0% 0%,
      rgba(78, 148, 207, 0.10),
      transparent 47%
    ),
    linear-gradient(145deg, #f4faff 0%, #ffffff 100%);
}

.score-stats-progress-page
.month-analysis-source-label {
  color: #42627d;
  font-size: 13px;
  line-height: 1.35;
  font-weight: 800;
}

.score-stats-progress-page
.month-analysis-source-value {
  display: flex;
  align-items: baseline;
  justify-content: center;
  margin-top: 6px;
}

.score-stats-progress-page
.month-analysis-source-value strong {
  font-size: 25px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -0.02em;
}

.score-stats-progress-page
.month-analysis-source-card.is-self-selected
.month-analysis-source-value strong {
  color: #1e7b45;
}

.score-stats-progress-page
.month-analysis-source-card.is-assigned
.month-analysis-source-value strong {
  color: #1f5f95;
}

.score-stats-progress-page
.month-analysis-source-value span {
  margin-left: 5px;
  color: #315673;
  font-size: 14px;
  font-weight: 900;
}

.score-stats-progress-page
.month-analysis-source-score {
  margin-top: 5px;
  color: #42627d;
  font-size: 12px;
  line-height: 1.3;
  font-weight: 700;
}

.score-stats-progress-page
.month-analysis-source-score strong {
  margin: 0 3px;
  font-size: 16px;
  font-weight: 900;
}

.score-stats-progress-page
.month-analysis-source-card.is-self-selected
.month-analysis-source-score strong {
  color: #1e7b45;
}

.score-stats-progress-page
.month-analysis-source-card.is-assigned
.month-analysis-source-score strong {
  color: #1f5f95;
}

.score-stats-progress-page
.month-analysis-source-card small {
  margin-top: 6px;
  color: #82909c;
  font-size: 10px;
  line-height: 1.35;
  font-weight: 600;
}

/* =========================================================
   七、加载和空数据状态
   ========================================================= */

.score-stats-progress-page
.month-stat-loading,
.score-stats-progress-page
.month-stat-empty {
  min-height: 300px;
}


/* =========================================================
   八、较矮屏幕适配
   ========================================================= */

@media (max-height: 760px) {

  .score-stats-progress-page
  .month-analysis-overview {
    min-height: 42px;
    padding-top: 5px;
    padding-bottom: 5px;
  }

  .score-stats-progress-page
  .month-analysis-kpi-card {
    min-height: 96px;
    padding-top: 7px;
    padding-bottom: 7px;
  }

  .score-stats-progress-page
  .month-analysis-kpi-value
  strong {
    font-size: 23px;
  }

  .score-stats-progress-page
  .month-analysis-forecast-section {
    margin-top: 7px;
    padding-top: 5px;
  }

  .score-stats-progress-page
  .month-analysis-forecast-card {
    min-height: 94px;
    padding-top: 7px;
    padding-bottom: 7px;
  }

  .score-stats-progress-page
  .month-analysis-forecast-value
  strong {
    font-size: 24px;
  }
  .score-stats-progress-page
  .month-analysis-source-section {
    margin-top: 7px;
    padding-top: 5px;
  }

  .score-stats-progress-page
  .month-analysis-source-card {
    min-height: 82px;
    padding-top: 6px;
    padding-bottom: 6px;
  }

  .score-stats-progress-page
  .month-analysis-source-value strong {
    font-size: 22px;
  }
}


/* =========================================================
   月度播出分析：移除辅助说明文字
   版本：20260780
   ========================================================= */


/*
 * 隐藏“本月统计区间”。
 */

.score-stats-progress-page
.month-analysis-period {
  display: none;
}


/*
 * 隐藏右侧完整的上月同期区间提示。
 *
 * 上月有数据时，各核心数据卡片底部的
 * 增加、减少或持平结果仍会正常显示。
 */

.score-stats-progress-page
.month-analysis-comparison-notice {
  display: none;
}


/*
 * 隐藏“本月核心数据”及其右侧说明。
 */

.score-stats-progress-page
.month-analysis-kpi-section
> .month-analysis-section-heading {
  display: none;
}


/*
 * 隐藏五张核心数据卡片底部的辅助说明。
 *
 * 这里只隐藏没有同期数据时显示的占位说明，
 * 不隐藏以后正常生成的同期比较结果。
 */

.score-stats-progress-page
.month-analysis-kpi-placeholder {
  display: none;
}


/*
 * 隐藏“剩余时间”卡片底部的
 * “距离次月1日”。
 *
 * 不影响另外两张预测卡片底部的估算说明。
 */

.score-stats-progress-page
.month-analysis-forecast-card.is-remaining
small {
  display: none;
}


/*
 * 顶部只剩下“统计截至7月27日”后，
 * 改成单列布局，避免保留无用空位。
 */

.score-stats-progress-page
.month-analysis-overview {
  grid-template-columns: minmax(0, 1fr);
}


/*
 * 去掉原来“本月核心数据”标题所占的间距。
 */

.score-stats-progress-page
.month-analysis-kpi-section {
  margin-top: 8px;
}


/*
 * 核心数据卡片底部文字隐藏后，
 * 让名称和数字自然垂直居中。
 */

.score-stats-progress-page
.month-analysis-kpi-card {
  min-height: 92px;
}


/*
 * “剩余时间”卡片底部说明隐藏后，
 * 让名称和数字自然居中。
 */

.score-stats-progress-page
.month-analysis-forecast-card.is-remaining {
  justify-content: center;
}


/* =========================================================
   累计稿分走势：增加纵向显示空间
   版本：20260781
   ========================================================= */


/* =========================================================
   一、统计中心尽量使用浏览器可用高度
   ========================================================= */

.score-stats-modal {
  padding-top: 4px;
  padding-bottom: 4px;
}


/* =========================================================
   二、压缩弹窗顶部外围区域
   ========================================================= */

.score-stats-modal
.score-stats-modal-header {
  margin-bottom: 5px;
  padding-bottom: 5px;
}

.score-stats-modal
.score-stats-modal-header
.app-modal-header-title {
  font-size: 19px;
}

.score-stats-modal
.score-stats-modal-header
.app-modal-description {
  margin-top: 1px;
  font-size: 11px;
}

.score-stats-tabs {
  margin-bottom: 6px;
}


/* =========================================================
   三、压缩03页面自身的标题区域
   ========================================================= */

.score-stats-trend-page
.score-stats-full-card {
  padding-top: 8px;
  padding-bottom: 8px;
}

.score-stats-trend-page
.score-stats-full-card
.stats-dashboard-card-header {
  margin-bottom: 5px;
  padding-bottom: 4px;
}


.score-stats-trend-page
.score-stats-full-card
.stats-dashboard-card-description {
  margin-top: 1px;
  font-size: 11px;
}


/* =========================================================
   四、压缩走势图工具栏和记者图例
   ========================================================= */


.score-stats-trend-mount
.trend-legend {
  flex: 0 0 auto;
  margin-bottom: 4px;
  padding-top: 2px;
  padding-bottom: 2px;
}


/* =========================================================
   五、走势图占满剩余垂直空间
   ========================================================= */

.score-stats-trend-mount {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}


/*
 * 走势图内部说明尽量少占高度。
 */

.score-stats-trend-mount
.app-modal-footer {
  flex: 0 0 auto;
  margin-top: 2px;
  padding-top: 2px;
}


/* =========================================================
   六、压缩整个统计中心最底部说明
   ========================================================= */

.score-stats-modal
.score-stats-modal-footer {
  margin-top: 3px;
  padding-top: 2px;
}


/* =========================================================
   七、浏览器可用高度较小时
   ========================================================= */


/* =========================================================
   稿分统计中心高度折中修正
   版本：20260782

   取消上一版接近全屏的纵向高度，
   恢复适中的居中大弹窗。
   ========================================================= */


/* =========================================================
   一、恢复适中的居中弹窗
   ========================================================= */

.score-stats-modal {
  align-items: center;
  justify-content: center;
  padding: 12px;
  overflow: auto;
}

.score-stats-modal
.score-stats-modal-box,
.score-stats-modal
.app-modal-box.score-stats-modal-box {
  width: 1180px;
  min-width: 1180px;
  min-height: 0;
}


/* =========================================================
   二、恢复适中的顶部区域尺寸
   ========================================================= */

.score-stats-modal
.score-stats-modal-header {
  min-height: 43px;
  margin-bottom: 6px;
  padding-bottom: 6px;
}

.score-stats-modal
.score-stats-modal-header
.app-modal-header-title {
  font-size: 20px;
}

.score-stats-modal
.score-stats-modal-header
.app-modal-description {
  margin-top: 2px;
  font-size: 12px;
}

.score-stats-tabs {
  margin-bottom: 7px;
}

.score-stats-tab {
  height: 41px;
}


/* =========================================================
   三、恢复二级页面适中的标题尺寸
   ========================================================= */

.score-stats-trend-page
.score-stats-full-card {
  padding-top: 10px;
  padding-bottom: 10px;
}

.score-stats-trend-page
.score-stats-full-card
.stats-dashboard-card-header {
  min-height: 37px;
  margin-bottom: 6px;
  padding-bottom: 5px;
}

.score-stats-trend-page
.score-stats-full-card
.stats-dashboard-card-title {
  font-size: 17px;
}

.score-stats-trend-page
.score-stats-full-card
.stats-dashboard-card-description {
  margin-top: 2px;
  font-size: 12px;
}


/* =========================================================
   四、03走势图采用适中的纵向高度
   ========================================================= */


.score-stats-trend-mount
.trend-legend {
  min-height: 33px;
  margin-bottom: 5px;
  padding-top: 3px;
  padding-bottom: 3px;
}

.score-stats-trend-mount
.trend-chart-shell {
  flex: 1 1 auto;
  margin: 0;
  overflow: hidden;
}


.score-stats-trend-mount
.app-modal-footer {
  min-height: 16px;
  margin-top: 3px;
  padding-top: 3px;
}


/* =========================================================
   五、恢复统计中心底部说明的正常尺寸
   ========================================================= */

.score-stats-modal
.score-stats-modal-footer {
  min-height: 17px;
  margin-top: 4px;
  padding-top: 3px;
}


/* =========================================================
   六、取消上一版对01页面造成的过度拉长
   ========================================================= */


/* =========================================================
   七、较矮浏览器窗口适配
   ========================================================= */

@media (max-height: 760px) {

  .score-stats-modal {
    align-items: center;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .score-stats-modal
  .score-stats-modal-box,
  .score-stats-modal
  .app-modal-box.score-stats-modal-box {
    height: 700px;
    min-height: 0;
    max-height: calc(100vh - 16px);
  }

  .score-stats-trend-mount
  .trend-chart-shell {
    height: auto;
    min-height: 425px;
  }

  .score-stats-reporters-page
  .summary-left
  .score-summary,
  .score-stats-reporters-page
  .score-summary {
    height: 445px;
    min-height: 445px;
    max-height: 445px;
  }
}

/* =========================================================
   记者稿分统计页面视觉强化
   版本：20260785

   1. 适度增加稿分统计中心垂直高度
   2. 强化记者总分和姓名
   3. 将“100分”向右移动，使其更贴近目标线
   ========================================================= */


/* =========================================================
   一、适度增加统计中心弹窗高度
   ========================================================= */

.score-stats-modal {
  padding-top: 6px;
  padding-bottom: 6px;
}


/* =========================================================
   二、把新增高度主要交给记者柱状图页面
   ========================================================= */

.score-stats-reporters-page
.summary-left
.score-summary,
.score-stats-reporters-page
.score-summary {
  height: 515px;
  min-height: 515px;
  max-height: 515px;
  padding-top: 16px;
  padding-bottom: 14px;
}


/*
 * 增加柱体本身的垂直绘制空间。
 * 左侧“100分”坐标区必须同步修改，
 * 才能保证文字、红色目标线和柱体仍共用同一坐标。
 */

.score-stats-reporters-page
.summary-bar-wrap,
.score-stats-reporters-page
.summary-topic-label-bar-spacer {
  height: 326px;
}


/* =========================================================
   三、强化每名记者的总分
   ========================================================= */

.score-stats-reporters-page
.summary-bar-value {
  display: inline-flex;
  order: 2;
  align-items: center;
  justify-content: center;

  min-width: 54px;
  height: 28px;
  margin-top: 8px;
  padding: 0 8px;

  box-sizing: border-box;
  border: 1px solid #c9dcef;
  border-radius: 999px;

  background:
    linear-gradient(
      180deg,
      #f8fbff 0%,
      #e8f2fc 100%
    );

  color: #174f82;
  font-size: 17px;
  line-height: 26px;
  font-weight: 900;
  letter-spacing: -0.25px;
  text-align: center;
  white-space: nowrap;

  box-shadow:
    0 3px 8px rgba(31, 78, 121, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.95);
}


/*
 * 达到100分以后，总分同步使用绿色强调，
 * 与已经达标的绿色柱体形成一致的视觉语义。
 */

.score-stats-reporters-page
.summary-bar-item:has(
  .summary-bar-target-reached
)
.summary-bar-value {
  border-color: #b9ddc6;

  background:
    linear-gradient(
      180deg,
      #f5fcf7 0%,
      #dff3e5 100%
    );

  color: #237447;

  box-shadow:
    0 3px 8px rgba(46, 139, 87, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.95);
}


/* =========================================================
   四、强化记者姓名
   ========================================================= */

.score-stats-reporters-page
.summary-bar-name {
  display: flex;
  order: 3;
  align-items: center;
  justify-content: center;

  width: 64px;
  height: 25px;
  margin-top: 5px;

  color: #243b53;
  font-size: 15px;
  line-height: 25px;
  font-weight: 800;
  letter-spacing: 0.3px;
  text-align: center;
  white-space: nowrap;

  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.92);
}


/* =========================================================
   五、对应调整左侧标签占位高度
   保证下方三行数据继续水平对齐
   ========================================================= */

.score-stats-reporters-page
.summary-topic-label-spacer {
  height: 28px;
  margin-top: 8px;
}

.score-stats-reporters-page
.summary-topic-label-name-spacer {
  height: 25px;
  margin-top: 5px;
}


/* =========================================================
   六、把“100分”向右移动，更贴近红色目标线
   ========================================================= */

.score-stats-reporters-page
.summary-target-label {
  left: 34px;
  z-index: 6;
  transform: translateY(50%);
}


/* =========================================================
   七、较矮浏览器窗口适配
   ========================================================= */

@media (max-height: 780px) {

  .score-stats-modal {
    padding-top: 5px;
    padding-bottom: 5px;
  }

  .score-stats-modal
  .score-stats-modal-box,
  .score-stats-modal
  .app-modal-box.score-stats-modal-box {
    height: 750px;
    max-height: calc(100vh - 10px);
  }

  .score-stats-reporters-page
  .summary-left
  .score-summary,
  .score-stats-reporters-page
  .score-summary {
    height: 495px;
    min-height: 495px;
    max-height: 495px;
  }

  .score-stats-reporters-page
  .summary-bar-wrap,
  .score-stats-reporters-page
  .summary-topic-label-bar-spacer {
    height: 306px;
  }
}

/* =========================================================
   累计稿分走势图标签视觉优化
   版本：20260788
   ========================================================= */


/*
 * “100分目标”和“稿分警戒线”增加白色描边。
 * 当文字附近有记者折线时，仍然可以清楚辨认。
 */

.score-stats-trend-mount
.trend-target-label,
.score-stats-trend-mount
.trend-safety-label {
  paint-order: stroke;
  stroke: rgba(255, 255, 255, 0.97);
  stroke-width: 5px;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/*
 * 100分目标。
 */

.score-stats-trend-mount
.trend-target-label {
  fill: #c45110;
  font-size: 12px;
  font-weight: 800;
}


/*
 * 稿分警戒线。
 */


/*
 * “截至29日”略微增强。
 */

.score-stats-trend-mount
.trend-today-label {
  fill: #2878c7;
  font-size: 11px;
  font-weight: 800;
  opacity: 0.92;
  paint-order: stroke;
  stroke: rgba(255, 255, 255, 0.98);
  stroke-width: 4px;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/*
 * “未来日期”保持低调，
 * 与截止日期形成清晰的主次关系。
 */

.score-stats-trend-mount
.trend-future-label {
  fill: #8e9daa;
  font-size: 11px;
  font-weight: 600;
  paint-order: stroke;
  stroke: rgba(255, 255, 255, 0.96);
  stroke-width: 4px;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/*
 * 右侧最终分数。
 * 略微放大，并使用白色描边隔开背景和引导线。
 */

.score-stats-trend-mount
.trend-latest-label {
  font-size: 12px;
  font-weight: 900;
  pointer-events: none;
  paint-order: stroke;
  stroke: rgba(255, 255, 255, 0.99);
  stroke-width: 5px;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/*
 * 数据点与最终分数之间的引导线。
 * 保持清晰，但不抢过折线本身。
 */

.score-stats-trend-mount
.trend-label-leader {
  fill: none;
  stroke-width: 1.2;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.58;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
}


/* =========================================================
   本月稿分构成：现代实心饼图
   版本：20260789
   ========================================================= */


/*
 * 整体卡片。
 */

.score-stats-share-page
.score-share-card {
  overflow: hidden;
  border: 1px solid rgba(207, 220, 232, 0.92);
  border-radius: 14px;
  background:
    radial-gradient(
      circle at 5% 0%,
      rgba(74, 144, 205, 0.075),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #ffffff 0%,
      #fbfdff 48%,
      #f7fafe 100%
    );
  box-shadow:
    0 8px 25px rgba(35, 78, 116, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.96);
}


/*
 * 卡片顶部装饰线。
 */

.score-stats-share-page
.score-share-card::before {
  left: 18px;
  width: 145px;
  height: 2px;
  background:
    linear-gradient(
      90deg,
      #3e8fd1 0%,
      #43b7bb 58%,
      transparent 100%
    );
}


/*
 * 标题和总分区域。
 */

.score-stats-share-page
.score-share-header {
  min-height: 58px;
  margin: 0 0 8px;
  padding-bottom: 11px;
  align-items: flex-start;
  border-bottom: 1px solid rgba(220, 230, 239, 0.82);
}

.score-stats-share-page
.stats-dashboard-card-title {
  color: #244f74;
  font-size: 17px;
  line-height: 1.4;
  font-weight: 800;
  letter-spacing: 0.1px;
}

.score-stats-share-page
.score-share-caption {
  margin-top: 3px;
  color: #7c8d9d;
  font-size: 12px;
  line-height: 1.45;
  font-weight: 400;
}

.score-stats-share-page
.score-share-card-total {
  color: #6a7f92;
  font-size: 13px;
  line-height: 1.5;
}

.score-stats-share-page
.score-share-latest-date {
  color: #657b8e;
  font-size: 13px;
  font-weight: 600;
}

.score-stats-share-page
.score-share-total-summary {
  color: #587086;
  font-size: 13px;
  font-weight: 600;
}

.score-stats-share-page
.score-share-card-total
.score-share-total-summary
strong {
  margin-left: 5px;
  color: #e05a16;
  font-size: 20px;
  font-weight: 900;
}

.score-stats-share-page
.score-share-total-number {
  color: #e05a16;
  font-size: 25px;
  font-weight: 900;
  letter-spacing: -0.5px;
}


/*
 * 饼图与图例的整体布局。
 */

.score-stats-share-page
.score-share-content {
  display: flex;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  min-height: 0;
  padding: 12px 32px 22px;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.score-stats-share-page
.score-pie-layout {
  display: grid;
  grid-template-columns:
    365px
    340px;
  gap: 66px;
  min-width: 0;
  margin: 0 auto;
}


/*
 * 实心饼图。
 */

.score-stats-share-page
.score-pie-chart-wrap {
  margin: 0 auto;
}

.score-stats-share-page
.score-pie-chart {
  overflow: visible;
}


.score-stats-modal
.score-stats-share-page
.score-pie-segment {
  outline: none;
  transition:
    opacity 0.2s ease,
    filter 0.2s ease;
}


/*
 * 图例外框。
 */

.score-stats-share-page
.score-pie-legend {
  padding: 8px;
  overflow-x: hidden;
  overflow-y: auto;
  box-sizing: border-box;
  border: 1px solid rgba(220, 229, 237, 0.8);
  border-radius: 12px;
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.94),
      rgba(247, 250, 253, 0.88)
    );
  box-shadow:
    0 5px 18px rgba(39, 75, 105, 0.055),
    inset 0 1px 0 rgba(255, 255, 255, 0.95);
  scrollbar-width: thin;
  scrollbar-color: #b8c9d8 transparent;
}

.score-stats-share-page
.score-pie-legend::-webkit-scrollbar {
  width: 6px;
}

.score-stats-share-page
.score-pie-legend::-webkit-scrollbar-track {
  background: transparent;
}

.score-stats-share-page
.score-pie-legend::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #b8c9d8;
}


/*
 * 图例表头与每一行。
 * 只显示：颜色标记、记者姓名、占比。
 */

.score-stats-share-page
.score-pie-legend-head,
.score-stats-share-page
.score-pie-legend-item {
  display: grid;
  grid-template-columns:
    14px
    minmax(120px, 1fr)
    78px;
  align-items: center;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.score-stats-share-page
.score-pie-legend-head {
  margin: 0 0 4px;
  padding: 2px 12px 7px;
  border-bottom: 1px solid #e2eaf1;
  font-size: 11px;
  line-height: 1.35;
  font-weight: 600;
}

.score-stats-share-page
.score-pie-legend-head
span:nth-child(3) {
  text-align: right;
}

.score-stats-modal
.score-stats-share-page
.score-pie-legend-item {
  margin: 2px 0;
  padding: 7px 12px;
  border: 1px solid transparent;
  border-bottom: 1px solid rgba(225, 233, 240, 0.74);
  border-radius: 8px;
  color: #40576a;
  font-size: 14px;
  line-height: 1.4;
  cursor: default;
  outline: none;
  transition:
    opacity 0.2s ease,
    color 0.2s ease,
    background 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease;
}

.score-stats-share-page
.score-pie-legend-item:last-child {
  border-bottom-color: transparent;
}


/*
 * 现代圆角方形颜色标记。
 */

.score-stats-share-page
.score-pie-legend-dot {
  border: 1px solid rgba(35, 67, 91, 0.12);
  border-radius: 3px;
  background: var(--share-color);
  box-shadow:
    0 0 0 2px rgba(255, 255, 255, 0.96),
    0 2px 5px rgba(43, 73, 97, 0.18);
}


/*
 * 记者姓名。
 */

.score-stats-share-page
.score-pie-legend-name {
  min-width: 0;
  overflow: hidden;
  color: #304d65;
  font-size: 14px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}


/*
 * 占比。
 */

.score-stats-share-page
.score-pie-legend-percent {
  display: block;
  color: #d95b1c;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.1px;
  white-space: nowrap;
}


/*
 * 鼠标悬停和键盘选中效果。
 */

.score-stats-modal
.score-stats-share-page
.score-pie-legend-item:hover,
.score-stats-modal
.score-stats-share-page
.score-pie-legend-item:focus,
.score-stats-modal
.score-stats-share-page
.score-pie-legend-item.is-active {
  border-color: rgba(170, 201, 226, 0.55);
  background:
    linear-gradient(
      90deg,
      rgba(229, 241, 251, 0.94),
      rgba(248, 251, 254, 0.86)
    );
  box-shadow:
    inset 3px 0 0 var(--share-color),
    0 3px 10px rgba(48, 91, 127, 0.065);
  transform: translateX(3px);
}

.score-stats-modal
.score-stats-share-page
.score-pie-layout.has-active-share
.score-pie-legend-item:not(.is-active) {
  opacity: 0.48;
}

.score-stats-share-page
.score-pie-legend-item.is-zero {
  opacity: 0.42;
}


/*
 * 无稿分时显示淡灰色圆形。
 */


.score-stats-share-page
.score-pie-layout.is-empty
.score-pie-chart {
  opacity: 0.85;
}


/*
 * 较矮的电脑屏幕适配。
 */

@media (max-height: 780px) {

  .score-stats-share-page
  .score-share-content {
    padding-top: 6px;
    padding-bottom: 10px;
  }

  .score-stats-share-page
  .score-pie-layout {
    grid-template-columns:
      320px
      330px;
    gap: 48px;
  }


}


/*
 * 不需要动画时关闭过渡效果。
 */

@media (prefers-reduced-motion: reduce) {

  .score-stats-share-page
  .score-pie-segment,
  .score-stats-share-page
  .score-pie-legend-item {
    transition: none;
  }
}


/* =========================================================
   本月稿分构成：尺寸与图例精修
   版本：20260790
   ========================================================= */


/*
 * 重新整理内容区域，减少无意义的空白。
 */

.score-stats-share-page
.score-share-content {
  padding:
    10px
    34px
    16px;
}


/*
 * 放大饼图，同时缩短饼图与图例之间的距离。
 */

.score-stats-share-page
.score-pie-layout {
  grid-template-columns:
    420px
    268px;
  gap: 38px;
  margin: 0 auto;
}


/*
 * 饼图放大到400px。
 */

.score-stats-share-page
.score-pie-chart-wrap {
  margin: 0 auto;
  border-radius: 50%;
}


/*
 * 给饼图增加非常轻微的外部层次，
 * 避免看起来像直接贴在页面上。
 */

.score-stats-share-page
.score-pie-chart-wrap::after {
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  border:
    1px solid
    rgba(38, 73, 101, 0.10);
  border-radius: 50%;
  box-shadow:
    inset
    0
    0
    0
    1px
    rgba(255, 255, 255, 0.18),
    0
    12px
    26px
    rgba(35, 76, 111, 0.10);
  content: "";
  pointer-events: none;
}


/*
 * 减弱旧样式中的阴影，
 * 使饼图更加清晰、干净。
 */


/*
 * 图例整体变窄。
 */

.score-stats-share-page
.score-pie-legend {
  padding:
    7px
    9px;
  border:
    1px solid
    rgba(216, 226, 235, 0.72);
  border-radius: 12px;
  background:
    linear-gradient(
      145deg,
      rgba(255, 255, 255, 0.88),
      rgba(249, 251, 253, 0.78)
    );
  box-shadow:
    0
    5px
    16px
    rgba(39, 75, 105, 0.04),
    inset
    0
    1px
    0
    rgba(255, 255, 255, 0.96);
}


/*
 * 图例三列使用固定宽度并整体居中。
 * 这样记者姓名和占比不会被推到两边。
 */

.score-stats-share-page
.score-pie-legend-head,
.score-stats-share-page
.score-pie-legend-item {
  grid-template-columns:
    13px
    82px
    62px;
}


/*
 * 图例标题调整得更加紧凑。
 */

.score-stats-share-page
.score-pie-legend-head {
  min-height: 29px;
  margin-bottom: 3px;
  padding:
    2px
    8px
    6px;
  color: #8796a4;
}


/*
 * 每一位记者的图例行。
 */

.score-stats-modal
.score-stats-share-page
.score-pie-legend-item {
  margin: 1px 0;
  padding:
    6px
    8px;
  border-bottom-color:
    rgba(225, 233, 240, 0.68);
}


/*
 * 记者姓名与占比靠近显示。
 */

.score-stats-share-page
.score-pie-legend-name {
  font-size: 14px;
  font-weight: 700;
}

.score-stats-share-page
.score-pie-legend-percent {
  font-size: 14px;
  font-weight: 800;
  text-align: right;
}


/*
 * 颜色标记稍微缩小，
 * 让图例看起来更精致。
 */

.score-stats-share-page
.score-pie-legend-dot {
  width: 11px;
  height: 11px;
  border-radius: 3px;
  box-shadow:
    0
    0
    0
    2px
    rgba(255, 255, 255, 0.96),
    0
    2px
    4px
    rgba(43, 73, 97, 0.14);
}


/*
 * 图例悬停效果更加克制。
 */

.score-stats-modal
.score-stats-share-page
.score-pie-legend-item:hover,
.score-stats-modal
.score-stats-share-page
.score-pie-legend-item:focus,
.score-stats-modal
.score-stats-share-page
.score-pie-legend-item.is-active {
  border-color:
    rgba(175, 202, 224, 0.46);
  background:
    linear-gradient(
      90deg,
      rgba(232, 242, 250, 0.84),
      rgba(249, 251, 253, 0.66)
    );
  box-shadow:
    inset
    3px
    0
    0
    var(--share-color);
  transform:
    translateX(2px);
}


/*
 * 覆盖之前针对较矮屏幕设置的290px饼图。
 * 从你的截图看，当前浏览器正好触发了旧限制。
 */

@media (max-height: 780px) {

  .score-stats-share-page
  .score-share-content {
    padding:
      6px
      28px
      10px;
  }

  .score-stats-share-page
  .score-pie-layout {
    grid-template-columns:
      390px
      258px;
    gap: 34px;
  }


  .score-stats-modal
  .score-stats-share-page
  .score-pie-legend-item {
    padding-top: 5px;
    padding-bottom: 5px;
  }
}


/* =========================================================
   本月稿分构成：外部姓名与彩色引导线
   版本：20260791
   ========================================================= */


/*
 * 饼图、外部姓名和右侧图例的整体布局。
 */

.score-stats-share-page
.score-pie-layout {
  grid-template-columns:
    650px
    235px;
  align-items: center;
  justify-content: center;
  gap: 18px;
  width: 903px;
  max-width: 100%;
  margin: 0 auto;
}


/*
 * 扩大绘图区。
 * 其中包含实心饼图、姓名和引导线。
 */

.score-stats-share-page
.score-pie-chart-wrap {
  position: relative;
  width: 650px;
  max-width: 650px;
  height: 470px;
  aspect-ratio: auto;
  margin: 0 auto;
  border-radius: 0;
}


/*
 * 关闭上一次添加的圆形外框，
 * 避免外框覆盖姓名引导线。
 */

.score-stats-share-page
.score-pie-chart-wrap::after {
  display: none;
}


/*
 * SVG绘图区。
 */

.score-stats-share-page
.score-pie-chart {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}


/*
 * 实心饼图底层。
 */

.score-stats-share-page
.score-pie-track {
  fill: none;
  stroke: #e8eef4;
  stroke-width: 200;
}


/*
 * 扇区。
 */

.score-stats-modal
.score-stats-share-page
.score-pie-segment {
  fill: none;
  stroke-width: 200;
  stroke-linecap: butt;
  cursor: help;
  outline: none;
  opacity: 1;
  transition:
    opacity 0.2s ease,
    filter 0.2s ease;
}


/*
 * 饼图使用更轻、更自然的阴影。
 */

.score-stats-share-page
.score-pie-segments {
  filter:
    drop-shadow(
      0
      8px
      10px
      rgba(33, 70, 102, 0.11)
    );
}


/*
 * 扇区高亮。
 */

.score-stats-modal
.score-stats-share-page
.score-pie-segment:hover,
.score-stats-modal
.score-stats-share-page
.score-pie-segment:focus,
.score-stats-modal
.score-stats-share-page
.score-pie-segment.is-active {
  stroke-width: 200;
  opacity: 1;
  filter:
    brightness(1.07)
    saturate(1.08);
}

.score-stats-modal
.score-stats-share-page
.score-pie-layout.has-active-share
.score-pie-segment:not(.is-active) {
  opacity: 0.28;
  filter:
    saturate(0.65)
    brightness(1.08);
}


/*
 * 外部记者姓名标注。
 */

.score-stats-share-page
.score-pie-label {
  cursor: default;
  outline: none;
}


/*
 * 彩色引导线。
 */

.score-stats-share-page
.score-pie-label-line {
  fill: none;
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.72;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
  transition:
    opacity 0.2s ease,
    stroke-width 0.2s ease;
}


/*
 * 引导线在扇区边缘的定位点。
 */

.score-stats-share-page
.score-pie-label-point {
  stroke: rgba(255, 255, 255, 0.96);
  stroke-width: 1.6;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
  transition:
    r 0.2s ease,
    opacity 0.2s ease;
}


/*
 * 外部记者姓名。
 */

.score-stats-share-page
.score-pie-label-text {
  font-family:
    "Microsoft YaHei",
    "PingFang SC",
    Arial,
    sans-serif;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.2px;
  paint-order: stroke;
  stroke: rgba(255, 255, 255, 0.98);
  stroke-width: 4px;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
  transition:
    opacity 0.2s ease,
    font-size 0.2s ease;
}


/*
 * 鼠标指向姓名、图例或对应扇区时，
 * 同一记者的姓名和引导线一起增强。
 */

.score-stats-share-page
.score-pie-label:hover
.score-pie-label-line,
.score-stats-share-page
.score-pie-label:focus
.score-pie-label-line,
.score-stats-share-page
.score-pie-label.is-active
.score-pie-label-line {
  stroke-width: 2;
  opacity: 1;
}

.score-stats-share-page
.score-pie-label:hover
.score-pie-label-text,
.score-stats-share-page
.score-pie-label:focus
.score-pie-label-text,
.score-stats-share-page
.score-pie-label.is-active
.score-pie-label-text {
  font-size: 15px;
  opacity: 1;
}

.score-stats-share-page
.score-pie-label:hover
.score-pie-label-point,
.score-stats-share-page
.score-pie-label:focus
.score-pie-label-point,
.score-stats-share-page
.score-pie-label.is-active
.score-pie-label-point {
  r: 4.2;
  opacity: 1;
}


/*
 * 某位记者被选中时，
 * 其他记者姓名和引导线适度变淡。
 */

.score-stats-modal
.score-stats-share-page
.score-pie-layout.has-active-share
.score-pie-label:not(.is-active) {
  opacity: 0.30;
}


/*
 * 右侧图例进一步收紧。
 */

.score-stats-share-page
.score-pie-legend {
  width: 235px;
  max-width: 235px;
  max-height: 345px;
  padding:
    7px
    8px;
}

.score-stats-share-page
.score-pie-legend-head,
.score-stats-share-page
.score-pie-legend-item {
  grid-template-columns:
    12px
    74px
    55px;
  justify-content: center;
  column-gap: 8px;
}

.score-stats-modal
.score-stats-share-page
.score-pie-legend-item {
  min-height: 41px;
  padding:
    6px
    7px;
}

.score-stats-share-page
.score-pie-legend-name {
  font-size: 13px;
}

.score-stats-share-page
.score-pie-legend-percent {
  font-size: 13px;
}


/*
 * 无稿分时的实心灰色圆形。
 */

.score-stats-share-page
.score-pie-layout.is-empty
.score-pie-track {
  stroke: #e2e9ef;
  stroke-width: 200;
}


/*
 * 较矮浏览器窗口适配。
 * 保留姓名标注，同时避免内容顶到底部。
 */

@media (max-height: 780px) {

  .score-stats-share-page
  .score-share-content {
    padding:
      4px
      18px
      8px;
  }

  .score-stats-share-page
  .score-pie-layout {
    grid-template-columns:
      590px
      225px;
    gap: 12px;
    width: 827px;
  }

  .score-stats-share-page
  .score-pie-chart-wrap {
    width: 590px;
    max-width: 590px;
    height: 427px;
  }

  .score-stats-share-page
  .score-pie-legend {
    width: 225px;
    max-width: 225px;
  }

  .score-stats-share-page
  .score-pie-legend-head,
  .score-stats-share-page
  .score-pie-legend-item {
    grid-template-columns:
      12px
      70px
      53px;
    column-gap: 7px;
  }

  .score-stats-modal
  .score-stats-share-page
  .score-pie-legend-item {
    min-height: 38px;
    padding-top: 5px;
    padding-bottom: 5px;
  }
}


/*
 * 尊重系统的“减少动画”设置。
 */

@media (prefers-reduced-motion: reduce) {

  .score-stats-share-page
  .score-pie-segment,
  .score-stats-share-page
  .score-pie-label-line,
  .score-stats-share-page
  .score-pie-label-text,
  .score-stats-share-page
  .score-pie-label-point {
    transition: none;
  }
}

/* =========================================================
   本月稿分构成：最终饼图光影与引导线
   版本：20260793
   ========================================================= */


/*
 * 彻底关闭旧的圆形或椭圆形背景装饰。
 */

.score-stats-modal
.score-pie-chart-wrap::before,
.score-stats-modal
.score-pie-chart-wrap::after {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
  content: none !important;
}


/*
 * 绘图区保持完全透明。
 */

.score-stats-modal
.score-pie-chart-wrap {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.score-stats-modal
.score-pie-chart {
  background: transparent;
  filter: none;
}


/*
 * 隐藏饼图底层灰色圆盘。
 * 有数据时，所有扇区会完整覆盖整个圆形。
 */

.score-stats-modal
.score-pie-track {
  stroke: transparent;
}


/*
 * 为整个饼图添加多色环境阴影。
 *
 * 第一层是深海蓝灰色的下投影；
 * 第二层是青绿色的左侧柔光；
 * 第三层是烟熏紫色的右侧柔光。
 *
 * 三层阴影都来自当前配色体系，
 * 不会再形成白色或灰白色椭圆托盘。
 */

.score-stats-modal
.score-pie-segments {
  filter:
    drop-shadow(
      0
      13px
      16px
      rgba(54, 95, 115, 0.18)
    )
    drop-shadow(
      -7px
      4px
      13px
      rgba(63, 127, 122, 0.10)
    )
    drop-shadow(
      7px
      4px
      13px
      rgba(118, 101, 143, 0.09)
    );
}


/*
 * 扇区本身不再各自生成大范围阴影。
 * 避免多个阴影叠成一个椭圆底板。
 */

.score-stats-modal
.score-pie-segment {
  filter: none;
  opacity: 1;
  transition:
    opacity 0.2s ease,
    filter 0.2s ease;
}


/*
 * 鼠标悬停或选中时，只增强相应扇区颜色。
 */

.score-stats-modal
.score-pie-segment:hover,
.score-stats-modal
.score-pie-segment:focus,
.score-stats-modal
.score-pie-segment.is-active {
  filter:
    brightness(1.055)
    saturate(1.07);
  opacity: 1;
}


/*
 * 某位记者被选中时，其他扇区适度变淡。
 */

.score-stats-modal
.score-pie-layout.has-active-share
.score-pie-segment:not(.is-active) {
  filter:
    saturate(0.62)
    brightness(1.06);
  opacity: 0.28;
}


/*
 * 外部姓名区域本身不产生任何阴影。
 */

.score-stats-modal
.score-pie-labels,
.score-stats-modal
.score-pie-label {
  filter: none;
}


/*
 * 连接线与水平线的共同样式。
 */

.score-stats-modal
.score-pie-label-line {
  fill: none;
  stroke-width: 1.3;
  stroke-linecap: round;
  opacity: 0.78;
  filter: none;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
  transition:
    opacity 0.2s ease,
    stroke-width 0.2s ease;
}


/*
 * 靠近姓名的一段横线。
 * 由app.js保证两端纵坐标完全相同。
 */

.score-stats-modal
.score-pie-label-horizontal {
  stroke-width: 1.45;
}


/*
 * 引导线在扇区上的定位点。
 */

.score-stats-modal
.score-pie-label-point {
  stroke: rgba(255, 255, 255, 0.96);
  stroke-width: 1.4;
  filter: none;
  pointer-events: none;
  vector-effect: non-scaling-stroke;
  transition:
    opacity 0.2s ease,
    r 0.2s ease;
}


/*
 * 外部记者姓名。
 */

.score-stats-modal
.score-pie-label-text {
  font-family:
    "Microsoft YaHei",
    "PingFang SC",
    Arial,
    sans-serif;
  font-size: 14px;
  font-weight: 750;
  letter-spacing: 0.1px;
  paint-order: stroke;
  stroke: rgba(255, 255, 255, 0.97);
  stroke-width: 3px;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: none;
  pointer-events: none;
  transition:
    opacity 0.2s ease,
    font-size 0.2s ease;
}


/*
 * 指向扇区、姓名或右侧图例时，
 * 对应引导线同步增强。
 */

.score-stats-modal
.score-pie-label:hover
.score-pie-label-line,
.score-stats-modal
.score-pie-label:focus
.score-pie-label-line,
.score-stats-modal
.score-pie-label.is-active
.score-pie-label-line {
  stroke-width: 1.9;
  opacity: 1;
}


/*
 * 高亮时定位点适度放大。
 */

.score-stats-modal
.score-pie-label:hover
.score-pie-label-point,
.score-stats-modal
.score-pie-label:focus
.score-pie-label-point,
.score-stats-modal
.score-pie-label.is-active
.score-pie-label-point {
  r: 3.9;
  opacity: 1;
}


/*
 * 高亮时姓名仅轻微增强，不明显跳动。
 */

.score-stats-modal
.score-pie-label:hover
.score-pie-label-text,
.score-stats-modal
.score-pie-label:focus
.score-pie-label-text,
.score-stats-modal
.score-pie-label.is-active
.score-pie-label-text {
  font-size: 14.5px;
  font-weight: 800;
  opacity: 1;
}


/*
 * 选中某位记者时，其他标注适度变淡。
 */

.score-stats-modal
.score-pie-layout.has-active-share
.score-pie-label:not(.is-active) {
  opacity: 0.30;
}


/*
 * 无数据时恢复淡灰色圆形提示。
 */

.score-stats-modal
.score-pie-layout.is-empty
.score-pie-track {
  stroke: #e2e9ef;
}


/*
 * 系统要求减少动画时关闭过渡效果。
 */

@media (prefers-reduced-motion: reduce) {

  .score-stats-modal
  .score-pie-segment,
  .score-stats-modal
  .score-pie-label-line,
  .score-stats-modal
  .score-pie-label-point,
  .score-stats-modal
  .score-pie-label-text {
    transition: none;
  }
}


/* =========================================================
   本月稿分构成：外部姓名下方显示占比
   版本：20260795
   ========================================================= */


/*
 * 每位记者姓名下方的占比数字。
 */

.score-stats-share-page
.score-pie-label-percent {
  font-family:
    "Microsoft YaHei",
    "PingFang SC",
    Arial,
    sans-serif;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.15px;
  opacity: 0.78;
  paint-order: stroke;
  stroke: rgba(255, 255, 255, 0.98);
  stroke-width: 3px;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: none;
  pointer-events: none;
  transition:
    opacity 0.2s ease,
    font-size 0.2s ease;
}


/*
 * 鼠标指向对应扇区、姓名或右侧图例时，
 * 比例数字同步增强。
 */

.score-stats-share-page
.score-pie-label:hover
.score-pie-label-percent,
.score-stats-share-page
.score-pie-label:focus
.score-pie-label-percent,
.score-stats-share-page
.score-pie-label.is-active
.score-pie-label-percent {
  font-size: 12px;
  opacity: 1;
}


/*
 * 系统要求减少动画时关闭过渡效果。
 */

@media (prefers-reduced-motion: reduce) {

  .score-stats-share-page
  .score-pie-label-percent {
    transition: none;
  }
}
/* =========================================================
   累计稿分走势图布局优化
   版本：20260796

   1. 删除警戒线开关和状态工具栏
   2. 全部显示按钮移动到图例行
   3. 警戒线名称显示在走势图右侧
   4. 增加统计中心与走势图高度
   ========================================================= */


/* =========================================================
   一、记者图例和“全部显示”按钮同一行
   ========================================================= */

.score-stats-trend-mount
.trend-legend-row {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-width: 0;
  min-height: 35px;
  margin: 0 0 6px;
  padding: 2px 7px;
  box-sizing: border-box;
}


/*
 * 图例占据左侧剩余空间。
 */

.score-stats-trend-mount
.trend-legend-row
.trend-legend {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  min-width: 0;
  min-height: 31px;
  margin: 0;
  padding: 0;
}


/*
 * “全部显示”固定在图例行最右侧。
 */

.score-stats-trend-mount
.trend-legend-row
.trend-show-all-btn {
  flex: 0 0 auto;
  min-width: 86px;
  height: 30px;
  margin: 0 0 0 auto;
  padding: 4px 12px;
  white-space: nowrap;
}


/* =========================================================
   二、独立走势图弹窗兼容
   ========================================================= */

.trend-modal-box
.trend-legend-row {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-width: 0;
  min-height: 35px;
  margin-bottom: 9px;
}

.trend-modal-box
.trend-legend-row
.trend-legend {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
}

.trend-modal-box
.trend-legend-row
.trend-show-all-btn {
  flex: 0 0 auto;
  margin-left: auto;
}


/* =========================================================
   三、走势图右侧稿分警戒线标签
   ========================================================= */

.score-stats-trend-mount
.trend-safety-end-label {
  font-size: 12px;
  font-weight: 800;
}


/*
 * 警戒线本身保持较淡的橙色虚线，
 * 防止抢过记者走势图。
 */

.score-stats-trend-mount
.trend-safety-line {
  fill: none;
  stroke: #d39a4c;
  stroke-width: 1.7;
  stroke-dasharray: 4 5;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.88;
}


/* =========================================================
   四、适当增加整个统计中心高度
   ========================================================= */

.score-stats-modal
.score-stats-modal-box,
.score-stats-modal
.app-modal-box.score-stats-modal-box {
  height: 830px;
}


/*
 * 增加走势图有效高度。
 * 相比原来的455px增加到515px。
 */

.score-stats-trend-mount
.trend-chart-shell {
  flex: 1 1 auto;
  width: 100%;
  height: auto;
  min-height: 515px;
  max-height: none;
  margin: 0;
  overflow: hidden;
}


/*
 * SVG继续填满走势图容器。
 */

.score-stats-trend-mount
#trendChart {
  display: block;
  width: 100%;
  height: 100%;
}


/* =========================================================
   五、较矮浏览器窗口适配
   避免窗口高度不足时走势图被强制裁切
   ========================================================= */

@media (max-height: 850px) {


  .score-stats-trend-mount
  .trend-chart-shell {
    height: auto;
    min-height: 455px;
  }
}
/* =========================================================
   走势图右侧标签二次优化
   ========================================================= */


/*
 * 普通记者标签现在包含姓名，
 * 稍微收紧字间距，避免文字过长。
 */

.score-stats-trend-mount
.trend-latest-label {
  font-size: 12px;
  font-weight: 900;
  letter-spacing: -0.2px;
}


/*
 * 警戒线标签单独突出。
 */

.score-stats-trend-mount
.trend-safety-end-label {
  fill: #9d651f;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  pointer-events: none;

  paint-order: stroke;
  stroke: rgba(255, 255, 255, 0.99);
  stroke-width: 5px;
  stroke-linecap: round;
  stroke-linejoin: round;
}


/*
 * 警戒线的引导折线略微加深，
 * 使它在右侧标签列中更容易识别。
 */

.score-stats-trend-mount
.trend-safety-leader {
  stroke-width: 1.4;
  opacity: 0.82;
}
/* =========================================================
   稿分统计中心单独按浏览器110%比例显示
   ========================================================= */

.score-stats-modal
.score-stats-modal-box,
.score-stats-modal
.app-modal-box.score-stats-modal-box {
  zoom: 1.1;

  /*
   * 预留放大所需空间，避免弹窗超出浏览器窗口。
   */
  max-width: calc(90.9091vw - 40px);
  max-height: calc(90.9091vh - 12px);
}

@media (max-height: 850px) {
  .score-stats-modal
  .score-stats-modal-box,
  .score-stats-modal
  .app-modal-box.score-stats-modal-box {
    height: calc(90.9091vh - 12px);
    max-height: calc(90.9091vh - 12px);
  }
}


/* =========================================================
   自主选题占比行：腾出垂直空间
   ========================================================= */

/*
 * 记者柱状图下方新增“自主选题占比”一行，
 * 约需27px。统计区容器为固定高度并隐藏溢出，
 * 因此把柱体绘制高度同步收窄，
 * 保证整体高度不变、底部数据行不被裁掉。
 *
 * 左侧“100分”坐标区必须使用同一数值，
 * 否则目标线、警戒线会与柱体错位。
 */

.score-stats-reporters-page
.summary-bar-wrap,
.score-stats-reporters-page
.summary-topic-label-bar-spacer {
  height: 299px;
}

@media (max-height: 780px) {
  .score-stats-reporters-page
  .summary-bar-wrap,
  .score-stats-reporters-page
  .summary-topic-label-bar-spacer {
    height: 279px;
  }
}


/* =========================================================
   月度播出分析：统一排版重构（方案B）
   版本：20260804

   目标：三个区块共用一套标题、卡片与间距规范。
   本段位于文件末尾，是 04 页最终生效层，
   如需调整 04 页外观请优先修改此处。
   ========================================================= */


/* ---------------------------------------------------------
   一、设计变量
   --------------------------------------------------------- */

.score-stats-progress-page {
  /* 卡片统一规格 */
  --ma-card-radius: 10px;
  --ma-card-pad-y: 10px;
  --ma-card-pad-x: 8px;
  --ma-card-min-h: 88px;
  --ma-card-border: #d7e4ef;

  /* 统一字号 */
  --ma-label-size: 12px;
  --ma-value-size: 26px;
  --ma-unit-size: 12px;
  --ma-note-size: 11px;

  /* 统一间距 */
  --ma-grid-gap: 8px;
  --ma-section-gap: 10px;
}


/* ---------------------------------------------------------
   二、页面主体：纵向节奏统一
   --------------------------------------------------------- */

.score-stats-progress-page
.stats-progress-body,
.score-stats-progress-page
.summary-progress {
  justify-content: flex-start;
  padding: 4px 18px 10px;
}


/* ---------------------------------------------------------
   三、统一区块标题
   三个区块（进度、选题来源、剩余预测）
   共用“粗体主标题 + 灰色副标题”左对齐规格。
   --------------------------------------------------------- */

.score-stats-progress-page
.month-analysis-section-heading {
  display: flex;
  align-items: baseline;
  min-height: 0;
  margin: 0 0 6px;
}

.score-stats-progress-page
.month-analysis-section-heading
strong {
  color: #234f76;
  font-size: 14px;
  line-height: 1.4;
  font-weight: 900;
  letter-spacing: 0.01em;
}

.score-stats-progress-page
.month-analysis-section-heading
span {
  margin-left: 9px;
  color: #7a8a98;
  font-size: var(--ma-note-size);
  line-height: 1.4;
  font-weight: 600;
}


/* 顶部“本月时间进度”标题与下方区块标题对齐 */

.score-stats-progress-page
.progress-title {
  justify-content: flex-start;
  margin: 0 0 6px;
}

.score-stats-progress-page
.progress-title
strong {
  color: #234f76;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.01em;
}

.score-stats-progress-page
.month-progress-bar {
  height: 26px;
}

.score-stats-progress-page
.month-progress-text {
  font-size: 13px;
}


/* ---------------------------------------------------------
   四、“统计截至”降级为紧凑说明条
   原为独占一行的浅蓝色区块，
   现压缩为轻量文字行，回收垂直空间。
   --------------------------------------------------------- */

.score-stats-progress-page
.month-analysis-overview {
  display: block;
  min-height: 0;
  margin-top: 8px;
  padding: 0;
  border: 0;
  background: none;
}

.score-stats-progress-page
.month-analysis-date {
  color: #5a7288;
  font-size: 12px;
  font-weight: 700;
}

.score-stats-progress-page
.month-analysis-date-label {
  color: #7a8a98;
}

.score-stats-progress-page
.month-analysis-date
strong {
  margin: 0 4px;
  color: #234f76;
  font-size: 14px;
  font-weight: 900;
}


/* ---------------------------------------------------------
   五、统一卡片规格
   KPI、选题来源、剩余预测三类卡片
   共用同一组尺寸与内部层级，仅用颜色区分语义。
   --------------------------------------------------------- */

.score-stats-progress-page
.month-analysis-kpi-card,
.score-stats-progress-page
.month-analysis-source-card,
.score-stats-progress-page
.month-analysis-forecast-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-width: 0;
  min-height: var(--ma-card-min-h);
  padding: var(--ma-card-pad-y) var(--ma-card-pad-x);
  box-sizing: border-box;
  border: 1px solid var(--ma-card-border);
  border-radius: var(--ma-card-radius);
}


/* 卡片标签 */

.score-stats-progress-page
.month-analysis-kpi-label,
.score-stats-progress-page
.month-analysis-source-label,
.score-stats-progress-page
.month-analysis-forecast-label {
  margin: 0;
  color: #5f7488;
  font-size: var(--ma-label-size);
  line-height: 1.3;
  font-weight: 700;
  text-align: center;
}


/* 卡片主数值 */

.score-stats-progress-page
.month-analysis-kpi-value,
.score-stats-progress-page
.month-analysis-source-value,
.score-stats-progress-page
.month-analysis-forecast-value {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 3px;
  margin: 0;
  line-height: 1.05;
}

.score-stats-progress-page
.month-analysis-kpi-value
strong,
.score-stats-progress-page
.month-analysis-source-value
strong,
.score-stats-progress-page
.month-analysis-forecast-value
strong {
  font-size: var(--ma-value-size);
  line-height: 1.05;
  font-weight: 900;
  letter-spacing: -0.01em;
}

.score-stats-progress-page
.month-analysis-kpi-value
span,
.score-stats-progress-page
.month-analysis-source-value
span,
.score-stats-progress-page
.month-analysis-forecast-value
span {
  font-size: var(--ma-unit-size);
  font-weight: 700;
}


/* 卡片底部说明 */

.score-stats-progress-page
.month-analysis-kpi-compare,
.score-stats-progress-page
.month-analysis-source-card small,
.score-stats-progress-page
.month-analysis-forecast-card small {
  margin: 0;
  font-size: var(--ma-note-size);
  line-height: 1.3;
  font-weight: 700;
  text-align: center;
}


/* ---------------------------------------------------------
   六、区块间距与网格
   --------------------------------------------------------- */

.score-stats-progress-page
.month-analysis-kpi-section,
.score-stats-progress-page
.month-analysis-source-section,
.score-stats-progress-page
.month-analysis-forecast-section {
  width: 100%;
  max-width: 1060px;
  margin-top: var(--ma-section-gap);
  padding-top: 0;
  border-top: 0;
}

.score-stats-progress-page
.month-analysis-kpi-grid,
.score-stats-progress-page
.month-analysis-source-grid,
.score-stats-progress-page
.month-analysis-forecast-grid {
  display: grid;
  gap: var(--ma-grid-gap);
}

.score-stats-progress-page
.month-analysis-kpi-grid {
  grid-template-columns:
    repeat(5, minmax(0, 1fr));
}

.score-stats-progress-page
.month-analysis-forecast-grid {
  grid-template-columns:
    repeat(3, minmax(0, 1fr));
}


/*
 * 选题来源两张卡不再各占半屏。
 * 与上方五等分网格对齐：
 * 每张卡占 2 列，右侧留 1 列空位，
 * 使三行卡片的左边缘与列宽保持同一节奏。
 */

.score-stats-progress-page
.month-analysis-source-grid {
  grid-template-columns:
    repeat(2, minmax(0, 1fr));
}

.score-stats-progress-page
.month-analysis-source-card {
  grid-column: auto;
}


/* ---------------------------------------------------------
   七、语义配色
   --------------------------------------------------------- */

/* KPI 卡：中性蓝 */

.score-stats-progress-page
.month-analysis-kpi-card {
  background:
    linear-gradient(
      180deg,
      #fbfdff 0%,
      #f2f7fb 100%
    );
}

.score-stats-progress-page
.month-analysis-kpi-value
strong {
  color: #1f4e79;
}

.score-stats-progress-page
.month-analysis-kpi-value
span {
  color: #5f7488;
}


/* 自主选题卡：绿 */

.score-stats-progress-page
.month-analysis-source-card.is-self-selected {
  border-color: #cbe4d5;
  background:
    linear-gradient(
      180deg,
      #f6fcf8 0%,
      #eef7f1 100%
    );
}

.score-stats-progress-page
.month-analysis-source-card.is-self-selected
.month-analysis-source-value
strong {
  color: #1f7a45;
}


/* 安排选题卡：蓝 */

.score-stats-progress-page
.month-analysis-source-card.is-assigned {
  border-color: #cddfec;
  background:
    linear-gradient(
      180deg,
      #f7fbfe 0%,
      #eff5fa 100%
    );
}

.score-stats-progress-page
.month-analysis-source-card.is-assigned
.month-analysis-source-value
strong {
  color: #26618f;
}


/* ---------------------------------------------------------
   八、选题来源卡：条数与稿分并排
   原为四层结构（标签／条数／产生基础稿分 N 分／占比），
   多出的中间行打散了视觉重心。
   现改为“条数 · 稿分”同一行并排，
   与 KPI 卡的三层结构完全同构。
   --------------------------------------------------------- */

.score-stats-progress-page
.month-analysis-source-value {
  gap: 10px;
}


/*
 * “产生基础稿分 N 分”提升为主数值的一部分，
 * 与条数同排显示，字号与条数一致。
 */

.score-stats-progress-page
.month-analysis-source-score {
  display: flex;
  align-items: baseline;
  gap: 3px;
  margin: 0;
  color: #5f7488;
  font-size: var(--ma-unit-size);
  line-height: 1.05;
  font-weight: 700;
}

.score-stats-progress-page
.month-analysis-source-score
strong {
  font-size: var(--ma-value-size);
  line-height: 1.05;
  font-weight: 900;
  letter-spacing: -0.01em;
}

.score-stats-progress-page
.month-analysis-source-card.is-self-selected
.month-analysis-source-score
strong {
  color: #1f7a45;
}

.score-stats-progress-page
.month-analysis-source-card.is-assigned
.month-analysis-source-score
strong {
  color: #26618f;
}


/*
 * 条数与稿分之间的竖线分隔。
 */

.score-stats-progress-page
.month-analysis-source-metrics {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 12px;
}

.score-stats-progress-page
.month-analysis-source-metrics
> * + * {
  padding-left: 12px;
  border-left: 1px solid rgba(90, 114, 136, 0.22);
}


/* 占比说明 */

.score-stats-progress-page
.month-analysis-source-card
small {
  color: #6c8093;
}


/* ---------------------------------------------------------
   九、剩余预测卡配色
   --------------------------------------------------------- */

.score-stats-progress-page
.month-analysis-forecast-card {
  background:
    linear-gradient(
      180deg,
      #fbfdff 0%,
      #f2f7fb 100%
    );
}

.score-stats-progress-page
.month-analysis-forecast-card
.month-analysis-forecast-value
strong {
  color: #1f4e79;
}

.score-stats-progress-page
.month-analysis-forecast-card
.month-analysis-forecast-value
span {
  color: #5f7488;
}

.score-stats-progress-page
.month-analysis-forecast-card
small {
  color: #6c8093;
}


/*
 * 稿分预测卡保留暖色强调，
 * 与左侧两张事实性卡片区分开。
 */

.score-stats-progress-page
.month-analysis-forecast-card.is-score {
  border-color: #f0dcc4;
  background:
    linear-gradient(
      180deg,
      #fffaf4 0%,
      #fdf2e4 100%
    );
}

.score-stats-progress-page
.month-analysis-forecast-card.is-score
.month-analysis-forecast-value
strong {
  color: #c2660f;
}


/* ---------------------------------------------------------
   十、矮屏适配
   统一收窄卡片高度与字号，
   替代此前分散在多处的压缩规则。
   --------------------------------------------------------- */

@media (max-height: 800px) {
  .score-stats-progress-page {
    --ma-card-min-h: 78px;
    --ma-card-pad-y: 8px;
    --ma-value-size: 23px;
    --ma-section-gap: 8px;
  }

  .score-stats-progress-page
  .month-progress-bar {
    height: 24px;
  }
}

@media (max-height: 720px) {
  .score-stats-progress-page {
    --ma-card-min-h: 68px;
    --ma-card-pad-y: 6px;
    --ma-value-size: 20px;
    --ma-label-size: 11px;
    --ma-section-gap: 7px;
    --ma-grid-gap: 6px;
  }

  .score-stats-progress-page
  .month-progress-bar {
    height: 22px;
  }

  .score-stats-progress-page
  .month-progress-text {
    font-size: 12px;
  }
}


/* ---------------------------------------------------------
   十一、打印
   --------------------------------------------------------- */

@media print {
  .score-stats-progress-page
  .month-analysis-kpi-card,
  .score-stats-progress-page
  .month-analysis-source-card,
  .score-stats-progress-page
  .month-analysis-forecast-card {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}


/* ---------------------------------------------------------
   十二、对齐与间距修正（20260805）

   1) “本月时间进度”标题仍居中：
      .score-stats-modal .summary-progress .progress-title
      为三类选择器，特异性高于本段原有的两类规则，
      因此这里补足层级使其左对齐。
   2) 进度条与内容区左右边缘对齐。
   3) 收紧顶部纵向间距。
   --------------------------------------------------------- */

.score-stats-progress-page
.summary-progress
.progress-title,
.score-stats-modal
.score-stats-progress-page
.progress-title {
  flex: 0 0 auto;
  justify-content: flex-start;
  margin: 0 0 6px;
}


/*
 * 进度条、说明区与三行卡片统一为同一宽度，
 * 保证左右边缘完全对齐。
 */

.score-stats-progress-page
.progress-title,
.score-stats-progress-page
.month-progress-bar,
.score-stats-progress-page
#monthProgressDesc,
.score-stats-modal
.score-stats-progress-page
.month-progress-bar {
  width: 100%;
  max-width: 1060px;
  box-sizing: border-box;
}


/*
 * “统计截至”说明与进度条的间距收紧，
 * 使其在视觉上从属于上方进度条。
 */

.score-stats-progress-page
.month-analysis-overview {
  margin-top: 7px;
}

.score-stats-progress-page
.month-analysis-kpi-section {
  margin-top: 6px;
}


/* ---------------------------------------------------------
   十三、高窗口：回收底部留白（20260805）

   04 页主体为 flex 列容器且内容顶对齐，
   窗口较高时多余空间会全部堆在底部。
   这里在高窗口下放大卡片与间距，
   让三行卡片自然填满可用高度，
   而不是留下一整片空白。
   --------------------------------------------------------- */

@media (min-height: 801px) {
  .score-stats-progress-page {
    --ma-card-min-h: 112px;
    --ma-card-pad-y: 14px;
    --ma-value-size: 30px;
    --ma-label-size: 13px;
    --ma-unit-size: 13px;
    --ma-note-size: 12px;
    --ma-grid-gap: 10px;
    --ma-section-gap: 16px;
  }

  .score-stats-progress-page
  .month-progress-bar {
    height: 30px;
  }

  .score-stats-progress-page
  .month-progress-text {
    font-size: 14px;
  }

  .score-stats-progress-page
  .month-analysis-section-heading
  strong,
  .score-stats-progress-page
  .progress-title
  strong {
    font-size: 15px;
  }

  .score-stats-progress-page
  .month-analysis-overview {
    margin-top: 9px;
  }

  .score-stats-progress-page
  .month-analysis-kpi-section {
    margin-top: 9px;
  }
}


/* ============================================================
 * 04 页收尾打磨
 *
 * 1. 剩余时间卡恢复底部说明文字，
 *    使三张预测卡的信息层级一致。
 * 2. 进度条标题标注计算口径，
 *    与下方按播出日期统计的数据区分开。
 * ============================================================ */

.score-stats-progress-page
.month-analysis-forecast-card.is-remaining {
  justify-content: flex-start;
}

.score-stats-progress-page
.month-analysis-forecast-card.is-remaining small {
  display: block;
}

.score-stats-modal
.summary-progress
.progress-title {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}

.score-stats-modal
.summary-progress
.progress-title
.progress-title-basis {
  font-size: 12px;
  font-weight: 400;
  color: #7c8da3;
  letter-spacing: 0.2px;
}

/* =========================================================
   四、图例交互提示文字
   ========================================================= */

.trend-legend-row
.trend-legend-hint {
  flex: 0 0 auto;
  margin-left: auto;
  padding-right: 2px;
  color: #7c8b99;
  font-size: 12px;
  line-height: 1.3;
  white-space: nowrap;
  user-select: none;
}

.trend-modal-box
.trend-legend-row
.trend-legend-hint {
  flex: 0 0 auto;
  margin-left: auto;
}

.trend-modal-box
.trend-legend-row
.trend-show-all-btn {
  margin-left: 0;
}

@media (max-width: 900px) {
  .trend-legend-row
  .trend-legend-hint {
    display: none;
  }
}

/* =========================================================
   五、修正：提示文字与“全部显示”按钮争夺横向空间
   两者原本都设了 margin-left: auto，导致按钮被压缩变形。
   改为仅由提示文字负责推开，按钮禁止收缩。
   ========================================================= */

.trend-legend-row
.trend-legend-hint {
  margin-left: auto;
}

.trend-modal-box
.trend-legend-row
.trend-show-all-btn,
.score-stats-trend-mount
.trend-legend-row
.trend-show-all-btn {
  flex: 0 0 auto;
  margin-left: 10px;
  width: auto;
  min-width: 84px;
  height: 29px;
  padding: 0 14px;
  box-sizing: border-box;
  white-space: nowrap;
  line-height: 27px;
  text-align: center;
}

.month-refresh-row .small {
  flex: 1 1 auto;
  min-width: 0;
}

/* Saving is a short exclusive operation; keep the existing layout stable. */
body.news-save-busy #tableBody,
body.news-save-busy #monthQueryModal,
body.news-save-busy #logoutBtn,
body.news-save-busy #uploadBtn,
body.news-save-busy #addRowBtn { pointer-events: none; }
body.news-save-busy .edit-input,
body.news-save-busy #tableBody button,
body.news-save-busy #tableBody select { opacity: 0.65; }
.edit-input.invalid-score { outline: 2px solid #c92a2a; outline-offset: -2px; background-color: #fff3f3; }