/* ============================================================
   AI 雷达 · 重置速查表 + 详情页
   详情页结构与参数 1:1 对标 whenreset.dev/zh-cn/codex：
   paper(统计条[elapsed-stat 实心黄 36px] + cal-toolbar + cal-layout)
   + tbl-head + paper(table 固定布局 colgroup) + about
   ============================================================ */

/* ---------- 通用页头 ---------- */
.page-head { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 28px; }
.page-head h1 { font-size: 26px; font-weight: 800; }
.back { font-size: 13px; color: var(--sub); }
.meta-bar { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; align-items: center; }
.mchip { font-size: 11px; color: var(--sub); border: 1px solid var(--line); background: var(--card); border-radius: 999px; padding: 2px 10px; }
.mchip.warn { color: var(--amber); background: var(--amber-bg); border-color: var(--amber-line); }

/* ---------- 公告横条 ---------- */
.ann {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  border: 1.5px solid var(--line); border-radius: 12px;
  background: color-mix(in srgb, var(--yellow) 40%, var(--card));
  color: var(--ink); padding: 14px 18px; margin: 18px 0 16px; font-size: 14px;
}
.ann b { font-weight: 800; }
.ann a { margin-left: auto; white-space: nowrap; font-weight: 700; color: var(--ink); text-decoration: none; }
.ann a:hover { color: var(--reset); }

/* ---------- paper 卡（2px 粗描边 + 实体阴影，whenreset 同款） ---------- */
.paper {
  background: var(--card);
  border: 2px solid var(--edge);
  box-shadow: 4px 4px 0 var(--shadow);
  border-radius: 14px;
  overflow: hidden;
}
.dcard { /* 同义兼容 */
  background: var(--card);
  border: 2px solid var(--edge);
  box-shadow: 4px 4px 0 var(--shadow);
  border-radius: 14px;
  overflow: hidden;
}
.detail { margin-top: 26px; }

/* ---------- 统计条（paper 顶部，3 列，第一格 elapsed-stat 实心黄） ---------- */
.stats {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1.2fr;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
}
.stat { padding: 14px 20px 16px; border-right: 1px solid var(--line); min-width: 0; }
.stat:last-child { border-right: none; }
.stat .k { font-size: 12.5px; font-weight: 600; color: var(--sub); margin-bottom: 2px; }
.stat .v { font-size: 34px; font-weight: 800; line-height: 1.15; color: var(--ink); font-variant-numeric: tabular-nums; }
.stat .v.md { font-size: 30px; }
.stat .s { font-size: 12.5px; color: var(--sub); margin-top: 4px; }
.elapsed-stat { background: var(--yellow); color: #2c261f; border-right: 1px solid var(--line); }
.elapsed-stat .k { color: #5a4a10; }
.elapsed-stat .v { color: #2c261f; font-size: 36px; }
.elapsed-stat .s { color: #5a4a10; }

/* ---------- 日历内容（cal-with-summary 内） ---------- */
.cal-content { padding: 16px 20px 18px; }
.cal-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }

/* 视图切换胶囊：热力图 | 日历 */
.cal-view-toggle {
  display: flex; border: 1px solid var(--line); background: var(--card);
  border-radius: 999px; padding: 2px;
}
.cal-view-toggle button {
  border: 0; background: transparent; color: var(--sub);
  font-size: 13px; font-weight: 700; padding: 5px 18px;
  border-radius: 999px; cursor: pointer;
}
.cal-view-toggle button.on { background: var(--yellow); color: #2c261f; }

.cal-legend { display: flex; gap: 14px; align-items: center; font-size: 11.5px; color: var(--sub); flex-wrap: wrap; }
.cal-legend .sw { display: inline-block; width: 13px; height: 13px; border-radius: 4px; margin-right: 5px; vertical-align: -2px; }

/* ----- 热力图：1:1 复刻（左星期列 + 横滚周矩阵） ----- */
.cal-layout { --cal-cell-size: 22px; --cal-weeks: 26; display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 8px; }
.weekdays {
  display: grid; grid-template-rows: repeat(7, var(--cal-cell-size)); gap: 3px;
  margin-top: 21px; font-size: 10px; color: var(--sub);
  text-align: center; align-items: center;
}
.cal-scroll { overflow-x: auto; padding-bottom: 6px; }
.cal-body {
  width: 100%;
  display: grid; gap: 3px;
}
.months {
  display: grid; grid-template-columns: repeat(var(--cal-weeks), minmax(0, 1fr));
  gap: 3px; height: 14px; margin-bottom: 4px;
  font: 600 10px ui-monospace, monospace; color: var(--sub);
}
.cal-grid {
  display: grid;
  grid-template-columns: repeat(var(--cal-weeks), minmax(0, 1fr));
  grid-template-rows: repeat(7, 1fr);
  grid-auto-flow: column; gap: 3px;
}
.cal-day {
  aspect-ratio: 1; box-sizing: border-box;
  background: var(--cal-empty); border: 0; border-radius: 5px;
  min-width: 0; padding: 0; display: block; cursor: pointer;
  font: 600 12px ui-monospace, monospace; color: color-mix(in srgb, var(--ink) 55%, var(--cal-empty));
}
.cal-day:hover { outline: 2px solid var(--reset); outline-offset: 1px; }
.cal-day.r { background: var(--reset); color: #fff; }
.cal-day.c { background: var(--banked); color: #fff; }
.cal-day.r.c { background: color-mix(in srgb, var(--reset) 60%, var(--banked)); color: #fff; }
.cal-day.partial { background: color-mix(in srgb, var(--banked) 55%, var(--cal-empty)); }
.cal-day.t { outline: 2px solid var(--edge); outline-offset: -2px; }
.cal-day.f { opacity: 0.45; cursor: default; color: transparent; }
.cal-day.f:hover { outline: none; }

/* ----- 日历视图（双月并排，铺满版心） ----- */
.mon-head { display: flex; align-items: center; gap: 14px; margin: 4px 0 12px; flex-wrap: wrap; }
.mon-head b { font-size: 15px; }
.dual-cal { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.mon-title { font-size: 14px; font-weight: 800; text-align: center; margin-bottom: 8px; }
.mon-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }   /* 10-01 修：1fr 的隐含 min=auto,月初密集的厂商 logo 抬高 min-content 把列撑到 53px 溢出半区挤歪下月框（同第47次档案卡 minmax(0,1fr) 根治法） */
.mon-wd { font-size: 11px; font-weight: 700; color: var(--sub); text-align: center; padding-bottom: 2px; }
.mon-day {
  min-height: 46px; border-radius: 8px; border: 1px solid var(--line);
  background: var(--card); font-size: 12.5px; font-weight: 700; color: var(--ink);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 3px; cursor: pointer; font-variant-numeric: tabular-nums; padding: 4px 0;
}
.mon-day:hover { border-color: var(--reset); }
.mon-day.empty-d { background: transparent; color: transparent; border-color: transparent; cursor: default; }
.mon-day.t { outline: 2px solid var(--edge); outline-offset: -2px; }
.mon-day .ev { display: flex; gap: 3px; }
.mon-day .ev i { width: 7px; height: 7px; border-radius: 2px; display: block; }
.mon-day .ev i.r { background: var(--reset); }
.mon-day .ev i.c { background: var(--banked); }

#dayinfo {
  margin-top: 12px; font-size: 13px; color: var(--ink); min-height: 22px;
  background: color-mix(in srgb, var(--reset) 10%, var(--card));
  border-left: 3px solid var(--reset);
  padding: 7px 12px; border-radius: 0 8px 8px 0; display: none;
}
#dayinfo.on { display: block; }
#dayinfo b { color: var(--reset); }

/* ============================================================
   记录表 1:1（tbl-head + paper > table 固定布局）
   ============================================================ */
.tbl-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; margin: 0 2px 8px; }
.tbl-head h2, .tbl-head h3 { font-size: 18px; font-weight: 800; margin: 0; }
.tbl-head span, .tbl-head .cnt { color: var(--sub); font-size: 13px; font-weight: 500; }

.tbl-wrap { border-radius: inherit; }
.tbl { border-radius: inherit; overflow-x: auto; }
.tbl table, table.rec-table {
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
  min-width: 680px;
  font-size: 14px;
}
.rec-table th {
  text-align: left;
  font: 600 11px ui-monospace, monospace;
  letter-spacing: 0.1em;
  color: var(--sub);
  border-bottom: 2px solid var(--edge);
  padding: 10px 14px;
  white-space: nowrap;
}
.rec-table td {
  border-bottom: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
  vertical-align: middle;
  padding: 12px 14px;
  line-height: 20px;
  background: transparent;
}
.rec-table tbody tr:last-child td { border-bottom: 0; }
tr.row { cursor: pointer; }
tr.row:hover td { background: color-mix(in srgb, var(--reset) 6%, var(--card)); }
tr.row:focus-visible td { background: color-mix(in srgb, var(--reset) 8%, var(--card)); outline: none; }
td.d { font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }
td.d small { display: block; font-weight: 500; font-size: 11.5px; color: var(--faint); }
td.scope { color: var(--sub); font-size: 13.5px; }
td.why { color: var(--ink); font-size: 13.5px; }
td.src { text-align: center; }
td.src a { display: inline-flex; color: var(--sub); padding: 4px; border-radius: 8px; }
td.src a:hover { color: var(--ink); background: color-mix(in srgb, var(--ink) 6%, transparent); }

/* 类型 pill（图标 + 文字） */
.pill {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12.5px; font-weight: 600; color: var(--ink); white-space: nowrap;
}
.pill svg { flex: none; width: 16px; height: 16px; }
.pill.p-reset svg { color: var(--reset); }
.pill.p-card svg { color: var(--banked); }

/* 原因 tag 彩标 */
.tag {
  display: inline-block; font-size: 11.5px; font-weight: 700;
  padding: 2px 9px; border-radius: 7px; margin-right: 7px; white-space: nowrap;
}
.tag.fix, .tag.ok { color: var(--reset); background: color-mix(in srgb, var(--reset) 16%, transparent); }
.tag.unstated, .tag.warn { color: #7a4a06; background: color-mix(in srgb, var(--yellow) 70%, var(--card)); }
.tag.new { color: var(--blue); background: color-mix(in srgb, var(--blue) 14%, transparent); }

/* 点击行展开的来源详情 */
tr.detail { display: none; }
tr.detail.open { display: table-row; }
tr.detail td { background: color-mix(in srgb, var(--ink) 3%, var(--card)); padding: 10px 14px 12px; }
.tl { list-style: none; display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.tl li { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; color: var(--sub); }
.tl .role {
  font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 6px;
  color: var(--reset); background: color-mix(in srgb, var(--reset) 15%, transparent);
}
.tl .when { font-variant-numeric: tabular-nums; color: var(--faint); font-size: 12.5px; }
.tl a { color: var(--ink); font-weight: 700; text-decoration: none; }
.tl a:hover { color: var(--reset); }

/* ---------- 关于 ---------- */
.about { margin-top: 28px; padding: 0 2px; }
.about h3 { font-size: 15px; font-weight: 800; margin-bottom: 8px; }
.about p { font-size: 13.5px; color: var(--sub); line-height: 1.9; }

/* ============================================================
   速查表首页（每套餐一框架的卡片网格）
   ============================================================ */
.vgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(520px, 1fr)); gap: 20px; margin-top: 18px; }
.vcard { background: var(--card); border: 2px solid var(--edge); box-shadow: 4px 4px 0 var(--shadow); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; }
.dhead { display: flex; align-items: center; gap: 12px; padding: 16px 20px; border-bottom: 2px solid var(--edge); flex-wrap: wrap; }
.vicon { flex: none; width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; font-size: 15px; }
.dhead h2 { font-size: 19px; font-weight: 800; }
.dhead .src { font-size: 12px; color: var(--faint); }
.more { margin-left: auto; font-size: 12.5px; color: var(--ink); border: 2px solid var(--edge); border-radius: 999px; padding: 5px 16px; background: var(--card); font-weight: 700; text-decoration: none; }
.more:hover { background: var(--yellow); }
.badge { display: inline-block; font-size: 11.5px; font-weight: 700; padding: 2px 10px; border-radius: 999px; white-space: nowrap; }
.badge.ok { color: var(--reset); background: color-mix(in srgb, var(--reset) 14%, transparent); border: 1px solid color-mix(in srgb, var(--reset) 35%, transparent); }
.badge.soon { color: #7a4a06; background: color-mix(in srgb, var(--yellow) 65%, transparent); border: 1px solid color-mix(in srgb, var(--yellow) 80%, transparent); }
.badge.spec { color: var(--faint); border: 1px solid var(--line); }
.mini { padding: 10px 16px 14px; }
.mini h4 { font-size: 11px; color: var(--faint); font-weight: 700; margin-bottom: 4px; letter-spacing: 0.5px; }
table.rt { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.rt td { padding: 7px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.rt tr:last-child td { border-bottom: none; }
.rt .d { font-weight: 800; white-space: nowrap; font-variant-numeric: tabular-nums; }
.note-box {
  margin: 14px 16px 16px;
  background: color-mix(in srgb, var(--yellow) 30%, var(--card));
  border-left: 3px solid var(--amber);
  padding: 10px 14px; border-radius: 0 8px 8px 0; font-size: 13px; line-height: 1.7;
}

/* ---------- 兼容：速查表卡片内 2 列统计 + 迷你表标签 ---------- */
.vcard .stats { grid-template-columns: 1fr 1fr; border-bottom: none; }
.vcard .stat { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.vcard .stat:nth-child(2n) { border-right: none; }
.vcard .stat .v { font-size: 24px; }
.vcard .stat .v.md { font-size: 16px; }
.vcard .stat.hl { background: var(--yellow); border-right: 1px solid var(--line); }
.vcard .stat.hl .k, .vcard .stat.hl .v, .vcard .stat.hl .s { color: #2c261f; }
.tagb {
  display: inline-block; font-size: 11.5px; font-weight: 700;
  padding: 2px 9px; border-radius: 7px; margin-right: 6px; white-space: nowrap;
}
.tagb.refresh { color: var(--reset); background: color-mix(in srgb, var(--reset) 16%, transparent); }
.tagb.price { color: #7a4a06; background: color-mix(in srgb, var(--yellow) 70%, var(--card)); }
.tagb.model { color: var(--blue); background: color-mix(in srgb, var(--blue) 14%, transparent); }

@media (max-width: 900px) {
  .dual-cal { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .vgrid { grid-template-columns: 1fr; }
  .stats { grid-template-columns: 1fr; }
  .stat { border-right: none; border-bottom: 1px solid var(--line); }
  .elapsed-stat { border-right: none; }
}