/* 总览 —— 仅引用 tokens.css 中的变量。字阶、容器查询与按压反馈在本文件内显式设定，不依赖其他工作包的全局规则。
   重排按内容区宽度（布局与断点「桌面工作区」）：.overview 是命名容器 ov，阈值以 rem 计，侧栏、窗口与字号变化时自动切换。 */
.overview { display: grid; gap: 28px; min-width: 0; container: ov / inline-size; }
/* 家底与趋势分区只允许整列宽：窄视口（如 390 下桌面站点侧栏占位）不得按内容最小宽撑破页面。
   查询容器只声明在 .overview 上（同名嵌套会让 @container ov 命中最近的 section），分区自身用 min-width: 0 */
.overview > section { min-width: 0; }
.overview section, .overview article { min-width: 0; }
/* 字阶：分区标题用弹窗标题级、卡片标题用卡片标题级（字体「字阶」）；说明文字用辅助说明级 */
.overview h2 { font-size: var(--text-dialog-title); line-height: 1.3; letter-spacing: -0.015em; }
.overview h3 { font-size: var(--text-card-title); line-height: 1.35; }
.overview :is(h2, h3, h4, b, strong) { font-weight: 600; }
.overview p { font-size: var(--text-caption); line-height: 1.5; overflow-wrap: anywhere; }
.overview .overview-caption { font-size: var(--text-caption); line-height: 1.5; overflow-wrap: anywhere; }
.overview :is(dt, small, summary, th, td) { font-weight: 400; }
.overview-section-head, .overview-selectors, .overview-trend-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.overview-section-head { margin-bottom: 16px; }
.overview-section-head h2 { margin: 0; }
.overview-section-head .field-help { font-size: var(--text-caption); line-height: 1.5; }
.overview-selectors { gap: 8px 12px; }
.overview-selectors .field { min-width: 8rem; max-width: 100%; }
/* 计划版本按表单规范：去掉原生箭头，外壳右侧单线箭头（不拦截点击）；可点区域覆盖整个外壳高度 */
.overview-selectors .input-shell > select.select { display: flex; align-items: center; height: 100%; min-height: 44px; padding: 0 24px 0 0; font-size: var(--text-table); font-weight: 400; }
/* 年度选择器：44px 胶囊、年份等宽；菜单右对齐锚定入口，限高滚动（结构见 overview.mjs） */
.overview .overview-year-field { gap: 6px; }
.overview .annual-year { display: flex; align-items: center; }
.overview .annual-year > button { width: 100%; }
.overview .overview-year-value { white-space: nowrap; }
.overview .year-menu { max-height: min(18rem, 55vh); }
.overview .year-menu button { font-weight: 400; }
.overview .year-menu [aria-selected="true"] { font-weight: 600; }
.overview-annual-grid { display: grid; grid-template-columns: minmax(0,1.3fr) repeat(2,minmax(0,1fr)); gap: 16px; }
.overview .panel { padding: 20px; }
.overview-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
/* 数字卡数值取 KPI 级：34px、600、1.1、−0.02em、display 字体、等宽数字；单位用正文级 500 */
.overview-number { display: inline; font: 600 var(--text-kpi)/1.1 var(--font-display); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.overview-number small { margin-left: 2px; font-family: var(--font-body); font-size: var(--text-body); font-weight: 500; letter-spacing: 0; }
/* 数值入口：48×48 命中区；负外边距抵消等量内边距，文字矩形位置与改前一致（可访问性触控 44、AD-03 第 3 条） */
.overview-value { display: inline-flex; align-items: center; width: max-content; margin: 0 -7px; padding: 0 7px; min-height: 44px; color: var(--fg); text-decoration: none; border-radius: var(--radius-sm); transition: background var(--motion-fast) var(--ease-standard), transform var(--motion-fast) var(--ease-standard); }
@media (hover: hover) { .overview .overview-value:hover { background: var(--fill-soft); text-decoration: none; } }
.overview .overview-value:active { background: var(--fill-soft); transform: scale(.97); transition-duration: 0ms; }
.overview-facts { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin: 12px 0; }
.overview-facts dt { font-size: var(--text-caption); line-height: 1.5; color: var(--muted); }
.overview-facts dd { margin: 0; font-variant-numeric: tabular-nums; }
/* 年度卡内数值链接：48×48 命中区；负外边距抵消等量内边距，文字位置不变 */
.overview-facts .btn { margin: 0 -9px; padding: 0 9px; }
.overview-rate { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin: 12px 0; font-size: var(--text-table); }
.overview-rate strong { font: 600 var(--text-kpi)/1.1 var(--font-display); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.overview-progress { width: 100%; height: 8px; border-radius: var(--radius-sm); background: var(--fill-soft); position: relative; }
.overview-progress i { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
/* 超额标记：2px 竖条（图表「进度与完成率」），不用字符；进度条照满格，文字仍显示实际比例。圆角取胶囊档，2px 宽时实际为 1px 圆端 */
.overview-progress.is-over::after { content: ""; position: absolute; top: -4px; right: -2px; width: 2px; height: 16px; border-radius: var(--radius-pill); background: var(--fg); }
.overview-distributions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.overview-distributions h4 { margin: 14px 0 4px; font-size: var(--text-label); line-height: 1.3; color: var(--muted); }
/* 钻取行与折叠摘要：按下即时底色（transition-duration: 0ms），松开 150ms 回位；悬停只在具备 hover 的设备生效 */
.overview-distribution, .overview-region summary, .overview-trend summary {
  border-radius: var(--radius-sm);
  transition: background var(--motion-fast) var(--ease-standard);
}
.overview :is(.overview-distribution, .overview-region summary, .overview-trend summary):active { background: var(--fill-soft); transform: scale(.99); transition-duration: 0ms; }
@media (hover: hover) {
  .overview .overview-distribution:hover, .overview .overview-region summary:hover, .overview .overview-trend summary:hover { background: var(--fill-soft); }
}
.overview-distribution { display: grid; grid-template-columns: minmax(5rem,1fr) minmax(24px,1fr) minmax(5rem,auto); gap: 10px; align-items: center; min-height: 44px; padding: 0 8px; color: var(--fg); font-size: var(--text-table); text-decoration: none; overflow-wrap: anywhere; }
.overview-bar { display: block; height: 12px; }
.overview-bar i { display: block; min-width: 6px; height: 100%; border-radius: 0 6px 6px 0; }
.overview-bar i[data-width="0"] { min-width: 0; }
.overview-region summary, .overview-trend summary { min-height: 44px; padding: 12px 8px; cursor: pointer; font-size: var(--text-table); }
.overview-region.is-child { padding-left: 12px; }
.overview-tags, .overview-gaps { margin-block: 16px; }
.overview a.chip { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; color: var(--fg); }
.overview .row-wrap { gap: 8px; }
.overview-trend-head { margin-bottom: 12px; }
.overview-trend-head h3 { margin: 0; }
.overview-trend-chart { width: 100%; height: 20rem; min-height: 218px; }
.overview-trend .table-scroll { overflow-x: auto; max-width: 100%; }
.overview-trend table { width: 100%; border-collapse: collapse; font-size: var(--text-table); font-variant-numeric: tabular-nums; }
.overview-trend th, .overview-trend td { padding: 10px; border-bottom: 1px solid var(--border-soft); text-align: left; }
.overview a.chip, .overview .btn { white-space: normal; overflow-wrap: anywhere; }
.overview .chip, .overview .btn { min-height: 44px; }
.overview-region .overview-bar i { background-color: var(--accent); }
.overview-rate.is-money .overview-progress { height: 4px; }

/* ── 内容区容器查询：阈值以 rem 计（默认字号下 56rem≈896px、22rem≈352px） ── */
/* 不足 56rem：数字卡两列、两图通栏；年度区先通栏计划卡，再并排供应与农转 */
@container ov (max-width: 55.999rem) {
  .overview-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .overview-distributions { grid-template-columns: minmax(0,1fr); }
  .overview-annual-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .overview-annual-grid > .overview-card:first-child { grid-column: 1 / -1; }
}
/* 可用宽度不足 22rem：数字卡单列 */
@container ov (max-width: 21.999rem) { .overview-kpis { grid-template-columns: minmax(0,1fr); } }
/* 视口 ≤900px：年度卡单列（布局与断点「桌面工作区」） */
@media (max-width: 900px) { .overview-annual-grid { grid-template-columns: minmax(0,1fr); } .overview-annual-grid > .overview-card:first-child { grid-column: auto; } }
@media (max-width: 640px) { .overview { gap: 24px; } .overview .panel { padding: 16px; } .overview-distribution { grid-template-columns: minmax(4rem,1fr) minmax(12px,.6fr) minmax(4rem,1fr); gap: 6px; } .overview-selectors { width: 100%; } .overview-selectors .field { flex: 1; min-width: 0; } }
/* 触控尺寸查询：选择器、菜单选项与年度卡数值链接命中区 ≥44（布局与断点「密度与触控」、组件「开关与选择器」） */
@media (pointer: coarse) and (max-width: 1023px), (max-width: 640px) {
  .overview-selectors { width: 100%; }
  /* 年度与计划版本同一行，按 9rem∶8rem 起分余宽，“刷新数据”放不下时另起一行：计划版本不再被挤到只剩箭头，
     右对齐锚定的年度菜单也不越出页面左缘 */
  .overview-selectors .field { flex: 1 1 8rem; min-width: 0; }
  .overview-selectors .overview-year-field { flex: 1 1 9rem; }
  /* 计划版本是可编辑控件：触控下至少 max(16px, 1rem)（字体「触屏可编辑字号」），否则上面 0,3,1 的 13.5px 会压过 base.css 的触控规则 */
  .overview-selectors .input-shell > select.select { font-size: max(16px, 1rem); }
  .overview .year > button { width: 100%; height: auto; min-height: 44px; }
  .overview .year-menu button { min-height: 44px; }
  /* 年度卡数值链接左右各外扩 12px，负外边距抵消，文字位置不变。“未完成／待核”两链接夹着分隔符：
     前一链接画在分隔符文字之上（position: relative），后一链接从分隔符之后起算、只向右外扩，两者命中区不重叠 */
  .overview-facts .btn { position: relative; margin: 0 -12px; padding: 0 12px; }
  .overview-facts .btn + .btn { margin-left: 0; padding-left: 0; margin-right: -24px; padding-right: 24px; }
}
/* 减少动态效果：只保留底色反馈，不缩放（形状与动效「减少动态效果」）；覆盖 base.css 的胶囊缩放 */
@media (prefers-reduced-motion: reduce) { .overview :is(.overview-value, .overview-distribution, .overview-region summary, .overview-trend summary, .year > button, .menu button):active { transform: none; } }