guanlan-src/app_frontEnd/app_frontEnd_guanlan/assets/app.css

/* 观澜 新前端样式表 —— 设计基准 = docs/design/guanlan_v2.html
 * (2026-09-03 用户: "你帮我整体设计一下吧"; 纸底/印章/长卷那版已否, 留档 docs/design/_explored/)
 *
 * 六条决定:
 *   01 问题先于全貌   打开先看该管的几台; 全场状态压成 38 格一条带子放第二屏
 *   02 两条轴两枚chip 设备状态 (彩色) × 证据级 (单色) 并排 —— 两者不可互替, 这是产品的真正特色
 *   03 限定语不可分离 每个结论下的限定行在同一张卡, 带自己的标签
 *   04 一种强调色     海蓝只用于「可操作」; 红黄灰绿是语义不是装饰
 *   05 System font stack only; no external font request.
 *   06 不动           无入场动画, 只有悬停与选中
 *
 * 单主题 (显式底色)。深色版留作后续 —— token 已分层, 届时只改 :root。
 */

:root{
  --ground:#F5F7F8; --panel:#FFFFFF; --ink:#1B2430; --muted:#5C6B78; --line:#DDE3E8; --hair:#C9D1D8;
  --accent:#1F6F8B; --accent-deep:#175A71; --accent-soft:#BFDCE6; --wash:#E8F2F6;
  --critical:#C8372D; --warning:#D48A1E; --unknown:#8A96A0; --good:#2E8B6A; --excellent:#8FCBB5;
  /* 迁移期: 旧 JS 里的变量名指到新语义 */
  --bad:var(--critical); --warn:var(--warning); --ok:var(--good); --info:var(--accent);
  --sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;
  --mono:"SF Mono",Menlo,Consolas,monospace;
  --r:10px;
}
*{box-sizing:border-box}
html{background:var(--ground)}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--sans);font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased}
body[data-lang=zh]{font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",Inter,ui-sans-serif,system-ui,sans-serif}
a{color:var(--accent-deep);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1200px;margin:0 auto;padding:0 28px 72px}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.num{font-variant-numeric:tabular-nums}
.small{font-size:12.5px} .muted{color:var(--muted)}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.005em;text-wrap:balance}
h2{font-size:15px} h3{font-size:14px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ── 顶 ── */
header.top{display:flex;align-items:center;gap:14px;padding:18px 0 12px}
.mark{display:inline-flex;align-items:center;gap:9px}
.mark svg{width:26px;height:26px;color:var(--accent)}
.brand{font-weight:600;font-size:18px;letter-spacing:-.01em}
.brand small{font-weight:400;color:var(--muted);margin-left:8px;font-size:13px}
.tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border:1px solid var(--hair);border-radius:4px;padding:2px 7px}
header.top .right{margin-left:auto;display:flex;gap:8px;align-items:center}
select,input,button{font:inherit;font-size:13px;color:var(--ink)}
select,input{background:var(--panel);border:1px solid var(--line);border-radius:7px;padding:6px 10px}
input::placeholder{color:var(--muted)}
.toggle{display:inline-flex;border:1px solid var(--line);border-radius:7px;overflow:hidden;background:var(--panel)}
.toggle button{border:0;background:transparent;padding:6px 12px;cursor:pointer;color:var(--muted)}
.toggle button.on{background:var(--ink);color:#fff}

/* ── 页签: 平铺 (用户 2026-08-28 裁定), 当前项一条下划线 ── */
nav.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);flex-wrap:wrap}
nav.tabs button{font-size:13.5px;border:0;background:transparent;color:var(--muted);padding:9px 12px 10px;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
nav.tabs button.on{color:var(--accent-deep);border-bottom-color:var(--accent);font-weight:500}

/* ── 节 ── */
section{margin-top:26px}
.sechead{display:flex;align-items:baseline;gap:12px;margin-bottom:10px}
.sechead .meta{color:var(--muted);font-size:12.5px}
.sechead .legend{margin-left:auto}
.legend{display:flex;gap:14px;font-size:12px;color:var(--muted)}
.legend i{display:inline-block;width:9px;height:9px;border-radius:2px;vertical-align:-1px;margin-right:5px}
.eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:22px 0 8px}

/* ── 按钮 ── */
.btn{padding:7px 16px;border-radius:7px;border:1px solid var(--accent);background:var(--accent);color:#fff;font-weight:500;cursor:pointer}
.btn:hover{background:var(--accent-deep);border-color:var(--accent-deep)}
.btn.quiet{background:transparent;color:var(--accent-deep)}
.btn:disabled{opacity:.5;cursor:not-allowed}

/* ── 面板 / 表 ── */
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.mb{margin-bottom:12px}
.tblwrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:13px}
th{font-weight:500;color:var(--muted);text-align:left;padding:7px 10px;border-bottom:1px solid var(--line);font-size:12px;letter-spacing:.02em;white-space:nowrap}
td{padding:7px 10px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums;vertical-align:top}
tr:last-child td{border-bottom:0}
td.r,th.r{text-align:right}

/* ── KPI: 左边条 = 语义 ── */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px 11px;position:relative}
.kpi::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 2px 2px 0;background:var(--accent)}
.kpi.warn::before{background:var(--warning)} .kpi.bad::before{background:var(--critical)} .kpi.ok::before{background:var(--good)}
.kpi b{display:block;font-size:24px;font-weight:600;letter-spacing:-.02em;line-height:1.15;font-variant-numeric:tabular-nums}
.kpi b small{font-size:13px;font-weight:500;color:var(--muted);margin-left:2px}
.kpi span{display:block;font-size:12px;color:var(--muted);margin-top:4px}

/* ── chip: 设备状态 (彩色) ── */
.chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:500;padding:2px 8px;border-radius:5px;white-space:nowrap;line-height:1.5}
.chip.bad{background:rgba(200,55,45,.10);color:var(--critical)}
.chip.warn{background:rgba(212,138,30,.14);color:#9C6410}
.chip.unk{background:rgba(138,150,160,.16);color:#4F5B66}
.chip.ok{background:rgba(46,139,106,.12);color:#22705A}
.chip.ex{background:rgba(143,203,181,.22);color:#2E7A62}

/* ── tier: 证据级 (单色) · rv: 审级 ── */
.evid{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.tier{font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;padding:2px 7px;border-radius:4px;border:1px solid var(--hair);color:var(--muted);white-space:nowrap}
.tier.confirmed{background:var(--ink);border-color:var(--ink);color:#fff}
.tier.near{border-color:var(--ink);color:var(--ink)}
.tier.candidate{border-color:var(--muted);color:var(--muted)}
.tier.reference{}
.tier.insufficient{border-style:dashed}
.tier.withdrawn{text-decoration:line-through}
.rv{font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.rv::before{content:"·";margin-right:3px;color:var(--hair)}

/* ── 关注卡: 左边条 = 设备状态 ── */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:12px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px 12px 18px;position:relative;transition:box-shadow .15s}
.card::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:3px;border-radius:0 2px 2px 0;background:var(--sev,var(--hair))}
.card.lit{box-shadow:0 0 0 2px var(--accent-soft)}
.card .head{display:flex;align-items:baseline;gap:10px}
.card .unit{font-weight:600;font-size:19px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.card .sys{color:var(--muted);font-size:13px}
.card .head .chip{margin-left:auto}
.card .why{margin:8px 0 9px;font-size:13.5px}
.caveat{font-size:12px;color:var(--muted);border-top:1px solid var(--line);padding-top:7px;margin-top:2px;line-height:1.5}
.caveat b{font-family:var(--mono);font-weight:500;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-right:7px}

/* ── 迷你趋势: 越早越淡 (JS 按序设 opacity), 末点实色 ── */
.spark{height:28px;display:flex;align-items:flex-end;gap:2px;margin:9px 0 8px}
.spark i{flex:1;display:block;background:var(--accent);border-radius:1px 1px 0 0}

/* ── 全场状态条: 一格一台 ── */
.strip{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px 8px}
.cells{display:grid;grid-template-columns:repeat(var(--n,38),1fr);gap:4px}
.cell{aspect-ratio:1;border-radius:3px;background:var(--excellent);transition:transform .1s}
.cell.hot{cursor:pointer} .cell.hot:hover{transform:translateY(-2px)}
.cell.bad{background:var(--critical)} .cell.warn{background:var(--warning)} .cell.unk{background:var(--unknown)} .cell.ok{background:var(--good)}
.cell.lit{outline:2px solid var(--ink);outline-offset:1px}
.nums{display:grid;grid-template-columns:repeat(var(--n,38),1fr);gap:4px;margin-top:5px;font-family:var(--mono);font-size:9.5px;color:var(--muted);text-align:center}
.nums span.hot{color:var(--ink);font-weight:500}
.quiet{color:var(--muted);font-size:13px;margin-top:10px}
.quiet b{color:var(--ink);font-weight:500}

/* ── 系统入口 ── */
.systems{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.sysc{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:11px 13px;display:grid;gap:7px}
.sysc .t{display:flex;justify-content:space-between;align-items:baseline}
.sysc .t b{font-weight:500}
.sysc .t a{font-size:12px}
.bar{display:flex;height:6px;border-radius:3px;overflow:hidden;background:var(--line)}
.bar i{display:block;height:100%}
.sysc .cnt{display:flex;gap:10px;font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.sysc .cnt i{display:inline-block;width:7px;height:7px;border-radius:2px;margin-right:4px}

/* ── 骨架 (载入中) ── */
.skel{height:12px;border-radius:6px;background:linear-gradient(90deg,var(--line),var(--panel),var(--line));background-size:200% 100%;animation:sk 1.2s linear infinite}
@keyframes sk{to{background-position:-200% 0}}

/* 原文数据 (英文模式下按原文标注显示) */
.verbatim{font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif}
code{font-family:var(--mono);font-size:11.5px}

/* ── 问答: 类别 pill / 常用问题行 / 核验徽章 ── */
.pill{font-size:13px;padding:6px 14px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer}
.pill.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:500}
.qitem{font-size:13px;cursor:pointer;border:1px solid var(--line);border-radius:8px;padding:8px 12px;margin-top:8px;background:var(--panel)}
.qitem:hover{border-color:var(--accent-soft);background:var(--wash)}
.badge{display:inline-block;font-size:11.5px;padding:1px 8px;border-radius:5px;border:1px solid var(--hair);color:var(--muted)}
.badge.ok{border-color:var(--good);color:var(--good)} .badge.warn{border-color:var(--warning);color:#9C6410}

/* ── 汇报定制: 一页纸预览 ── */
.paper{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:26px 30px;margin-top:14px}
.paper-hd{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:12px;margin-bottom:16px;border-bottom:2px solid var(--ink)}
.paper-ti{font-weight:600;font-size:17px;letter-spacing:-.01em}
.paper-ft{display:flex;justify-content:space-between;gap:16px;font-size:11.5px;color:var(--muted);padding-top:10px;margin-top:16px;border-top:1px solid var(--line);flex-wrap:wrap}
.paper .panel{border-radius:8px}
svg.dt text{font-family:var(--sans)}
@media print{.noprint,nav.tabs,header.top,footer{display:none!important}.wrap{padding:0;max-width:none}.paper{border:0;padding:0}body{background:#fff}}

/* ── 双列网格 (故障/电量页): 窄屏单列, 宽屏两列; span2 占满 ── */
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(480px,1fr));gap:12px}
.grid2 .span2{grid-column:1/-1}
i.bar{display:inline-block;height:10px;border-radius:2px;vertical-align:middle;margin-right:6px;opacity:.85}

/* ── 振动融合: 状态|证据 双联 chip, 传动链小格, 矩阵表 ── */
.duo{display:inline-flex;align-items:stretch;border:1px solid var(--c,var(--hair));border-radius:5px;overflow:hidden;font-size:11.5px;line-height:1.5;max-width:100%}
.duo .st{padding:1px 7px;background:var(--c,var(--hair));color:#fff;font-weight:500;white-space:nowrap}
.duo .ev{padding:1px 7px;color:var(--ink);background:var(--panel);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}
.chain{display:inline-flex;gap:2px;vertical-align:middle}
.chain i{display:inline-block;width:11px;height:11px;border-radius:2px;border:1px solid var(--hair);background:var(--panel)}
.chain i.on{border-color:var(--accent)}
table.fmx td{vertical-align:top;padding:6px 8px}
table.fmx th div{line-height:1.3}

/* ── 逐台/单问题浮层 (静态站上 /turbine /problem 是 404, 页内兜住) ── */
.popm{position:fixed;inset:0;z-index:9999;background:rgba(27,36,48,.55);overflow:auto;padding:24px 16px}
.popc{max-width:1120px;margin:0 auto;background:var(--ground);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px}
.poph{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.poph h3{font-size:16px}


/* 2026-09-03: reading hierarchy, work-order details and responsive layout. */
:root{--r:12px;--shadow:0 3px 16px rgba(23,51,68,.035)}   /* 2026-09-06 用户裁: 去中段 --ground/--line 覆盖, 令牌与门户一致 */
.wrap{max-width:1360px;padding:0 32px 64px}
header.top{padding:24px 0 20px;gap:24px}
.brand{font-size:21px;letter-spacing:-.035em}
.brand small{letter-spacing:0;font-size:12px}
.mark{gap:12px}
nav.tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;padding:6px;background:#EAF0F3;border:1px solid var(--line);border-radius:12px}
nav.tabs button{margin:0;padding:10px 6px;min-height:40px;border:0;border-radius:7px;font-size:12px;line-height:1.3}
nav.tabs button:hover{color:var(--accent-deep);background:#F5F9FA}
nav.tabs button.on{color:var(--accent-deep);background:var(--panel);box-shadow:0 1px 5px #17334412;font-weight:600}
.page-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:28px 0 16px}
.page-head h1{font-size:28px;line-height:1.2;letter-spacing:-.035em}
.window-badge{font-size:11px;font-weight:500;white-space:nowrap;color:var(--accent-deep);border:1px solid #CDDEE6;background:#ECF4F7;padding:5px 10px;border-radius:6px}
.page-head+section{margin-top:0}
.sechead{flex-wrap:wrap;row-gap:6px;margin-bottom:14px}
.sechead h2{font-size:18px;letter-spacing:-.025em}
.legend{flex-wrap:wrap;row-gap:5px}
.panel,.card,.kpi,.strip,.sysc{box-shadow:var(--shadow)}
.panel{padding:18px}
.panel>h3{font-size:15px;line-height:1.45;margin-bottom:8px}
.panel,.grid2>*{min-width:0}
.kpis{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.kpi{padding:18px 20px;min-height:108px}
.kpi::before{top:18px;bottom:18px}
.kpi b{font-size:29px;line-height:1.1}
.kpi b small{margin-left:5px;font-size:12px}
.kpi span{font-size:12px;margin-top:9px;line-height:1.45;max-width:36ch}
.cards{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:16px}
.card{padding:20px 22px 18px}
.card .head{align-items:start;flex-wrap:wrap;gap:8px}
.card .unit{font-size:23px;line-height:1.15;white-space:nowrap}
.card .sys{flex:1;min-width:90px;line-height:1.45}
.card .head .chip{margin-left:auto}
.card .evid{margin:12px 0 8px}
.card .caveat{font-size:12px;line-height:1.65;padding-top:12px}
.evidence-detail{margin-top:14px;background:#F5F8FA;border:1px solid #E5ECF0;border-radius:7px;padding:9px 12px}
.evidence-detail summary{cursor:pointer;color:var(--accent-deep);font-size:12px;font-weight:500}
.card .why{line-height:1.7;margin:10px 0 3px}
.sysc{padding:16px;gap:12px}
.sysc[role=button]{cursor:pointer}
.sysc[role=button]:hover{border-color:#9DBECA;background:#FBFDFE}
.grid2{grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:16px}
.tblwrap{max-width:100%;border-radius:7px;overscroll-behavior-x:contain}
th{background:#F4F7F9;font-size:11px;font-weight:600;letter-spacing:.025em;padding:10px 12px}
td{padding:11px 12px;line-height:1.6}
tr:hover>td{background:#F7FAFC}
td.r,th.r{white-space:nowrap}
.strip{overflow-x:auto;padding:18px}
.strip .cells,.strip .nums{min-width:850px}
footer{border-top:1px solid var(--line);padding-top:18px;line-height:1.7;font-size:11px!important}
.popm{padding:24px;background:rgba(17,35,47,.58);backdrop-filter:blur(3px)}
.popc{max-width:1240px;padding:0 0 8px;border-radius:16px;box-shadow:0 24px 80px #0E263640}
.poph{position:sticky;top:-24px;z-index:2;align-items:center;padding:20px 24px;margin:0 0 20px;background:var(--panel);border-radius:16px 16px 0 0;box-shadow:0 2px 8px #17334405}
.poph h3{font-size:23px;line-height:1.3;letter-spacing:-.025em}
.poph .btn{flex-shrink:0;min-height:36px;border-color:var(--line);background:var(--ground)}
.popc>.panel,.popc>p{margin:16px 20px}
.popc>.panel{padding:20px}
.popc>.panel>.head{align-items:center!important;margin-bottom:10px;font-size:17px}
.popc>.panel>.small{max-width:105ch;line-height:1.7}
.popc .grid2>.panel{padding:16px;box-shadow:none;background:#FBFCFD}
.order-block{margin-top:24px;border-top:1px solid var(--line);padding-top:18px}
.order-head{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:12px}
.order-head>b{font-size:14px}
.action-counts{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.action-count{display:inline-flex;gap:7px;align-items:center;background:var(--wash);color:var(--accent-deep);border:1px solid #D5E7EF;border-radius:5px;padding:3px 8px;font-size:11px}
.action-count b{font-variant-numeric:tabular-nums;font-weight:600}
.order-table{table-layout:fixed;min-width:780px}
.order-table .order-date{width:112px;white-space:nowrap}
.order-table td{overflow-wrap:anywhere;padding-top:14px;padding-bottom:14px}
.order-table td.order-date{overflow-wrap:normal;font-size:12px;color:var(--muted)}
.popup-verbatim-note{color:var(--muted);font-size:11px;line-height:1.7;padding:0 4px}
.verbatim{border-bottom:1px dotted #B9C6CF}
@media(min-width:1440px){.kpis{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:900px){.wrap{padding:0 20px 48px}.brand small{display:block;margin:3px 0 0}.cards{grid-template-columns:1fr}.sechead .legend{margin-left:0;width:100%}.popm{padding:12px}.poph{top:-12px}.systems{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){
 .wrap{padding:0 14px 40px}header.top{flex-wrap:wrap;gap:14px;padding:18px 0}.brand{font-size:20px}header.top .right{margin-left:0;width:100%;gap:8px}header.top select{flex:1;min-width:0}
 nav.tabs{grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;padding:5px}nav.tabs button{font-size:11.5px;min-height:36px;text-align:left;padding:8px 10px}
 .page-head{margin:22px 0 14px;align-items:flex-start}.page-head h1{font-size:23px}.window-badge{font-size:10px;padding:4px 7px}
 .kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.kpi{padding:14px;min-height:116px}.kpi b{font-size:24px}.kpi span{font-size:11px}
 .systems{grid-template-columns:1fr}.panel{padding:14px}.card{padding:16px}.card .head .sys{font-size:12px}.card .unit{font-size:21px}
 .popm{padding:8px}.popc{border-radius:12px}.poph{top:-8px;padding:15px 14px;border-radius:12px 12px 0 0;margin-bottom:12px}.poph h3{font-size:19px}.popc>.panel,.popc>p{margin:12px 10px}.popc>.panel{padding:14px}.popc .grid2>.panel{padding:12px}
 .order-head{gap:8px}.paper{padding:18px 14px}.paper-hd{gap:12px;flex-wrap:wrap}
}
@media print{.evidence-detail{display:block}.poph{position:static}nav.tabs,header.top,.page-head .window-badge{display:none!important}.card,.panel,.kpi{box-shadow:none}}

/* Singapore bay theme: a restrained Marina Bay silhouette, garden canopies, turbines and wind-flow traces. */
/* 2026-09-06 用户裁: 删末块令牌覆盖, 与门户单文件浅色令牌 (#F5F7F8/#1B2430/#1F6F8B/#DDE3E8) 一致; 基线 detail_style_baseline */
body{background:radial-gradient(ellipse at 95% 0,rgba(41,201,187,.075),transparent 40%),var(--ground)}
header.top{position:relative;isolation:isolate;overflow:hidden;min-height:128px;margin:22px 0 12px;padding:28px 30px;border:1px solid #1F526A;border-radius:18px;background:radial-gradient(ellipse at 68% 120%,#08788788,transparent 60%),linear-gradient(115deg,#092438,#103E55);box-shadow:0 10px 32px #0A344416}
header.top::before{content:"";position:absolute;z-index:-1;inset:0;opacity:.16;background-image:linear-gradient(#73B4C425 1px,transparent 1px),linear-gradient(90deg,#73B4C425 1px,transparent 1px);background-size:28px 28px;pointer-events:none}
.wind-field{position:absolute;width:420px;height:130px;left:35%;bottom:0;color:#61DBCE;opacity:.4;pointer-events:none;z-index:-1}
header.top .mark{gap:15px}header.top .mark>svg{width:36px;height:36px;color:#65E1D0;padding:5px;border:1px solid #66CCBE55;border-radius:10px;background:#73E4CE0D}
header.top .brand{font-size:27px;color:#F4FFFF;letter-spacing:-.035em}
header.top .brand small{display:block;margin:3px 0 0;font-size:11px;letter-spacing:.035em;color:#B3D6DF}
header.top .right{position:relative;padding:9px 11px;border:1px solid #759EAD44;border-radius:10px;background:#092A3EBF}
header.top .right label{color:#B9D7E1}header.top select{background:#153E52;color:#E5FAFF;border-color:#3A6576}
header.top .toggle{background:#E9F5F7;border-color:#527887}
nav.tabs{background:#E4EFF2;border-color:#D1E3E8;gap:5px}
nav.tabs button.on{color:#fff;background:linear-gradient(110deg,#087788,#006975);box-shadow:0 3px 8px #08778820}
nav.tabs button:hover:not(.on){background:#F7FFFF;color:#00636B}
.page-head h1{position:relative;padding-left:14px}
.page-head h1::before{content:"";position:absolute;left:0;top:4px;bottom:2px;width:4px;border-radius:3px;background:linear-gradient(#07949C,#46C7AB)}
.window-badge{background:#E5F5F3;border-color:#BDDCD8;color:#00636B}
.kpi{background:linear-gradient(140deg,#fff 65%,#EEF9F8)}
.evidence-detail{background:#F0F8F9;border-color:#DAECEE}
.panel,.card,.sysc{border-color:#D7E5EB}.sysc[role=button]:hover{border-color:#69AAA9}
a:hover{color:#008591}
:focus-visible{outline-color:#05A2AD;outline-width:3px}
@media(max-width:900px){header.top{padding:24px;gap:16px}.wind-field{left:34%;width:280px;opacity:.25}}
@media(max-width:600px){header.top{margin-top:14px;padding:20px 17px;min-height:156px;border-radius:14px;gap:18px}header.top .brand{font-size:25px}header.top .brand small{font-size:10px}header.top .right{padding:8px;width:100%}.wind-field{left:auto;right:-50px;bottom:46px;width:230px;opacity:.22}header.top .mark{gap:12px}}
@media print{body{background:#fff}.page-head h1::before{display:none}.kpi{background:#fff}a{color:inherit}}

.source-record{margin-top:5px;font-size:10px;color:var(--muted);font-weight:400;line-height:1.6}
.source-record summary{cursor:pointer;display:list-item;color:var(--accent-deep)}
.source-record[open]{background:var(--ground);border:1px solid var(--line);border-radius:6px;padding:7px}
.source-record>div{margin-top:6px;font-size:12px;overflow-wrap:anywhere}

/* 返回门户 / 重新选择机组·测点 (2026-09-06 用户裁: 补上再冻结) */
header.top .right .back-portal,header.top .right .reselect{display:inline-block;margin-right:8px;padding:6px 11px;border:1px solid #759EAD66;border-radius:8px;background:#0E3446;color:#E5FAFF;font-size:12.5px;text-decoration:none;cursor:pointer;line-height:1.3}
header.top .right .back-portal:hover,header.top .right .reselect:hover{background:#155069;border-color:#9BC6D3}