:root {
  --yellow: #f1db15;
  --yellow-soft: #fff3a0;
  --ink: #151515;
  --ink-2: #232323;
  --muted: #727272;
  --line: #e8e8e2;
  --surface: rgba(255,255,255,.91);
  --bg: #fff9d9;
  --shadow: 0 18px 60px rgba(20,20,10,.08);
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; font-family: Inter, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif; color: var(--ink); }
button, input { font: inherit; }
button { cursor: pointer; }

/* Login */
.login-body { min-height: 100vh; background:var(--yellow-soft); overflow:hidden; }
.login-layout { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(420px, .75fr); }
.login-brand-panel { position:relative; overflow:hidden; padding:9vh 7vw; background:radial-gradient(circle at 20% 10%, #fff9c8 0, transparent 30%), linear-gradient(145deg,var(--yellow),#f7e94d); color:#17140a; display:flex; flex-direction:column; justify-content:center; }
.login-brand-panel::after { content:""; position:absolute; inset:auto -12% -22% 20%; height:70%; border:1px solid rgba(30,25,0,.12); transform:rotate(-13deg); border-radius:48px; }
.login-brand-glow { position:absolute; width:480px; height:480px; background:#fff; opacity:.26; filter:blur(110px); border-radius:50%; left:5%; top:12%; }
.login-logo { width:min(520px,76%); height:auto; object-fit:contain; margin-bottom:54px; position:relative; z-index:1; background:rgba(255,255,255,.92); padding:18px 24px; border-radius:22px; box-shadow:0 18px 40px rgba(107,92,0,.12); }
.login-kicker, .topbar-eyebrow, .hero-label { letter-spacing:.16em; font-size:12px; font-weight:900; color:#786900; }
.login-brand-panel h1 { position:relative; z-index:1; font-size:clamp(46px,5.2vw,82px); line-height:1.06; margin:18px 0 22px; letter-spacing:-.045em; }
.login-brand-panel p { position:relative; z-index:1; color:#514900; font-size:18px; max-width:650px; }
.login-feature-row { position:relative; z-index:1; display:flex; gap:10px; flex-wrap:wrap; margin-top:26px; }
.login-feature-row span { border:1px solid rgba(30,25,0,.16); background:rgba(255,255,255,.38); border-radius:999px; padding:9px 15px; color:#312b00; font-size:13px; }
.login-card-wrap { display:flex; align-items:center; justify-content:center; background:linear-gradient(160deg,#fffde8,var(--yellow-soft)); padding:50px; position:relative; }
.login-card-wrap::before { content:"ZICHEN"; position:absolute; color:rgba(20,20,20,.035); font-size:12vw; font-weight:900; transform:rotate(-20deg); }
.login-card { width:min(430px,100%); background:#fff; border:1px solid #e8e8e3; box-shadow:var(--shadow); padding:42px; border-radius:28px; position:relative; z-index:1; }
.login-card-title { font-size:30px; font-weight:900; }
.login-card-subtitle { margin:8px 0 32px; color:#888; }
.login-card label { display:block; margin:18px 0; }
.login-card label span { display:block; font-size:13px; font-weight:700; color:#555; margin-bottom:8px; }
.login-card input { width:100%; border:1px solid #ddd; padding:14px 15px; border-radius:12px; outline:none; background:#fafafa; transition:.2s; }
.login-card input:focus { border-color:#d8c400; box-shadow:0 0 0 4px rgba(241,219,21,.15); background:#fff; }
.primary-button { width:100%; border:0; border-radius:12px; background:var(--yellow); color:#111; padding:15px; font-weight:900; margin-top:8px; }
.form-error { min-height:21px; color:#bd2424; font-size:13px; }
.login-security { border-top:1px solid #eee; padding-top:18px; margin-top:4px; color:#aaa; font-size:12px; text-align:center; }

/* App shell */
.app-body { background:var(--bg); min-height:100vh; overflow-x:hidden; }
.app-shell { min-height:100vh; display:grid; grid-template-columns:258px 1fr; position:relative; z-index:2; }
.sidebar { position:sticky; top:0; height:100vh; background:linear-gradient(180deg,#f4df1c,#e9cd00); color:#17140a; padding:22px 14px; display:flex; flex-direction:column; box-shadow:10px 0 35px rgba(0,0,0,.08); }
.sidebar-brand { display:flex; align-items:center; gap:12px; padding:5px 9px 22px; border-bottom:1px solid rgba(42,36,0,.14); }
.sidebar-brand img { width:84px; height:32px; object-fit:contain; object-position:left center; }
.sidebar-brand strong { display:block; font-size:14px; }
.sidebar-brand span { display:block; font-size:10px; color:#615600; margin-top:3px; max-width:120px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sidebar-nav { overflow:auto; padding:15px 0; display:flex; flex-direction:column; gap:3px; }
.nav-item { border:0; color:#564b00; background:transparent; padding:11px 12px; border-radius:10px; display:flex; gap:11px; align-items:center; text-align:left; font-size:13px; }
.nav-item span { width:20px; color:#756700; text-align:center; }
.nav-item:hover { background:rgba(255,255,255,.45); color:#111; }
.nav-item.active { background:#17140a; color:#fff; font-weight:800; box-shadow:0 8px 20px rgba(70,58,0,.18); }
.nav-item.active span { color:var(--yellow); }
.main-area { min-width:0; }
.topbar { min-height:92px; padding:20px 34px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(20,20,20,.06); background:rgba(255,249,217,.88); backdrop-filter:blur(15px); position:sticky; top:0; z-index:10; }
.topbar-eyebrow { color:#9a8c00; font-size:9px; }
.topbar h2 { margin:5px 0 0; font-size:25px; }
.user-panel { display:grid; grid-template-columns:auto auto auto; align-items:center; gap:12px 16px; text-align:right; }
.user-company { grid-column:1 / 3; font-size:11px; font-weight:900; color:#8f8200; }
.user-name { grid-column:1 / 3; font-size:13px; color:#555; }
.ghost-button { grid-column:3; grid-row:1 / 3; border:1px solid #d8d8d2; background:#fff; border-radius:10px; padding:9px 13px; }
.content-area { padding:30px 34px 80px; position:relative; }
.page-view { display:none; }
.page-view.active { display:block; }
.brand-watermark { position:fixed; z-index:0; pointer-events:none; left:258px; top:92px; right:0; bottom:0; overflow:hidden; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:18vh 10vw; padding:8vh 4vw; transform:rotate(-10deg) scale(1.08); transform-origin:center; }
.watermark-item { opacity:.045; display:flex; align-items:center; gap:20px; white-space:nowrap; }
.watermark-item img { width:260px; height:auto; filter:none; }
.watermark-item strong { font-size:36px; font-weight:900; }
.hero-card { min-height:260px; background:linear-gradient(110deg,#f1db15,#ffe962); border-radius:26px; color:#17140a; padding:42px 46px; display:flex; align-items:center; justify-content:space-between; gap:40px; box-shadow:var(--shadow); overflow:hidden; position:relative; }
.hero-card::after { content:""; position:absolute; width:360px; height:360px; background:var(--yellow); opacity:.08; filter:blur(60px); right:2%; border-radius:50%; }
.hero-copy { position:relative; z-index:1; max-width:620px; }
.hero-copy h1 { font-size:42px; letter-spacing:-.04em; margin:15px 0 12px; }
.hero-copy p { color:#5c5200; line-height:1.75; margin:0; }
.hero-logo { width:min(430px,38%); position:relative; z-index:2; object-fit:contain; background:rgba(255,255,255,.92); border-radius:22px; padding:20px 24px; filter:drop-shadow(0 14px 20px rgba(104,89,0,.12)); }
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-top:18px; }
.metric-card, .panel-card, .placeholder-card { background:var(--surface); border:1px solid rgba(20,20,20,.06); border-radius:18px; box-shadow:0 8px 30px rgba(20,20,10,.035); }
.metric-card { padding:22px; }
.metric-card span { color:#777; font-size:12px; font-weight:700; }
.metric-card strong { display:block; font-size:28px; margin:9px 0 5px; }
.metric-card small { color:#aaa; }
.dashboard-grid { display:grid; grid-template-columns:1.7fr 1fr; gap:16px; margin-top:16px; }
.panel-card { padding:24px; min-height:220px; }
.panel-heading { display:flex; justify-content:space-between; align-items:start; }
.panel-heading span { font-size:11px; color:#999; }
.panel-heading strong { display:block; font-size:18px; margin-top:4px; }
.pill { background:#f3f1dc; padding:5px 9px; border-radius:999px; color:#817700 !important; }
.empty-state { display:flex; align-items:center; justify-content:center; min-height:130px; color:#aaa; text-align:center; line-height:1.7; border:1px dashed #ddd; border-radius:13px; margin-top:18px; padding:20px; }
.saving-number { font-size:38px; font-weight:900; margin:25px 0; }
.progress-row { display:flex; justify-content:space-between; color:#777; font-size:12px; }
.progress-track { height:8px; background:#eee; border-radius:999px; margin-top:9px; overflow:hidden; }
.progress-track i { display:block; height:100%; background:var(--yellow); }
.placeholder-card { padding:60px; min-height:340px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }
.placeholder-tag { background:var(--yellow); font-size:11px; font-weight:900; border-radius:999px; padding:5px 9px; }
.placeholder-card h2 { font-size:38px; margin:18px 0 8px; }
.placeholder-card p { color:#777; max-width:640px; line-height:1.8; }

@media (max-width: 1050px) {
  .login-layout { grid-template-columns:1fr; }
  .login-brand-panel { display:none; }
  .login-card-wrap { min-height:100vh; }
  .metric-grid { grid-template-columns:repeat(2,1fr); }
  .dashboard-grid { grid-template-columns:1fr; }
  .hero-logo { width:34%; }
}
@media (max-width: 760px) {
  .app-shell { grid-template-columns:76px 1fr; }
  .sidebar { padding:16px 8px; }
  .sidebar-brand div, .nav-item:not(.active) { font-size:0; }
  .sidebar-brand img { width:55px; }
  .nav-item { justify-content:center; padding:12px 4px; }
  .nav-item span { font-size:16px; }
  .brand-watermark { left:76px; }
  .topbar { padding:16px 18px; }
  .content-area { padding:18px; }
  .hero-card { padding:28px; min-height:220px; }
  .hero-copy h1 { font-size:30px; }
  .hero-logo { display:none; }
  .metric-grid { grid-template-columns:1fr 1fr; }
  .user-company { display:none; }
}

/* Asset center */
.section-heading-row { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:22px; }
.section-heading-row h1 { font-size:36px; margin:7px 0 5px; letter-spacing:-.035em; }
.section-heading-row p { color:#777; margin:0; }
.section-kicker { font-size:10px; letter-spacing:.18em; font-weight:900; color:#988b00; }
.primary-action { border:0; background:var(--yellow); color:#111; font-weight:900; padding:12px 17px; border-radius:11px; box-shadow:0 7px 16px rgba(184,165,0,.18); }
.asset-summary-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:14px; }
.summary-chip { background:rgba(255,255,255,.82); border:1px solid rgba(20,20,20,.06); border-radius:15px; padding:15px 18px; }
.summary-chip span { display:block; color:#999; font-size:10px; margin-bottom:7px; }
.summary-chip strong { font-size:15px; }
.asset-list-card { background:rgba(255,255,255,.92); border:1px solid rgba(20,20,20,.06); border-radius:20px; box-shadow:var(--shadow); overflow:hidden; }
.asset-toolbar { display:flex; gap:10px; padding:17px; border-bottom:1px solid #eee; align-items:center; }
.search-box { flex:1; min-width:240px; display:flex; align-items:center; background:#f6f6f2; border:1px solid #e6e6df; border-radius:11px; padding:0 12px; }
.search-box span { color:#999; margin-right:7px; }
.search-box input { border:0; outline:0; background:transparent; width:100%; padding:11px 0; }
.asset-toolbar select, .asset-dialog select { border:1px solid #ddd; border-radius:10px; background:#fff; padding:10px 12px; }
.table-wrap { overflow:auto; }
.asset-table { width:100%; border-collapse:collapse; min-width:1050px; font-size:12px; }
.asset-table th { text-align:left; color:#999; font-size:10px; font-weight:800; padding:13px 15px; background:#fafaf7; border-bottom:1px solid #eee; white-space:nowrap; }
.asset-table td { padding:14px 15px; border-bottom:1px solid #f0f0eb; vertical-align:middle; }
.asset-table tr:hover td { background:#fffef4; }
.asset-code { font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:11px; }
.asset-name-cell strong { display:block; font-size:13px; }
.asset-name-cell span { display:block; color:#999; margin-top:4px; font-size:10px; }
.type-badge, .status-badge, .grade-badge { display:inline-flex; align-items:center; padding:5px 8px; border-radius:999px; font-size:10px; font-weight:800; white-space:nowrap; }
.type-badge { background:#f2f2ee; color:#555; }
.status-badge { background:#eef1ef; color:#4b5a50; }
.status-in_use, .status-reusable { background:#e7f6e9; color:#29763a; }
.status-pending_disposal, .status-disposed { background:#f7e9e7; color:#a04438; }
.status-in_repair, .status-pending_inspection { background:#fff4d8; color:#8d6800; }
.grade-badge { width:26px; height:26px; justify-content:center; padding:0; }
.grade-a { background:#e4f6e7; color:#237536; }.grade-b { background:#fff2c8; color:#806500; }.grade-c { background:#f9dfdc; color:#9c352b; }
.muted { color:#aaa; }
.table-action { border:0; background:#1b1b1b; color:#fff; border-radius:8px; padding:7px 10px; font-size:10px; }
.table-empty { text-align:center; color:#aaa; padding:50px !important; }

.asset-dialog { width:min(920px, calc(100vw - 36px)); max-height:88vh; border:0; border-radius:22px; padding:0; box-shadow:0 30px 90px rgba(0,0,0,.22); }
.asset-dialog::backdrop { background:rgba(10,10,10,.5); backdrop-filter:blur(4px); }
.asset-dialog form { padding:26px; overflow:auto; max-height:88vh; }
.dialog-heading, .drawer-heading { display:flex; justify-content:space-between; align-items:flex-start; border-bottom:1px solid #eee; padding-bottom:16px; margin-bottom:18px; }
.dialog-heading span, .drawer-heading span { color:#a09200; font-size:9px; letter-spacing:.16em; font-weight:900; }
.dialog-heading h2, .drawer-heading h2 { margin:5px 0 0; font-size:23px; }
.icon-button { border:0; background:#f2f2ee; width:34px; height:34px; border-radius:50%; font-size:20px; }
.form-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.form-grid label span { display:block; color:#666; font-size:10px; font-weight:800; margin-bottom:6px; }
.form-grid input, .form-grid textarea, .form-grid select { width:100%; border:1px solid #ddd; background:#fafafa; border-radius:10px; padding:10px 11px; outline:0; }
.form-grid input:focus, .form-grid textarea:focus, .form-grid select:focus { border-color:#d8c400; box-shadow:0 0 0 3px rgba(241,219,21,.14); background:#fff; }
.form-span-2 { grid-column:span 2; }
.dialog-actions { display:flex; justify-content:flex-end; gap:10px; border-top:1px solid #eee; margin-top:19px; padding-top:18px; }

.detail-drawer { position:fixed; inset:0; z-index:40; pointer-events:none; opacity:0; transition:.2s; }
.detail-drawer.open { pointer-events:auto; opacity:1; }
.drawer-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.28); backdrop-filter:blur(2px); }
.drawer-card { position:absolute; right:0; top:0; bottom:0; width:min(620px, 94vw); background:#fbfbf8; box-shadow:-20px 0 70px rgba(0,0,0,.16); padding:28px; transform:translateX(100%); transition:.25s ease; overflow:auto; }
.detail-drawer.open .drawer-card { transform:translateX(0); }
.detail-hero { background:#191919; color:#fff; border-radius:15px; padding:18px; display:flex; align-items:center; gap:10px; margin-bottom:15px; }
.detail-hero strong { margin-left:auto; }
.detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.detail-grid > div, .config-list > div { background:#fff; border:1px solid #ecece6; border-radius:11px; padding:13px; }
.detail-grid span, .config-list span { display:block; color:#999; font-size:9px; margin-bottom:5px; }
.detail-grid strong, .config-list strong { font-size:12px; }
.detail-section { margin-top:20px; }
.detail-section h3 { font-size:15px; margin-bottom:10px; }
.config-list { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.timeline { border-left:1px solid #ddd; margin-left:7px; padding-left:20px; }
.timeline > div { position:relative; padding:0 0 18px; }
.timeline i { position:absolute; left:-25px; top:4px; width:9px; height:9px; border-radius:50%; background:var(--yellow); border:2px solid #fff; box-shadow:0 0 0 1px #d6c400; }
.timeline span { display:block; color:#aaa; font-size:9px; }
.timeline strong { display:block; margin-top:3px; font-size:11px; }.timeline p { margin:4px 0 0; color:#777; font-size:10px; }
@media (max-width: 900px) { .form-grid { grid-template-columns:1fr 1fr; }.asset-summary-row { grid-template-columns:1fr; } }
@media (max-width: 620px) { .form-grid { grid-template-columns:1fr; }.form-span-2 { grid-column:auto; }.section-heading-row { align-items:flex-start; flex-direction:column; }.asset-toolbar { flex-wrap:wrap; }.detail-grid,.config-list { grid-template-columns:1fr; } }

/* Import center */
.import-layout { display:grid; grid-template-columns:1.15fr .85fr; gap:16px; margin-bottom:16px; }
.import-setup-card, .import-map-card { background:rgba(255,255,255,.92); border:1px solid rgba(20,20,20,.06); border-radius:20px; box-shadow:var(--shadow); padding:22px; }
.file-drop { margin:18px 0 16px; min-height:145px; border:1.5px dashed #d8d6be; background:#fffef2; border-radius:16px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; cursor:pointer; transition:.2s; }
.file-drop:hover { border-color:#c8b900; background:#fffce6; }
.file-drop input { display:none; }
.file-drop strong { font-size:15px; }
.file-drop span { font-size:11px; color:#999; margin-top:7px; }
.import-form-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:14px; }
.import-form-grid label span { display:block; font-size:10px; color:#777; font-weight:800; margin-bottom:5px; }
.import-form-grid select { width:100%; border:1px solid #ddd; border-radius:10px; padding:10px; background:#fafafa; }
.full-button { width:100%; }
.field-map-empty { min-height:210px; border:1px dashed #deded7; border-radius:14px; color:#aaa; display:flex; align-items:center; justify-content:center; text-align:center; padding:25px; line-height:1.7; margin-top:18px; }
.field-map-list { display:grid; gap:7px; margin-top:18px; max-height:260px; overflow:auto; }
.field-map-list > div { display:grid; grid-template-columns:1fr auto 1fr; gap:8px; align-items:center; background:#fafaf5; border:1px solid #eeeeea; border-radius:9px; padding:9px 11px; font-size:10px; }
.field-map-list span { color:#777; }.field-map-list i { color:#c3b300; font-style:normal; }.field-map-list strong { text-align:right; }
.import-preview-area.hidden { display:none; }
.import-summary-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin:14px 0; }
.import-stat { background:#fff; border:1px solid #ecece6; border-radius:14px; padding:14px 16px; }
.import-stat span { display:block; color:#888; font-size:10px; }.import-stat strong { display:block; font-size:25px; margin-top:6px; }
.stat-create { border-top:3px solid #5caf6b; }.stat-incomplete { border-top:3px solid #d8b72b; }.stat-update { border-top:3px solid #6b84c9; }.stat-conflict { border-top:3px solid #db7b38; }.stat-invalid { border-top:3px solid #c6554d; }
.import-preview-toolbar { justify-content:space-between; }
.import-preview-toolbar > div strong { display:block; font-size:13px; }.import-preview-toolbar > div span { display:block; color:#999; font-size:10px; margin-top:4px; }
.import-status { display:inline-flex; padding:5px 8px; border-radius:999px; font-size:9px; font-weight:900; }
.import-status-create { background:#e7f6e9;color:#29763a; }.import-status-incomplete { background:#fff3ca;color:#806400; }.import-status-update_candidate { background:#e8edf9;color:#405a9d; }.import-status-conflict { background:#ffeadc;color:#9a4e1f; }.import-status-invalid { background:#f8dfdc;color:#a13931; }
@media(max-width:1000px){.import-layout{grid-template-columns:1fr}.import-summary-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.import-form-grid{grid-template-columns:1fr}.import-summary-grid{grid-template-columns:1fr 1fr}}


/* Milestone 2 workflow, people, todos, standards and reuse */
.ops-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:16px}.ops-grid-main{grid-template-columns:1.05fr .95fr}.ops-card{background:rgba(255,255,255,.9);border:1px solid rgba(94,78,0,.1);border-radius:20px;padding:22px;box-shadow:var(--shadow)}.ops-card-highlight{background:linear-gradient(145deg,var(--yellow-soft),#fffef4)}
.field-block{display:block;margin-top:16px}.field-block span,.compact-grid label span{display:block;font-size:10px;font-weight:800;color:#756b2e;margin-bottom:6px}.field-block select,.field-block input,.compact-grid input,.compact-grid select{width:100%;border:1px solid #ddd8b2;background:#fffdf2;border-radius:10px;padding:10px 11px;outline:0}.field-block select:focus,.field-block input:focus,.compact-grid input:focus,.compact-grid select:focus{border-color:#cbb500;box-shadow:0 0 0 3px rgba(241,219,21,.15)}
.mini-profile{margin-top:14px;background:rgba(255,255,255,.76);border:1px dashed #d6c75e;border-radius:12px;padding:14px;color:#6e632c;font-size:11px;line-height:1.7}.button-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.ghost-button.compact{grid-column:auto;grid-row:auto;padding:10px 12px}.inline-message{min-height:20px;font-size:11px;color:#756800;margin:10px 0 0}.subtle{display:block;color:#9b9367!important;font-size:10px!important;margin-top:4px}.stack-list{display:grid}.stack-item{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(2,minmax(120px,.7fr)) auto;gap:14px;align-items:center;padding:15px 18px;border-bottom:1px solid #f0ecd0}.stack-item:last-child{border-bottom:0}.stack-item strong{display:block;font-size:12px}.stack-item span{display:block;color:#88815c;font-size:10px;margin-top:4px}.stack-item .primary-action{padding:8px 11px;font-size:10px}.flow-transfer-card,.reuse-history-card{margin-top:14px}.two-column-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:16px}.compact-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.todo-summary-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}.todo-list{display:grid;gap:10px}.todo-item{background:rgba(255,255,255,.9);border:1px solid rgba(89,75,0,.09);border-radius:15px;padding:17px 19px;display:flex;justify-content:space-between;gap:18px;align-items:center}.todo-item.high{border-left:4px solid #dc9f00}.todo-item strong{font-size:13px}.todo-item p{margin:5px 0 0;color:#8b835c;font-size:10px}.todo-type{background:var(--yellow-soft);border-radius:999px;padding:6px 9px;font-size:9px;font-weight:900;white-space:nowrap}.reuse-grid{display:grid;grid-template-columns:1.5fr .5fr;gap:14px;margin-bottom:14px}.reuse-kpi-card{display:flex;flex-direction:column;justify-content:center}.reuse-kpi-card>span{font-size:11px;color:#827822}.reuse-kpi-card>strong{font-size:52px;margin:8px 0}.reuse-kpi-card>small{line-height:1.6;color:#92895c}.match-score{font-size:22px!important;color:#796b00}.match-recommended{border-left:4px solid #4d9b55}.match-refurbish_then_use{border-left:4px solid #d19f00}.match-usable{border-left:4px solid #7791b5}.rating-box{margin-top:20px;background:linear-gradient(135deg,#fff9c7,#fffef5);border:1px solid #e9dc7a;border-radius:14px;padding:16px}.rating-box h3{margin:0 0 10px}.rating-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.rating-actions select,.rating-actions input{border:1px solid #d9d09a;border-radius:9px;padding:8px 10px;background:#fff}.rating-result{font-size:11px;color:#6f641e;margin:8px 0}.hidden{display:none!important}
@media(max-width:1050px){.ops-grid,.ops-grid-main,.two-column-layout,.reuse-grid{grid-template-columns:1fr}.stack-item{grid-template-columns:1fr auto}.stack-item>:nth-child(2),.stack-item>:nth-child(3){display:none}}@media(max-width:680px){.compact-grid{grid-template-columns:1fr}.todo-summary-row{grid-template-columns:1fr}.todo-item{align-items:flex-start;flex-direction:column}}
.todo-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.todo-actions .primary-action{padding:8px 11px;font-size:10px}.row-tight{margin-top:0;gap:5px;justify-content:flex-end}

/* Milestone 3 parts, repair, refurbishment and disposal */
.three-column-lists{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:14px 0}.vendor-layout{margin-top:14px}.warning-pill{background:#fff0c2!important;color:#8a5e00!important;border:1px solid #e8c45e}.stack-item .row-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.stack-item .row-actions .ghost-button,.stack-item .row-actions .primary-action{font-size:9px;padding:7px 9px}.ops-card .panel-heading+.form-grid{margin-top:14px}
@media(max-width:1180px){.three-column-lists{grid-template-columns:1fr}}@media(max-width:680px){.three-column-lists{grid-template-columns:1fr}}

/* Milestone 4 inventory */
.link-button{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.inventory-focus-card{background:linear-gradient(145deg,#fff7a6,#fffef0)}.inventory-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:18px}.inventory-kpis>div{background:rgba(255,255,255,.7);border:1px solid #e9dc81;border-radius:12px;padding:12px}.inventory-kpis span{display:block;color:#8a8049;font-size:9px}.inventory-kpis strong{display:block;font-size:20px;margin-top:5px}.inventory-progress{margin-top:13px}.inventory-detail-area{margin-top:14px}.inventory-summary-row{grid-template-columns:repeat(5,1fr)}.inventory-task-row{grid-template-columns:minmax(0,1.8fr) .5fr .5fr auto}.inventory-task-row .row-actions{justify-content:flex-end}@media(max-width:900px){.inventory-summary-row{grid-template-columns:repeat(2,1fr)}.inventory-task-row{grid-template-columns:1fr auto}.inventory-task-row>:nth-child(2),.inventory-task-row>:nth-child(3){display:none}}

/* Milestone 5 analytics and operations */
.dashboard-metric-grid{grid-template-columns:repeat(4,1fr)}.analytics-kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}.analytics-kpi-grid .ops-card{padding:18px}.analytics-kpi-grid span{font-size:10px;color:#827822}.analytics-kpi-grid strong{display:block;font-size:27px;margin:8px 0}.analytics-kpi-grid small{color:#9a925f}.analytics-layout{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}.bar-list{padding:18px;display:grid;gap:13px}.bar-row{display:grid;grid-template-columns:80px 1fr 70px;gap:10px;align-items:center}.bar-row span{font-size:11px;font-weight:800}.bar-track{height:10px;border-radius:999px;background:#f2efd8;overflow:hidden}.bar-track i{display:block;height:100%;background:linear-gradient(90deg,#f2d800,#dcae00);border-radius:999px}.bar-row b{text-align:right;font-size:11px}.lifecycle-card{margin-top:14px}.report-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}.report-grid a{background:linear-gradient(145deg,#fff6a4,#fffef3);border:1px solid #e3d36b;border-radius:16px;padding:18px;text-decoration:none;color:#332f0d;font-weight:900;box-shadow:var(--shadow)}.report-grid small{display:block;font-size:9px;color:#8c834f;margin-top:6px}.settings-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.settings-grid .ops-card>span{font-size:10px;color:#887e35}.settings-grid .ops-card>strong{display:block;font-size:20px;margin:8px 0}.settings-grid p{font-size:11px;color:#89815a;line-height:1.7}.audit-table td{max-width:230px;font-size:9px}.audit-json{white-space:pre-wrap;word-break:break-word;max-height:80px;overflow:auto;color:#736d50}@media(max-width:1100px){.dashboard-metric-grid,.analytics-kpi-grid{grid-template-columns:repeat(2,1fr)}.analytics-layout{grid-template-columns:1fr}.report-grid{grid-template-columns:1fr 1fr}}@media(max-width:680px){.dashboard-metric-grid,.analytics-kpi-grid,.report-grid,.settings-grid{grid-template-columns:1fr}}

/* V1 final: asset sets and employee roster import */
.asset-set-layout{margin-top:14px}.asset-set-layout select[multiple]{min-height:150px;padding:8px;background:#fffdf0;border:1px solid #dfd38a;border-radius:12px}.asset-set-layout select[multiple] option{padding:7px 9px;border-radius:7px}.employee-import-card{margin-top:14px}.employee-import-row{display:grid;grid-template-columns:minmax(280px,1fr) 220px auto;gap:12px;align-items:end;padding:16px}.employee-import-row>label:not(.file-drop){display:grid;gap:7px;font-size:10px;color:#837a3c}.employee-import-row select{min-height:42px}.compact-file-drop{min-height:86px;margin:0;padding:14px}.employee-import-preview{padding:0 16px 16px}.employee-import-preview .mini-profile{margin-bottom:12px}.employee-import-preview .stack-list{max-height:320px;overflow:auto;margin-bottom:12px}@media(max-width:900px){.employee-import-row{grid-template-columns:1fr}.asset-set-layout{grid-template-columns:1fr}}

/* 2026-08 UI refresh: match Zichen administration dashboard */
:root{--yellow:#F4D12F;--yellow-soft:#FFF8D8;--ink:#181A1B;--ink-2:#202223;--muted:#74797F;--line:#E9EAEC;--surface:#FFFFFF;--bg:#F5F6F7;--shadow:0 10px 30px rgba(20,24,28,.055)}
.app-body{background:var(--bg)}
.app-shell{grid-template-columns:258px 1fr}
.sidebar{background:linear-gradient(180deg,#1D1F1F 0%,#171919 100%);color:#fff;padding:24px 16px;box-shadow:8px 0 28px rgba(0,0,0,.10)}
.sidebar-brand{padding:8px 6px 28px;border-bottom:0;min-height:92px;display:flex;align-items:flex-start}
.sidebar-brand img{width:205px;height:auto;max-height:72px;object-fit:contain;object-position:left center}
.sidebar-nav{padding:4px 0 18px;gap:7px}
.nav-item{color:#F4F4F4;padding:14px 14px;border-radius:12px;font-size:14px;font-weight:700;gap:12px}
.nav-item span{color:#E8EAEC;width:24px;font-size:14px}
.nav-item:hover{background:#292B2B;color:#fff}
.nav-item.active{background:var(--yellow);color:#171919;box-shadow:none}
.nav-item.active span{color:#171919}
.topbar{min-height:92px;background:rgba(255,255,255,.96);border-bottom:1px solid #ECEDEF;padding:20px 34px;backdrop-filter:blur(16px)}
.topbar-eyebrow{color:#9B8410}.topbar h2{color:#141617}.user-company{color:#6D5D08}.user-name{color:#60656A}
.content-area{background:#F5F6F7;padding:30px 34px 80px}
.brand-watermark{left:258px;top:92px;opacity:.65}.watermark-item{opacity:.025}.watermark-item img{width:220px}.watermark-item strong{font-size:30px;color:#9A8212}
.hero-card{min-height:255px;background:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.94) 42%,rgba(255,250,232,.64) 100%),url('/assets/campus-building.jpg') right center/58% auto no-repeat;border:1px solid #ECE8DB;border-radius:20px;padding:42px 48px;box-shadow:var(--shadow)}
.hero-card::after{display:none}.hero-copy{max-width:610px}.hero-label{color:#8B7712}.hero-copy h1{font-size:40px}.hero-copy p{color:#4E5357}
.metric-card,.panel-card,.placeholder-card,.asset-list-card,.ops-card,.import-setup-card,.import-map-card,.summary-chip{background:#fff;border:1px solid #E9EAEC;box-shadow:var(--shadow)}
.metric-card{border-radius:17px}.metric-card span{color:#666C72}.metric-card small{color:#A2A6AA}
.primary-action{background:var(--yellow);color:#171919;box-shadow:none}.primary-action:hover{filter:brightness(.98)}
.ghost-button{background:#fff;border-color:#DADDE0;color:#242729}
.section-kicker,.dialog-heading span,.drawer-heading span{color:#9A8212}
.asset-table th{background:#F8F9FA;color:#7F858B}.asset-table tr:hover td{background:#FFFBE9}
.table-actions{display:flex;gap:7px;align-items:center}.table-delete-action,.danger-action{border:1px solid #E7B7B2;background:#FFF6F5;color:#B63D33;border-radius:8px;padding:7px 10px;font-size:10px;font-weight:800}.table-delete-action:hover,.danger-action:hover{background:#FCE7E5}
.detail-action-row{display:flex;justify-content:flex-end;margin:-4px 0 12px}.danger-action{padding:9px 12px}
.asset-detail-photo-card{display:grid;grid-template-columns:190px 1fr;gap:16px;align-items:center;background:#fff;border:1px solid #E8E9EB;border-radius:16px;padding:14px;margin-bottom:12px}.asset-photo-preview{height:130px;border-radius:12px;background:#F3F4F5;overflow:hidden;display:flex;align-items:center;justify-content:center}.asset-photo-preview img{width:100%;height:100%;object-fit:cover}.asset-photo-empty{color:#A1A6AA;font-size:12px}.asset-photo-actions{display:grid;gap:8px}.asset-photo-actions>strong{font-size:14px}.asset-photo-actions>span{font-size:10px;color:#888D92}.asset-photo-actions input[type=file]{font-size:10px;width:100%}
.asset-photo-field small{display:block;color:#979B9F;font-size:9px;margin-top:6px;line-height:1.5}.asset-photo-field input[type=file]{padding:8px;background:#fff}
.template-download-card{background:#fff;border:1px solid #E9EAEC;border-radius:20px;box-shadow:var(--shadow);padding:22px;margin-bottom:16px}.template-download-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px}.template-download-grid a{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:#202223;background:#FAFAF8;border:1px solid #E8E5D6;border-radius:12px;padding:14px 15px;font-size:12px;font-weight:900;transition:.16s}.template-download-grid a:hover{background:#FFF8D8;border-color:#E2C52C;transform:translateY(-1px)}.template-download-grid small{font-size:9px;color:#9A8A37;font-weight:700}
.import-layout{margin-top:0}.file-drop{background:#FCFCFA;border-color:#DADCCF}.file-drop:hover{background:#FFFBE9;border-color:#D9BB22}
.detail-hero{background:#1D1F1F}
@media(max-width:1050px){.template-download-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.app-shell{grid-template-columns:76px 1fr}.sidebar{padding:16px 8px}.sidebar-brand{min-height:65px;padding:4px 2px 18px}.sidebar-brand img{width:62px}.nav-item:not(.active){font-size:0}.brand-watermark{left:76px}.hero-card{background:linear-gradient(90deg,rgba(255,255,255,.98),rgba(255,252,238,.92)),url('/assets/campus-building.jpg') center/cover no-repeat}.asset-detail-photo-card{grid-template-columns:1fr}.template-download-grid{grid-template-columns:1fr 1fr}}
.hero-brand-mark{position:absolute;right:7%;top:28px;width:330px;max-width:30%;opacity:.045;pointer-events:none;z-index:0}.hero-copy{z-index:2}.hero-card{isolation:isolate}
@media(max-width:760px){.hero-brand-mark{display:none}}

/* 2026-08 dashboard alignment polish */
.dashboard-metric-grid .metric-card{
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:156px;
}
.dashboard-metric-grid .metric-card span,
.dashboard-metric-grid .metric-card strong,
.dashboard-metric-grid .metric-card small{
  width:100%;
  text-align:center;
}
.dashboard-metric-grid .metric-card strong{
  text-align:center;
}
.dashboard-grid .panel-card > .panel-heading{
  text-align:left;
}
#dashboard-todo-list{
  text-align:center;
}
.dashboard-todo-mini{
  min-height:130px;
  margin-top:18px;
  display:grid;
  align-content:center;
  justify-items:center;
  gap:10px;
  text-align:center;
}
.dashboard-todo-mini > div{
  width:min(100%,560px);
  padding:10px 14px;
  border-bottom:1px solid #F0F1F2;
}
.dashboard-todo-mini > div:last-child{border-bottom:0}
#dashboard-saving-number{
  text-align:center;
  margin:28px auto 30px;
}
.dashboard-grid > .panel-card:last-child .progress-row,
.dashboard-grid > .panel-card:last-child .progress-track{
  width:88%;
  margin-left:auto;
  margin-right:auto;
}
