/* ===== 组合管理（pages/portfolio.html）=====
   红涨绿跌：盈利 / 上涨 = #e03131；亏损 / 下跌 = #0ca678；主色 #27548c */
:root{
  --pf-blue:#27548c; --pf-blue-d:#1d3f6b; --pf-blue-l:#eef3fa;
  --pf-up:#e03131; --pf-dn:#0ca678;
  --pf-bd:#e3e4e6; --pf-line:#f0f0f2; --pf-mut:#8a93a5; --pf-ink:#0a0a0a; --pf-ink2:#5a6478;
}
body{background:#fafafa;}
.wrap{padding-bottom:40px;}

/* ---------------- hero ---------------- */
.hero-sm{padding: 26px 28px 22px;}
.hero-sm h1{font-size:20px;margin-bottom:4px;}
.pf-note{font-size:12px;color:var(--pf-mut);margin-top:10px;line-height:1.7;max-width:none;}

/* ---------------- 录入区 ---------------- */
.pf-add{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.pf-in{border:1.5px solid #d5dbe4;border-radius:9px;padding:7px 11px;font-size:12.5px;
  font-family:inherit;color:var(--pf-ink);background:#fff;outline:none;box-sizing:border-box;
  width:150px;transition:.15s;}
.pf-in:hover{border-color:#b9c4d4;}
.pf-in.code{width:104px;letter-spacing:.5px;}
.pf-in.date{width:150px;color:var(--pf-ink);}
.pf-in.note{width:180px;}
.pf-in:focus{border-color:var(--pf-blue);box-shadow:0 0 0 3px rgba(39,84,140,.12);}
.pf-in::placeholder{color:#98a2b3;}
.pf-file{display:none;}
.hide{display:none!important;}

.pf-btn{border:1px solid #d5dbe4;background:#fff;border-radius:9px;padding:8px 14px;
  font:600 12.5px/1.25 inherit;color:#3d4657;cursor:pointer;transition:.15s;white-space:nowrap;}
.pf-btn:hover{border-color:#b3c7e2;color:var(--pf-blue);background:#fafcff;}
.pf-btn.primary{background:var(--pf-blue);border-color:var(--pf-blue);color:#fff;}
.pf-btn.primary:hover{background:var(--pf-blue-d);border-color:var(--pf-blue-d);color:#fff;}
.pf-btn.danger{color:#c92a2a;border-color:#f2cdcd;}
.pf-btn.danger:hover{background:#fff5f5;border-color:#e8b4b4;color:#c92a2a;}
.pf-btn.ghost{border-style:dashed;color:var(--pf-mut);padding:6px 11px;font-size:12px;}
.pf-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px;
  padding-top:12px;border-top:1px dashed var(--pf-line);}
.pf-tip{font-size:12px;color:var(--pf-mut);}

/* ---------------- KPI ---------------- */
.pf-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
.pf-kpi{border:1px solid var(--pf-bd);border-radius:14px;padding:12px 14px;background:#fcfdff;}
.pf-kpi .k{font-size:11.5px;color:var(--pf-mut);margin-bottom:6px;}
.pf-kpi .v{font-size:19px;font-weight:700;letter-spacing:-.4px;font-variant-numeric:tabular-nums;}
.pf-kpi .s{font-size:11.5px;color:var(--pf-mut);margin-top:5px;}
.pf-kpi .s b{font-weight:600;}
.pf-kpi.up .v{color:var(--pf-up);}
.pf-kpi.dn .v{color:var(--pf-dn);}
.pf-kpis.sm{grid-template-columns:repeat(5,minmax(0,1fr));margin-top:14px;}
.pf-kpis.sm .pf-kpi{padding:10px 12px;}
.pf-kpis.sm .pf-kpi .v{font-size:16px;}
.pf-meta{font-size:12px;color:var(--pf-mut);margin-top:12px;line-height:1.8;}
.pf-meta b{color:var(--pf-ink2);font-weight:600;}

/* ---------------- 区块标题 ---------------- */
.pf-sec-h{display:flex;align-items:baseline;gap:10px;font-size:15px;font-weight:700;
  color:var(--pf-ink);letter-spacing:-.2px;margin-bottom:12px;flex-wrap:wrap;}
.pf-sec-h small{font-size:11.5px;font-weight:400;color:var(--pf-mut);}
.pf-sec-h .r{margin-left:auto;display:flex;align-items:center;gap:8px;}

/* ---------------- 表格 ---------------- */
.pf-tbl{overflow-x:auto;}
.pf-tbl table{width:100%;border-collapse:collapse;font-size:12.5px;font-variant-numeric:tabular-nums;}
.pf-tbl th{text-align:left;font-weight:600;color:var(--pf-mut);font-size:11.5px;
  padding:9px 10px;border-bottom:1px solid var(--pf-bd);white-space:nowrap;background:#fafafa;}
.pf-tbl td{padding:10px;border-bottom:1px solid var(--pf-line);color:var(--pf-ink);white-space:nowrap;}
.pf-tbl tr:last-child td{border-bottom:0;}
.pf-tbl tbody tr:hover td{background:#fafcff;}
.pf-tbl .num{text-align:right;}
.pf-tbl th.num{text-align:right;}
.pf-tbl .nm{font-weight:600;}
.pf-tbl .nm i{font-style:normal;color:var(--pf-mut);font-weight:400;font-size:11px;margin-left:5px;}
.pf-tbl .up{color:var(--pf-up);}
.pf-tbl .dn{color:var(--pf-dn);}
.pf-tbl .mut{color:var(--pf-mut);}
.pf-tbl tfoot td{padding:10px;border-top:1px solid var(--pf-bd);font-weight:600;background:#fcfdff;}
.pf-act{border:0;background:none;color:var(--pf-blue);cursor:pointer;font:600 12px/1 inherit;padding:3px 5px;}
.pf-act.del{color:#c92a2a;}
.pf-act:hover{text-decoration:underline;}
.pf-ein{width:78px;border:1px solid var(--pf-blue);border-radius:7px;padding:5px 7px;
  font:12px/1.2 inherit;color:var(--pf-ink);text-align:right;outline:none;box-sizing:border-box;}
.wbar{display:block;height:5px;border-radius:3px;background:#f0f0f2;overflow:hidden;margin-top:5px;min-width:52px;}
.wbar i{display:block;height:100%;background:var(--pf-blue);border-radius:3px;}

/* ---------------- 基准切换 ---------------- */
.pf-bench{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:-4px 0 12px;
  padding-bottom:10px;border-bottom:1px dashed var(--pf-line);}
.pf-bench-lab{font-size:11.5px;color:var(--pf-mut);margin-right:2px;}
.pf-bench button{border:1px solid #d5dbe4;background:#fff;border-radius:9px;
  padding:5px 12px;font:600 12px/1.3 inherit;color:#3d4657;cursor:pointer;transition:.15s;white-space:nowrap;}
.pf-bench button:hover{border-color:#b3c7e2;color:var(--pf-blue);background:#fafcff;}
.pf-bench button.on{background:var(--pf-blue);border-color:var(--pf-blue);color:#fff;}

/* ---------------- 结构 ---------------- */
.pf-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:14px;}
.pf-grid > .card{margin-bottom:14px;}
.pf-chart{height:288px;}
.pf-chart.lg{height:300px;}
.pf-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--pf-line);font-size:12.5px;}
.pf-row:last-child{border-bottom:0;}
.pf-row .n{flex:1;color:var(--pf-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pf-row .v{color:var(--pf-ink2);font-variant-numeric:tabular-nums;flex:none;}
.pf-row .v b{font-weight:600;}
.pf-bar{flex:none;width:96px;height:6px;border-radius:3px;background:#f0f0f2;overflow:hidden;}
.pf-bar i{display:block;height:100%;background:var(--pf-blue);}
.pf-hint{font-size:12px;color:var(--pf-mut);line-height:1.8;}
.pf-empty{border:1px dashed #c9d2de;border-radius:12px;padding:26px 18px;text-align:center;
  color:var(--pf-mut);font-size:12.5px;line-height:1.9;}
.pf-src{font-size:11.5px;color:var(--pf-mut);line-height:1.8;margin-top:12px;
  padding-top:10px;border-top:1px dashed var(--pf-line);}
.pf-load{padding:26px;text-align:center;color:var(--pf-mut);font-size:12.5px;}

/* ---------------- 响应式 ---------------- */
@media(max-width:1024px){
  .pf-kpis{grid-template-columns:repeat(2,minmax(0,1fr));}
  .pf-kpis.sm{grid-template-columns:repeat(3,minmax(0,1fr));}
  .pf-grid{grid-template-columns:minmax(0,1fr);}
}
@media(max-width:760px){
  .pf-kpis,.pf-kpis.sm{grid-template-columns:repeat(2,minmax(0,1fr));}
  .pf-in,.pf-in.date,.pf-in.note{width:100%;}
  .pf-add{gap:7px;}
  .pf-add .pf-btn{width:100%;}
  .pf-chart,.pf-chart.lg{height:250px;}
  .hero-sm{padding: 26px 28px 22px;}
}


/* ===== house 精修层（2026-10-13 晚）===== */
.hero-sm{background:transparent;border:0;border-radius:0;box-shadow:none;padding:14px 0 10px;}
.hero-sm h1{font-size:20px;letter-spacing:-.2px;margin-bottom:4px;}
.pf-note{font-size:12.5px;color:#8a93a5;}
.pf-sec-h{padding-left:9px;border-left:3px solid #27548c;}
.pf-kpi{background:#fafbfc;border-color:#e8ebf1;}
.pf-tbl th{background:#f6f8fb;font-size:11px;font-weight:700;color:#5b6478;letter-spacing:.3px;}
.pf-tbl tbody tr:hover td{background:#f7fafe;}
.pf-tbl tfoot td{background:#fafbfc;}
.pf-empty{border-radius:14px;background:#fafbfc;}
.pfoot{font-size:11.5px;color:#8a93a5;line-height:1.9;margin-top:18px;
  padding-top:12px;border-top:1px solid #eef0f4;}