
:root {
  --hrms-ink:#122033; --hrms-muted:#64748b; --hrms-line:#dbe4ee; --hrms-bg:#f6f8fb;
  --hrms-card:#ffffff; --hrms-blue:#1d4ed8; --hrms-teal:#0f766e; --hrms-green:#15803d;
  --hrms-amber:#b45309; --hrms-red:#b91c1c; --hrms-shadow:0 16px 42px rgba(15,23,42,.08);
}
* { box-sizing:border-box; }
body.hrms-unified, .hrms-unified-body {
  margin:0; background:var(--hrms-bg); color:var(--hrms-ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",Arial,sans-serif; letter-spacing:0;
}
.hrms-shell { max-width:1280px; margin:0 auto; padding:28px clamp(18px,4vw,56px) 44px; }
.hrms-hero { background:linear-gradient(180deg,#eef6ff 0%,#ffffff 100%); border-bottom:1px solid var(--hrms-line); }
.hrms-hero-inner { max-width:1280px; margin:0 auto; padding:32px clamp(18px,4vw,56px) 24px; }
.hrms-eyebrow { color:var(--hrms-teal); font-weight:800; margin-bottom:10px; }
.hrms-title { margin:0; font-size:clamp(30px,4vw,52px); line-height:1.08; color:var(--hrms-ink); }
.hrms-lead { max-width:820px; color:#475569; font-size:17px; line-height:1.75; margin:14px 0 0; }
.hrms-status-strip { display:flex; flex-wrap:wrap; gap:10px; margin-top:18px; }
.hrms-pill { display:inline-flex; align-items:center; gap:7px; padding:8px 12px; border-radius:999px; background:#fff; border:1px solid var(--hrms-line); font-weight:800; font-size:13px; }
.hrms-pill.done { color:var(--hrms-green); background:#ecfdf5; border-color:#bbf7d0; }
.hrms-pill.preview { color:var(--hrms-amber); background:#fff7ed; border-color:#fed7aa; }
.hrms-pill.blocked { color:var(--hrms-red); background:#fef2f2; border-color:#fecaca; }
.hrms-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.hrms-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.hrms-card { background:var(--hrms-card); border:1px solid var(--hrms-line); border-radius:8px; padding:18px; box-shadow:var(--hrms-shadow); margin:16px 0; }
.hrms-card h2, .hrms-card h3 { margin:0 0 10px; }
.hrms-metric strong { display:block; font-size:30px; color:var(--hrms-blue); }
.hrms-muted { color:var(--hrms-muted); }
.hrms-flow { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; margin:16px 0; }
.hrms-step { background:#fff; border:1px solid var(--hrms-line); border-radius:8px; padding:13px; min-height:92px; }
.hrms-step strong { display:block; margin-bottom:6px; }
.hrms-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }
.hrms-btn { display:inline-flex; align-items:center; justify-content:center; padding:10px 14px; border-radius:8px; border:1px solid var(--hrms-line); background:#fff; color:var(--hrms-ink); text-decoration:none; font-weight:800; }
.hrms-btn.primary { background:var(--hrms-blue); border-color:var(--hrms-blue); color:#fff; }
.hrms-risk { border-left:5px solid var(--hrms-amber); }
.hrms-risk.blocked { border-left-color:var(--hrms-red); }
.hrms-table { width:100%; border-collapse:collapse; background:#fff; }
.hrms-table th,.hrms-table td { text-align:left; padding:11px; border-bottom:1px solid #e2e8f0; vertical-align:top; }
.hrms-tech { margin-top:18px; border:1px solid var(--hrms-line); border-radius:8px; background:#fff; padding:12px; }
.hrms-tech summary { cursor:pointer; font-weight:900; }
.hrms-tech pre { white-space:pre-wrap; overflow:auto; background:#0f172a; color:#e2e8f0; padding:14px; border-radius:8px; font-size:12px; }
@media(max-width:980px){ .hrms-grid,.hrms-grid.two,.hrms-flow{grid-template-columns:1fr 1fr;} }
@media(max-width:620px){ .hrms-grid,.hrms-grid.two,.hrms-flow{grid-template-columns:1fr;} .hrms-shell,.hrms-hero-inner{padding-left:18px;padding-right:18px;} .hrms-btn,.hrms-pill{width:100%;} }


/* 23A boss demo visual QA polish */
.hrms-card { overflow-wrap:anywhere; }
.hrms-actions { align-items:center; }
.hrms-btn { min-height:42px; }
.hrms-card p { line-height:1.68; }
.hrms-hero-inner { position:relative; }
.hrms-page-note { border:1px solid #bbf7d0; background:#ecfdf5; color:#14532d; border-radius:8px; padding:12px 14px; margin:14px 0; font-weight:800; }
@media(max-width:620px){
  .hrms-title { font-size:28px; }
  .hrms-lead { font-size:15px; }
  .hrms-card { padding:15px; }
  .hrms-table { display:block; overflow-x:auto; }
}
