之后
只要有一个换行或空格，正文第一行就会莫名缩进一截。内容必须紧贴着写。 */
white-space: pre-wrap; line-height: 1.65;
}
/* ---------------------------------------------------------------- 覆盖 Bootstrap 细节 */
.text-muted { color: var(--sms-muted) !important; }
.text-danger { color: var(--sms-danger) !important; }
hr { border-color: var(--sms-line); opacity: 1; }
/* 表格滚动容器要裁到卡片圆角上，否则首/末行会顶出直角 */
.card > .table-responsive:first-child { border-radius: calc(var(--r-lg) - 1px) calc(var(--r-lg) - 1px) 0 0; }
.card > .table-responsive:last-child { border-radius: 0 0 calc(var(--r-lg) - 1px) calc(var(--r-lg) - 1px); }
.card > .table-responsive:only-child { border-radius: calc(var(--r-lg) - 1px); }
/* 列表分页条。接在表格后面，所以自己收一下卡片的底角 */
.pager {
display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
padding: 12px 16px;
border-top: 1px solid var(--sms-line);
}
.card > .pager:last-child { border-radius: 0 0 calc(var(--r-lg) - 1px) calc(var(--r-lg) - 1px); }
.pager .hint { font-size: 12.5px; color: var(--sms-muted); }
.pager-links { display: flex; flex-wrap: wrap; gap: 4px; margin-left: auto; }
.pager .page-link {
display: inline-flex; align-items: center; justify-content: center;
min-width: 30px; height: 30px; padding: 0 9px;
border: 1px solid var(--sms-line); border-radius: var(--r-xs);
background: #fff; color: var(--sms-ink-2); font-size: 13px;
text-decoration: none;
transition: border-color var(--t), color var(--t), background-color var(--t);
}
.pager a.page-link:hover {
border-color: var(--sms-primary); color: var(--sms-primary);
background: var(--sms-primary-soft);
}
.pager .page-link.current {
background: var(--sms-primary); border-color: var(--sms-primary);
color: #fff; font-weight: 600;
}
.pager .page-link.disabled { color: var(--sms-faint); background: var(--sms-surface-2); }
.pager .page-gap {
display: inline-flex; align-items: center; height: 30px;
color: var(--sms-faint); font-size: 13px;
}
/* 可折叠的次要内容（如拜访提醒里「周期内」的那些中心） */
.fold { border-top: 1px solid var(--sms-line); }
.card > .fold:last-child {
border-radius: 0 0 calc(var(--r-lg) - 1px) calc(var(--r-lg) - 1px);
overflow: hidden;
}
.fold > summary {
display: flex; align-items: center; gap: 7px;
padding: 11px 16px;
font-size: 12.5px; color: var(--sms-muted);
cursor: pointer; user-select: none; list-style: none;
transition: color var(--t), background-color var(--t);
}
.fold > summary::-webkit-details-marker { display: none; }
.fold > summary::before {
content: ""; width: 6px; height: 6px; margin-left: 2px;
border-right: 1.6px solid currentColor;
border-bottom: 1.6px solid currentColor;
transform: rotate(-45deg);
transition: transform var(--t);
}
.fold[open] > summary::before { transform: rotate(45deg); }
.fold > summary:hover { color: var(--sms-primary); background: var(--sms-surface-2); }
/* header 自己已经有一条 border-bottom，紧跟其后的 .fold 再加一条就是 2px 粗线 */
.card > .card-header + .fold { border-top: 0; }
/* 折叠条上那一行预览：项目一多，靠它认得出哪条是哪条。
min-width:0 必须有 —— flex item 默认 min-width:auto，不加就撑开不省略号。 */
.me-prev {
flex: 1 1 auto; min-width: 0;
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
code { color: var(--sms-primary-hover); background: var(--sms-primary-soft); padding: 1px 6px; border-radius: 5px; font-size: .92em; }
kbd { background: var(--sms-ink); border-radius: 5px; font-size: .85em; }
/* 表格里的链接：正文色更沉，hover 才亮起来，避免整列发蓝 */
.table a { color: var(--sms-ink); font-weight: 500; transition: color var(--t); }
.table a:hover { color: var(--sms-primary); text-decoration: underline; text-underline-offset: 2px; }
/* 表格里的实心主按钮要压过上面的链接色，否则蓝底黑字看不清。 */
.table a.btn-primary,
.table a.btn-primary:hover,
.table a.btn-primary:focus {
color: #fff;
text-decoration: none;
}
.table tbody tr td .form-text { margin-top: 2px; }
/* ---------------------------------------------------------------- AI 优化 */
/* AI 优化按钮：旁边一排都是灰按钮，不做出区分根本找不着它。
用系统里已有的紫色（--sms-violet）配图标 —— 跟「保存」的实心蓝也不会打架。 */
.btn-ai {
display: inline-flex; align-items: center; gap: 5px;
border-color: #ddd6fb;
background: linear-gradient(135deg, var(--sms-violet-soft), var(--sms-primary-soft));
color: #5c3fd6; font-weight: 500;
}
.btn-ai:hover {
border-color: #b9a9f7; color: #4b30c0;
background: linear-gradient(135deg, #ece5ff, #e4ebfe);
box-shadow: 0 3px 10px -4px rgba(122, 90, 248, .6);
}
.btn-ai:disabled, .btn-ai:disabled:hover {
opacity: .6; box-shadow: none;
border-color: #ddd6fb; color: #5c3fd6;
background: linear-gradient(135deg, var(--sms-violet-soft), var(--sms-primary-soft));
}
.btn-ai .ico { width: 14px; height: 14px; stroke-width: 2.2; }
/* 按钮旁边的状态文字：优化中 / 已优化 N 处 / 具体报错 */
.ai-status { font-size: 12.5px; color: var(--sms-muted); }
.ai-status.ok { color: var(--sms-ok); }
.ai-status.bad { color: var(--sms-danger); }
.ai-status.warn { color: var(--sms-warn); }
/* AI 分析弹窗：先补信息再生成。跟按钮同一套紫色，让整块有辨识度。 */
#analyze-modal .modal-content {
border: none;
border-radius: 14px;
overflow: hidden;
box-shadow: 0 24px 60px -24px rgba(20, 30, 60, .4);
}
#analyze-modal .modal-header {
background: linear-gradient(135deg, var(--sms-violet-soft), var(--sms-primary-soft));
border-bottom: 1px solid var(--sms-violet-tint);
padding: 16px 20px;
}
#analyze-modal .ai-title-ico {
flex: 0 0 auto;
display: inline-flex; align-items: center; justify-content: center;
width: 32px; height: 32px;
background: #fff; border-radius: 9px;
box-shadow: 0 2px 8px -2px rgba(122, 90, 248, .45);
}
#analyze-modal .ai-title-ico .ico { width: 18px; height: 18px; stroke-width: 2.2; color: #5c3fd6; }
#analyze-modal .modal-title { font-size: 16px; font-weight: 600; color: #3a2f6b; }
#analyze-modal .ai-title-sub { font-size: 12.5px; color: var(--sms-muted); line-height: 1.4; }
#analyze-modal .modal-body { padding: 20px; }
/* 通读/生成中的加载态：居中、软底、虚线框，跟普通内容区分开 */
.analyze-phase {
display: flex; align-items: center; justify-content: center; gap: 10px;
padding: 36px 20px;
background: var(--sms-surface-2);
border: 1px dashed var(--sms-violet-tint);
border-radius: 12px;
color: #6b6594; font-size: 14px;
}
/* 多轮补信息的题目卡片 */
.analyze-q-hint { font-size: 12.5px; color: var(--sms-muted); margin-bottom: 12px; }
.analyze-question {
padding: 14px 16px;
background: var(--sms-surface-2);
border: 1px solid var(--sms-line);
border-radius: 12px;
margin-bottom: 12px;
transition: border-color .15s var(--ease), box-shadow .15s var(--ease);
}
.analyze-question:focus-within {
border-color: var(--sms-violet);
box-shadow: 0 0 0 3px var(--sms-violet-soft);
}
.analyze-q-label { display: flex; gap: 9px; align-items: flex-start; margin-bottom: 8px; }
.analyze-q-num {
flex: 0 0 auto;
width: 20px; height: 20px; border-radius: 50%;
background: linear-gradient(135deg, #8a6cf6, var(--sms-violet));
color: #fff; font-size: 12px; font-weight: 600;
display: inline-flex; align-items: center; justify-content: center;
margin-top: 1px;
}
.analyze-q-text { font-size: 13.5px; color: var(--sms-ink-2); line-height: 1.55; }
.analyze-question textarea { font-size: 13.5px; border-color: var(--sms-line); }
.analyze-question textarea:focus {
border-color: var(--sms-violet);
box-shadow: 0 0 0 3px var(--sms-violet-soft);
}
/* 提示词编辑框：等宽字体、行高松一些，长文本好读 */
.ai-prompt-box {
font-family: ui-monospace, "Cascadia Mono", Consolas, "Microsoft YaHei", monospace;
font-size: 12.5px;
line-height: 1.75;
}
/* 被 AI 改过的输入框闪一下，让人一眼看到哪里动了 —— 不闪的话
一屏几十个文本框，根本不知道它改了哪儿。 */
.ai-touched { border-color: var(--sms-primary) !important; animation: ai-flash 4.2s var(--ease); }
@keyframes ai-flash {
0%, 55% { background-color: var(--sms-primary-soft); }
100% { background-color: #fff; }
}
/* ============================================================ 双周会汇报 */
/* 展示页是开会投屏用的，不是录入表单 —— 排版准则是「一屏扫得完、后排看得清」，
所以留白、字号、行高都比别处大一档。录入表单在编辑页，两边样式不复用。 */
.mt-head {
display: flex; align-items: flex-start; gap: 16px;
flex-wrap: wrap; margin-bottom: 18px;
}
.mt-head-main { flex: 1 1 auto; min-width: 0; }
.mt-title {
font-size: 21px; font-weight: 650; color: var(--sms-ink);
margin: 0 0 7px; letter-spacing: -.018em; line-height: 1.35;
}
.mt-meta {
display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center;
font-size: 12.5px; color: var(--sms-muted);
}
.mt-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
/* ---------------------------------------------------------- 汇报计时 */
/* 讲的人用来自查「讲了多久」，只在汇报模式里出现。
**固定在右下角**：一往下翻页头部就滚没了，计时跟着头部走等于没有。
右下角不跟任何东西打架（头部那排按钮在右上角）。
**刻意做得淡**（用户要求）：白底浅灰字、不用红也不用琥珀、数字等宽 ——
等宽是为了跳秒时宽度不变，不会把旁边的字挤得动来动去（那比颜色更烦人）。
**不做**倒计时、不变色、不闪烁：这些都在给人压力，而这一页是拿来汇报的，不是考试。
跑着 = 实心小点，暂停 = 空心圈，**不靠颜色也能看出状态**。 */
.mt-timer-hud {
position: fixed; right: 18px; bottom: 16px; z-index: 30;
display: flex; align-items: center; gap: 2px;
padding: 3px 7px 3px 3px; border-radius: 999px;
background: rgba(255, 255, 255, .93);
border: 1px solid var(--sms-line);
box-shadow: var(--sh-sm);
font-size: 13.5px;
}
.mt-timer {
display: inline-flex; align-items: center; gap: 6px;
padding: 1px 7px; border-radius: 999px;
color: var(--sms-muted);
font-variant-numeric: tabular-nums;
cursor: pointer; user-select: none;
}
.mt-timer:hover { background: var(--sms-line-2); }
.mt-timer .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--sms-faint); }
.mt-timer.paused { color: var(--sms-faint); }
.mt-timer.paused .dot { background: transparent; box-shadow: inset 0 0 0 1.5px var(--sms-faint); }
.mt-timer-reset {
border: 0; background: transparent; padding: 1px 5px; border-radius: 5px;
color: var(--sms-faint); font-size: 13px; line-height: 1; cursor: pointer;
}
.mt-timer-reset:hover { color: var(--sms-muted); background: var(--sms-line-2); }
/* ---------------------------------------------------------- 概览条 */
.mt-summary {
/* 3 列：原先第 4 格是「风险分布」，需求说它不是重要展示项，移除了 */
display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 12px; margin-bottom: 16px;
}
.mt-stat {
background: #fff; border: 1px solid var(--sms-line);
border-radius: var(--r-md); padding: 13px 15px; box-shadow: var(--sh-xs);
}
.mt-stat .k { font-size: 12px; color: var(--sms-muted); margin-bottom: 6px; }
.mt-stat .v {
font-size: 22px; font-weight: 650; color: var(--sms-ink);
line-height: 1.1; letter-spacing: -.02em;
}
.mt-stat .v small { font-size: 13px; font-weight: 500; color: var(--sms-muted); }
.mt-stat .sub { font-size: 12px; color: var(--sms-muted); margin-top: 6px; }
/* 净值合计是这一屏里最该被看见的数字之一（领导最关心"这摊子值多少钱"），
淡灰小字太容易被忽略，给它一个带底色的标签。 */
.mt-stat .netamt {
display: inline-block; margin-left: 2px; padding: 1px 8px;
border-radius: 999px; font-weight: 650;
font-variant-numeric: tabular-nums; letter-spacing: -.01em;
}
.mt-stat.opp .sub { color: var(--sms-primary-hover); }
.mt-stat.opp .netamt { color: var(--sms-primary-hover); background: var(--sms-primary-soft); }
.mt-stat.won .sub { color: #0a7a53; }
.mt-stat.won .netamt { color: #0a7a53; background: var(--sms-ok-soft); }
.mt-stat.opp .v { color: var(--sms-primary-hover); }
.mt-stat.won .v { color: #0a7a53; }
/* ---------------------------------------------------------- 风险标记 */
.mt-risk {
display: inline-flex; align-items: center; gap: 6px;
font-size: 12.5px; color: var(--sms-ink-2); white-space: nowrap;
}
.mt-risk .dot {
width: 9px; height: 9px; border-radius: 50%; flex: 0 0 9px;
}
.mt-risk-green .dot { background: var(--sms-ok); }
.mt-risk-amber .dot { background: var(--sms-warn); }
.mt-risk-red .dot { background: var(--sms-danger); }
/* 概览条里那三个数字要和色点一样大，才像一组 */
.mt-risks { display: flex; gap: 16px; align-items: baseline; }
.mt-risks .mt-risk {
font-size: 22px; font-weight: 650; letter-spacing: -.02em; color: var(--sms-ink);
}
.mt-risks .mt-risk .dot { width: 8px; height: 8px; flex-basis: 8px; }
/* ---------------------------------------------------------- 总览表 */
.mt-table-wrap { overflow-x: auto; border-radius: var(--r-lg); }
.mt-table {
width: 100%; border-collapse: separate; border-spacing: 0;
background: #fff; border: 1px solid var(--sms-line);
border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-sm);
}
.mt-table thead th {
background: #f7f9fc; text-align: left; font-size: 12px; font-weight: 600;
color: var(--sms-muted); padding: 11px 14px;
border-bottom: 1px solid var(--sms-line); white-space: nowrap;
}
.mt-table .c-org, .mt-table .c-name { min-width: 130px; }
.mt-table .c-bid { min-width: 170px; }
/* 大类那一列：每行都有徽章，给个稳定宽度，免得每行宽窄不一 */
.mt-table .c-cat { white-space: nowrap; }
.mt-table .c-risk { white-space: nowrap; }
.mt-row { cursor: pointer; }
.mt-row > td {
padding: 13px 14px; font-size: 13.5px; color: var(--sms-ink-2);
border-bottom: 1px solid var(--sms-line-2); vertical-align: middle;
transition: background var(--t);
}
.mt-row:hover > td { background: #fafcff; }
.mt-row.open > td {
background: var(--sms-primary-soft); border-bottom-color: transparent;
}
.mt-row:focus-visible { outline: 0; }
.mt-row:focus-visible > td { box-shadow: inset 0 0 0 2px var(--sms-primary-ring); }
.mt-row > td.c-amount {
font-variant-numeric: tabular-nums; white-space: nowrap; font-weight: 500;
color: var(--sms-ink);
}
.mt-row > td.c-bid { color: var(--sms-muted); }
.mt-caret {
display: inline-block; width: 0; height: 0;
border-left: 5px solid currentColor;
border-top: 4.5px solid transparent; border-bottom: 4.5px solid transparent;
color: var(--sms-faint); transition: transform .18s var(--ease);
}
.mt-row.open .mt-caret { transform: rotate(90deg); }
/* ---------------------------------------------------------- 展开的详情 */
.mt-detail { display: none; }
.mt-detail.open { display: table-row; }
.mt-detail > td {
padding: 0; background: #fbfdff;
border-bottom: 1px solid var(--sms-line-2);
}
.mt-detail-inner { padding: 16px 18px 18px 46px; }
/* 「招标/上线」那一对年月下拉（项目表单和会议编辑页共用）。
Bootstrap 的 .form-select 自带 width:100%，放进 flex 容器里如果不显式平分，
两个都会想占满整行 —— 容器一允许换行（flex-wrap）就上下叠起来了。
这里给个明确的 flex:1 1 0，两边各占一半，跟容器怎么配都稳。 */
.bid-pair > .form-select { flex: 1 1 0; width: auto; min-width: 0; }
/* 「当前阶段 / 涉及协作」这两条：项目的属性，跟下面三段汇报正文不是一回事。
整行给一块淡蓝底 + 左边一道实色竖条，标签做成白底彩色药丸 ——
原来只有一个小灰药丸、底色又是白的，汇报模式投屏时基本看不见。
两块底色相同、上下只隔 8px，看着是一组。 */
.mt-coop {
display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px;
padding: 7px 12px; margin-bottom: 8px;
border-radius: var(--r-sm);
background: var(--sms-primary-tint);
border-left: 3px solid var(--sms-primary);
font-size: 13px; color: var(--sms-ink);
}
.mt-coop .k {
font-size: 11.5px; font-weight: 600; color: var(--sms-primary);
padding: 1px 8px; border-radius: 999px; background: #fff;
}
.mt-blank { font-size: 13px; color: var(--sms-muted); }
/* 「当前阶段」那一行：整条阶段链（走过 → 当前 → 未来），见 _stage_ladder.html。
**底色必须是白的**：上面 .mt-coop 那块淡蓝底会把「走过」的淡蓝药丸吞掉，
三态就只剩一点点深浅差，投屏上分不出来。左边那道实色竖条保留 —— 它才是
「这两行是一组」的线索。标签药丸也跟着反过来（深字淡底），白底白丸是看不见的。 */
.mt-stage-row {
display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px;
padding: 7px 12px; margin-bottom: 8px;
border-radius: var(--r-sm);
background: #fff;
border: 1px solid var(--sms-line);
border-left: 3px solid var(--sms-primary);
font-size: 13px; color: var(--sms-ink);
}
/* 标签用**中性灰**，不跟阶段药丸一样用淡蓝 —— 一样的底色让「当前阶段」看着
就像进度里的第一环（用户原话）。灰底灰字 = 「这是个字段名」，蓝底 = 「这是个阶段」。
字号跟阶段药丸一样大（用户要求整体缩小到跟标签齐平）。 */
.mt-stage-row .k {
font-size: 11.5px; font-weight: 600; color: var(--sms-ink-2);
padding: 1px 8px; border-radius: 999px; background: var(--sms-line);
}
/* 药丸链。flex-wrap：字典加到十几级也只是折行，不会把版面撑破。 */
.mt-stage { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.mt-stage-pill {
padding: 2px 10px; border-radius: 999px;
font-size: 11.5px; font-weight: 600; white-space: nowrap;
}
.mt-stage-passed { background: var(--sms-primary-tint); color: var(--sms-primary); }
/* 当前那一级：实心深蓝 + 白字 + 外圈一道光环。**不放大** —— 放大过一版，用户要求
跟其它药丸一样大：实心深蓝本来就跟淡蓝/白底一眼分得开，不必再靠字号。 */
.mt-stage-current {
background: var(--sms-primary); color: #fff;
box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--sms-primary-ring);
}
.mt-stage-future {
background: #fff; color: var(--sms-muted);
border: 1px solid var(--sms-line);
}
.mt-stage-sep { color: var(--sms-faint); font-size: 12px; line-height: 1; }
/* 兜底：阶段没定，或者那个值已经不在字典里了 —— 这时不画阶梯，退回文字。 */
.mt-stage-fallback { color: var(--sms-ink); }
.mt-stage-fallback .hint { color: var(--sms-muted); font-size: 12px; margin-left: 6px; }
/* ------------------------------------------------- 汇报模式：「正在汇报」到哪一块 */
/* 鼠标点选的位置标记：**只剩一块紫色背景**。
这一路是砍下来的，砍掉的每一版都在 README 和 spec 里记着原因，别再往回加：
- 左边加一道 4px 紫条 → 这页每个块本来就有 2-3px 的左边条，只差 1px + 一个色相
- 整个展开块外面再套一圈框 → 太丑，用户否掉
- 块自己一圈细框 + 留白里一支 ▶ → 用户说只留背景色就行
所以现在只有底色。**底色因此取得比 --sms-violet-soft 深一档**：原来那个 #f3f0ff
几乎就是白的，单独用根本看不出来（它当初只是给描边打底的）。
紫色是因为绿/黄/红被风险等级占了、蓝被阶段和链接占了，这页没用过紫色。
初始什么都不加 —— 「当前」完全由浏览器端 JS 决定，服务端不写死（JS 没跑就还是原样）。 */
.mt-seg.is-live {
border-radius: var(--r-sm);
background: var(--sms-violet-tint);
}
/* 汇报模式里这些东西是可以点的，给个手型 —— 不给的话没人知道能点。
（这不是标记的一部分，是「可点」的唯一提示，别跟着标记一起删。） */
html.reporting .mt-seg { cursor: pointer; }
/* 回款明细：**整行**可选中（讲到「这笔款」时点那一行）。底色铺在每个 td 上 ——
`tr` 上的 background 在部分浏览器里不生效。行自己的底线别动：留着才跟别的行一致。 */
.mt-pay tr.mt-seg.is-live > td { background: var(--sms-violet-tint); }
.mt-block { border-left: 2px solid var(--sms-line); padding-left: 13px; margin-bottom: 14px; }
.mt-block:last-child { margin-bottom: 0; }
.mt-block .h {
font-size: 11.5px; font-weight: 600; color: var(--sms-muted);
margin-bottom: 5px; letter-spacing: .02em;
}
.mt-block .b {
font-size: 13.5px; line-height: 1.75; color: var(--sms-ink-2);
/* 跟 .timeline-item .body 同款：换行要原样保留。
模板里内容必须紧贴
，否则模板缩进会被当正文渲染出来。 */
white-space: pre-wrap;
}
.mt-block.b1 { border-left-color: var(--sms-primary); }
.mt-block.b2 { border-left-color: var(--sms-danger); }
.mt-block.b3 { border-left-color: var(--sms-ok); }
/* ---------------------------------------------------------- 其它 · 图例 */
.mt-other {
margin-top: 18px; background: #fff; border: 1px solid var(--sms-line);
border-radius: var(--r-lg); padding: 15px 18px; box-shadow: var(--sh-sm);
}
.mt-other-b {
margin-top: 9px; font-size: 13.5px; line-height: 1.75;
color: var(--sms-ink-2); white-space: pre-wrap;
}
.mt-legend {
display: flex; flex-wrap: wrap; gap: 8px 22px;
margin-top: 14px; font-size: 12px; color: var(--sms-muted);
}
/* ---------------------------------------------------------- 年度目标完成 */
/* 汇报模式里领导最先要看的一眼：签单和回款各完成多少。纯数字 + 百分比，不做进度条
（需求明确否掉了进度条）。整块用蓝色调，跟上面灰色的概览条区分开 —— 这是 KPI，
那只是计数。 */
.mt-audit {
display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 14px; margin-bottom: 18px; padding: 16px 20px;
background: linear-gradient(180deg, #fbfcff, #f6f9ff);
border: 1px solid #d3defb; border-radius: var(--r-lg);
}
.mt-audit .k { font-size: 12.5px; color: var(--sms-muted); }
.mt-audit .v {
margin-top: 4px; font-size: 21px; font-weight: 600; color: var(--sms-ink);
font-variant-numeric: tabular-nums;
}
.mt-audit .v small { font-size: 12.5px; font-weight: 400; color: var(--sms-muted); }
.mt-audit .p { margin-top: 3px; font-size: 12.5px; font-weight: 600; color: var(--sms-primary); }
.mt-audit .p.muted { font-weight: 400; color: var(--sms-faint); }
html.reporting .mt-audit { padding: 20px 24px; }
html.reporting .mt-audit .k,
html.reporting .mt-audit .p { font-size: 14px; }
html.reporting .mt-audit .v { font-size: 28px; }
/* ---------------------------------------------------------- 收款块 */
/* 展示页的收款明细，复用 .mt-table 的表格外观，但**行不是可点开的**，所以没有
.mt-row。这里必须自己把单元格排版补上：.mt-table 的单元格样式全挂在 .mt-row > td
上，收款明细没有那个类，就掉回浏览器默认样式（内边距只有 2px 上下、字号 16px），
跟正上方那张项目表一比，两截表格的行高和左边缘全都对不齐。
写成 `.mt-pay .mt-table td` 而不是去改 `.mt-row > td`：改动那条会牵连总览表
里 .mt-row / .mt-detail 的一堆覆盖关系（金额列、展开行、归档态），风险大得多。 */
.mt-pay { margin-top: 22px; }
.mt-pay-sum { margin-bottom: 12px; }
.mt-pay .mt-table tbody > tr > td {
padding: 13px 14px; font-size: 13.5px; color: var(--sms-ink-2);
border-bottom: 1px solid var(--sms-line-2); vertical-align: middle;
}
/* 最后一行不画底线，让表格的圆角收干净（总览表那边是同一条规矩） */
.mt-pay .mt-table tbody > tr:last-child > td { border-bottom: 0; }
/* 金额是这一块要看的那个数：等宽数字（几行对得齐才扫得快）、加粗、近黑 */
.mt-pay .mt-table td.c-amount {
font-variant-numeric: tabular-nums; white-space: nowrap;
font-weight: 500; color: var(--sms-ink);
}
/* 「2026年12月第2周」是一个整体，断在中间没法读 */
.mt-pay .mt-table td.c-time { white-space: nowrap; }
/* 付款条件是自由文本（「预付30%、验收后付60%、质保金10%」这种一句话），不能 nowrap
—— 它比别的列长得多。给个下限只是别让它挤成每行一个字的竖条；太长就正常折行。 */
.mt-pay .mt-table .c-terms { min-width: 150px; }
/* 汇报模式：这四个数是要给领导看的，放大一档。标签跟着抬一点，不然反差太大。 */
html.reporting .mt-pay .pay-sum .k { font-size: 14px; }
html.reporting .mt-pay .pay-sum b { font-size: 26px; }
html.reporting .mt-pay .mt-table tbody > tr > td { font-size: 16px; padding: 17px 16px; }
/* ---------------------------------------------------------- 汇报模式 */
/* 开会投屏：藏掉侧边栏和顶栏，字号整体放大一档，一次只展开一个项目。
只切 html 上的一个类名，不另做页面 —— 散会后去掉 ?report=1 就回到只读页。 */
html.reporting .sidebar,
html.reporting .sidebar-backdrop,
html.reporting .topbar { display: none !important; }
html.reporting .page { padding: 30px 36px 64px; max-width: none; }
html.reporting .mt-head { margin-bottom: 22px; }
html.reporting .mt-title { font-size: 27px; }
html.reporting .mt-meta { font-size: 13.5px; }
/* 计时器在投屏上稍大一档（它是给讲的人看的，多半在电脑那头扫一眼，但投影上也得认得出） */
html.reporting .mt-timer-hud { font-size: 15px; bottom: 20px; right: 22px; }
html.reporting .mt-summary { gap: 16px; }
html.reporting .mt-stat .v,
html.reporting .mt-risks .mt-risk { font-size: 28px; }
html.reporting .mt-stat .sub { font-size: 13px; }
html.reporting .mt-table thead th { font-size: 13px; padding: 13px 16px; }
html.reporting .mt-row > td { font-size: 16px; padding: 17px 16px; }
html.reporting .mt-risk { font-size: 14.5px; }
html.reporting .mt-detail-inner { padding: 20px 22px 22px 50px; }
html.reporting .mt-block .h { font-size: 13px; }
html.reporting .mt-block .b,
html.reporting .mt-other-b { font-size: 16px; line-height: 1.9; }
/* 这两条也要跟着放大 —— 用户就是站在投屏前看这一块的，字号不动等于白改 */
html.reporting .mt-coop { font-size: 15px; padding: 9px 14px; }
html.reporting .mt-coop .k { font-size: 13px; }
/* 阶段链在投屏上要跟着放大 —— 这一页的用途就是投出来给一屋子人看 */
html.reporting .mt-stage-row { font-size: 15px; padding: 9px 14px; }
html.reporting .mt-stage-row .k { font-size: 13px; }
html.reporting .mt-stage-pill { font-size: 13px; padding: 3px 11px; }
/* 当前那级在投屏模式下也不放大 —— 跟普通模式一个规矩：只靠颜色和光环区分定位 */
html.reporting .mt-stage-sep { font-size: 13px; }
html.reporting .mt-stage-fallback .hint { font-size: 13px; }
/* 「正在汇报」只靠底色标记，没有描边和 ▶ 可放大 —— 投屏那档不需要额外规则。
真觉得后排看不清，加的不是描边（用户否过），是把非当前块的对比降一档，见 README。 */
@media (max-width: 991.98px) {
.mt-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mt-title { font-size: 18px; }
.mt-detail-inner { padding: 14px 14px 16px 18px; }
}
/* ---------------------------------------------------------- 编辑页 */
/* 展示页是投屏用的、要好读；编辑页是录入用的、要好填。两边取向不同，样式不复用。 */
.me-item .card-header .section-title { min-width: 0; overflow-wrap: anywhere; }
/* 三段的标签右边挂着「AI 润色」，所以标签和按钮要排一行 */
.me-label-row {
display: flex; align-items: center; justify-content: space-between;
gap: 10px; margin-bottom: 5px;
}
.me-label-row .form-label { margin-bottom: 0; }
.me-status { min-height: 17px; }
/* ============================================================ 门户首页 */
/* 域名根目录那一页。**个人站点** —— 不出现任何单位信息。
审美方向：**大厂式的亮色简约**（Apple / 华为那种），靠留白、字号和克制的质感
撑住，不靠堆装饰。这一版在原来「近白 + 大字」的基础上加了三样，都还很克制：
① 顶部一层柔和光斑（两个大半径模糊的径向渐变）—— 只做背景，不占内容位
② 卡片和胶囊换成半透明白 + 发丝描边 + 两级阴影，悬停轻轻上浮
③ 品牌色从苹果蓝换成偏靛的 #4f6df5，另配一个更深的号专门给文字用
仍然**不做**的：网格纹理、彩色描边叠着堆、等宽字体、序号、装饰插图。
干净本身就是高级感 —— 改这一页时守住这条。光斑是唯一的例外，因为它是背景层；
再往内容上叠东西就散了。
不继承 base.html：它是「系统外面」的入口，不该出现任何系统内部的导航。 */
.portal-body {
/* 门户自己的令牌，不复用后台那套 --sms-*：门户要零售级的干净，
跟后台那种带边框、带底色的表单不是一回事。 */
--p-bg: #fbfbfd; /* 页面底：不纯白，纯白在屏幕上偏冷 */
--p-bg-soft: #f5f6fa; /* 页脚底 */
--p-surface: rgba(255, 255, 255, .78); /* 卡片：半透明白，让下面的光斑透一点上来 */
--p-ink: #1a1d29; /* 主文字：近黑偏蓝，不用纯黑 */
--p-ink-2: #5b6172; /* 次文字 */
--p-ink-3: #9aa0b4; /* 分组标题、页脚那种更弱的字 */
--p-line: rgba(26, 29, 41, .08);
--p-brand: #4f6df5; /* 全站唯一强调色 */
--p-brand-ink: #3b55d9; /* 压深一档，给文字用（原色当正文偏浅） */
--p-brand-soft: rgba(79, 109, 245, .09);
--p-r: 18px;
--p-sh: 0 1px 2px rgba(26, 29, 41, .04), 0 8px 24px rgba(26, 29, 41, .06);
--p-sh-hover: 0 2px 4px rgba(26, 29, 41, .06),
0 16px 40px rgba(79, 109, 245, .14);
min-height: 100vh; display: flex; flex-direction: column;
background: var(--p-bg);
color: var(--p-ink-2);
}
/* 页内锚点（#apps / #links）平滑滚过去。
**必须挂在 上** —— scroll-behavior 不是可继承属性，跟 overflow 不一样，
写在 上一点作用都没有。用 .portal-html 钩子限定在门户这一页，
免得把后台那些页面的滚动一起改掉。 */
.portal-html { scroll-behavior: smooth; }
/* 精灵图不该占位。模板里用 class 而不是内联 style，所以这条必须有。 */
.portal-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
/* ---------------------------------------------------------- 站头 */
/* 半透明 + 饱和度增强 + 14px 模糊：滚动时底下的内容会透上来一点，但字始终清楚。 */
.portal-top {
position: sticky; top: 0; z-index: 10;
background: rgba(251, 251, 253, .72);
backdrop-filter: saturate(180%) blur(14px);
-webkit-backdrop-filter: saturate(180%) blur(14px);
border-bottom: 1px solid var(--p-line);
}
.portal-top-in {
max-width: 1060px; margin: 0 auto; padding: 0 24px;
height: 58px; display: flex; align-items: center; gap: 26px;
}
.portal-brand {
display: inline-flex; align-items: center; gap: 10px;
font-size: 17px; font-weight: 700; color: var(--p-ink); letter-spacing: .01em;
}
/* 品牌标记只用品牌色的线稿，不套色块 —— 色块在这个尺度上显得吵 */
/* 站标：浅蓝渐变圆角方块 + 白线稿符号。跟登录页 `.auth-brand .logo` 是同一套
（同一个渐变、同一个圆角），两页的品牌位才算同一个站。
阴影比登录页那版收一档 —— 那边压在深色面板上，这边是近白底，照搬会发灰。 */
.portal-logo {
flex: 0 0 auto; width: 30px; height: 30px;
display: inline-grid; place-items: center;
border-radius: 9px; color: #fff;
background: linear-gradient(140deg, #4a6ee8, #2f54d8 60%, #2444b6);
box-shadow: 0 4px 11px -4px rgba(47, 84, 216, .55),
inset 0 1px 0 rgba(255, 255, 255, .24);
}
.portal-logo svg { width: 17px; height: 17px; }
/* 站标走填充、不走描边 —— 细线在 17px 下会糊（跟后台 `.ico` 那条一个道理）。
模板上的 svg 标签写的是 fill="none" stroke="currentColor"，但 CSS 优先级高于
表现属性，这条能盖掉它，不用去改模板里的属性。 */
.portal-logo svg, .portal-foot-logo svg { fill: currentColor; stroke: none; }
/* 导航做成胶囊：悬停时底色淡淡浮出来，比只换字色更有「按得到」的感觉 */
.portal-nav { margin-left: auto; display: flex; gap: 4px; }
.portal-nav a {
padding: 6px 14px; border-radius: 999px;
font-size: 14px; color: var(--p-ink-2);
transition: background .18s var(--ease), color .18s var(--ease);
}
.portal-nav a:hover { background: var(--p-brand-soft); color: var(--p-brand-ink); }
/* ---------------------------------------------------------- 主视觉 */
/* 「大气」出在两处：字放到最大、上下留足空，以及背后那层几乎看不见的光。
标题上方的短横线、渐变文字、装饰图标之类一律不用 —— 大厂的 hero
就是一行大字加一行小字。 */
.portal-hero {
position: relative; overflow: hidden;
padding: 96px 24px 72px; text-align: center;
}
/* 两团柔和的光斑。半径给得很大、模糊 70px，所以只看得出「这块亮一点」，
看不出是个圆 —— 一旦看出形状就变成廉价装饰了。
用 ::before/::after 而不是加 div：纯装饰，不该进 DOM。 */
.portal-hero::before, .portal-hero::after {
content: ""; position: absolute; border-radius: 50%;
filter: blur(70px); pointer-events: none;
}
.portal-hero::before {
width: 480px; height: 480px; top: -220px; left: 50%;
transform: translateX(-70%);
background: radial-gradient(circle, rgba(79, 109, 245, .16), transparent 70%);
}
.portal-hero::after {
width: 380px; height: 380px; top: -160px; left: 50%;
transform: translateX(10%);
background: radial-gradient(circle, rgba(120, 80, 220, .12), transparent 70%);
}
/* 内容压在光斑上面。overflow:hidden 是必须的 —— 光斑超出 hero 往下溢，
不裁掉会在正文区留下一道淡淡的色带。 */
/* 三层叠起来，顺序写死：
① 两团光斑 z-index 0 ② 背后那幅画 z-index 1 ③ 文字 z-index 2。
不靠 DOM 顺序碰运气 —— 光斑是用 ::before/::after 画的，紧跟其后的子元素和
它俩谁盖谁得算一遍，不如直接标出来。 */
.portal-hero::before, .portal-hero::after { z-index: 0; }
.portal-hero-art {
position: absolute; z-index: 1; pointer-events: none;
/* 靠右出血，裁掉一截 —— 这样它是「排版元素」而不是「居中贴的水印」。
居中版是 `top: 50%; left: 50%; transform: translate(-50%, -50%)`。 */
top: 50%; right: -80px; transform: translateY(-50%);
width: 520px; height: 520px;
/* 这一档是量出来的，不是随手写的：画的线条色是 #b0c7fa（很浅），
且只覆盖一成面积（线稿）。在近白底 #fbfbfd 上：
.10 → 线条只比底色暗 7 级，基本看不见（第一版就是这个问题）
.22 → 暗 17 级，明显看得出来，但仍是底纹、不抢字
再往上（.28+）就开始像装饰而不是背景了，慎调。 */
opacity: .22;
}
.portal-hero-art img { display: block; width: 100%; height: 100%; }
.portal-hero > :not(.portal-hero-art) { position: relative; z-index: 2; }
.portal-hero-eyebrow {
display: inline-block; margin-bottom: 22px;
padding: 4px 14px; border-radius: 999px;
font-size: 13px; font-weight: 600; letter-spacing: .04em;
color: var(--p-brand-ink);
background: var(--p-brand-soft);
border: 1px solid rgba(79, 109, 245, .18);
}
.portal-hero-title {
font-size: clamp(34px, 6vw, 56px); font-weight: 800; color: var(--p-ink);
letter-spacing: -.02em; line-height: 1.15; margin: 0;
}
.portal-hero-sub {
margin: 14px 0 0;
font-size: clamp(15px, 2.4vw, 18px); color: var(--p-ink-2);
}
/* 实时日期时间。tabular-nums 是必须的 —— 不锁数字宽度的话，秒数每跳一次
整行都会轻轻抖一下。时间比日期大一号：这一行真正要看的那个数是它。 */
.portal-clock {
margin: 34px 0 0;
display: inline-flex; align-items: baseline; gap: 10px;
font-size: 14px; color: var(--p-ink-2);
font-variant-numeric: tabular-nums;
}
.portal-clock .sep { color: rgba(26, 29, 41, .2); }
.portal-clock .time {
font-size: 22px; font-weight: 600; color: var(--p-ink); letter-spacing: .02em;
}
/* ---------------------------------------------------------- 应用区 */
.portal-main {
flex: 1 1 auto; width: 100%; max-width: 1060px;
margin: 0 auto; padding: 0 24px 80px;
}
.portal-main section { scroll-margin-top: 78px; }
/* 两块内容之间留一口气，别贴着 */
.portal-main section + section { margin-top: 56px; }
/* 分组标题：小号、全大写、拉开字距，右边接一条发丝线把空白收住。
它不跟内容抢注意力 —— 这一页的主角是卡片。 */
.portal-section-title {
display: flex; align-items: center; gap: 12px;
margin: 0 0 20px;
font-size: 13px; font-weight: 600; color: var(--p-ink-3);
letter-spacing: .14em; text-transform: uppercase;
}
.portal-section-title::after {
content: ""; flex: 1; height: 1px; background: var(--p-line);
}
.portal-grid {
display: grid;
/* **固定两栏**：现在就是两套系统。用 auto-fit 会铺成四列、只填两格，
右边空一大片，看着像没排满。加到三套以上时这里要改回 auto-fit。 */
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 20px;
}
/* 卡片 = 半透明白 + 发丝描边 + 两级阴影。静态就带一点浮起，悬停再抬 4px、
阴影染成品牌色、描边也偏一点品牌色。
里面只有三样：图标方块、系统名、「进入系统」。**不写系统介绍** ——
名称本身已经说清了是哪个系统，多一行小字反而把版面拉散。 */
.portal-card {
position: relative;
display: flex; flex-direction: column;
min-height: 208px;
padding: 30px 26px 24px;
border-radius: var(--p-r);
background: var(--p-surface);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid var(--p-line);
/* 第二层是**内阴影做出来的上沿高光** —— 半透明 + 模糊那套的标准搭配，
一道 1px 的亮边就让卡片像块玻璃而不是一块白纸。极淡，只在侧面看得出。 */
box-shadow: var(--p-sh), inset 0 1px 0 rgba(255, 255, 255, .7);
/* 卡片里的内容整体居中：图标、名字、「进入系统」都对着一条中轴排 */
text-align: center;
transition: transform .22s cubic-bezier(.2, .7, .3, 1),
box-shadow .22s var(--ease), border-color .22s var(--ease);
}
.portal-card:hover {
transform: translateY(-4px);
box-shadow: var(--p-sh-hover), inset 0 1px 0 rgba(255, 255, 255, .9);
border-color: rgba(79, 109, 245, .28);
}
/* 图标独立一行、名字在它下面（竖向排），比图标和名字挤一行更透气 */
.portal-card-top {
display: flex; flex-direction: column; align-items: center; gap: 18px;
}
.portal-chip {
flex: 0 0 auto; width: 46px; height: 46px; border-radius: 13px;
display: grid; place-items: center;
color: var(--p-brand);
background: linear-gradient(135deg, rgba(79, 109, 245, .12),
rgba(120, 80, 220, .12));
border: 1px solid rgba(79, 109, 245, .16);
transition: transform var(--t);
}
.portal-chip svg { width: 24px; height: 24px; }
.portal-card:hover .portal-chip { transform: scale(1.06); }
.portal-card-name {
font-size: 17px; font-weight: 650; color: var(--p-ink);
letter-spacing: -.01em; line-height: 1.3;
}
/* 系统名下面那一行小字。跟名字挨紧一点（8px）—— 它们是一组，
跟上面的图标（18px）拉开档次，否则三样看着一样远，读起来散。 */
.portal-card-desc {
margin-top: 8px;
font-size: 13.5px; color: var(--p-ink-2); line-height: 1.5;
}
/* 「进入系统」是卡片里唯一的彩色元素。它靠 card 上的 text-align: center 居中，
不需要自己再做 flex。不画分隔线 —— 白卡片上再来一条线就是多一道噪点；
靠 margin-top: auto 让它沉到底部，两张卡自然对齐。 */
.portal-card-go {
margin-top: auto; padding-top: 20px;
font-size: 14px; font-weight: 600; color: var(--p-brand-ink);
}
/* 可选的右上角小标签。正常不填，填了也只是个更浅的灰胶囊，不抢眼。 */
.portal-tag {
position: absolute; top: 18px; right: 20px;
font-size: 11px; color: var(--p-ink-2);
background: rgba(26, 29, 41, .05);
padding: 2px 9px; border-radius: 999px;
}
/* ---------------------------------------------------------- 常用入口 */
/* 白底胶囊，压在卡片下面 —— 用白色跟卡片拉开层次。
这一栏还有个作用是撑住页面的下半截：只有两张卡片时整页太短，
看着不像站点、倒像登录页。
**六等分铺满整行**，不是 flex 换行。用 flex 的话胶囊只有文字那么宽、
挤在左边，右边空一大片，看着像没排完版。六等分之后每个胶囊一样宽、
首尾正好顶到卡片区的左右边缘，跟上面的卡片对齐。 */
.portal-links {
display: grid;
grid-template-columns: repeat(6, minmax(0, 1fr));
gap: 12px;
}
.portal-link {
display: flex; align-items: center; justify-content: center;
min-height: 46px; padding: 10px 12px;
border-radius: 999px;
background: #fff;
border: 1px solid var(--p-line);
box-shadow: 0 1px 2px rgba(26, 29, 41, .03);
font-size: 14px; font-weight: 500; color: var(--p-ink-2);
/* 等分之后每格宽度固定，文字一律不换行 —— 「客户管理」换行会把整行撑高 */
white-space: nowrap;
transition: transform .18s var(--ease), border-color .18s var(--ease),
color .18s var(--ease), box-shadow .18s var(--ease);
}
.portal-link:hover {
transform: translateY(-2px);
border-color: rgba(79, 109, 245, .32);
color: var(--p-brand-ink);
box-shadow: 0 6px 16px rgba(79, 109, 245, .12);
}
/* ---------------------------------------------------------- 页脚 */
/* 备案号是硬要求，不是装饰：ICP 号必须链到工信部、公安备案号链到网安平台。 */
.portal-foot {
border-top: 1px solid var(--p-line);
background: var(--p-bg-soft);
padding: 32px 24px 40px;
}
.portal-foot-in {
max-width: 1060px; margin: 0 auto;
display: flex; flex-direction: column; align-items: center; gap: 10px;
text-align: center;
font-size: 13px; color: var(--p-ink-3);
}
.portal-foot-nav { display: flex; gap: 22px; }
.portal-foot-nav a { color: var(--p-ink-2); transition: color .18s var(--ease); }
.portal-foot-nav a:hover { color: var(--p-brand-ink); }
/* 页脚这枚站标跟顶栏同一个符号，只是压成灰的、更小 —— 页脚不该抢视线 */
.portal-copy {
display: inline-flex; align-items: center; gap: 7px;
font-size: 12px; color: var(--p-ink-3);
}
.portal-foot-logo {
flex: 0 0 auto; display: inline-grid; place-items: center;
width: 16px; height: 16px; color: var(--p-ink-3); opacity: .8;
}
.portal-foot-logo svg { width: 15px; height: 15px; }
.portal-beian {
display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
gap: 6px 10px; font-size: 12px; color: var(--p-ink-3);
}
.portal-beian a { color: var(--p-ink-3); transition: color .18s var(--ease); }
.portal-beian a:hover { color: var(--p-ink-2); }
.portal-beian .sep { color: rgba(26, 29, 41, .18); }
/* 公安备案号配一枚盾牌小图标（网安备案的惯用标记），跟页脚站标同色同尺寸，不抢视线 */
.portal-police { display: inline-flex; align-items: center; gap: 5px; }
.portal-police-badge { width: 14px; height: 14px; flex: 0 0 auto; opacity: .85; }
/* 键盘焦点。链接默认没有焦点环，不给的话键盘用户根本看不出走到哪了 ——
卡片和胶囊那种大块元素尤其明显。 */
.portal-body a:focus-visible {
outline: 2px solid var(--p-brand); outline-offset: 3px; border-radius: 6px;
}
/* ---------------------------------------------------------- 入场 */
/* 一次编排好的入场：题头先落，卡片跟上，最后是常用入口。幅度很小（12px），
大厂的动效都克制在这个量级 —— 动作大了就显廉价。
延迟按区块给（#apps / #links），不按类给：两个区块的小标题是同一个类，
按类给会让下面那块的小标题比上面的卡片还先出现。
用 backwards 而不是 both —— both 会让动画终值一直挂在元素上，把悬停的
translateY 压死（动画的优先级高于 transition，不是"后写的赢"）。 */
@keyframes p-rise {
from { opacity: 0; transform: translateY(12px); }
to { opacity: 1; transform: none; }
}
.portal-hero-eyebrow, .portal-hero-title, .portal-hero-sub, .portal-clock,
.portal-section-title, .portal-card, .portal-links {
animation: p-rise .7s var(--ease) backwards;
}
.portal-hero-title { animation-delay: .06s; }
.portal-hero-sub { animation-delay: .12s; }
.portal-clock { animation-delay: .18s; }
#apps .portal-section-title { animation-delay: .22s; }
#apps .portal-card:nth-child(1) { animation-delay: .26s; }
#apps .portal-card:nth-child(2) { animation-delay: .32s; }
#apps .portal-card:nth-child(3) { animation-delay: .38s; }
#links .portal-section-title { animation-delay: .38s; }
.portal-links { animation-delay: .42s; }
/* 系统里关掉动效的那一档，门户也得跟着关 —— 包括平滑滚动 */
@media (prefers-reduced-motion: reduce) {
.portal-html { scroll-behavior: auto; }
.portal-hero-eyebrow, .portal-hero-title, .portal-hero-sub, .portal-clock,
.portal-section-title, .portal-card, .portal-links { animation: none; }
.portal-card, .portal-chip, .portal-link, .portal-nav a { transition: none; }
}
/* 平板：六等分每格只剩一百来像素，折成三列两行 */
@media (max-width: 991.98px) {
.portal-links { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* 窄屏上那幅画会横跨到居中的文字底下，两边都糊 —— 直接收掉，留光斑就够了 */
.portal-hero-art { display: none; }
}
@media (max-width: 767.98px) {
.portal-top-in { height: 54px; padding: 0 16px; gap: 14px; }
.portal-nav { gap: 2px; }
.portal-nav a { padding: 6px 10px; }
.portal-hero { padding: 64px 20px 48px; }
.portal-main { padding: 0 16px 56px; }
.portal-grid { grid-template-columns: 1fr; }
.portal-card { padding: 24px 22px 20px; min-height: 0; }
.portal-link { font-size: 13.5px; }
}
/* 手机：两列三行 */
@media (max-width: 575.98px) {
.portal-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.me-note {
margin-top: 14px; padding: 9px 12px; font-size: 12.5px; line-height: 1.6;
background: var(--sms-warn-soft); border: 1px solid #f2ddb8;
border-radius: var(--r-sm); color: #8a5204;
}
.me-hr { margin: 18px 0 14px; border-color: var(--sms-line-2); opacity: 1; }
/* ------------------------------------------------ 项目报告时间线的行尾操作 */
/* .timeline-item .meta span 默认是灰底胶囊，这里要的是纯文字链接，得单独去掉底色 */
.timeline-item .meta .rpt-actions {
margin-left: auto; gap: 10px; padding: 0; background: none;
}
.timeline-item .meta .rpt-actions a,
.timeline-item .meta .rpt-actions button {
background: none; border: 0; padding: 0; font: inherit;
color: var(--sms-primary); cursor: pointer;
}
.timeline-item .meta .rpt-actions a:hover,
.timeline-item .meta .rpt-actions button:hover { text-decoration: underline; }
.timeline-item .meta .rpt-actions .danger { color: var(--sms-danger); }
/* ------------------------------------------------------------ AI 分析历史 */
/* 一条一个
，最新的由模板加 open 默认展开 —— 分析正文动辄上千字，
十条全摊开会把页面拉得没法看。 */
.ai-analysis {
border: 1px solid var(--sms-line); border-radius: var(--r-md);
margin-bottom: 10px; overflow: hidden; background: #fff;
}
.ai-analysis:last-child { margin-bottom: 0; }
.ai-analysis > summary {
cursor: pointer; padding: 9px 13px; background: #f7f9fc;
font-size: 12.5px; color: var(--sms-muted);
display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
list-style: none;
}
.ai-analysis > summary::-webkit-details-marker { display: none; }
.ai-analysis > summary::before {
content: "▸"; color: var(--sms-primary); font-size: 11px;
transition: transform .15s var(--ease);
}
.ai-analysis[open] > summary::before { content: "▾"; }
.ai-analysis > summary span {
padding: 1px 8px; border-radius: 999px; background: #eef1f6; color: #5b6779;
font-variant-numeric: tabular-nums;
}
.ai-body {
padding: 13px 15px; border-top: 1px solid var(--sms-line);
font-size: 13.5px; line-height: 1.75; color: var(--sms-ink-2);
/* 与 .timeline-item .body 同款：分析正文的换行要原样保留。
模板里内容必须紧贴 ，否则缩进会被当正文渲染。 */
white-space: pre-wrap;
}
/* 展开后的操作行（目前只有「删除这次分析」）。放在正文下面而不是塞进
：
只允许短语内容，塞