:root {
  --bg: #f4f7f7;
  --surface: #ffffff;
  --surface-soft: #f8faf9;
  --ink: #172526;
  --muted: #718080;
  --line: #dfe7e4;
  --teal: #087f7a;
  --teal-dark: #055e5b;
  --teal-soft: #dff1ee;
  --blue: #2a6f9e;
  --blue-soft: #e3eff7;
  --green: #388b6d;
  --green-soft: #e3f2e9;
  --orange: #c17c38;
  --orange-soft: #f9eddc;
  --coral: #bb5e5d;
  --coral-soft: #fae7e5;
  --shadow: 0 8px 28px rgba(28, 62, 59, 0.06);
  --radius: 10px;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif; color: var(--ink); background: var(--bg); font-size: 14px; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:focus-visible, select:focus-visible, input:focus-visible, textarea:focus-visible { outline: 3px solid rgba(8,127,122,.18); outline-offset: 1px; }

.app-shell { min-height: 100vh; display: flex; }
.sidebar { width: 236px; background: #103c3d; color: #d7e7e4; flex: 0 0 236px; display: flex; flex-direction: column; padding: 22px 14px 18px; position: sticky; top: 0; height: 100vh; z-index: 20; }
.brand { display: flex; gap: 11px; align-items: center; padding: 0 9px 27px; border-bottom: 1px solid rgba(255,255,255,.12); }
.brand-mark { width: 34px; height: 34px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; align-items: end; padding: 6px; background: #d6eee9; border-radius: 9px; }
.brand-mark span { display: block; background: var(--teal); border-radius: 2px 2px 1px 1px; }
.brand-mark span:nth-child(1) { height: 45%; opacity: .72; }.brand-mark span:nth-child(2) { height: 74%; }.brand-mark span:nth-child(3) { height: 100%; opacity: .86; }
.brand strong, .brand small { display: block; }.brand strong { color: white; font-size: 15px; letter-spacing: .2px; }.brand small { color: #8fb4b1; font-size: 11px; margin-top: 4px; }
.main-nav { padding-top: 23px; display: flex; flex-direction: column; gap: 4px; }
.nav-item { color: #bad3d0; background: transparent; border: 0; border-radius: 7px; min-height: 44px; padding: 0 11px; display: flex; align-items: center; gap: 11px; text-align: left; position: relative; transition: background .18s, color .18s; }
.nav-item:hover { background: rgba(255,255,255,.08); color: #fff; }.nav-item.active { background: #1a5959; color: #fff; }.nav-item b { margin-left: auto; font-size: 11px; background: rgba(255,255,255,.13); color: #c4e9e3; min-width: 20px; text-align: center; border-radius: 20px; padding: 3px 5px; }
.nav-icon { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 6px; border: 1px solid rgba(198,229,224,.32); color: #cae6e2; font-size: 11px; letter-spacing: -1px; }.nav-item.active .nav-icon { border-color: #63ccc0; background: rgba(99,204,192,.14); }
.sidebar-foot { margin-top: auto; border-top: 1px solid rgba(255,255,255,.12); padding: 17px 10px 0; }.security-state { font-size: 12px; color: #b8ded8; }.security-state span { width: 7px; height: 7px; background: #5fd0a1; display: inline-block; border-radius: 50%; margin-right: 4px; }.security-state span[data-state="loading"] { background: #c28a42; }.security-state span[data-state="error"] { background: #c45e61; }.sidebar-foot p { color: #769b99; font-size: 11px; margin: 8px 0 0; }

.main { flex: 1; min-width: 0; position: relative; }.topbar { height: 77px; background: rgba(255,255,255,.92); border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; padding: 0 34px; position: sticky; top: 0; z-index: 10; backdrop-filter: blur(10px); }.topbar-left { display: flex; align-items: center; gap: 13px; }.topbar h1 { margin: 0; font-size: 19px; letter-spacing: -.2px; }.topbar p { margin: 5px 0 0; font-size: 12px; color: var(--muted); }.topbar-actions { display: flex; align-items: center; gap: 17px; }.global-select { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; }.global-select select, .project-select select, .mdl-selector select, .query-row select { background: var(--surface); color: var(--ink); border: 1px solid var(--line); padding: 8px 29px 8px 10px; border-radius: 6px; min-width: 165px; cursor: pointer; }.icon-button { width: 35px; height: 35px; border: 1px solid var(--line); background: var(--surface); color: #55706f; border-radius: 7px; position: relative; display: grid; place-items: center; font-size: 13px; }.icon-button:hover { border-color: #9dc8c3; color: var(--teal); }.icon-button.small { width: 29px; height: 29px; }.mobile-menu { display: none; }.notification-dot { position: absolute; width: 6px; height: 6px; background: var(--coral); border-radius: 50%; top: 7px; right: 7px; }.profile-button { border: 0; background: none; display: flex; align-items: center; gap: 8px; padding: 2px; text-align: left; color: var(--ink); }.avatar { width: 33px; height: 33px; border-radius: 50%; background: #d7ede9; color: var(--teal-dark); display: grid; place-items: center; font-weight: 700; }.profile-copy strong, .profile-copy small { display: block; }.profile-copy strong { font-size: 12px; }.profile-copy small { font-size: 11px; color: var(--muted); margin-top: 3px; }.chevron { color: #94a6a3; font-size: 17px; margin-left: 2px; }
.view { display: none; padding: 28px 34px 50px; max-width: 1560px; margin: auto; }.view.active { display: block; }.view-toolbar { min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 21px; }.toolbar-buttons { display: flex; gap: 9px; align-items: center; }.date-context { color: var(--muted); font-size: 12px; }.date-context strong { color: #4e6361; margin-left: 4px; }.live-dot { display: inline-block; width: 7px; height: 7px; background: #51b28a; border-radius: 50%; box-shadow: 0 0 0 4px rgba(81,178,138,.12); margin-right: 7px; }.primary-button, .secondary-button, .text-button, .chip { border-radius: 6px; border: 1px solid transparent; min-height: 35px; padding: 0 14px; transition: all .18s; }.primary-button { background: var(--teal); color: #fff; }.primary-button:hover { background: var(--teal-dark); }.secondary-button { background: var(--surface); border-color: var(--line); color: #405d5c; }.secondary-button:hover { border-color: #96beb9; color: var(--teal); }.secondary-button.compact { min-height: 30px; padding: 0 10px; font-size: 12px; }.text-button { padding: 0; background: transparent; color: var(--teal); min-height: unset; }.text-button:hover { color: var(--teal-dark); text-decoration: underline; }.eyebrow { color: var(--muted); font-size: 11px; display: block; margin-bottom: 4px; }.period-title { font-size: 15px; }.segmented, .resource-tabs { display: inline-flex; background: #e8efed; border-radius: 7px; padding: 3px; }.segmented button, .resource-tabs button { border: 0; background: transparent; color: var(--muted); padding: 8px 17px; border-radius: 5px; font-size: 12px; }.segmented button.active, .resource-tabs button.active { background: #fff; color: var(--teal-dark); box-shadow: 0 2px 5px rgba(0,0,0,.05); }

.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; margin-bottom: 17px; }.metric-card { background: var(--surface); border: 1px solid var(--line); border-top: 3px solid var(--teal); border-radius: var(--radius); padding: 17px 18px 14px; box-shadow: var(--shadow); min-height: 136px; }.metric-card.accent-blue { border-top-color: var(--blue); }.metric-card.accent-green { border-top-color: var(--green); }.metric-card.accent-coral { border-top-color: var(--coral); }.metric-top { display: flex; justify-content: space-between; color: var(--muted); font-size: 12px; }.metric-card > strong { display: block; font-size: 28px; letter-spacing: .2px; line-height: 1.1; margin-top: 12px; }.metric-card > small { display: block; color: var(--muted); font-size: 11px; margin-top: 7px; }.trend { font-size: 11px; padding: 2px 5px; border-radius: 4px; }.trend.up { color: var(--green); background: var(--green-soft); }.trend.down { color: var(--coral); background: var(--coral-soft); }.sparkline { height: 26px; display: flex; gap: 4px; align-items: end; margin-top: 10px; }.sparkline::before { content: ""; display: block; width: 100%; height: 100%; background: linear-gradient(160deg, transparent 39%, #bee4df 40%, #bee4df 43%, transparent 44%), linear-gradient(164deg, transparent 58%, #bee4df 59%, #bee4df 63%, transparent 64%), linear-gradient(168deg, transparent 75%, #bee4df 76%, #bee4df 79%, transparent 80%); opacity: .9; }.progress-track { height: 5px; background: #e8efed; border-radius: 99px; overflow: hidden; margin-top: 13px; }.progress-track span { display: block; height: 100%; border-radius: inherit; background: var(--blue); }.accent-green .progress-track span { background: var(--green); }.task-mini { margin-top: 12px; display: flex; gap: 8px; color: var(--muted); font-size: 11px; }.danger-bg, .warning-bg, .blue-bg, .green-bg, .coral-bg { border-radius: 4px; padding: 2px 5px; }.danger-bg { background: var(--coral-soft); color: var(--coral); }.warning-bg { background: var(--orange-soft); color: var(--orange); }.blue-bg { background: var(--blue-soft); color: var(--blue); }.green-bg { background: var(--green-soft); color: var(--green); }.coral-bg { background: var(--coral-soft); color: var(--coral); }
.overview-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(300px, .82fr); gap: 15px; }.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }.panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; padding: 18px 19px 0; }.panel-head h2 { margin: 0; font-size: 15px; letter-spacing: -.1px; }.panel-head p { margin: 5px 0 0; color: var(--muted); font-size: 11px; }.legend { display: flex; gap: 11px; color: var(--muted); font-size: 10px; }.legend span { display: flex; align-items: center; gap: 4px; }.legend i { width: 7px; height: 7px; display: inline-block; border-radius: 50%; }.legend-teal { background: var(--teal); }.legend-coral, .legend-red { background: var(--coral); }.legend-blue { background: var(--blue); }.legend-green { background: var(--green); }.legend-orange { background: var(--orange); }.chart-wrap { height: 226px; padding: 14px 18px 13px; }.chart-wrap canvas { width: 100%; height: 100%; }.quality-panel { min-height: 309px; }.quality-content { height: 199px; position: relative; display: grid; place-items: center; }.quality-content canvas { width: 220px; height: 190px; }.quality-summary { position: absolute; top: 78px; left: 50%; transform: translateX(-50%); text-align: center; pointer-events: none; }.quality-summary strong, .quality-summary span, .quality-summary small { display: block; }.quality-summary strong { font-size: 24px; }.quality-summary span { font-size: 10px; color: var(--muted); margin-top: 2px; }.quality-summary small { font-size: 10px; color: var(--green); margin-top: 4px; }.quality-legend { border-top: 1px solid var(--line); margin: 0 19px; padding: 10px 0 13px; display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; }.quality-legend span { color: var(--muted); font-size: 10px; text-align: center; }.quality-legend b { display: block; color: var(--ink); font-size: 12px; margin-top: 4px; }.progress-panel, .todo-panel { margin-top: 15px; min-height: 249px; }.institution-list { padding: 14px 19px 17px; }.institution-row { display: grid; grid-template-columns: 1.1fr 1.3fr 34px; gap: 12px; align-items: center; margin-bottom: 14px; }.institution-row:last-child { margin-bottom: 0; }.institution-row strong, .institution-row small { display: block; }.institution-row strong { font-size: 12px; font-weight: 600; }.institution-row small { font-size: 10px; color: var(--muted); margin-top: 4px; }.row-progress { height: 5px; background: #edf2f0; border-radius: 99px; overflow: hidden; }.row-progress span { display: block; height: 100%; background: var(--teal); border-radius: inherit; }.row-progress.warning span { background: var(--orange); }.row-progress.danger span { background: var(--coral); }.institution-row > b { text-align: right; font-size: 11px; color: #55706f; }.count-badge { background: var(--teal-soft); color: var(--teal-dark); padding: 4px 8px; border-radius: 20px; font-size: 11px; }.todo-tabs { display: flex; gap: 17px; border-bottom: 1px solid var(--line); margin: 14px 19px 0; }.todo-tabs button { border: 0; background: none; color: var(--muted); font-size: 11px; padding: 0 0 9px; border-bottom: 2px solid transparent; }.todo-tabs button.active { color: var(--teal); border-bottom-color: var(--teal); }.todo-list { padding: 4px 19px 9px; }.todo-item { border: 0; border-bottom: 1px solid #edf1ef; width: 100%; display: grid; grid-template-columns: 40px 1fr auto; gap: 8px; align-items: center; background: none; padding: 11px 0; text-align: left; color: var(--ink); }.todo-item:last-child { border-bottom: 0; }.todo-item > span:nth-child(2) strong, .todo-item > span:nth-child(2) small { display: block; }.todo-item strong { font-size: 11px; font-weight: 600; }.todo-item small { color: var(--muted); font-size: 10px; margin-top: 4px; }.todo-item time { color: var(--muted); font-size: 10px; }.todo-type { font-size: 10px; text-align: center; width: 36px; }.dataset-panel { margin-top: 15px; }.table-scroll { overflow-x: auto; padding: 14px 19px 18px; }.table-scroll table { width: 100%; border-collapse: collapse; min-width: 700px; }.table-scroll th { font-size: 10px; color: var(--muted); font-weight: 500; text-align: left; background: var(--surface-soft); padding: 10px 12px; border-bottom: 1px solid var(--line); white-space: nowrap; }.table-scroll td { padding: 12px; border-bottom: 1px solid #edf1ef; color: #4b605e; font-size: 11px; white-space: nowrap; }.table-scroll tr:last-child td { border-bottom: 0; }.table-scroll td:first-child { color: var(--ink); }.table-scroll td strong, .table-scroll td small { display: block; }.table-scroll td small { color: #8b9a98; font-size: 10px; margin-top: 4px; }.score { font-weight: 700; }.score.good { color: var(--green); }.score.warn { color: var(--orange); }.status { font-size: 10px; padding: 3px 7px; border-radius: 4px; white-space: nowrap; }.status.success { color: var(--green); background: var(--green-soft); }.status.warning { color: var(--orange); background: var(--orange-soft); }.status.danger { color: var(--coral); background: var(--coral-soft); }.status.info { color: var(--blue); background: var(--blue-soft); }

.collection-stats, .research-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; margin-bottom: 17px; }.collection-stats article, .research-metrics article { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px 18px; }.collection-stats span, .collection-stats strong, .collection-stats small, .research-metrics span, .research-metrics strong, .research-metrics small { display: block; }.collection-stats span, .research-metrics span { color: var(--muted); font-size: 11px; }.collection-stats strong, .research-metrics strong { font-size: 25px; margin-top: 10px; }.collection-stats small, .research-metrics small { color: var(--muted); margin-top: 5px; font-size: 10px; }.dispatch-panel { margin-bottom: 15px; }.dispatch-actions { display: flex; align-items: center; gap: 14px; }.dispatch-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 18px 19px 20px; }.dispatch-grid article { display: grid; grid-template-columns: 27px 1fr; gap: 8px; position: relative; border: 1px solid var(--line); border-radius: 7px; padding: 12px; min-height: 91px; background: var(--surface-soft); }.dispatch-grid article > .status { position: absolute; right: 10px; top: 10px; }.step-number { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: var(--teal-dark); background: var(--teal-soft); font-size: 10px; font-weight: 700; }.dispatch-grid strong, .dispatch-grid p { display: block; }.dispatch-grid strong { font-size: 11px; padding-right: 42px; }.dispatch-grid p { color: var(--muted); font-size: 10px; line-height: 1.5; margin: 7px 0 0; }.task-table-panel { min-height: 450px; }.inline-filters { display: flex; gap: 6px; }.chip { min-height: 29px; padding: 0 10px; font-size: 11px; background: var(--surface-soft); color: var(--muted); border-color: var(--line); }.chip.active { background: var(--teal-soft); color: var(--teal-dark); border-color: transparent; }.task-status { display: flex; align-items: center; gap: 6px; }.task-status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); }.task-status-dot.warning { background: var(--orange); }.task-status-dot.danger { background: var(--coral); }.mini-progress { width: 76px; height: 5px; display: inline-block; background: #eef2f0; border-radius: 99px; vertical-align: middle; margin-right: 6px; }.mini-progress span { height: 100%; display: block; background: var(--teal); border-radius: inherit; }.mini-progress.warning span { background: var(--orange); }.mini-progress.danger span { background: var(--coral); }
.governance-layout { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(320px, .75fr); gap: 15px; }.cleaning-panel { margin-bottom: 15px; }.cleaning-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 19px; }.clean-step { border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); padding: 12px; display: grid; grid-template-columns: 26px 1fr; gap: 8px; min-height: 74px; }.clean-step > span { width: 23px; height: 23px; border-radius: 50%; display: grid; place-items: center; color: #8d9c99; background: #edf2f0; font-size: 10px; }.clean-step strong, .clean-step small { display: block; }.clean-step strong { font-size: 11px; padding-top: 2px; }.clean-step small { grid-column: 2; color: var(--muted); font-size: 10px; margin-top: -3px; }.clean-step.done { border-color: #b9ded5; background: #f5fbf9; }.clean-step.done > span, .clean-step.active > span { background: var(--teal-soft); color: var(--teal-dark); }.clean-step.active { border-color: #e5c69d; background: #fffaf3; }.cleaning-footer { border-top: 1px solid #edf1ef; padding: 11px 19px 13px; display: flex; align-items: center; gap: 18px; color: var(--muted); font-size: 10px; }.cleaning-footer i { width: 7px; height: 7px; display: inline-block; border-radius: 50%; margin-right: 4px; }.cleaning-footer .text-button { margin-left: auto; }.issue-panel { min-height: 550px; }.issue-list { padding: 15px 19px; }.issue-card { width: 100%; border: 1px solid var(--line); background: var(--surface-soft); text-align: left; border-radius: 7px; padding: 13px; display: grid; grid-template-columns: 10px 1fr auto; gap: 10px; align-items: start; margin-bottom: 9px; }.issue-card:hover, .issue-card.active { background: #f0f8f6; border-color: #a7d3ca; }.issue-card > span:first-child { width: 7px; height: 7px; border-radius: 50%; background: var(--coral); margin-top: 5px; }.issue-card.warning > span:first-child { background: var(--orange); }.issue-card strong, .issue-card small, .issue-card p { display: block; }.issue-card strong { font-size: 12px; }.issue-card small { color: var(--muted); font-size: 10px; margin-top: 4px; }.issue-card p { color: #59706d; font-size: 11px; margin: 8px 0 0; }.issue-card time { color: #9aa8a5; font-size: 10px; }.issue-detail { min-height: 550px; padding-bottom: 20px; }.empty-state { display: grid; place-items: center; text-align: center; min-height: 500px; padding: 25px; }.empty-symbol { border: 1px solid var(--line); width: 47px; height: 47px; display: grid; place-items: center; color: var(--teal); border-radius: 50%; background: var(--teal-soft); }.empty-state h3 { font-size: 14px; margin: 15px 0 0; }.empty-state p { font-size: 11px; color: var(--muted); margin: 7px 0 0; }.detail-head { padding: 20px; border-bottom: 1px solid var(--line); }.detail-head h3 { margin: 0; font-size: 15px; }.detail-head p { color: var(--muted); font-size: 11px; margin: 5px 0 0; }.detail-table { margin: 17px 20px; width: calc(100% - 40px); border-collapse: collapse; }.detail-table th, .detail-table td { padding: 9px 0; text-align: left; border-bottom: 1px solid #edf1ef; font-size: 11px; }.detail-table th { color: var(--muted); width: 36%; font-weight: 400; }.suggestion-box { background: var(--orange-soft); margin: 0 20px 17px; padding: 12px; border-radius: 6px; }.suggestion-box strong { font-size: 11px; color: #8b5c29; }.suggestion-box p { font-size: 11px; color: #795c3b; line-height: 1.6; margin: 5px 0 0; }.detail-actions { display: flex; gap: 8px; padding: 0 20px; }
.query-builder { padding-bottom: 18px; margin-bottom: 15px; }.permission-badge { color: var(--green); background: var(--green-soft); padding: 5px 8px; border-radius: 4px; font-size: 10px; }.query-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; padding: 18px 19px 8px; }.query-row label { color: var(--muted); font-size: 11px; }.query-row select { display: block; width: 100%; margin-top: 7px; }.condition-row { display: grid; grid-template-columns: 96px 1fr 1fr 35px; gap: 8px; align-items: center; padding: 6px 19px; }.condition-row select, .condition-row input { width: 100%; border: 1px solid var(--line); border-radius: 5px; padding: 8px 9px; color: var(--ink); background: white; font-size: 11px; }.remove-condition { border: 0; background: transparent; color: #9eaaa7; font-size: 17px; }.query-actions { display: flex; justify-content: space-between; align-items: center; padding: 12px 19px 0; }.query-actions > div { display: flex; gap: 8px; }.resource-result-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, .68fr); gap: 15px; }.result-panel { min-height: 390px; }.cohort-summary { background: var(--surface-soft); display: grid; grid-template-columns: repeat(3, 1fr); margin: 17px 19px 0; border: 1px solid var(--line); border-radius: 6px; }.cohort-summary div { padding: 12px; border-right: 1px solid var(--line); }.cohort-summary div:last-child { border-right: 0; }.cohort-summary span, .cohort-summary strong { display: block; }.cohort-summary span { font-size: 10px; color: var(--muted); }.cohort-summary strong { font-size: 19px; margin-top: 6px; }.distribution-panel { min-height: 390px; }.distribution-panel canvas { width: 190px; height: 190px; display: block; margin: 17px auto 5px; }.donut-legend { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); margin: 0 19px; padding-top: 12px; gap: 4px; }.donut-legend span { font-size: 10px; color: var(--muted); text-align: center; }.donut-legend i { width: 7px; height: 7px; display: inline-block; border-radius: 50%; margin-right: 3px; }
.search-box { background: #fff; border: 1px solid var(--line); border-radius: 7px; display: flex; align-items: center; min-width: min(430px, 50vw); height: 35px; }.search-box > span { color: #91a09c; padding-left: 11px; }.search-box input { flex: 1; min-width: 0; border: 0; outline: 0; padding: 0 9px; color: var(--ink); font-size: 11px; }.search-box button { border: 0; background: var(--teal-soft); color: var(--teal-dark); height: 27px; margin-right: 4px; border-radius: 4px; padding: 0 10px; font-size: 11px; }.lineage-panel { min-height: 280px; overflow: hidden; }.lineage-flow { display: flex; align-items: center; padding: 55px 25px 60px; min-width: 930px; }.lineage-node { width: 155px; min-height: 115px; border: 1px solid var(--line); background: var(--surface-soft); border-radius: 7px; padding: 12px; flex: 0 0 auto; position: relative; }.node-tag { width: 22px; height: 22px; display: grid; place-items: center; background: var(--teal-soft); color: var(--teal-dark); border-radius: 4px; font-size: 10px; margin-bottom: 10px; }.lineage-node strong, .lineage-node small, .lineage-node p { display: block; }.lineage-node strong { font-size: 11px; }.lineage-node small { color: var(--teal); font-size: 10px; margin-top: 7px; line-height: 1.4; }.lineage-node p { color: var(--muted); font-size: 9px; margin: 7px 0 0; }.lineage-link { width: 50px; height: 1px; background: #b7cfca; position: relative; flex: 0 0 50px; }.lineage-link::after { content: ""; position: absolute; right: 0; top: -3px; border-left: 5px solid #b7cfca; border-top: 3px solid transparent; border-bottom: 3px solid transparent; }.lineage-link span { position: absolute; top: -21px; left: 50%; transform: translateX(-50%); color: var(--muted); font-size: 9px; }.lineage-bottom { display: grid; grid-template-columns: 1.3fr .8fr; gap: 15px; margin-top: 15px; }.timeline { padding: 17px 20px 20px; }.timeline > div { display: grid; grid-template-columns: 70px 10px 1fr; gap: 10px; align-items: start; min-height: 46px; }.timeline time { color: var(--muted); font-size: 10px; padding-top: 2px; }.timeline span { width: 8px; height: 8px; border-radius: 50%; background: var(--teal); margin-top: 3px; position: relative; }.timeline span::after { content: ""; position: absolute; width: 1px; height: 41px; background: #cfe0dc; left: 4px; top: 8px; }.timeline > div:last-child span::after { display: none; }.timeline p { margin: 0; }.timeline strong, .timeline small { display: block; }.timeline strong { font-size: 11px; }.timeline small { color: var(--muted); font-size: 10px; margin-top: 4px; }.audit-summary { padding: 18px 20px 20px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; }.audit-summary div { border-bottom: 1px solid var(--line); padding-bottom: 10px; }.audit-summary span, .audit-summary strong { display: block; }.audit-summary span { color: var(--muted); font-size: 10px; }.audit-summary strong { font-size: 20px; margin-top: 5px; }.danger-text { color: var(--coral); }.success-text { color: var(--green); }
.mdl-selector, .project-select { display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: 11px; }.mdl-selector select, .project-select select { min-width: 280px; }.mdl-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(310px, .75fr); gap: 15px; }.mdl-main { min-height: 500px; }.risk-bars { padding: 24px 22px 10px; }.risk-bars > div { display: grid; grid-template-columns: 120px 1fr 48px; gap: 12px; align-items: center; margin-bottom: 20px; }.risk-bars > div > div:first-child { display: contents; }.risk-bars span, .risk-bars b { font-size: 11px; }.risk-bars b { font-weight: 500; color: #516866; }.risk-bars small { color: var(--muted); text-align: right; font-size: 10px; }.risk-track { grid-column: 2; height: 10px; background: #eff3f1; border-radius: 99px; overflow: hidden; }.risk-track span { display: block; height: 100%; border-radius: inherit; }.risk-track .low { background: var(--green); }.risk-track .mid { background: var(--orange); }.risk-track .high { background: var(--coral); }.trend-section { border-top: 1px solid var(--line); padding: 18px 21px; }.trend-section h3 { font-size: 12px; margin: 0; }.trend-section canvas { width: 100%; height: 220px; margin-top: 10px; }.rule-panel { min-height: 500px; }.rule-list { padding: 20px 19px 7px; }.rule-list article { display: grid; grid-template-columns: 27px 1fr; gap: 10px; margin-bottom: 17px; }.rule-list article > span { width: 25px; height: 25px; border-radius: 50%; background: var(--teal-soft); color: var(--teal-dark); display: grid; place-items: center; font-size: 10px; }.rule-list strong, .rule-list p { display: block; }.rule-list strong { font-size: 11px; }.rule-list p { color: var(--muted); font-size: 10px; line-height: 1.5; margin: 4px 0 0; }.version-note { border-top: 1px solid var(--line); margin: 5px 19px; padding: 14px 0; }.version-note span, .version-note strong, .version-note small { display: block; }.version-note span { color: var(--muted); font-size: 10px; }.version-note strong { font-size: 17px; margin-top: 5px; }.version-note small { color: var(--muted); font-size: 10px; margin-top: 5px; }
.ai-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(330px, .78fr); gap: 15px; min-height: 620px; }.ai-chat, .knowledge-panel { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }.ai-chat { display: flex; flex-direction: column; min-height: 620px; }.chat-head { padding: 17px 20px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; }.chat-head > div { display: flex; gap: 10px; align-items: center; }.ai-mark { width: 34px; height: 34px; border-radius: 9px; background: var(--teal); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: 11px; }.chat-head h2 { margin: 0; font-size: 15px; }.chat-head p { margin: 5px 0 0; color: var(--muted); font-size: 10px; }.chat-head .live-dot { width: 5px; height: 5px; box-shadow: none; margin-right: 4px; }.chat-body { flex: 1; padding: 23px 25px; overflow: auto; }.chat-message { display: flex; gap: 10px; max-width: 720px; }.message-avatar { width: 28px; height: 28px; flex: 0 0 28px; border-radius: 7px; background: var(--teal-soft); color: var(--teal-dark); display: grid; place-items: center; font-size: 10px; font-weight: 700; }.chat-message p { background: var(--surface-soft); border: 1px solid var(--line); border-radius: 0 8px 8px 8px; padding: 12px 14px; margin: 0; font-size: 12px; color: #435a58; line-height: 1.7; }.suggestions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 13px; }.suggestions button { background: #fff; border: 1px solid #badbd5; color: var(--teal); padding: 7px 9px; border-radius: 5px; font-size: 10px; }.suggestions button:hover { background: var(--teal-soft); }.user-message { justify-content: flex-end; margin: 17px 0 0 auto; }.user-message .message-avatar { order: 2; background: var(--blue-soft); color: var(--blue); }.user-message p { background: var(--teal); color: #fff; border-radius: 8px 0 8px 8px; border-color: var(--teal); }.source-citation { margin: 9px 0 0 38px; padding: 9px; border-left: 2px solid #9fcfc6; background: #f5faf8; font-size: 10px; color: #5b7773; line-height: 1.5; }.chat-input { border-top: 1px solid var(--line); padding: 14px 19px 12px; display: grid; grid-template-columns: 1fr auto; gap: 8px; }.chat-input textarea { resize: none; border: 1px solid var(--line); border-radius: 7px; min-height: 45px; padding: 9px 11px; color: var(--ink); outline: 0; }.chat-input textarea:focus { border-color: #8bc6bf; }.chat-input > button { border: 0; background: var(--teal); color: #fff; border-radius: 7px; width: 65px; }.chat-input small { grid-column: 1 / -1; color: #9aa7a4; font-size: 9px; }.knowledge-panel { padding-bottom: 20px; }.knowledge-graph { height: 255px; margin: 12px 20px 0; position: relative; background: linear-gradient(145deg, #f3faf8 0%, #fbfcfb 100%); border: 1px solid #e1eeeb; border-radius: 8px; overflow: hidden; }.kg-node { position: absolute; z-index: 2; background: #fff; border: 1px solid #afd4cc; color: var(--teal-dark); font-size: 10px; padding: 6px 9px; border-radius: 5px; box-shadow: 0 2px 7px rgba(8,127,122,.08); }.kg-node.central { left: 50%; top: 45%; transform: translate(-50%,-50%); background: var(--teal); color: #fff; border-color: var(--teal); padding: 9px 13px; font-weight: 700; }.kg-node.n1 { left: 12%; top: 19%; }.kg-node.n2 { right: 10%; top: 21%; }.kg-node.n3 { left: 14%; bottom: 17%; }.kg-node.n4 { right: 12%; bottom: 22%; }.kg-node.n5 { left: 50%; bottom: 10%; transform: translateX(-50%); }.kg-line { position: absolute; z-index: 1; height: 1px; background: #b8d9d3; transform-origin: left center; width: 112px; left: 50%; top: 50%; }.kg-line.l1 { transform: rotate(205deg); }.kg-line.l2 { transform: rotate(-24deg); }.kg-line.l3 { transform: rotate(157deg); }.kg-line.l4 { transform: rotate(25deg); }.kg-line.l5 { transform: rotate(90deg); width: 83px; }.source-list { padding: 18px 20px 0; }.source-list h3 { margin: 0 0 11px; font-size: 12px; }.source-list > div { display: flex; gap: 10px; padding: 10px 0; border-bottom: 1px solid #edf1ef; }.source-list > div:last-child { border-bottom: 0; }.source-list > div > span { width: 31px; height: 22px; border-radius: 4px; background: var(--teal-soft); color: var(--teal-dark); display: grid; place-items: center; font-size: 9px; }.source-list p { margin: 0; }.source-list strong, .source-list small { display: block; }.source-list strong { font-size: 11px; font-weight: 600; }.source-list small { color: var(--muted); font-size: 10px; margin-top: 3px; }
.project-select select { min-width: 325px; }.research-metrics article:first-child { grid-column: span 1; }.research-metrics article:first-child .progress-track { margin-top: 12px; }.research-grid { margin-bottom: 15px; }.task-board { min-height: 385px; }.kanban { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 20px; }.kanban > div { background: #f7faf9; border: 1px solid var(--line); border-radius: 7px; padding: 10px; min-height: 260px; }.kanban-head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 10px; border-bottom: 1px solid #e2ebe8; color: #5e716e; font-size: 11px; }.kanban-head b { font-weight: 500; color: #9aa7a4; }.kanban article { background: #fff; border: 1px solid #e4ece9; border-radius: 6px; padding: 11px; margin-top: 10px; }.kanban article strong, .kanban article p, .kanban article time { display: block; }.kanban article strong { font-size: 11px; margin-top: 8px; line-height: 1.45; }.kanban article p { font-size: 10px; color: var(--muted); line-height: 1.5; margin: 6px 0 0; }.kanban article time { font-size: 10px; color: var(--muted); margin-top: 9px; }.tag { font-size: 9px; border-radius: 4px; padding: 3px 5px; }.completed { opacity: .72; }.decision-panel { min-height: 220px; }.decision-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 11px; padding: 18px 19px 20px; }.decision-grid article { display: grid; grid-template-columns: 28px 1fr; gap: 10px; border: 1px solid var(--line); border-radius: 7px; padding: 12px; background: var(--surface-soft); }.decision-grid article > span { color: var(--orange); font-size: 10px; font-weight: 700; }.decision-grid strong, .decision-grid p { display: block; }.decision-grid strong { font-size: 11px; }.decision-grid p { color: var(--muted); font-size: 10px; line-height: 1.6; margin: 5px 0 0; }

.popover { position: fixed; z-index: 30; right: 28px; top: 65px; width: 235px; background: #fff; border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 16px 35px rgba(20,63,61,.15); }.role-menu { right: 28px; width: 220px; padding: 10px; }.role-menu > p { color: var(--muted); font-size: 10px; margin: 3px 8px 8px; }.role-menu button { border: 0; background: none; width: 100%; text-align: left; padding: 9px 8px; border-radius: 5px; }.role-menu button.active, .role-menu button:hover { background: var(--teal-soft); }.role-menu button span, .role-menu button small { display: block; }.role-menu button span { font-size: 11px; }.role-menu button small { color: var(--muted); font-size: 9px; margin-top: 3px; }.notification-panel { padding-bottom: 7px; }.popover-head { padding: 13px 14px 11px; display: flex; justify-content: space-between; border-bottom: 1px solid var(--line); }.popover-head strong { font-size: 12px; }.notice { display: flex; gap: 8px; padding: 11px 14px; border-bottom: 1px solid #edf1ef; }.notice:last-child { border-bottom: 0; }.notice.unread { background: #fbfdfc; }.notice > div strong, .notice > div p, .notice > div time { display: block; }.notice > div strong { font-size: 10px; }.notice > div p { color: var(--muted); font-size: 10px; margin: 4px 0; }.notice > div time { color: #a3afad; font-size: 9px; }.status-dot { width: 6px; height: 6px; border-radius: 50%; flex: 0 0 6px; margin-top: 4px; }.status-dot.danger { background: var(--coral); }.status-dot.warning { background: var(--orange); }.status-dot.success { background: var(--green); }.modal-backdrop { position: fixed; inset: 0; background: rgba(11,38,38,.4); z-index: 40; }.modal { border: 0; border-radius: 10px; width: min(520px, calc(100% - 32px)); padding: 0; box-shadow: 0 25px 60px rgba(9,40,39,.26); color: var(--ink); z-index: 50; }.modal::backdrop { background: transparent; }.modal.narrow { width: min(440px, calc(100% - 32px)); }.modal-head { padding: 19px 21px 15px; display: flex; justify-content: space-between; border-bottom: 1px solid var(--line); }.modal-head h2 { font-size: 16px; margin: 0; }.modal-head p { color: var(--muted); font-size: 11px; margin: 5px 0 0; }.upload-stepper { display: flex; gap: 20px; padding: 15px 21px 9px; color: #a1aeab; font-size: 10px; border-bottom: 1px solid #edf1ef; }.upload-stepper span.active { color: var(--teal); font-weight: 700; }.form-field { display: block; padding: 17px 21px 11px; font-size: 11px; color: var(--muted); }.form-field select { display: block; margin-top: 7px; width: 100%; padding: 9px; border: 1px solid var(--line); border-radius: 5px; color: var(--ink); }.dropzone { margin: 8px 21px 14px; border: 1px dashed #a8c9c3; background: #f7fbfa; border-radius: 8px; min-height: 147px; display: grid; place-items: center; align-content: center; text-align: center; color: var(--teal-dark); }.dropzone:hover { background: var(--teal-soft); }.upload-symbol { width: 31px; height: 31px; border-radius: 50%; background: var(--teal-soft); display: grid; place-items: center; font-size: 19px; margin-bottom: 9px; }.dropzone strong { font-size: 12px; }.dropzone p { color: var(--muted); font-size: 10px; margin: 6px 0 0; }.file-preview { margin: 8px 21px 14px; display: flex; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 6px; padding: 10px; }.file-type { background: var(--blue-soft); color: var(--blue); padding: 5px; border-radius: 4px; font-size: 9px; }.file-preview > div { flex: 1; }.file-preview strong, .file-preview small { display: block; }.file-preview strong { font-size: 11px; }.file-preview small { color: var(--muted); font-size: 9px; margin-top: 3px; }.modal-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 21px 18px; border-top: 1px solid #edf1ef; }.generic-content { padding: 20px; }
.toast-region { position: fixed; right: 25px; bottom: 23px; z-index: 80; display: grid; gap: 8px; }.toast { background: #153f3e; color: #e7f5f1; border-radius: 7px; padding: 11px 14px; box-shadow: 0 12px 25px rgba(11,45,43,.2); font-size: 11px; animation: toast-in .25s ease-out; }.toast.success { border-left: 3px solid #66c79b; }.toast.warning { border-left: 3px solid #e6ae65; }.toast.error { border-left: 3px solid #e6807a; }@keyframes toast-in { from { transform: translateY(8px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

@media (max-width: 1100px) { .sidebar { width: 206px; flex-basis: 206px; }.view { padding-left: 24px; padding-right: 24px; }.topbar { padding: 0 24px; }.metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.overview-grid, .resource-result-grid, .lineage-bottom, .mdl-grid, .ai-layout { grid-template-columns: 1fr; }.quality-panel { min-height: 285px; }.progress-panel, .todo-panel { margin-top: 15px; }.lineage-flow { overflow-x: auto; }.knowledge-panel { min-height: auto; }.ai-layout { min-height: auto; }.ai-chat { min-height: 570px; }.research-metrics { grid-template-columns: repeat(2, 1fr); }.kanban { overflow-x: auto; grid-template-columns: repeat(4, minmax(185px, 1fr)); }.kanban > div { min-height: 250px; } }
@media (max-width: 720px) { .sidebar { position: fixed; left: 0; transform: translateX(-100%); transition: transform .22s; width: 238px; flex-basis: 238px; box-shadow: 12px 0 24px rgba(9,40,39,.18); }.sidebar.open { transform: translateX(0); }.mobile-overlay { display: none; position: fixed; inset: 0; background: rgba(12,38,38,.32); z-index: 15; }.mobile-overlay.open { display: block; }.mobile-menu { display: grid; }.topbar { height: 67px; padding: 0 15px; }.topbar h1 { font-size: 16px; }.topbar p { font-size: 10px; }.global-select, .profile-copy, .chevron { display: none; }.topbar-actions { gap: 8px; }.view { padding: 20px 15px 35px; }.view-toolbar { align-items: flex-start; flex-wrap: wrap; margin-bottom: 16px; }.toolbar-buttons { margin-left: auto; }.metric-grid, .collection-stats, .research-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }.metric-card { min-height: 123px; padding: 13px; }.metric-card > strong { font-size: 22px; margin-top: 10px; }.metric-card > small { font-size: 10px; }.overview-grid { display: block; }.panel { border-radius: 8px; }.data-trend-panel, .quality-panel, .progress-panel, .todo-panel { margin-bottom: 10px; }.legend { display: none; }.chart-wrap { height: 188px; }.quality-content { height: 175px; }.quality-content canvas { height: 170px; width: 200px; }.quality-summary { top: 68px; }.quality-legend { margin: 0 10px; }.quality-legend span { font-size: 9px; }.institution-row { grid-template-columns: 1fr 1fr 33px; gap: 8px; }.panel-head { padding-left: 14px; padding-right: 14px; }.table-scroll { padding-left: 12px; padding-right: 12px; }.dataset-panel .panel-head, .task-table-panel .panel-head { flex-wrap: wrap; }.inline-filters { flex-wrap: wrap; }.search-box { min-width: 100%; }.lineage-panel { overflow-x: auto; }.lineage-flow { padding-left: 17px; padding-right: 17px; }.query-row { grid-template-columns: 1fr; padding-left: 14px; padding-right: 14px; }.condition-row { grid-template-columns: 76px 1fr 1fr 22px; padding-left: 14px; padding-right: 14px; }.query-actions { padding-left: 14px; padding-right: 14px; }.cohort-summary { margin-left: 12px; margin-right: 12px; }.donut-legend { margin-left: 12px; margin-right: 12px; }.mdl-selector, .project-select { width: 100%; flex-wrap: wrap; }.mdl-selector select, .project-select select { min-width: 0; width: 100%; }.risk-bars > div { grid-template-columns: 70px 1fr 40px; gap: 7px; }.decision-grid { grid-template-columns: 1fr; padding-left: 14px; padding-right: 14px; }.chat-head { padding: 14px; }.chat-body { padding: 17px 14px; }.chat-input { padding-left: 12px; padding-right: 12px; }.ai-chat { min-height: 590px; }.resource-tabs, .segmented { max-width: 100%; overflow-x: auto; }.resource-tabs button, .segmented button { padding-left: 11px; padding-right: 11px; }.popover { right: 13px; top: 59px; }.notification-panel { width: min(300px, calc(100% - 26px)); }.role-menu { right: 13px; }.modal { width: calc(100% - 22px); }.modal-head { padding-left: 15px; padding-right: 15px; }.form-field, .upload-stepper { padding-left: 15px; padding-right: 15px; }.dropzone, .file-preview { margin-left: 15px; margin-right: 15px; }.modal-actions { padding-left: 15px; padding-right: 15px; }.toast-region { right: 13px; left: 13px; bottom: 13px; }.toast { text-align: center; }.task-table-panel { min-height: 380px; } }

.auth-gate { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; background: linear-gradient(135deg, #e9f3f1, #f5f8f8); }
.auth-gate[hidden] { display: none; }
.auth-card { width: min(410px, calc(100% - 30px)); padding: 28px; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 24px 70px rgba(15,65,62,.16); }
.auth-brand { display: flex; gap: 12px; align-items: center; margin-bottom: 26px; color: var(--teal-dark); }.auth-brand strong, .auth-brand small { display: block; }.auth-brand small { color: var(--muted); font-size: 11px; margin-top: 4px; }
.auth-card h1 { margin: 0 0 6px; font-size: 22px; }.auth-hint { color: var(--muted); font-size: 12px; margin: 0 0 20px; line-height: 1.6; }.auth-field { display: block; color: var(--muted); font-size: 12px; margin: 12px 0; }.auth-field input { display: block; width: 100%; box-sizing: border-box; padding: 11px 12px; margin-top: 6px; border: 1px solid var(--line); border-radius: 6px; font-size: 14px; }.auth-submit { width: 100%; margin-top: 12px; padding: 11px; }.auth-link { display: block; width: 100%; margin-top: 12px; text-align: center; }.auth-message { min-height: 18px; margin: 12px 0 0; color: var(--green); font-size: 12px; }.auth-message.error { color: var(--coral); }
.task-filter-bar, .issue-toolbar { flex-wrap: wrap; }
@media (max-width: 720px) { .task-filter-bar, .issue-toolbar { align-items: stretch; flex-direction: column; padding-left: 14px; padding-right: 14px; }.task-filter-bar input { max-width: none; }.task-filter-bar > span { margin-left: 0; }.issue-filters, .issue-bulk-actions { flex-wrap: wrap; }.cleaning-head-actions { align-items: stretch; flex-direction: column; }.detail-kpis { grid-template-columns: 1fr; } }

/* The two operational workflows stay compact on smaller screens. */
.form-grid .form-field { padding-left: 7px; padding-right: 7px; }
@media (max-width: 1100px) { .dispatch-grid { grid-template-columns: repeat(2, 1fr); }.cleaning-steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 720px) { .dispatch-grid, .cleaning-steps { grid-template-columns: 1fr; padding-left: 14px; padding-right: 14px; }.dispatch-actions { width: 100%; justify-content: flex-end; }.cleaning-footer { align-items: flex-start; flex-direction: column; gap: 7px; }.cleaning-footer .text-button { margin-left: 0; }.form-grid { grid-template-columns: 1fr; }.form-field.full { grid-column: auto; }.task-policy-note { margin-left: 15px; margin-right: 15px; } }

.approval-list { padding: 0 1px; }.approval-list article { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }.approval-list strong, .approval-list small, .approval-list p { display: block; }.approval-list strong { font-size: 12px; }.approval-list small, .approval-list p { color: var(--muted); font-size: 10px; margin: 4px 0 0; }.approval-actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 15px; }
.task-filter-bar { display: flex; gap: 8px; align-items: center; padding: 0 19px 12px; }.task-filter-bar input, .task-filter-bar select, .cleaning-head-actions select { min-height: 30px; border: 1px solid var(--line); border-radius: 5px; padding: 0 9px; background: #fff; color: var(--ink); font-size: 11px; }.task-filter-bar input { flex: 1; max-width: 300px; }.task-filter-bar > span { color: var(--muted); font-size: 10px; margin-left: auto; }.cleaning-head-actions { display: flex; align-items: center; gap: 8px; }.issue-toolbar { display: flex; align-items: center; justify-content: space-between; padding: 0 19px 5px; gap: 10px; }.issue-filters, .issue-bulk-actions { display: flex; align-items: center; gap: 6px; }.issue-bulk-actions .text-button { font-size: 10px; margin-right: 4px; }.issue-card { grid-template-columns: 16px 10px 1fr auto; }.issue-card input { margin-top: 2px; accent-color: var(--teal); }.issue-card.selected { background: #edf8f5; border-color: #a7d3ca; }.approval-row-actions { display: flex; gap: 8px; align-items: center; margin-left: auto; }.empty-approval { color: var(--muted); font-size: 11px; padding: 20px 0; text-align: center; }.detail-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-bottom: 14px; }.detail-kpis span { background: var(--surface-soft); border-radius: 6px; padding: 9px; color: var(--muted); font-size: 10px; }.detail-kpis b { display: block; color: var(--ink); margin-top: 5px; font-size: 11px; }.task-detail-content { padding: 18px 20px 20px; }.task-detail-content > p { color: #59706d; font-size: 11px; line-height: 1.7; }.history-list { border-top: 1px solid var(--line); margin-top: 13px; padding-top: 9px; color: var(--muted); font-size: 10px; line-height: 2; }
.form-grid .form-field input, .form-grid .form-field select { display: block; margin-top: 7px; width: 100%; min-height: 35px; padding: 8px 9px; border: 1px solid var(--line); border-radius: 5px; color: var(--ink); background: #fff; }.form-grid .form-field select[multiple] { min-height: 96px; }.form-grid .form-field.full { grid-column: 1 / -1; }.form-grid .form-field small { display: block; color: #91a09c; font-size: 9px; margin-top: 5px; }.task-policy-note { margin: 2px 21px 13px; padding: 10px 11px; background: var(--teal-soft); border-radius: 6px; color: var(--teal-dark); font-size: 10px; line-height: 1.5; }.task-policy-note strong { margin-right: 7px; }

.operational-empty,.source-empty,.table-empty { padding: 24px 16px; text-align: center; color: var(--muted); font-size: 11px; line-height: 1.7; background: var(--surface-soft); border: 1px dashed var(--line); border-radius: 6px; }
.source-file-list { display: grid; gap: 8px; margin-top: 10px; }
.source-file { display: flex; align-items: center; gap: 9px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.source-file strong { display: block; font-size: 11px; color: var(--ink); word-break: break-word; }
.source-file small { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; }
:root {