/* 由 index.html 的内联 <style> 抽出（2026-10-05）。
   CSP: style-src-elem: inline 阻断项 —— 内联样式元素是收紧 style-src 的阻塞点，
   迁出为外链样式表后归 style-src-elem 'self' 管辖。内容原样搬移，未做改动。 */
@import './semantic-aliases.css';

*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"PingFang SC","Microsoft YaHei",-apple-system,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
button{font-family:inherit;cursor:pointer;border:none}
input{font-family:inherit;outline:none}
/* 键盘焦点环：原实现只有 var(--green)[#06B981] 1px 描边（白底 2.54:1，不达 SC 1.4.11 的 3:1） */
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid var(--green-text);outline-offset:2px}
.hidden{display:none!important}

/* ===== 登录页 · 全屏品牌沉浸（对齐工作台 index.html） ===== */
#loginPage{min-height:100vh;display:flex;background:var(--grad-login);position:relative;overflow:hidden}
/* 装饰：柔光 */
#loginPage::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 15% 85%,var(--a-white-mid) 0%,transparent 40%),radial-gradient(circle at 85% 15%,var(--a-white-weak) 0%,transparent 35%);pointer-events:none}
/* 装饰：科技感网格 */
#loginPage::after{content:'';position:absolute;inset:0;background-image:linear-gradient(var(--a-white-weak) 1px,transparent 1px),linear-gradient(90deg,var(--a-white-weak) 1px,transparent 1px);background-size:48px 48px;pointer-events:none;-webkit-mask-image:radial-gradient(circle at center,black 0%,transparent 75%);mask-image:radial-gradient(circle at center,black 0%,transparent 75%)}
.login-wrap{position:relative;z-index:1;display:flex;width:100%;min-height:100vh;align-items:center;justify-content:center;padding:var(--sp-xxl)}
/* 左侧品牌区 */
.login-brand{flex:1;max-width:560px;color:var(--on-brand);padding:60px;display:flex;flex-direction:column;justify-content:center}
.login-brand .brand-logo-big{width:240px;height:auto;margin-bottom:var(--sp-huge);filter:drop-shadow(0 8px 24px var(--a-black-mid))}
.login-brand h1{font-size:var(--glyph-splash);font-weight:var(--fw-bold);letter-spacing:1px;margin-bottom:var(--sp-md);line-height:var(--lh-tight)}
.login-brand .tagline{font-size:var(--fs-titleLg);opacity:.9;margin-bottom:var(--sp-huge);font-weight:var(--fw-regular)}
.login-brand .features{display:flex;flex-direction:column;gap:var(--sp-lg);margin-top:var(--sp-xxl)}
.login-brand .feat{display:flex;align-items:center;gap:var(--sp-md);font-size:var(--fs-bodyLg);opacity:.95}
.login-brand .feat::before{content:'✓';width:22px;height:22px;border-radius:50%;background:var(--a-white-mid);display:inline-flex;align-items:center;justify-content:center;font-size:var(--fs-caption);font-weight:var(--fw-semibold)}
/* 右侧登录卡片 */
.login-box{background:var(--surface);border-radius:var(--radius-xxl);padding:44px var(--sp-huge);width:420px;max-width:100%;box-shadow: var(--elev-ink-xxl);position:relative;overflow:hidden}
.login-box::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--grad-brand-h)}
.login-box .login-title{font-size:var(--fs-hero);font-weight:var(--fw-bold);color:var(--text);margin-bottom:var(--sp-sm)}
.login-box .login-sub{font-size:var(--fs-body);color:var(--text-3);margin-bottom:var(--sp-huge)}
.login-box .form-group{margin-bottom:var(--sp-xl)}
.login-box .form-input{width:100%;height:var(--ctl-secondary);padding:0 var(--sp-lg) 0 44px;font-size:var(--fs-bodyLg);border-radius:var(--radius-md);border:1.5px solid var(--border);background:var(--surface-2);color:var(--text);transition:all .15s;outline:none}
.login-box .form-input:focus{border-color:var(--primary);background:var(--surface);box-shadow:0 0 0 4px var(--a-green-weak)}
.login-box .input-wrap{position:relative}
.login-box .input-wrap .ic{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--text-3);font-size:var(--fs-title);pointer-events:none;display:inline-flex}
.login-box .btn-login{width:100%;height:var(--ctl-secondary);font-size:var(--fs-bodyLg);font-weight:var(--fw-semibold);border-radius:var(--radius-md);letter-spacing:1px;background:var(--grad-brand);border:none;color:var(--on-brand);box-shadow:var(--shadow-brand);cursor:pointer;margin-top:var(--sp-sm);transition:all .15s}
.login-box .btn-login:hover{transform:translateY(-1px);box-shadow: var(--elev-brand-lg)}
.login-err{color:var(--bad);font-size:var(--fs-body);min-height:20px;margin-top:var(--sp-md);text-align:center}
.login-foot{text-align:center;color:var(--text-3);font-size:var(--fs-caption);margin-top:var(--sp-xxl)}
/* 移动端：品牌区隐藏，仅保留登录卡片 */
@media(max-width:760px){
  .login-brand{display:none}
  .login-box{width:100%;max-width:420px}
}

/* ===== 备案信息条 ===== */
#icpBar{position:fixed;left:0;right:0;bottom:0;height:34px;display:flex;align-items:center;justify-content:center;gap:var(--sp-sm);font-size: var(--fs-caption);z-index:100;color:var(--a-white-hi-mid);background:var(--c-scrim-sub-bar, rgba(15, 42, 80, 0.55));backdrop-filter:blur(4px)}
#icpBar a{color:var(--a-white-hi-mid);text-decoration:none}
#icpBar a:hover{color:var(--on-brand);text-decoration:underline}
#icpBar.light{color:var(--text3);background:var(--a-white-hi-strong);border-top:1px solid var(--line)}
#icpBar.light a{color:var(--text3)}
#icpBar.light a:hover{color:var(--text)}

/* ===== 主界面 ===== */
#appPage{min-height:100vh;padding-bottom:34px}
.topbar{background:var(--card);border-bottom:1px solid var(--line);padding:0 var(--sp-xxl);height:60px;display:flex;align-items:center;position:sticky;top:0;z-index:50}
.topbar .brand{display:flex;align-items:center;gap:var(--sp-md);font-weight:var(--fw-bold);font-size: var(--fs-title);color:var(--deep)}
.topbar .brand img{height:32px;width:32px;object-fit:contain}
.topbar .spacer{flex:1}
.topbar .who{display:flex;align-items:center;gap:var(--sp-md);color:var(--text2);font-size: var(--fs-bodyLg)}
.topbar .logout{background:var(--bg);border:1px solid var(--line);color:var(--text2);padding:var(--sp-sm) var(--sp-lg);border-radius:var(--radius-sm);font-size: var(--fs-body)}
.topbar .logout:hover{color:var(--bad);border-color:#fecaca}
.wrap{max-width:1200px;margin:var(--sp-xxl) auto;padding:0 var(--sp-xxl)}
.page-title{font-size: var(--fs-display);font-weight:var(--fw-bold);color:var(--deep);margin-bottom:var(--sp-xs)}
.page-desc{color:var(--text3);font-size: var(--fs-body);margin-bottom:var(--sp-xl)}

/* KPI */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-lg);margin-bottom:var(--sp-xxl)}
.kpi{background:var(--card);border-radius:var(--radius-lg);padding:var(--sp-xl);border:1px solid var(--line);box-shadow: var(--elev-ink-md)}
.kpi .k-label{font-size: var(--fs-body);color:var(--text3);margin-bottom:var(--sp-sm)}
.kpi .k-value{font-size: var(--fs-hero);font-weight:var(--fw-bold);color:var(--deep)}
.kpi .k-sub{font-size: var(--fs-caption);color:var(--text3);margin-top:var(--sp-xs)}
.kpi.green .k-value{color:var(--green-text)}
.kpi.blue .k-value{color:var(--blue)}
.kpi.red .k-value{color:#e11d48}

/* 项目卡片 */
.proj-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:var(--sp-lg)}
.proj-card{background:var(--card);border-radius:var(--radius-xl);border:1px solid var(--line);padding:var(--sp-xl);cursor:pointer;transition:.2s;box-shadow: var(--elev-ink-md)}
.proj-card:hover{transform:translateY(-3px);box-shadow: var(--elev-ink-xl);border-color:#c7d7e8}
.proj-card .p-name{font-size: var(--fs-title);font-weight:var(--fw-semibold);color:var(--deep);margin-bottom:var(--sp-xs);display:flex;justify-content:space-between;align-items:center;gap:var(--sp-sm)}
.proj-card .p-cust{color:var(--text2);font-size: var(--fs-body);margin-bottom:var(--sp-lg)}
.p-status{padding:var(--sp-xxs) var(--sp-md);border-radius:var(--radius-xxl);font-size: var(--fs-caption);white-space:nowrap}
.p-status.执行中{background:#ecfdf5;color:#047857}
.p-status.已完成{background:#e0f2fe;color:#0369a1}
.p-status.暂停{background:#fef3c7;color:#b45309}
.proj-stats{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-md);border-top:1px solid var(--line);padding-top:var(--sp-md)}
.ps{text-align:center}
.ps .v{font-size: var(--fs-bodyLg);font-weight:var(--fw-semibold)}
.ps .l{font-size: var(--fs-mini);color:var(--text3);margin-top:var(--sp-xxs)}
.ps.profit .v{color:var(--green-text)}
.ps.profit .v.neg{color:var(--bad)}
.proj-empty{grid-column:1/-1;text-align:center;padding:60px 0;color:var(--text3);background:var(--card);border-radius:var(--radius-xl);border:1px dashed #d4dbe3}

/* 详情 */
.back-btn{background:var(--card);border:1px solid var(--line);color:var(--text2);padding:var(--sp-sm) var(--sp-lg);border-radius:var(--radius-sm);font-size: var(--fs-bodyLg);margin-bottom:var(--sp-xl)}
.back-btn:hover{border-color:#c7d7e8;color:var(--deep)}
.detail-card{background:var(--card);border-radius:var(--radius-xl);border:1px solid var(--line);padding:var(--sp-xxl);margin-bottom:var(--sp-xl)}
.detail-card .dc-title{font-size: var(--fs-bodyLg);font-weight:var(--fw-semibold);color:var(--deep);margin-bottom:var(--sp-lg);display:flex;align-items:center;gap:var(--sp-sm)}
.detail-card .dc-title::before{content:'';width:4px;height:16px;border-radius:var(--radius-xxs);background:var(--grad)}
.info-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:var(--sp-md)}
.info-grid .ig label{display:block;font-size: var(--fs-caption);color:var(--text3);margin-bottom:var(--sp-xs)}
.info-grid .ig .val{font-size: var(--fs-bodyLg);font-weight:var(--fw-medium)}
table{width:100%;border-collapse:collapse;font-size: var(--fs-bodyLg)}
th{text-align:left;color:var(--text3);font-weight:var(--fw-medium);font-size: var(--fs-caption);padding:var(--sp-sm) var(--sp-md);border-bottom:1px solid var(--line)}
td{padding:var(--sp-md) var(--sp-md);border-bottom:1px solid #f1f4f7}
tr:hover td{background:#fafbfc}
.t-right{text-align:right}
.money{font-variant-numeric:tabular-nums;font-weight:var(--fw-medium)}
.total-row td{background:#f8fafc;font-weight:var(--fw-semibold);color:var(--deep)}
.empty-row{text-align:center;color:var(--text3);padding:var(--sp-huge)}
.amount-highlight{font-size: var(--fs-display);font-weight:var(--fw-bold);color:var(--green-text)}
.amount-highlight.neg{color:var(--bad)}

@media(max-width:760px){
  .kpis{grid-template-columns:repeat(2,1fr)}
  .proj-grid{grid-template-columns:1fr}
}
