* { box-sizing: border-box; }
[v-cloak] { display: none; }
:root{
  --bg:#f6f7f9; --panel:#fff; --line:#e3e6ea; --line2:#eef0f3;
  --txt:#1f2329; --dim:#8a9099; --accent:#185FA5; --accent2:#e8f1fa;
  --fact:#f4f6f8; --derived:#fbfbfd; --sub:#f7f9fb;
  --red:#c0392b; --green:#1e8449;
}
html,body{margin:0;padding:0;height:100%;}
body{
  font-family:"Microsoft YaHei","PingFang SC","Segoe UI",system-ui,sans-serif;
  font-size:13px;color:var(--txt);background:var(--bg);-webkit-font-smoothing:antialiased;
}
button{font-family:inherit;}

/* ---------- topbar ---------- */
.topbar{
  height:52px;display:flex;align-items:center;justify-content:space-between;
  padding:0 18px;background:var(--panel);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:60;
}
.brand{display:flex;align-items:center;gap:10px;}
.logo{width:18px;height:18px;border-radius:4px;background:linear-gradient(135deg,#185FA5,#0C447C);display:inline-block;}
.brand strong{font-size:14px;font-weight:600;letter-spacing:.2px;}
.period{font-size:12px;color:var(--dim);padding-left:8px;border-left:1px solid var(--line);}
.right{display:flex;align-items:center;gap:14px;}
.user{font-size:12px;color:var(--txt);}
.user em{font-style:normal;color:var(--dim);margin-left:6px;}
.devsel{font-size:12px;padding:4px 6px;border:1px solid var(--line);border-radius:6px;background:#fff;max-width:190px;}

/* ---------- layout ---------- */
.layout{display:flex;align-items:stretch;min-height:calc(100vh - 52px);}
.sidebar{
  width:212px;flex:0 0 212px;background:var(--panel);border-right:1px solid var(--line);
  padding:12px 0;position:sticky;top:52px;height:calc(100vh - 52px);overflow-y:auto;
}
.side-h{font-size:11px;color:var(--dim);padding:10px 16px 6px;letter-spacing:.5px;}
.mod{
  width:100%;display:flex;align-items:center;gap:8px;padding:7px 14px;
  background:none;border:0;cursor:pointer;text-align:left;font-size:12.5px;color:var(--txt);
  border-left:2px solid transparent;
}
.mod:hover{background:var(--accent2);}
.mod.active{background:var(--accent2);border-left-color:var(--accent);color:var(--accent);font-weight:600;}
.mc{width:22px;font-size:10.5px;color:var(--dim);flex:0 0 22px;}
.mod.active .mc{color:var(--accent);}
.mn{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mp{font-size:10.5px;color:var(--dim);}

.main{flex:1;min-width:0;padding:14px 16px 40px;}
.mainhead{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:10px;}
h1{font-size:16px;font-weight:600;margin:0 0 4px;}
h1 small{font-size:11.5px;font-weight:400;color:var(--dim);margin-left:8px;}
.h2{font-size:14px;font-weight:600;margin:22px 0 8px;}
.meta{font-size:11.5px;color:var(--dim);margin:0;}
.actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.dirty{font-size:11.5px;color:#b26a00;background:#fff6e5;padding:3px 8px;border-radius:10px;}

/* ---------- buttons ---------- */
.btn{
  font-size:12px;padding:6px 13px;border-radius:6px;border:1px solid var(--line);
  background:#fff;color:var(--txt);cursor:pointer;transition:.12s;
}
.btn:hover{border-color:#c6cbd2;background:#fafbfc;}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;}
.btn.primary:hover{background:#134d87;}
.btn.ghost{background:transparent;}
.btn.xs{font-size:11px;padding:3px 9px;}
.btn:disabled{opacity:.45;cursor:not-allowed;}
.sel{font-size:12px;padding:5px 8px;border:1px solid var(--line);border-radius:6px;background:#fff;}

/* ---------- legend ---------- */
.legend{display:flex;gap:14px;margin-bottom:8px;font-size:11.5px;color:var(--dim);}
.lg::before{content:"";display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;vertical-align:-1px;}
.lg.fact::before{background:var(--fact);border:1px solid var(--line);}
.lg.target::before{background:#fff;border:1px solid var(--accent);}
.lg.derived::before{background:var(--derived);border:1px solid var(--line);}
.lg.warn{color:#b26a00;}
.lg.carry::before{background:#fff8e6;border:1px dashed #d9a441;}
.fv.carry{text-decoration:underline dotted #d9a441;text-underline-offset:3px;}

/* ---------- grid ---------- */
.gridwrap{background:var(--panel);border:1px solid var(--line);border-radius:8px;overflow:auto;max-height:calc(100vh - 220px);}
table.grid{border-collapse:separate;border-spacing:0;width:100%;font-size:12px;}
table.grid th,table.grid td{
  padding:4px 7px;border-bottom:1px solid var(--line2);border-right:1px solid var(--line2);
  white-space:nowrap;vertical-align:middle;
}
table.grid thead th{
  background:#fafbfc;font-weight:600;font-size:11.5px;color:#4a5058;
  position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line);
}
table.grid thead tr:nth-child(1) th{z-index:22;}
table.grid thead tr:nth-child(2) th{top:27px;}
.gh{text-align:center;background:#f2f5f8 !important;border-left:1px solid var(--line) !important;}
.fh{text-align:right;}
.fh-fact{color:#6b7280;}
.fh-target{color:var(--accent);}
.fh-derived{color:#8a9099;}
.fh em{font-style:normal;color:var(--dim);margin-left:2px;}

td.sticky{position:sticky;background:var(--panel);z-index:10;}
th.sticky{position:sticky;background:#fafbfc;z-index:25;}
.c-idx{left:0;width:36px;text-align:center;color:var(--dim);font-size:10.5px;}
.c-co{left:36px;width:96px;}
.c-nm{left:132px;min-width:150px;border-right:1px solid var(--line) !important;}
tr.row-sub td.sticky{background:var(--sub);}
tr.row-sub{background:var(--sub);font-weight:600;}
tr.row-total{background:#eef3f8;font-weight:700;}
tr.row-total td.sticky{background:#eef3f8;}
tbody tr:hover td{background:#f7fafd;}
tbody tr:hover td.sticky{background:#f7fafd;}

td.num,td .num{text-align:right;font-variant-numeric:tabular-nums;}
td{align-items:center;}
.fv{display:block;text-align:right;font-variant-numeric:tabular-nums;color:#3b4148;}
.fv.locked{color:#6b7280;}
.dv{display:block;text-align:right;font-variant-numeric:tabular-nums;color:#7b8290;font-style:italic;}
.dv.up{color:var(--red);font-style:normal;}
.dv.down{color:var(--green);font-style:normal;}
.ci{
  width:100%;border:1px solid transparent;border-radius:4px;padding:3px 5px;
  font-size:12px;text-align:right;font-variant-numeric:tabular-nums;color:var(--txt);
  background:#fff;outline:none;
}
.ci:hover{border-color:#d8dde3;}
.ci:focus{border-color:var(--accent);box-shadow:0 0 0 2px rgba(24,95,165,.12);background:#fff;}
.ci.changed{border-color:#e8a33d;background:#fffdf6;}
td.c-fact{background:var(--fact);}
td.c-derived{background:var(--derived);}
td.c-target{background:#fff;}
.tag{font-style:normal;font-size:10px;color:var(--accent);background:var(--accent2);border-radius:3px;padding:1px 4px;margin-left:5px;}

/* ---------- misc ---------- */
.empty{padding:40px;text-align:center;color:var(--dim);}
.badge{display:inline-block;font-size:10.5px;padding:2px 7px;border-radius:9px;background:#eef0f3;color:#5b626b;}
.st-DRAFT{background:#eef0f3;color:#5b626b;}
.st-SUBMITTED{background:#fff4e0;color:#a5691a;}
.st-APPROVED{background:#e6f6ec;color:#1e8449;}
.st-RETURNED{background:#fdecea;color:#c0392b;}
.st-LOCKED{background:#e8f1fa;color:#185FA5;}
.st-FACT_DRAFT,.st-PREP{background:#eef0f3;color:#5b626b;}
.st-FACT_LOCKED{background:#e8f1fa;color:#185FA5;}
.st-FILLING{background:#fff4e0;color:#a5691a;}
.st-REVIEW{background:#f0e9fb;color:#6b3fa0;}
.st-CLOSED{background:#e6f6ec;color:#1e8449;}
.act{font-family:Consolas,monospace;font-size:10px;}
.dim{color:var(--dim);}
.center{text-align:center;}
.mono{font-family:Consolas,monospace;font-size:11px;}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:18px;margin-bottom:14px;}
.steps{font-size:12px;color:#4a5058;line-height:1.9;padding-left:18px;}
.steps code{background:#f2f4f7;padding:1px 5px;border-radius:3px;font-size:11px;}
.cards{display:flex;gap:12px;margin-bottom:14px;flex-wrap:wrap;}
.card{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:12px 16px;min-width:150px;flex:1;}
.cl{font-size:11.5px;color:var(--dim);}
.cv{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;margin-top:4px;}
.cu{font-size:10.5px;color:var(--dim);}
table.simple td{white-space:normal;}
.bar{display:inline-block;width:calc(100% - 46px);height:7px;background:#eef0f3;border-radius:4px;overflow:hidden;vertical-align:middle;margin-right:6px;}
.bar span{display:block;height:100%;background:var(--accent);border-radius:4px;}
.bar span.ok{background:var(--green);}

.toast{
  position:fixed;left:50%;bottom:28px;transform:translateX(-50%);
  padding:9px 18px;border-radius:8px;font-size:12.5px;color:#fff;background:#2c3e50;
  box-shadow:0 6px 20px rgba(0,0,0,.16);z-index:200;max-width:70vw;
}
.toast.error{background:#c0392b;}
.toast.ok{background:#1e8449;}

/* ---------- 登录 ---------- */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#f6f7f9;}
.login-box{width:340px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:28px 28px 22px;}
.login-logo{display:flex;align-items:center;gap:9px;margin-bottom:6px;}
.login-logo strong{font-size:15px;font-weight:600;}
.login-sub{font-size:12px;color:var(--dim);margin:0 0 20px;}
.login-box label{display:block;font-size:12px;color:var(--dim);margin-bottom:14px;}
.login-box input{width:100%;margin-top:6px;font-size:13px;padding:9px 11px;border:1px solid var(--line);border-radius:7px;outline:none;font-family:inherit;}
.login-box input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(24,95,165,.1);}
.login-btn{width:100%;margin-top:6px;padding:9px;font-size:13px;}
.login-err{color:#c0392b;font-size:12px;margin:-4px 0 10px;}
.login-tip{font-size:11px;color:var(--dim);text-align:center;margin:14px 0 0;}

/* ---------- 弹窗 ---------- */
.modal-mask{position:fixed;inset:0;background:rgba(20,25,32,.35);z-index:300;display:flex;align-items:center;justify-content:center;padding:24px;}
.modal{width:720px;max-width:100%;max-height:88vh;background:#fff;border-radius:12px;display:flex;flex-direction:column;overflow:hidden;}
.modal.small{width:400px;}
.modal-h{padding:15px 20px;border-bottom:1px solid var(--line);font-size:14px;font-weight:600;}
.modal-b{padding:16px 20px;overflow-y:auto;}
.modal-f{padding:12px 20px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:8px;}
.frow{display:flex;align-items:center;gap:12px;margin-bottom:10px;}
.frow label{width:70px;flex:0 0 70px;font-size:12px;color:var(--dim);}
.frow input,.frow select{flex:1;font-size:12.5px;padding:7px 10px;border:1px solid var(--line);border-radius:6px;font-family:inherit;outline:none;}
.frow input:focus,.frow select:focus{border-color:var(--accent);}
.fgroup{border-top:1px dashed var(--line);margin-top:14px;padding-top:12px;}
.fg-h{font-size:12px;font-weight:600;margin-bottom:8px;}
.checks{display:flex;flex-wrap:wrap;gap:8px 16px;}
.chk{display:flex;align-items:center;gap:5px;font-size:12px;cursor:pointer;width:auto;}
.chk input{margin:0;}
.projwrap{display:flex;flex-wrap:wrap;gap:14px 22px;}
.projcol{min-width:150px;}
.projco{font-size:11px;color:var(--dim);margin-bottom:5px;}
.projcol .chk{margin-bottom:4px;}