:root {
  --navy: #17365d;
  --blue: #1f4e78;
  --teal: #0f6b78;
  --ink: #172033;
  --muted: #667085;
  --line: #d8e2ee;
  --surface: #ffffff;
  --page: #f2f5f4;
  --soft-blue: #eef4f8;
  --soft-mint: #edf7f2;
  --gold: #b7791f;
  --green: #147a55;
  --green-bg: #e7f6ef;
  --amber: #a15c00;
  --amber-bg: #fff3d0;
  --red: #b42318;
  --red-bg: #fee9e7;
  --shadow: 0 8px 24px rgba(31, 55, 75, 0.07);
  font-family: "Microsoft YaHei UI", "PingFang SC", system-ui, sans-serif;
  color: var(--ink);
  background: var(--page);
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--page); min-width: 0; overflow-x: hidden; }
body.access-locked { overflow: hidden; }
button, input, select { font: inherit; }
button { cursor: pointer; }

.access-gate {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 20px;
  overflow-y: auto;
  background: linear-gradient(135deg, rgba(16, 44, 77, .96), rgba(15, 107, 120, .92));
  backdrop-filter: blur(8px);
}
.access-card {
  width: calc(100vw - 40px);
  max-width: 460px;
  min-width: 0;
  padding: 30px;
  border: 1px solid rgba(255, 255, 255, .42);
  border-radius: 8px;
  background: white;
  box-shadow: 0 26px 70px rgba(4, 24, 44, .32);
}
.access-mark { width: 54px; height: 54px; margin-bottom: 20px; display: grid; place-items: center; border-radius: 8px; color: white; background: var(--teal); font-size: 24px; font-weight: 800; }
.access-card h2 { margin: 6px 0 10px; color: var(--navy); font-size: 25px; }
.access-card > p { margin: 0 0 20px; color: var(--muted); line-height: 1.65; }
.access-card label { margin-bottom: 6px; }
.access-card input { width: 100%; margin-bottom: 14px; min-height: 46px; }
.access-card .primary-button { min-height: 46px; }
.access-message { min-height: 20px; margin: 13px 0 5px !important; font-size: 12px; color: var(--muted) !important; }
.access-message.error { color: var(--red) !important; }
.access-message.success { color: var(--green) !important; }
.access-card small { display: block; margin-top: 9px; color: var(--muted); line-height: 1.55; }

.topbar {
  height: 78px;
  padding: 0 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: white;
  background: #17365d;
  box-shadow: 0 4px 18px rgba(12, 37, 65, 0.2);
}
.brand { display: flex; align-items: center; gap: 13px; }
.brand-mark { width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.5); border-radius: 8px; display: grid; place-items: center; font-weight: 800; font-size: 21px; background: rgba(255,255,255,.1); }
.brand h1 { margin: 0; font-size: 20px; letter-spacing: 0; }
.brand p { margin: 4px 0 0; font-size: 12px; color: #d8e8f6; }
.local-status { display: inline-flex; align-items: center; gap: 7px; margin-left: 8px; padding: 6px 9px; border: 1px solid rgba(255,255,255,.26); border-radius: 6px; color: #eaf6f0; background: rgba(255,255,255,.08); font-size: 11px; white-space: nowrap; }
.local-status i { width: 7px; height: 7px; border-radius: 50%; background: #74d3a8; box-shadow: 0 0 0 3px rgba(116,211,168,.15); }
.topbar nav { display: flex; height: 100%; align-items: stretch; }
.nav-button { border: 0; border-bottom: 3px solid transparent; padding: 0 22px; color: #dce9f4; background: transparent; }
.nav-button:hover, .nav-button.active { color: white; background: rgba(255,255,255,.08); border-bottom-color: #78d4df; }

main { max-width: 1600px; margin: 0 auto; padding: 28px 34px 48px; }
.view { display: none; }
.view.active { display: block; }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow); }
.hero { padding: 10px 4px 24px; display: flex; align-items: flex-end; justify-content: space-between; border-bottom: 1px solid #cbd9d5; }
.hero > div, .section-heading > div { min-width: 0; max-width: 100%; }
.hero h2, .section-heading h2 { margin: 6px 0 8px; font-size: 25px; color: var(--navy); }
.hero p, .section-heading p, .panel-heading p { margin: 0; color: var(--muted); line-height: 1.65; overflow-wrap: anywhere; }
.eyebrow { color: var(--teal); font-size: 12px; font-weight: 800; letter-spacing: 0; }
.legend { display: flex; gap: 18px; color: var(--muted); font-size: 13px; }
.legend span { display: flex; align-items: center; gap: 7px; }
.dot { width: 9px; height: 9px; display: inline-block; border-radius: 50%; }
.dot.green { background: #29a676; }.dot.amber { background: #e4a72d; }.dot.red { background: #d64545; }

.upload-grid { display: grid; grid-template-columns: minmax(620px, 1.45fr) minmax(390px, .8fr); gap: 20px; margin-top: 20px; }
.upload-panel { padding: 22px; }
.upload-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 15px; }
.upload-heading > div, .control-overview-heading > div { display: flex; align-items: center; gap: 10px; min-width: 0; }
.upload-heading b, .control-overview-heading b { display: block; color: var(--navy); font-size: 14px; }
.upload-heading small, .control-overview-heading small { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.section-index { width: 30px; height: 30px; flex: 0 0 30px; display: grid; place-items: center; border-radius: 6px; color: #805a19; background: #f7ebd4; font-weight: 800; font-size: 11px; }
.privacy-chip { flex: 0 0 auto; padding: 6px 8px; border-radius: 6px; color: var(--green); background: var(--soft-mint); font-size: 11px; font-weight: 700; }
.batch-editor { display: grid; grid-template-columns: 1fr auto; gap: 14px; align-items: end; margin-bottom: 16px; padding: 14px 16px; border: 1px solid #cfdeeb; border-radius: 8px; background: #f7fafc; }
.batch-editor label { font-size: 13px; }
.batch-editor input { min-width: 360px; background: white; }
.drop-zone { height: 205px; border: 2px dashed #9bb4ce; border-radius: 8px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; background: #f8fbfe; transition: border-color .2s ease, background .2s ease; }
.drop-zone:hover, .drop-zone.dragging { border-color: var(--teal); background: #ecf8fa; }
.drop-zone input { display: none; }
.drop-zone strong { font-size: 18px; color: var(--navy); }
.drop-zone span:last-child { color: var(--muted); font-size: 13px; }
.upload-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 8px; background: #dcebf5; color: var(--blue); font-size: 26px; font-weight: 700; }
.file-list { min-height: 50px; margin: 14px 0; display: flex; gap: 8px; flex-wrap: wrap; }
.file-list.empty { color: var(--muted); align-items: center; }
.file-chip { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; background: #edf4fa; border: 1px solid #cfdeeb; color: var(--navy); padding: 8px 10px; border-radius: 6px; font-size: 13px; }
.file-chip span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 330px; }
.file-chip button { border: 0; background: transparent; color: var(--muted); font-size: 17px; padding: 0 2px; }
.input-readiness { margin: 13px 0 10px; padding: 10px 12px; border-radius: 6px; background: #eef3f7; color: var(--muted); font-size: 12px; line-height: 1.5; }
.input-readiness.warn { color: var(--amber); background: var(--amber-bg); }
.input-readiness.ready { color: var(--green); background: var(--green-bg); }
.rule-card { padding: 24px 28px; }
.rule-card h3 { margin: 8px 0 7px; color: var(--navy); font-size: 20px; line-height: 1.35; }
.rule-lead { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.rule-list { display: grid; gap: 4px; margin-top: 18px; }
.rule-list > div { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 10px; padding: 12px 0; border-bottom: 1px solid #e6ecea; }
.rule-list > div > span { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 6px; color: var(--blue); background: var(--soft-blue); font-size: 11px; font-weight: 800; }
.rule-list p { margin: 0; }
.rule-list b { display: block; color: var(--ink); font-size: 13px; }
.rule-list small { display: block; margin-top: 4px; color: var(--muted); line-height: 1.5; }
.rule-assurance { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; margin-top: 16px; padding: 13px; border-radius: 6px; color: var(--green); background: var(--soft-mint); }
.rule-assurance i { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--green); font-style: normal; font-weight: 800; }
.rule-assurance b, .rule-assurance small { display: block; }
.rule-assurance small { margin-top: 3px; color: #477062; line-height: 1.45; }

.run-progress { margin: 12px 0; padding: 13px 14px; border: 1px solid #bad5df; border-radius: 6px; background: #f3f9fb; }
.run-progress-copy { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 10px; align-items: center; }
.run-progress-mark { width: 20px; height: 20px; border: 2px solid #b5d7dc; border-top-color: var(--teal); border-radius: 50%; animation: spin .8s linear infinite; }
.run-progress b, .run-progress small { display: block; }
.run-progress b { color: var(--navy); font-size: 13px; }
.run-progress small { margin-top: 2px; color: var(--muted); font-size: 11px; }
.run-progress strong { color: var(--teal); font-size: 12px; font-variant-numeric: tabular-nums; }
.run-progress-track { height: 5px; margin-top: 10px; overflow: hidden; border-radius: 3px; background: #dce9ed; }
.run-progress-track i { display: block; width: 12%; height: 100%; border-radius: inherit; background: var(--teal); transition: width .35s ease; }
.run-progress.error { border-color: #efb8b2; background: #fff4f2; }
.run-progress.error .run-progress-track i { background: var(--red); }
.run-progress.error .run-progress-mark { border: 0; animation: none; }
.run-progress.error .run-progress-mark::before { content: "!"; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--red); font-weight: 800; }

.primary-button, .secondary-button { border-radius: 6px; border: 1px solid transparent; min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 0 20px; font-weight: 700; text-decoration: none; }
.primary-button { width: 100%; color: white; background: var(--teal); box-shadow: 0 6px 16px rgba(15, 107, 120, .18); }
.primary-button:hover:not(:disabled) { background: #0c5a66; }
.primary-button.compact { width: auto; }
.primary-button:disabled { cursor: not-allowed; opacity: .48; box-shadow: none; }
.secondary-button { color: var(--blue); background: white; border-color: #9fb6ca; }
.secondary-button:hover { background: #eef5fa; }
.spinner { display: none; width: 18px; height: 18px; border: 2px solid rgba(255,255,255,.35); border-top-color: white; border-radius: 50%; animation: spin .8s linear infinite; }
.loading .spinner { display: inline-block; }.loading .button-text { opacity: .85; }
@keyframes spin { to { transform: rotate(360deg); } }

.hidden { display: none !important; }
.error-box, .notice { margin-top: 18px; padding: 14px 18px; border-radius: 6px; white-space: pre-wrap; line-height: 1.55; }
.error-box strong, .error-box span { display: block; }
.error-box strong { margin-bottom: 4px; }
.error-box { background: var(--red-bg); border: 1px solid #f4b4ae; color: var(--red); }
.notice { background: #e9f4fa; color: var(--blue); border: 1px solid #bbd5e5; }
.results { margin-top: 24px; }
.result-banner { max-width: 100%; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 22px; align-items: center; border-radius: 8px; padding: 20px 22px; margin-bottom: 22px; overflow-wrap: anywhere; word-break: break-word; }
.result-banner.pass { color: var(--green); background: #f3faf6; border: 1px solid #9fd9c4; border-left: 5px solid var(--green); }
.result-banner.block { color: var(--amber); background: #fff9e9; border: 1px solid #e8c875; border-left: 5px solid #c47b16; }
.result-verdict { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 13px; align-items: center; }
.result-verdict-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--green); font-size: 0; }
.result-banner.block .result-verdict-icon { background: #c47b16; }
.result-verdict-icon::before { content: "✓"; color: white; font-size: 21px; font-weight: 800; }
.result-banner.block .result-verdict-icon::before { content: "!"; }
.result-verdict span, .result-verdict strong, .result-verdict p { display: block; }
.result-verdict span { margin-bottom: 2px; color: var(--muted); font-size: 11px; font-weight: 700; }
.result-verdict strong { color: var(--ink); font-size: 18px; }
.result-verdict p { margin: 4px 0 0; color: #4d5d68; font-size: 13px; font-weight: 400; line-height: 1.55; }
.result-next { min-width: 185px; padding-left: 20px; border-left: 1px solid currentColor; }
.result-next span, .result-next b { display: block; }
.result-next span { font-size: 11px; font-weight: 700; opacity: .8; }
.result-next b { margin-top: 3px; font-size: 15px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; margin: 22px 0 16px; }
.section-heading h2 { margin-bottom: 4px; }
#result-title, #result-meta { max-width: 100%; overflow-wrap: anywhere; word-break: break-word; }
.heading-actions { display: flex; gap: 10px; align-items: center; }
.heading-actions .primary-button { width: auto; }
.kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)); gap: 12px; margin-bottom: 18px; }
.kpi { min-width: 0; min-height: 104px; background: white; border: 1px solid var(--line); border-radius: 8px; padding: 17px 18px; box-shadow: 0 5px 16px rgba(26,58,94,.045); }
.kpi.primary { border-top: 3px solid #7797b3; }
.kpi.good { border-top-color: var(--green); }
.kpi span { display: block; color: var(--muted); font-size: 12px; margin-bottom: 8px; }
.kpi strong { color: var(--navy); font-size: 24px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.kpi small { display: block; margin-top: 8px; color: var(--muted); font-size: 11px; line-height: 1.4; }
.kpi.warn strong { color: var(--amber); }.kpi.danger strong { color: var(--red); }

.control-overview { margin: 4px 0 18px; padding: 16px 0 18px; border-top: 1px solid #cedbd7; border-bottom: 1px solid #cedbd7; }
.control-overview-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
#control-overview-state { padding: 5px 8px; border-radius: 6px; color: var(--green); background: var(--soft-mint); font-size: 11px; font-weight: 700; }
#control-overview-state.attention { color: var(--amber); background: var(--amber-bg); }
.control-grid { display: grid; grid-template-columns: repeat(8, minmax(105px, 1fr)); gap: 8px; }
.control-item { min-width: 0; padding: 11px 12px; border: 1px solid #d8e2df; border-radius: 6px; background: rgba(255,255,255,.72); }
.control-item span, .control-item strong { display: block; }
.control-item span { color: var(--muted); font-size: 11px; line-height: 1.35; }
.control-item strong { margin-top: 5px; color: var(--navy); font-size: 18px; font-variant-numeric: tabular-nums; }
.control-item.warn { border-color: #e7cc8f; background: #fffbef; }
.control-item.warn strong { color: var(--amber); }
.control-item.danger { border-color: #efbeb9; background: #fff7f5; }
.control-item.danger strong { color: var(--red); }

.table-panel, .result-tabs { margin-top: 18px; overflow: hidden; }
.panel-heading { display: flex; justify-content: space-between; align-items: center; padding: 18px 20px 14px; }
.panel-heading h3 { margin: 0 0 5px; color: var(--navy); }
.panel-heading p { font-size: 13px; }
.table-wrap { overflow: auto; max-height: 570px; border-top: 1px solid var(--line); }
table { width: 100%; border-collapse: collapse; font-size: 12px; }
th { position: sticky; top: 0; z-index: 1; background: var(--blue); color: white; text-align: left; padding: 10px 12px; white-space: nowrap; }
th[draggable="true"] { cursor: grab; user-select: none; }
th[draggable="true"]:active { cursor: grabbing; }
.drag-handle { display: inline-block; margin-right: 7px; color: #bfe8f1; font-size: 11px; }
.dragging-column { opacity: .55; outline: 2px dashed #9cd9e4; }
td { padding: 10px 12px; border-bottom: 1px solid #e4ebf2; vertical-align: top; line-height: 1.45; }
tbody tr:nth-child(even) { background: #f8fbfd; }
tbody tr:hover { background: #edf6fb; }
.number { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.badge { display: inline-flex; align-items: center; white-space: nowrap; border-radius: 999px; padding: 4px 9px; font-size: 11px; font-weight: 800; }
.badge.green { color: var(--green); background: var(--green-bg); }
.badge.amber { color: var(--amber); background: var(--amber-bg); }
.badge.red { color: var(--red); background: var(--red-bg); }
.source-ref { color: var(--muted); min-width: 190px; }
.candidate-note { display: inline-block; margin: 5px 0 2px; padding: 3px 6px; border-radius: 4px; color: var(--amber); background: var(--amber-bg); font-size: 10px; font-weight: 800; }
.money-difference { margin-top: 5px; color: var(--red); font-size: 11px; font-weight: 800; white-space: normal; }
.ledger-review-box { width: 390px; max-width: 100%; display: grid; gap: 9px; }
.ledger-review-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding-bottom: 7px; border-bottom: 1px solid #e6c981; }
.ledger-review-heading b { color: var(--amber); line-height: 1.45; }
.ledger-review-heading span { flex: 0 0 auto; padding: 3px 6px; border-radius: 4px; color: var(--amber); background: var(--amber-bg); font-size: 10px; font-weight: 800; }
.ledger-candidate-list, .return-evidence-list { display: grid; gap: 7px; }
.ledger-candidate { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px; align-items: center; padding: 8px; border: 1px solid #d8e2ee; border-radius: 6px; background: white; }
.ledger-candidate b, .ledger-candidate span, .ledger-candidate small { display: block; overflow-wrap: anywhere; }
.ledger-candidate b { color: var(--navy); font-size: 11px; }
.ledger-candidate span { margin-top: 2px; color: var(--muted); font-size: 10px; }
.ledger-candidate small { margin-top: 3px; color: var(--ink); font-variant-numeric: tabular-nums; }
.candidate-action, .pending-return-action { min-height: 34px; border-radius: 5px; font-size: 11px; font-weight: 800; }
.candidate-action { padding: 0 10px; border: 1px solid #79a9b2; color: var(--teal); background: #f2faf9; white-space: nowrap; }
.candidate-action:hover:not(:disabled) { color: white; background: var(--teal); }
.pending-return-action { width: 100%; padding: 7px 10px; border: 1px solid #d1a34d; color: #805000; background: #fff8e7; }
.pending-return-action:hover:not(:disabled) { background: #ffedbb; }
.candidate-action:disabled, .pending-return-action:disabled { cursor: wait; opacity: .55; }
.ledger-empty-return { margin: 0; padding: 7px 8px; border-left: 3px solid #d1a34d; color: #805000; background: #fff9ea; font-size: 10px; line-height: 1.5; }
.return-evidence-line { padding: 7px 8px; border-left: 3px solid #7b9eb9; background: #f2f7fa; }
.return-evidence-line b, .return-evidence-line span, .return-evidence-line small { display: block; }
.return-evidence-line b { color: var(--blue); font-size: 10px; }
.return-evidence-line span, .return-evidence-line small { margin-top: 2px; color: var(--muted); font-size: 10px; overflow-wrap: anywhere; }
.ledger-decision { display: grid; gap: 3px; padding: 9px; border-radius: 6px; }
.ledger-decision b { font-size: 11px; }
.ledger-decision span { color: var(--muted); font-size: 10px; line-height: 1.5; }
.ledger-decision.selected { color: var(--green); background: var(--green-bg); }
.ledger-decision.pending { color: var(--amber); background: var(--amber-bg); }
.score { min-width: 72px; }
.result-tabs table { min-width: 2800px; }
.result-tabs [data-col="select"] { width: 76px; min-width: 76px; text-align: center; }
.result-tabs [data-col="result"], .result-tabs [data-col="status"], .result-tabs [data-col="type"] { width: 130px; min-width: 130px; }
.result-tabs [data-col="sourceType"] { width: 150px; min-width: 150px; }
.result-tabs [data-col="reason"] { width: 360px; min-width: 360px; }
.result-tabs [data-col="dates"], .result-tabs [data-col="time"] { width: 190px; min-width: 190px; }
.result-tabs [data-col="inboundDrug"], .result-tabs [data-col="orderDrug"], .result-tabs [data-col="drugs"], .result-tabs [data-col="object"] { width: 270px; min-width: 270px; }
.result-tabs [data-col="parties"] { width: 260px; min-width: 260px; }
.result-tabs [data-col="group"] { width: 420px; min-width: 420px; }
.result-tabs [data-col="manufacturer"] { width: 360px; min-width: 360px; }
.result-tabs [data-col="spec"] { width: 320px; min-width: 320px; }
.result-tabs [data-col="quantity"] { width: 170px; min-width: 170px; }
.result-tabs [data-col="amount"] { width: 140px; min-width: 140px; }
.result-tabs [data-col="score"] { width: 130px; min-width: 130px; }
.result-tabs [data-col="method"], .result-tabs [data-col="invoice"], .result-tabs [data-col="comparison"] { width: 270px; min-width: 270px; }
.result-tabs [data-col="orderNo"] { width: 210px; min-width: 210px; }
.result-tabs [data-col="source"], .result-tabs [data-col="detail"], .result-tabs [data-col="note"] { width: 320px; min-width: 320px; }
.result-tabs [data-col="action"] { width: 130px; min-width: 130px; }
.result-tabs [data-col="hospital"] { width: 300px; min-width: 300px; }
.result-tabs [data-col="drug"] { width: 250px; min-width: 250px; }
.result-tabs [data-col="positive"], .result-tabs [data-col="negative"] { width: 180px; min-width: 180px; }
.result-tabs [data-col="included"], .result-tabs [data-col="net"] { width: 160px; min-width: 160px; }
.result-tabs [data-col="negativeUse"] { width: 260px; min-width: 260px; }
.result-tabs [data-col="evidence"], .result-tabs [data-col="original"] { width: 260px; min-width: 260px; }
.result-tabs td { word-break: normal; overflow-wrap: anywhere; }
.result-tabs .source-ref { min-width: 0; }
#history-table { min-width: 1520px; }

.tab-list { display: flex; align-items: center; padding: 0 18px; border-bottom: 1px solid var(--line); }
.tab-button { border: 0; border-bottom: 3px solid transparent; background: transparent; padding: 15px 16px 12px; color: var(--muted); font-weight: 700; }
.tab-button.active { color: var(--blue); border-bottom-color: var(--teal); }
.tab-button span { margin-left: 5px; padding: 2px 7px; border-radius: 10px; background: #e9eff5; font-size: 11px; }
.tab-tools { display: flex; align-items: center; gap: 12px; padding: 12px 18px; background: #f8fafc; border-bottom: 1px solid var(--line); }
.tab-tools input { width: 360px; border: 1px solid #b9c9d8; border-radius: 8px; padding: 9px 12px; outline: none; }
.tab-tools input:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(15,107,120,.1); }
.tab-tools select { min-height: 39px; padding: 7px 12px; border: 1px solid #b9c9d8; border-radius: 8px; color: var(--ink); background: white; }
.drag-tip { margin-left: auto; color: var(--muted); font-size: 12px; white-space: nowrap; }
.tab-panel { display: none; }.tab-panel.active { display: block; }
.review-toolbar { display: flex; align-items: center; gap: 12px; padding: 13px 18px; background: #fffdf5; border-bottom: 1px solid #eadfae; }
.review-toolbar label { flex-direction: row; align-items: center; gap: 7px; white-space: nowrap; }
.review-toolbar input[type="checkbox"] { min-height: auto; }
.review-toolbar input:not([type="checkbox"]) { flex: 1; min-width: 260px; }
.review-toolbar .primary-button { width: auto; white-space: nowrap; }
.subsection-heading { padding: 15px 18px 10px; background: white; border-bottom: 1px solid var(--line); }
.subsection-heading h4 { margin: 0 0 4px; color: var(--navy); }
.subsection-heading p { margin: 0; color: var(--muted); font-size: 12px; }
.compact-wrap { max-height: 300px; }
#quality-table { min-width: 3180px; }
#reviewed-table { min-width: 1500px; }

.master-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.master-card { overflow: hidden; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px 14px; padding: 4px 20px 20px; }
label { display: flex; flex-direction: column; gap: 6px; color: #344054; font-size: 12px; font-weight: 700; }
input { border: 1px solid #bdcad6; border-radius: 8px; min-height: 39px; padding: 8px 10px; color: var(--ink); background: white; outline: none; }
input:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(15,107,120,.1); }
.checkbox-label { flex-direction: row; align-items: center; align-self: center; }
.checkbox-label input { min-height: auto; }
.master-table { max-height: 340px; }
.threshold-card { margin-top: 20px; padding-bottom: 20px; }
.threshold-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; padding: 0 20px; }

footer { padding: 22px 34px 36px; text-align: center; color: var(--muted); font-size: 12px; }

@media (max-width: 1250px) {
  .kpi-grid { grid-template-columns: repeat(3, 1fr); }
  .control-grid { grid-template-columns: repeat(4, minmax(110px, 1fr)); }
  .master-layout { grid-template-columns: 1fr; }
}

@media (max-width: 980px) {
  .topbar { height: auto; min-height: 78px; padding: 14px 22px 0; align-items: flex-start; flex-wrap: wrap; gap: 10px; }
  .topbar nav { width: 100%; height: 48px; overflow-x: auto; }
  .nav-button { flex: 1 0 auto; min-width: 108px; padding: 0 14px; }
  main { padding: 20px 20px 40px; }
  .hero { align-items: flex-start; flex-direction: column; gap: 18px; }
  .legend { flex-wrap: wrap; }
  .upload-grid { grid-template-columns: minmax(0, 1fr); }
  .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .control-grid { grid-template-columns: repeat(3, minmax(100px, 1fr)); }
  .section-heading { align-items: flex-start; flex-direction: column; gap: 14px; }
  .heading-actions { width: 100%; flex-wrap: wrap; }
  .heading-actions > * { flex: 1 1 220px; }
  .master-layout { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 720px) {
  .access-gate { padding: 16px; }
  .access-card { width: calc(100vw - 32px); padding: 24px 18px; }
  .topbar { padding-inline: 14px; }
  .topbar nav { overflow-x: hidden; }
  .nav-button { min-width: 0; flex: 1 1 25%; padding-inline: 7px; font-size: 12px; white-space: nowrap; }
  .brand { align-items: flex-start; }
  .brand-mark { width: 38px; height: 38px; flex: 0 0 38px; }
  .brand h1 { font-size: 17px; }
  .brand p { font-size: 11px; }
  main { padding: 12px 10px 30px; }
  .panel { border-radius: 8px; }
  .hero, .upload-panel, .rule-card { padding: 18px 15px; }
  .hero { padding-inline: 4px; }
  .local-status { display: none; }
  .upload-heading { align-items: flex-start; flex-direction: column; }
  .privacy-chip { align-self: flex-start; }
  .hero h2, .section-heading h2 { font-size: 21px; }
  .batch-editor { grid-template-columns: minmax(0, 1fr); }
  .batch-editor input { width: 100%; min-width: 0; }
  .drop-zone { height: 180px; padding: 18px; text-align: center; }
  .file-chip { width: 100%; }
  .file-chip span { max-width: calc(100vw - 100px); }
  .kpi-grid { gap: 8px; }
  .kpi { padding: 14px 12px; }
  .kpi strong { font-size: 20px; }
  .control-overview-heading { align-items: flex-start; }
  .control-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .control-item { padding: 10px; }
  .result-banner { padding: 14px 15px; }
  .result-banner { grid-template-columns: minmax(0, 1fr); gap: 13px; }
  .result-next { min-width: 0; padding: 12px 0 0; border-left: 0; border-top: 1px solid currentColor; }
  .result-verdict { grid-template-columns: 36px minmax(0, 1fr); }
  .result-verdict-icon { width: 34px; height: 34px; }
  .result-verdict strong { font-size: 16px; }
  .run-progress-copy { grid-template-columns: 22px minmax(0, 1fr) auto; }
  .section-heading { margin-top: 18px; }
  .heading-actions { display: grid; grid-template-columns: 1fr; }
  .heading-actions > *, .heading-actions .primary-button { width: 100%; }
  .panel-heading { padding: 15px 14px 12px; }
  .tab-list { overflow-x: auto; padding: 0 8px; scrollbar-width: thin; }
  .tab-button { flex: 0 0 auto; padding: 13px 12px 10px; }
  .tab-tools { align-items: stretch; flex-direction: column; padding: 10px 12px; }
  .tab-tools input, .tab-tools select { width: 100%; }
  .drag-tip { display: none; }
  .review-toolbar { align-items: stretch; flex-direction: column; padding: 12px; }
  .review-toolbar label { white-space: normal; }
  .review-toolbar input:not([type="checkbox"]) { width: 100%; min-width: 0; }
  .review-toolbar .primary-button { width: 100%; }
  .table-wrap { max-height: 64vh; overscroll-behavior: contain; }
  table { font-size: 11px; }
  th, td { padding: 9px 10px; }
  #monthly-table { min-width: 900px; }
  .form-grid { grid-template-columns: minmax(0, 1fr); padding: 4px 14px 16px; }
  .threshold-grid { grid-template-columns: minmax(0, 1fr); padding: 0 14px; }
  .primary-button, .secondary-button, .nav-button, .tab-button { min-height: 44px; touch-action: manipulation; }
  footer { padding: 20px 16px 30px; line-height: 1.6; }
}

@media (max-width: 420px) {
  .kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi { min-height: 94px; }
  .kpi strong { font-size: 18px; }
  .legend { gap: 10px 14px; }
}
