:root {
  --bg: #f4f7f6;
  --paper: #ffffff;
  --ink: #162425;
  --muted: #70807f;
  --line: #dce6e3;
  --deep: #101a1d;
  --deep-2: #172528;
  --teal: #1f8c80;
  --teal-soft: #e5f5f1;
  --orange: #c97933;
  --orange-soft: #fff0e2;
  --red: #bd4d4d;
  --red-soft: #fdecec;
  --blue: #4277a9;
  --blue-soft: #eaf2fa;
  --green: #2f8a61;
  --shadow: 0 14px 40px rgba(16, 36, 37, .08);
  font-family: "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}
.reference-tabs { margin-bottom: 14px; }
.reference-card { overflow: hidden; }
.reference-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 17px 18px 0; }
.reference-card-head h2 { margin: 0; font-size: 16px; }
.reference-card-head p { margin: 5px 0 0; color: var(--muted); font-size: 11px; }
.reference-note { margin: 13px 18px; padding: 9px 11px; border: 1px solid #e6ecea; border-radius: 6px; color: var(--muted); background: #fbfdfc; font-size: 11px; line-height: 1.55; }
.reference-scroll { overflow: auto; max-height: min(68vh, 680px); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.reference-table { min-width: 3300px; border-collapse: separate; border-spacing: 0; table-layout: fixed; font-size: 11px; color: #334743; }
.reference-table th, .reference-table td { width: 116px; min-width: 116px; max-width: 116px; padding: 9px 8px; border-right: 1px solid #e5ecea; border-bottom: 1px solid #e5ecea; vertical-align: top; line-height: 1.45; overflow-wrap: anywhere; }
.reference-table th { position: sticky; top: 0; z-index: 2; color: #21453f; background: #e9f5f1; font-weight: 700; text-align: center; white-space: normal; }
.reference-table thead tr:nth-child(2) th { top: 36px; background: #f4faf8; font-weight: 600; }
.reference-table tbody tr { cursor: pointer; }
.reference-table tbody tr:hover td { background: #f2faf7; }
.reference-table .reference-select { width: 34px; min-width: 34px; max-width: 34px; text-align: center; padding: 8px 5px; }
.reference-table .reference-select input { accent-color: var(--teal); }
.reference-table tbody td:first-child, .reference-table thead th:first-child { position: sticky; left: 0; z-index: 3; background: #f8fbfa; }
.reference-table thead th:first-child { background: #e9f5f1; }
.reference-table thead tr:nth-child(2) th:first-child { background: #f4faf8; }
.reference-table tbody td:nth-child(2) { position: sticky; left: 34px; z-index: 2; background: #f8fbfa; font-weight: 700; color: #24766a; }
.reference-table tbody tr:hover td:first-child, .reference-table tbody tr:hover td:nth-child(2) { background: #f2faf7; }
.reference-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 18px; color: var(--muted); font-size: 11px; }
.reference-detail-meta { display: flex; flex-wrap: wrap; gap: 7px 14px; margin: -4px 0 14px; color: var(--muted); font-size: 11px; }
.reference-detail-group { margin: 10px 0; border: 1px solid #e1ece8; border-radius: 7px; overflow: hidden; }
.reference-detail-group summary { display: flex; justify-content: space-between; gap: 12px; padding: 10px 11px; color: #24766a; background: #f2faf7; cursor: pointer; font-size: 12px; font-weight: 700; }
.reference-detail-group summary span { color: var(--muted); font-size: 10px; font-weight: 400; }
.reference-detail-group .kv-list { padding: 9px 11px 2px; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.app-shell { min-height: 100vh; display: flex; }
.sidebar { width: 252px; flex: 0 0 252px; background: var(--deep); color: #eaf3f0; padding: 22px 16px 18px; display: flex; flex-direction: column; }
.brand-block { display: flex; align-items: center; gap: 11px; padding: 0 8px 22px; }
.brand-block strong { display: block; font-size: 18px; letter-spacing: .02em; }
.brand-block small { display: block; color: #98aaa7; font-size: 11px; margin-top: 3px; }
.brand-block em { margin-left: auto; font-size: 10px; color: #7dd2c5; border: 1px solid #39655f; border-radius: 4px; padding: 3px 5px; font-style: normal; letter-spacing: .08em; }
.brand-mark { width: 34px; height: 34px; border: 1px solid #4b8c82; border-radius: 9px; display: flex; align-items: end; justify-content: center; gap: 3px; padding: 7px; background: #183530; }
.brand-mark span { display: block; width: 4px; border-radius: 2px 2px 0 0; background: #8be1d3; }
.brand-mark span:nth-child(1) { height: 10px; }.brand-mark span:nth-child(2) { height: 16px; }.brand-mark span:nth-child(3) { height: 13px; }
.workspace-pill { display: flex; align-items: center; gap: 8px; padding: 10px 11px; background: #16282a; border: 1px solid #294140; border-radius: 8px; margin-bottom: 18px; }
.workspace-pill small, .workspace-pill strong { display: block; }.workspace-pill small { color: #8aa09b; font-size: 10px; }.workspace-pill strong { font-size: 12px; margin-top: 3px; }.workspace-pill i { margin-left: auto; color: #8aa09b; width: 14px; }
.live-dot, .secure-dot { width: 7px; height: 7px; border-radius: 50%; display: block; background: #60d2b8; box-shadow: 0 0 0 4px rgba(96,210,184,.12); }
.nav { flex: 1; overflow: auto; padding-right: 2px; }.nav-group { color: #768d89; font-size: 10px; letter-spacing: .12em; padding: 13px 10px 7px; }.nav-item { width: 100%; border: 0; color: #c9d6d3; background: transparent; display: flex; align-items: center; gap: 10px; padding: 10px 11px; border-radius: 7px; text-align: left; font-size: 13px; margin: 2px 0; }.nav-item:hover { background: #1b3031; color: #fff; }.nav-item.active { color: #fff; background: #23514b; box-shadow: inset 3px 0 #74d4c3; }.nav-item i { width: 16px; }.nav-item b { margin-left: auto; min-width: 19px; text-align: center; font-size: 10px; padding: 2px 5px; border-radius: 9px; color: #ffc58d; background: #55391f; }.sidebar-foot { color: #a4b7b3; padding: 17px 8px 0; border-top: 1px solid #253737; font-size: 11px; }.sidebar-foot div { display: flex; align-items: center; gap: 8px; }.sidebar-foot small { color: #647a76; display: block; margin-top: 7px; }
.main-shell { flex: 1; min-width: 0; }.topbar { height: 68px; background: var(--paper); border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; padding: 0 28px; gap: 16px; }.topbar-start, .topbar-end { display: flex; align-items: center; gap: 13px; min-width: 0; }.case-select { background: transparent; border: 0; display: flex; align-items: baseline; gap: 10px; padding: 7px 0; color: var(--ink); }.case-select span { color: var(--muted); font-size: 11px; }.case-select strong { font-size: 16px; }.case-select small { color: var(--teal); font-size: 11px; }.case-select i { width: 14px; color: #8ba09b; margin-left: 2px; }.search-trigger { display: flex; align-items: center; gap: 8px; width: 270px; color: #8a9896; border: 1px solid var(--line); background: #f8fbfa; border-radius: 7px; padding: 8px 10px; font-size: 12px; }.search-trigger i { width: 15px; }.search-trigger kbd { margin-left: auto; font-size: 10px; color: #83918f; background: #eef3f1; padding: 2px 5px; border-radius: 4px; }.icon-btn { border: 1px solid var(--line); background: #fff; color: #63716f; border-radius: 7px; width: 34px; height: 34px; display: inline-grid; place-items: center; position: relative; }.icon-btn:hover { color: var(--teal); border-color: #9ecdc5; }.icon-btn i { width: 16px; }.notification b { position: absolute; top: -5px; right: -4px; background: var(--red); color: #fff; font-size: 9px; border-radius: 9px; padding: 2px 5px; }.role-picker { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 11px; }.role-picker select { border: 0; color: var(--ink); font-weight: 600; background: transparent; max-width: 120px; }.user-avatar { width: 32px; height: 32px; border-radius: 50%; background: #d9efe9; color: #24665d; display: grid; place-items: center; font-weight: 700; }
.main-content { padding: 28px 30px 42px; max-width: 1520px; margin: auto; }.page-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 21px; }.page-head h1 { margin: 0; font-size: 26px; letter-spacing: -.02em; }.page-head p { margin: 7px 0 0; color: var(--muted); font-size: 13px; }.page-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }.button { border: 1px solid var(--line); border-radius: 6px; background: #fff; color: #3f504e; padding: 8px 12px; font-size: 12px; display: inline-flex; align-items: center; gap: 6px; }.button:hover { border-color: #91c6bc; color: var(--teal); }.button.primary { background: var(--teal); color: #fff; border-color: var(--teal); }.button.primary:hover { background: #18766c; }.button.ghost { background: transparent; }.button.danger { color: var(--red); }.button.small { padding: 6px 9px; font-size: 11px; }.button i { width: 14px; }.icon-btn.small { width: 28px; height: 28px; border: 0; background: transparent; }.grid { display: grid; gap: 14px; }.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }.card { background: var(--paper); border: 1px solid var(--line); border-radius: 9px; box-shadow: 0 5px 20px rgba(20,47,46,.03); min-width: 0; }.card-header { min-height: 58px; padding: 15px 17px; border-bottom: 1px solid #edf2f0; display: flex; align-items: center; justify-content: space-between; gap: 12px; }.card-header h2 { font-size: 14px; margin: 0; }.card-header p { font-size: 11px; color: var(--muted); margin: 4px 0 0; }.card-body { padding: 17px; }.metric-card { padding: 15px 17px; position: relative; overflow: hidden; }.metric-card:after { content: ""; position: absolute; width: 72px; height: 72px; border: 12px solid #edf7f4; border-radius: 50%; right: -22px; bottom: -24px; }.metric-card span { color: var(--muted); font-size: 11px; }.metric-card strong { display: block; font-size: 27px; margin: 8px 0 3px; letter-spacing: -.04em; }.metric-card small { color: var(--muted); font-size: 11px; }.metric-card .trend { color: var(--green); }.metric-icon { color: var(--teal); width: 18px; }.summary-banner { background: linear-gradient(112deg, #173c38, #245b50 60%, #2e6b5e); color: #fff; border-radius: 10px; padding: 20px 22px; display: grid; grid-template-columns: 1.7fr repeat(4, 1fr); align-items: center; gap: 18px; margin-bottom: 14px; box-shadow: var(--shadow); }.summary-title { display: flex; align-items: center; gap: 12px; }.summary-title-icon { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #67aa9b; border-radius: 9px; background: #2a6b5e; }.summary-title-icon i { width: 21px; }.summary-title strong { display: block; font-size: 18px; }.summary-title small { color: #b7d8d0; font-size: 11px; display: block; margin-top: 5px; }.summary-metric { border-left: 1px solid rgba(214,242,235,.2); padding-left: 16px; }.summary-metric strong { font-size: 24px; display: block; }.summary-metric span { color: #b7d8d0; font-size: 11px; display: block; margin-top: 2px; }
.workflow { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 0; position: relative; }.workflow:before { content: ""; position: absolute; top: 16px; left: 6%; right: 6%; border-top: 1px dashed #c8d9d5; }.flow-node { position: relative; z-index: 1; width: 32px; height: 32px; border-radius: 50%; background: #edf3f1; color: #71817e; display: grid; place-items: center; margin-bottom: 8px; border: 3px solid #fff; box-shadow: 0 0 0 1px #d8e4e0; }.flow-step { display: flex; flex-direction: column; align-items: center; text-align: center; font-size: 11px; }.flow-step strong { font-size: 11px; }.flow-step small { color: var(--muted); margin-top: 4px; }.flow-step.done .flow-node { background: var(--teal); color: #fff; box-shadow: none; }.flow-step.active .flow-node { background: var(--orange); color: #fff; box-shadow: 0 0 0 5px #fff0e1; }.flow-step.active strong { color: #9c5b27; }.flow-step.done small { color: var(--green); }.next-list { display: grid; gap: 5px; }.next-item { border: 0; background: #f8fbfa; border-radius: 7px; padding: 10px; text-align: left; display: flex; gap: 10px; align-items: flex-start; }.next-item:hover { background: #edf7f4; }.next-item i { color: var(--teal); width: 16px; }.next-item strong { font-size: 12px; display: block; }.next-item span { color: var(--muted); font-size: 11px; display: block; margin-top: 4px; }.log-table { max-height: 236px; overflow: auto; }
.table-wrap { overflow: auto; }.data-table { width: 100%; border-collapse: collapse; font-size: 12px; min-width: 700px; }.data-table th { color: #7a8a87; font-weight: 600; background: #f8fbfa; text-align: left; padding: 10px 11px; border-bottom: 1px solid var(--line); white-space: nowrap; }.data-table td { padding: 11px; border-bottom: 1px solid #edf2f0; vertical-align: middle; }.data-table tr:hover td { background: #fbfdfc; }.data-table td:first-child { color: #3c514e; font-weight: 600; }.tag { display: inline-flex; align-items: center; border-radius: 4px; padding: 3px 7px; font-size: 10px; white-space: nowrap; }.tag.green { background: #e5f5ed; color: #2f805c; }.tag.teal { background: var(--teal-soft); color: #20766b; }.tag.orange { background: var(--orange-soft); color: #a25d25; }.tag.red { background: var(--red-soft); color: #ae4141; }.tag.blue { background: var(--blue-soft); color: #3e6e9a; }.muted { color: var(--muted); }.subtle { color: var(--muted); font-size: 11px; }.filterbar { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }.input, .select, .textarea { border: 1px solid var(--line); background: #fff; border-radius: 6px; color: var(--ink); padding: 8px 10px; outline: none; font-size: 12px; }.input:focus, .select:focus, .textarea:focus { border-color: #86bfb4; box-shadow: 0 0 0 3px rgba(42,146,132,.1); }.search-box { display: flex; align-items: center; border: 1px solid var(--line); border-radius: 6px; background: #fff; padding-left: 9px; min-width: 240px; }.search-box i { width: 15px; color: #879692; }.search-box .input { border: 0; flex: 1; }.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }.field { display: grid; gap: 5px; }.field.full { grid-column: 1 / -1; }.field label { font-size: 11px; color: var(--muted); }.textarea { min-height: 84px; resize: vertical; }.progress { height: 7px; background: #edf2f0; border-radius: 9px; overflow: hidden; }.progress span { display: block; height: 100%; background: var(--teal); border-radius: inherit; }.progress.orange span { background: var(--orange); }.progress.red span { background: var(--red); }.task-row { display: grid; grid-template-columns: 1.35fr .8fr .8fr 1fr auto; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid #edf2f0; }.task-row:last-child { border-bottom: 0; }.task-row strong { font-size: 12px; display: block; }.task-row small { display: block; color: var(--muted); font-size: 10px; margin-top: 4px; }
.split-panel { display: grid; grid-template-columns: 1.06fr .94fr; gap: 14px; }.entity-list { display: grid; gap: 8px; }.entity-item { display: flex; justify-content: space-between; align-items: center; background: #f8fbfa; border-radius: 7px; padding: 10px 11px; }.entity-item strong { font-size: 12px; }.entity-item small { color: var(--muted); display: block; margin-top: 4px; }.entity-actions { display: flex; gap: 2px; }.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); overflow: auto; }.tab { border: 0; background: transparent; color: var(--muted); padding: 9px 12px; font-size: 12px; white-space: nowrap; border-bottom: 2px solid transparent; }.tab.active { color: var(--teal); border-bottom-color: var(--teal); font-weight: 700; }.evidence-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 13px 0; flex-wrap: wrap; }.check-cell { width: 24px; }.check-cell input { accent-color: var(--teal); }.graph-card { min-height: 410px; position: relative; overflow: hidden; background: #f7fbfa; }.graph-card svg { width: 100%; height: 360px; }.graph-legend { position: absolute; bottom: 13px; left: 16px; display: flex; gap: 13px; flex-wrap: wrap; font-size: 10px; color: var(--muted); }.legend-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: 4px; }.relation-list { display: grid; gap: 8px; }.relation-item { display: grid; grid-template-columns: 1fr auto; gap: 8px; padding: 10px 11px; border: 1px solid #e4eeeb; border-radius: 7px; background: #fff; }.relation-item strong { font-size: 12px; }.relation-item small { display: block; color: var(--muted); margin-top: 4px; }.relation-actions { display: flex; gap: 4px; align-items: center; }.conflict { border-left: 3px solid var(--orange); }.analysis-tabs { display: grid; grid-template-columns: repeat(6, 1fr); gap: 7px; }.analysis-tab { text-align: left; padding: 11px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }.analysis-tab.active { border-color: #82beb4; background: #eef8f5; }.analysis-tab i { width: 17px; color: var(--teal); }.analysis-tab strong { display: block; margin-top: 8px; font-size: 12px; }.analysis-tab small { color: var(--muted); display: block; margin-top: 4px; font-size: 10px; }.result-hero { background: #f8fbfa; border: 1px solid #e2eeeb; border-radius: 8px; padding: 15px; }.risk-score { display: flex; align-items: center; gap: 15px; }.score-ring { width: 84px; height: 84px; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(var(--orange) 0 74%, #e9efed 74% 100%); position: relative; }.score-ring:after { content: ""; width: 62px; height: 62px; background: #f8fbfa; border-radius: 50%; position: absolute; }.score-ring strong { position: relative; z-index: 1; font-size: 22px; }.score-copy strong { font-size: 15px; display: block; }.score-copy small { display: block; margin-top: 5px; color: var(--muted); }.chain { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; align-items: stretch; }.chain-step { padding: 11px; border: 1px solid #dfeae7; border-radius: 7px; background: #fff; position: relative; }.chain-step:not(:last-child):after { content: "→"; position: absolute; right: -13px; top: 31px; color: #9cb1ad; }.chain-step strong { display: block; font-size: 11px; }.chain-step small { color: var(--muted); display: block; margin-top: 6px; line-height: 1.5; }.chain-step.done { border-color: #a8d8cd; background: #f1faf7; }.chain-step.warn { border-color: #edc894; background: #fffaf2; }.result-tabs { display: flex; gap: 6px; margin-bottom: 13px; }.result-tab { border: 1px solid var(--line); background: #fff; border-radius: 6px; padding: 7px 10px; font-size: 11px; color: var(--muted); }.result-tab.active { color: var(--teal); border-color: #84c4b9; background: #eff9f6; }.mini-chart { height: 160px; display: flex; align-items: end; gap: 9px; padding: 10px 9px 0; border-bottom: 1px solid var(--line); }.bar { flex: 1; background: #b7ded5; border-radius: 4px 4px 0 0; min-height: 8px; position: relative; }.bar strong { position: absolute; top: -18px; width: 100%; text-align: center; font-size: 10px; color: #6e827d; }.bar:nth-child(2), .bar:nth-child(5) { background: #edc28e; }.bar:nth-child(4) { background: #da8f79; }.chart-labels { display: flex; justify-content: space-around; font-size: 10px; color: var(--muted); padding-top: 7px; }.report-layout { display: grid; grid-template-columns: 250px minmax(0,1fr) 250px; gap: 14px; }.chapter-list { display: grid; gap: 4px; }.chapter { display: flex; align-items: center; gap: 7px; padding: 9px; border-radius: 6px; font-size: 12px; color: #50605e; }.chapter.active { background: #e8f6f2; color: #21766c; font-weight: 700; }.chapter small { margin-left: auto; color: #97a9a5; }.report-editor { min-height: 470px; }.report-editor textarea { width: 100%; min-height: 400px; border: 0; outline: 0; resize: vertical; font-size: 13px; line-height: 1.85; color: #324441; }.timeline { display: grid; gap: 0; }.timeline-item { display: grid; grid-template-columns: 105px 16px 1fr; gap: 9px; min-height: 58px; }.timeline-item time { font-size: 10px; color: var(--muted); padding-top: 2px; }.timeline-item .rail { position: relative; }.timeline-item .rail:before { content: ""; position: absolute; width: 8px; height: 8px; border-radius: 50%; background: var(--teal); top: 4px; left: 2px; box-shadow: 0 0 0 3px #e2f3ef; }.timeline-item:not(:last-child) .rail:after { content: ""; position: absolute; top: 14px; bottom: -4px; left: 5px; border-left: 1px dashed #bdd0cb; }.timeline-item strong { font-size: 12px; }.timeline-item p { color: var(--muted); font-size: 11px; margin: 4px 0 0; }.library-card h3 { font-size: 14px; margin: 0; }.library-card p { color: var(--muted); font-size: 11px; line-height: 1.6; }.library-count { font-size: 24px; color: var(--teal); font-weight: 700; }.settings-row { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid #edf2f0; }.settings-row:last-child { border-bottom: 0; }.settings-row strong { font-size: 12px; }.settings-row small { color: var(--muted); display: block; margin-top: 4px; }.switch { position: relative; width: 34px; height: 20px; display: inline-block; }.switch input { opacity: 0; width: 0; height: 0; }.slider { position: absolute; inset: 0; background: #c8d4d1; border-radius: 20px; }.slider:before { content: ""; position: absolute; width: 16px; height: 16px; left: 2px; top: 2px; border-radius: 50%; background: #fff; transition: .2s; }.switch input:checked + .slider { background: var(--teal); }.switch input:checked + .slider:before { transform: translateX(14px); }.empty { text-align: center; padding: 36px 12px; color: var(--muted); }.empty i { width: 26px; display: block; margin: 0 auto 10px; color: #aec0bc; }.empty strong, .empty span { display: block; }.empty span { margin-top: 5px; font-size: 11px; }
.drawer-wrap, .modal-wrap { position: fixed; inset: 0; visibility: hidden; z-index: 30; }.drawer-wrap.open, .modal-wrap.open { visibility: visible; }.drawer-overlay, .modal-overlay { position: absolute; inset: 0; background: rgba(12,25,26,.42); opacity: 0; transition: .2s; }.drawer-wrap.open .drawer-overlay, .modal-wrap.open .modal-overlay { opacity: 1; }.drawer { position: absolute; top: 0; right: 0; bottom: 0; width: min(520px, 92vw); background: #fff; box-shadow: -20px 0 50px rgba(0,0,0,.16); transform: translateX(100%); transition: .24s; padding: 21px; overflow: auto; }.drawer-wrap.open .drawer { transform: translateX(0); }.drawer-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; margin-bottom: 17px; }.drawer-head h2 { margin: 0; font-size: 17px; }.drawer-head p { color: var(--muted); font-size: 11px; margin: 5px 0 0; }.drawer-section { margin: 16px 0; }.drawer-section h3 { margin: 0 0 8px; font-size: 12px; }.drawer-section p { color: #566762; font-size: 12px; line-height: 1.7; }.kv-list { display: grid; gap: 8px; }.kv { display: flex; justify-content: space-between; gap: 16px; font-size: 11px; padding-bottom: 8px; border-bottom: 1px solid #edf2f0; }.kv span { color: var(--muted); }.kv strong { text-align: right; }.modal { position: relative; width: min(620px, 92vw); margin: 7vh auto 0; background: #fff; border-radius: 10px; box-shadow: var(--shadow); padding: 21px; transform: translateY(12px); opacity: 0; transition: .2s; max-height: 86vh; overflow: auto; }.modal-wrap.open .modal { transform: translateY(0); opacity: 1; }.modal h2 { margin: 0; font-size: 17px; }.modal-sub { color: var(--muted); font-size: 11px; margin: 6px 0 17px; }.modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }.flow-overlay { position: fixed; inset: 0; background: rgba(12,25,26,.64); z-index: 40; display: grid; place-items: center; padding: 22px; }.flow-modal { width: min(900px, 96vw); background: #fff; border-radius: 12px; padding: 24px; box-shadow: 0 25px 70px rgba(0,0,0,.25); }.flow-top { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }.flow-top h2 { margin: 0; font-size: 20px; }.flow-top p { color: var(--muted); font-size: 12px; margin: 7px 0 0; }.flow-sequence { display: grid; grid-template-columns: repeat(8,1fr); gap: 7px; margin: 24px 0; }.flow-sequence .flow-card { padding: 12px 9px; border: 1px solid var(--line); border-radius: 7px; min-height: 92px; }.flow-card.active { border-color: #e2ae76; background: #fff8ef; }.flow-card.done { border-color: #a6d8cc; background: #f1faf7; }.flow-card b { color: #98a9a5; font-size: 10px; }.flow-card strong { display: block; font-size: 11px; margin: 10px 0 5px; }.flow-card span { color: var(--muted); font-size: 10px; line-height: 1.4; }.flow-progress { height: 8px; background: #edf2f0; border-radius: 10px; overflow: hidden; }.flow-progress span { display: block; height: 100%; background: linear-gradient(90deg, #2f8a61, #e3a05f); transition: width .4s; }.flow-footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 12px; }.flow-footer span { color: var(--muted); font-size: 11px; }.toast-region { position: fixed; right: 22px; bottom: 22px; z-index: 60; display: grid; gap: 8px; }.toast { width: min(360px, calc(100vw - 36px)); background: #152524; color: #e9f5f0; border: 1px solid #366058; border-radius: 8px; padding: 11px 13px; box-shadow: var(--shadow); animation: toast-in .2s ease; }.toast strong { display: block; font-size: 12px; }.toast span { display: block; color: #a9c2bb; font-size: 11px; margin-top: 4px; }.mobile-menu { display: none; }
@keyframes toast-in { from { transform: translateY(8px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.flow-step { border: 0; background: transparent; color: inherit; }
.button:disabled { cursor: not-allowed; opacity: .45; color: var(--muted); border-color: var(--line); background: #f5f7f6; }
.graph-node { cursor: pointer; }
.tutorial-active { overflow: hidden; }
.tutorial-overlay { position: fixed; inset: 0; z-index: 70; pointer-events: auto; overscroll-behavior: contain; }
.tutorial-spotlight { position: fixed; z-index: 1; border: 2px solid #f0b36f; border-radius: 9px; box-shadow: 0 0 0 9999px rgba(10, 23, 24, .62), 0 0 0 5px rgba(240,179,111,.2); transition: left .22s ease, top .22s ease, width .22s ease, height .22s ease; pointer-events: none; }
.tutorial-card { position: fixed; z-index: 2; width: min(390px, calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow: auto; background: #fff; border: 1px solid #cfe1dc; border-radius: 8px; padding: 17px; box-shadow: 0 20px 60px rgba(7, 25, 25, .28); pointer-events: auto; }
.tutorial-arrow { position: fixed; z-index: 2; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; filter: drop-shadow(0 2px 2px rgba(7,25,25,.24)); }
.tutorial-arrow[data-placement="below"] { border-bottom: 13px solid #f0b36f; }
.tutorial-arrow[data-placement="above"] { border-top: 13px solid #f0b36f; }
.tutorial-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.tutorial-eyebrow { display: block; color: var(--teal); font-size: 10px; font-weight: 700; letter-spacing: .08em; margin-bottom: 7px; }
.tutorial-card h2 { margin: 0; font-size: 17px; line-height: 1.35; }
.tutorial-card > p { color: #526562; font-size: 12px; line-height: 1.7; margin: 12px 0 13px; }
.tutorial-focus { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #f2faf7; border: 1px solid #d8eee8; border-radius: 7px; padding: 9px 10px; font-size: 11px; }
.tutorial-focus span { color: var(--muted); }.tutorial-focus strong { color: #24766a; }
.tutorial-progress { height: 5px; background: #edf2f0; border-radius: 8px; overflow: hidden; margin-top: 14px; }.tutorial-progress span { display: block; height: 100%; background: var(--teal); border-radius: inherit; transition: width .2s ease; }
.tutorial-footer { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 14px; }.tutorial-footer .page-actions { justify-content: flex-end; }
.assistant-launcher { position: fixed; right: 24px; bottom: 24px; z-index: 25; display: inline-flex; align-items: center; gap: 8px; border: 1px solid #18766c; border-radius: 22px; padding: 11px 15px; color: #fff; background: var(--teal); box-shadow: 0 10px 26px rgba(31,140,128,.28); font-size: 12px; }
.assistant-launcher:hover { background: #18766c; transform: translateY(-1px); }
.assistant-launcher i { width: 16px; }
.assistant-wrap { position: fixed; inset: 0; z-index: 55; visibility: hidden; pointer-events: none; }
.assistant-wrap.open { visibility: visible; pointer-events: auto; }
.assistant-overlay { position: absolute; inset: 0; background: rgba(12,25,26,.36); opacity: 0; transition: opacity .2s; }
.assistant-wrap.open .assistant-overlay { opacity: 1; }
.assistant-panel { position: absolute; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; width: min(440px, 94vw); padding: 21px; background: var(--paper); box-shadow: -20px 0 50px rgba(0,0,0,.18); transform: translateX(100%); transition: transform .24s ease; }
.assistant-wrap.open .assistant-panel { transform: translateX(0); }
.assistant-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding-bottom: 15px; border-bottom: 1px solid var(--line); }
.assistant-head h2 { margin: 0; font-size: 18px; }
.assistant-head p { margin: 5px 0 0; color: var(--muted); font-size: 11px; }
.assistant-examples { display: grid; gap: 7px; padding: 14px 0; border-bottom: 1px solid #edf2f0; }
.assistant-examples > span { color: var(--muted); font-size: 11px; }
.assistant-example { border: 1px solid #d5e8e3; border-radius: 6px; padding: 8px 10px; color: #27786e; background: #f4fbf9; text-align: left; font-size: 11px; line-height: 1.45; }
.assistant-example:hover { border-color: #84c4b9; background: #eaf7f3; }
.assistant-example:disabled { cursor: not-allowed; opacity: .55; }
.assistant-messages { flex: 1; min-height: 0; overflow: auto; padding: 17px 2px; }
.assistant-empty { display: grid; justify-items: center; gap: 7px; padding: 58px 20px; text-align: center; color: var(--muted); }
.assistant-empty i { width: 28px; color: var(--teal); }
.assistant-empty strong { color: var(--ink); font-size: 13px; }
.assistant-empty span { font-size: 11px; line-height: 1.6; }
.assistant-message { display: flex; margin-bottom: 12px; }
.assistant-message.user { justify-content: flex-end; }
.assistant-bubble { max-width: 88%; border-radius: 10px; padding: 10px 12px; color: #334b47; background: #f1f7f5; font-size: 12px; line-height: 1.7; white-space: normal; }
.assistant-message.user .assistant-bubble { color: #fff; background: var(--teal); }
.assistant-message.assistant .assistant-bubble { border: 1px solid #dcebe7; background: #fbfdfc; }
.assistant-status { color: var(--muted); }
.assistant-caret { display: inline-block; width: 2px; height: 1em; margin-left: 2px; background: var(--teal); vertical-align: -2px; animation: assistant-caret .75s step-end infinite; }
.typing-dots { display: inline-flex; gap: 3px; margin-left: 5px; vertical-align: middle; }
.typing-dots i { width: 4px; height: 4px; border-radius: 50%; background: #89aaa3; animation: assistant-dot 1s infinite ease-in-out; }
.typing-dots i:nth-child(2) { animation-delay: .15s; }.typing-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes assistant-dot { 0%, 60%, 100% { opacity: .35; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-2px); } }
@keyframes assistant-caret { 50% { opacity: 0; } }
.assistant-compose { border-top: 1px solid var(--line); padding-top: 14px; }
.assistant-compose .textarea { width: 100%; min-height: 66px; resize: none; }
.assistant-compose-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 8px; }
.assistant-compose-footer small { color: var(--muted); font-size: 10px; }
.assistant-compose-footer > div { display: flex; gap: 7px; }
@media (max-width: 1180px) { .sidebar { width: 220px; flex-basis: 220px; }.summary-banner { grid-template-columns: 1.4fr repeat(4, 1fr); }.report-layout { grid-template-columns: 210px minmax(0,1fr); }.report-layout > .card:last-child { grid-column: 1 / -1; }.analysis-tabs { grid-template-columns: repeat(3,1fr); } }
@media (max-width: 820px) { .sidebar { position: fixed; z-index: 20; top: 0; bottom: 0; left: 0; transform: translateX(-100%); transition: .22s; }.sidebar.open { transform: translateX(0); }.mobile-menu { display: inline-grid; }.topbar { padding: 0 15px; }.search-trigger { width: 35px; padding: 8px; justify-content: center; }.search-trigger span, .search-trigger kbd, .role-picker span { display: none; }.role-picker select { max-width: 90px; font-size: 11px; }.main-content { padding: 20px 15px 32px; }.summary-banner { grid-template-columns: repeat(2,1fr); }.summary-title { grid-column: 1 / -1; }.cols-4, .cols-3, .cols-2, .split-panel, .report-layout { grid-template-columns: 1fr; }.workflow { grid-template-columns: repeat(4,1fr); gap: 16px 5px; }.workflow:before { display: none; }.task-row { grid-template-columns: 1fr auto; }.task-row > :nth-child(2), .task-row > :nth-child(3), .task-row > :nth-child(4) { display: none; }.chain { grid-template-columns: 1fr; }.chain-step:not(:last-child):after { content: "↓"; right: auto; top: auto; bottom: -18px; left: 50%; }.analysis-tabs { grid-template-columns: repeat(2,1fr); }.page-head { flex-direction: column; }.page-actions { justify-content: flex-start; }.form-grid { grid-template-columns: 1fr; }.field.full { grid-column: auto; } }
@media (max-width: 820px) { .assistant-panel { top: auto; width: 100%; max-height: min(78vh, 620px); padding: 17px 14px 14px; border-radius: 8px 8px 0 0; transform: translateY(100%); }.assistant-wrap.open .assistant-panel { transform: translateY(0); }.assistant-messages { padding-top: 13px; } }
@media (max-width: 520px) {
  .topbar { height: 60px; padding: 0 10px; gap: 6px; }
  .topbar-start, .topbar-end { gap: 6px; }
  .topbar-start { flex: 1 1 auto; overflow: hidden; }
  .topbar-end { flex: 0 0 auto; }
  .case-select { min-width: 0; gap: 0; overflow: hidden; }
  .case-select span, .case-select small, .case-select i { display: none; }
  .case-select strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
  .topbar-end > .tag, .user-avatar { display: none; }
  .role-picker select { width: 82px; max-width: 82px; }
  .main-content { padding: 18px 14px 30px; }
  .page-head h1 { font-size: 24px; }
  .page-actions { width: 100%; }
  .summary-banner { padding: 18px; gap: 15px; }
  .summary-metric { padding-left: 12px; }
  .toast-region { right: 14px; bottom: 14px; }
  .tutorial-card { padding: 15px; }
  .tutorial-card h2 { font-size: 16px; }
  .tutorial-footer { align-items: flex-start; flex-direction: column; }
  .tutorial-footer .page-actions { width: 100%; justify-content: flex-end; }
  .assistant-launcher { right: 14px; bottom: 14px; padding: 10px 12px; }
}