/* bidpilot — 조달 실무용 화면. 외부 폰트·CDN 없음.
   모든 색은 :root 토큰으로만 정의하고, 다크 모드는 같은 토큰을 다시 정의한다. */

:root {
  color-scheme: light;
  /* 바탕·글자 (차가운 중성색) */
  --bg: #f3f5f7;
  --surface: #ffffff;
  --surface-2: #eef1f4;
  --surface-3: #e7ecf1;
  --ink: #16202a;
  --ink-2: #3e4b58;
  --muted: #687482;
  --line: #dce2e8;
  --line-strong: #c3cbd4;
  /* 유일한 강조색: 강철 청색 */
  --accent: #1f5f8b;
  --accent-strong: #174a6d;
  --accent-soft: #e2edf5;
  --accent-ink: #ffffff;
  --focus: #2f80c2;
  /* 의미 색(판정·신뢰도) — 강조색과 분리 */
  --ok: #1d7340;
  --ok-bg: #e2f2e8;
  --ok-solid: #1d7340;
  --on-solid: #ffffff;
  --warn: #855600;
  --warn-bg: #fbefd2;
  --bad: #b02a22;
  --bad-bg: #fbe5e3;
  --neutral: #55606c;
  --neutral-bg: #e9edf1;
  --conf-a: #1d7340;  --conf-a-bg: #e2f2e8;
  --conf-b: #0f6466;  --conf-b-bg: #ddf0ef;
  --conf-c: #855600;  --conf-c-bg: #fbefd2;
  --conf-d: #b02a22;  --conf-d-bg: #fbe5e3;
  /* 산출방법(식별용) */
  --m-quote: #5a3ea8;   --m-quote-bg: #ece7f8;
  --m-market: #1d5aa0;  --m-market-bg: #e3ecf8;
  --m-mas: #0f6466;     --m-mas-bg: #ddf0ef;
  --m-past: #7a4a14;    --m-past-bg: #f4ebdf;
  --m-blend: #3a4699;   --m-blend-bg: #e6e8f6;
  --m-manual: #36424f;  --m-manual-bg: #e4e8ec;
  /* 사용자 지정·우리 투찰 */
  --user: #7c3a6b;
  --user-bg: #f6e7f1;
  --ours: #1f5f8b;
  --ours-bg: #e2edf5;
  --hl-bg: #fff6d9;
  /* 차트 */
  --series-1: #2a78d6;
  --chart-grid: #e6eaee;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #11161c;
    --surface: #182029;
    --surface-2: #1e2731;
    --surface-3: #25303b;
    --ink: #e4eaf0;
    --ink-2: #b9c4cf;
    --muted: #8a96a3;
    --line: #2a343f;
    --line-strong: #3a4653;
    --accent: #5d9fd0;
    --accent-strong: #8cbde3;
    --accent-soft: #1a3346;
    --accent-ink: #0b1620;
    --focus: #7cb6e6;
    --ok: #6cc28c;
    --ok-bg: #16301f;
    --ok-solid: #2f8a52;
    --on-solid: #ffffff;
    --warn: #e2b55c;
    --warn-bg: #352a12;
    --bad: #ef8a81;
    --bad-bg: #3b1d1b;
    --neutral: #a3afbb;
    --neutral-bg: #26303a;
    --conf-a: #6cc28c;  --conf-a-bg: #16301f;
    --conf-b: #5cc4c0;  --conf-b-bg: #133131;
    --conf-c: #e2b55c;  --conf-c-bg: #352a12;
    --conf-d: #ef8a81;  --conf-d-bg: #3b1d1b;
    --m-quote: #b7a3ef;   --m-quote-bg: #2a2342;
    --m-market: #8ab6ea;  --m-market-bg: #1a2c42;
    --m-mas: #5cc4c0;     --m-mas-bg: #133131;
    --m-past: #d9ad78;    --m-past-bg: #33281a;
    --m-blend: #a4adea;   --m-blend-bg: #232742;
    --m-manual: #c3ccd5;  --m-manual-bg: #2a333d;
    --user: #e3a1d1;
    --user-bg: #3a2134;
    --ours: #8cbde3;
    --ours-bg: #1a3346;
    --hl-bg: #3a3214;
    --series-1: #3987e5;
    --chart-grid: #2a343f;
    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --bg: #11161c;
  --surface: #182029;
  --surface-2: #1e2731;
  --surface-3: #25303b;
  --ink: #e4eaf0;
  --ink-2: #b9c4cf;
  --muted: #8a96a3;
  --line: #2a343f;
  --line-strong: #3a4653;
  --accent: #5d9fd0;
  --accent-strong: #8cbde3;
  --accent-soft: #1a3346;
  --accent-ink: #0b1620;
  --focus: #7cb6e6;
  --ok: #6cc28c;
  --ok-bg: #16301f;
  --ok-solid: #2f8a52;
  --on-solid: #ffffff;
  --warn: #e2b55c;
  --warn-bg: #352a12;
  --bad: #ef8a81;
  --bad-bg: #3b1d1b;
  --neutral: #a3afbb;
  --neutral-bg: #26303a;
  --conf-a: #6cc28c;  --conf-a-bg: #16301f;
  --conf-b: #5cc4c0;  --conf-b-bg: #133131;
  --conf-c: #e2b55c;  --conf-c-bg: #352a12;
  --conf-d: #ef8a81;  --conf-d-bg: #3b1d1b;
  --m-quote: #b7a3ef;   --m-quote-bg: #2a2342;
  --m-market: #8ab6ea;  --m-market-bg: #1a2c42;
  --m-mas: #5cc4c0;     --m-mas-bg: #133131;
  --m-past: #d9ad78;    --m-past-bg: #33281a;
  --m-blend: #a4adea;   --m-blend-bg: #232742;
  --m-manual: #c3ccd5;  --m-manual-bg: #2a333d;
  --user: #e3a1d1;
  --user-bg: #3a2134;
  --ours: #8cbde3;
  --ours-bg: #1a3346;
  --hl-bg: #3a3214;
  --series-1: #3987e5;
  --chart-grid: #2a343f;
  color-scheme: dark;
}

/* --------------------------------------------------------------------------
   기본
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
body {
  margin: 0;
  padding-block: 0;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
  background: var(--bg);
  color: var(--ink);
  font-family: "Pretendard", "Pretendard Variable", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo",
    "Malgun Gothic", "맑은 고딕", "Noto Sans KR", "Noto Sans CJK KR", "Segoe UI", Roboto, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  word-break: keep-all;
  overflow-wrap: break-word;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--accent); text-underline-offset: 2px; }
a:hover { color: var(--accent-strong); }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 2px; }
h1, h2, h3, h4 { color: var(--ink); line-height: 1.3; }
h1 { font-size: 21px; margin: 0 0 4px; font-weight: 700; letter-spacing: -0.01em; }
h2 { font-size: 16px; margin: 0; font-weight: 700; }
h3 { font-size: 14px; margin: 18px 0 8px; font-weight: 700; }
h4 { font-size: 13px; margin: 14px 0 6px; font-weight: 700; color: var(--ink-2); }
h2.h-sm { font-size: 14px; margin-bottom: 10px; padding-bottom: 6px; border-bottom: 1px solid var(--line); }
.h-spec { font-size: 15px; font-weight: 500; color: var(--ink-2); }
.h-note { font-size: 12px; font-weight: 400; color: var(--muted); margin-left: 6px; }
.mono { font-family: ui-monospace, "SF Mono", Menlo, Consolas, "D2Coding", monospace; font-size: 0.92em; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
.strong { font-weight: 700; }
.nowrap { white-space: nowrap; }
.min0 { min-width: 0; }
.pos { color: var(--ok); }
.neg { color: var(--bad); }
.warn-text { color: var(--warn); }
.sep { color: var(--line-strong); margin: 0 4px; }
.ago { color: var(--muted); font-size: 0.92em; }
.ts { font-variant-numeric: tabular-nums; }
.sub { font-size: 11.5px; color: var(--muted); margin-top: 1px; font-weight: 400; }
.sub-inline { font-size: 11.5px; color: var(--muted); }
.lead { margin: 0; color: var(--ink-2); font-size: 13px; }
ul.plain { margin: 0; padding-left: 18px; }
ul.plain li { margin: 3px 0; }

/* --------------------------------------------------------------------------
   상단
   -------------------------------------------------------------------------- */
.topbar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px;
  padding-block: 10px 8px;
  border-bottom: 2px solid var(--accent);
}
.brand { font-weight: 800; font-size: 17px; color: var(--ink); text-decoration: none; letter-spacing: -0.01em; display: inline-flex; align-items: baseline; gap: 8px; }
.brand-sub { font-weight: 500; font-size: 12px; color: var(--muted); }
.mainnav { display: flex; flex-wrap: wrap; gap: 2px; min-width: 0; }
.mainnav a { padding: 5px 10px; border-radius: 4px; color: var(--ink-2); text-decoration: none; font-weight: 600; font-size: 13.5px; }
.mainnav a:hover { background: var(--surface-3); color: var(--ink); }
.mainnav a.on { background: var(--accent-soft); color: var(--accent-strong); }
.gen-stamp { margin-left: auto; font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }

.freshbar {
  display: flex; align-items: flex-start; gap: 6px 10px;
  padding-block: 7px; border-bottom: 1px solid var(--line); font-size: 11.5px;
}
.fb-title { color: var(--muted); font-weight: 600; white-space: nowrap; line-height: 22px; }
.fb-chips { display: flex; flex-wrap: wrap; gap: 4px; min-width: 0; flex: 1 1 0; }
.fb-chip {
  display: inline-flex; align-items: center; gap: 4px; padding: 1px 7px; line-height: 18px;
  border: 1px solid var(--line); border-radius: 4px; background: var(--surface);
  color: var(--ink-2); text-decoration: none; white-space: nowrap; font-variant-numeric: tabular-nums;
}
.fb-chip:hover { border-color: var(--line-strong); color: var(--ink); }
.fb-chip .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ok); flex: none; }
.fb-chip .fb-name { font-weight: 600; color: var(--ink); }
.fb-chip.lvl-stale, .fb-chip.lvl-warn { border-color: var(--warn); }
.fb-chip.lvl-stale .dot, .fb-chip.lvl-warn .dot { background: var(--warn); }
.fb-chip.lvl-fail { border-color: var(--bad); background: var(--bad-bg); }
.fb-chip.lvl-fail .dot { background: var(--bad); }
.fb-chip .badge { font-size: 10.5px; padding: 0 4px; }
.fb-more { white-space: nowrap; font-weight: 600; line-height: 22px; }

.flashes { padding-block: 10px 0; }
.flash { padding: 8px 12px; border-radius: 4px; border: 1px solid var(--line-strong); background: var(--surface); margin-bottom: 6px; font-size: 13.5px; }
.flash-ok { border-color: var(--ok); background: var(--ok-bg); }
.flash-warn { border-color: var(--warn); background: var(--warn-bg); }
.flash-error { border-color: var(--bad); background: var(--bad-bg); }

.main { padding-block: 16px 28px; max-width: 1720px; margin-inline: auto; }
.footer {
  display: flex; flex-wrap: wrap; gap: 4px 18px; padding-block: 14px 22px;
  border-top: 1px solid var(--line); font-size: 12px; color: var(--muted);
  max-width: 1720px; margin-inline: auto;
}

/* --------------------------------------------------------------------------
   레이아웃 블록
   -------------------------------------------------------------------------- */
.page-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 10px 16px; margin-bottom: 14px; }
.page-head > * { min-width: 0; }
.head-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.crumbs { font-size: 12.5px; color: var(--muted); margin-bottom: 6px; overflow-wrap: anywhere; }
.crumbs a { color: var(--muted); }

.card {
  background: var(--surface); border: 1px solid var(--line); border-radius: 4px;
  padding: 14px 16px; margin-block: 0 16px; min-width: 0;
}
.card-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.card-head > * { min-width: 0; }
.count { display: inline-block; min-width: 20px; padding: 0 6px; margin-left: 4px; border-radius: 10px; background: var(--surface-2); color: var(--ink-2); font-size: 12px; font-weight: 600; text-align: center; font-variant-numeric: tabular-nums; vertical-align: 1px; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.grid-2 > * { min-width: 0; }
.stack { display: flex; flex-direction: column; }
.empty-note { color: var(--muted); margin: 6px 0; }
.note { font-size: 12.5px; color: var(--ink-2); margin: 8px 0 0; }

.banner { padding: 8px 12px; border-radius: 4px; margin-bottom: 12px; border: 1px solid var(--line-strong); font-size: 13px; background: var(--surface); }
.banner.warn { background: var(--warn-bg); border-color: var(--warn); }
.banner.user { background: var(--user-bg); border-color: var(--user); }

/* 요약 타일: 큰 숫자는 비례 숫자(가독성), 표 숫자만 tabular */
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin-bottom: 16px; }
.tiles > * { min-width: 0; }
.tile {
  display: flex; flex-direction: column; gap: 2px; padding: 10px 12px;
  background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--line-strong);
  border-radius: 4px; text-decoration: none; color: var(--ink);
}
.tile:hover { border-color: var(--line-strong); color: var(--ink); }
.tile-label { font-size: 12px; color: var(--muted); font-weight: 600; }
.tile-value { font-size: 26px; font-weight: 700; line-height: 1.15; }
.tile-value small { font-size: 13px; font-weight: 600; color: var(--ink-2); }
.tile-sub { font-size: 12px; color: var(--ink-2); }
.tile-go { border-left-color: var(--accent); }
.tile-alert { border-left-color: var(--bad); }
.tile-alert .tile-value { color: var(--bad); }
.tile-warn { border-left-color: var(--warn); }

.seg { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--line-strong); border-radius: 4px; overflow: hidden; margin-left: auto; }
.seg a { padding: 2px 10px; font-size: 12px; text-decoration: none; color: var(--ink-2); border-left: 1px solid var(--line); background: var(--surface); }
.seg a:first-child { border-left: 0; }
.seg a.on { background: var(--accent); color: var(--accent-ink); }

.chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 12px; }
.chip { display: inline-block; padding: 2px 9px; border: 1px solid var(--line-strong); border-radius: 12px; font-size: 12px; text-decoration: none; color: var(--ink-2); background: var(--surface); }
.chip:hover { border-color: var(--accent); color: var(--accent-strong); }
.chip.on { border-color: var(--accent); color: var(--accent-strong); font-weight: 700; background: var(--accent-soft); }

.summary-line { font-size: 13px; color: var(--ink-2); margin: 0 0 8px; display: flex; flex-wrap: wrap; gap: 4px 6px; align-items: center; }
.stat-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0; border: 1px solid var(--line); border-radius: 4px; background: var(--surface); margin-bottom: 12px; }
.stat-strip > div { padding: 8px 12px; border-right: 1px solid var(--line); display: flex; flex-direction: column; min-width: 0; }
.stat-strip .s-wide { grid-column: 1 / -1; border-top: 1px solid var(--line); border-right: 0; }
.s-label { font-size: 11.5px; color: var(--muted); font-weight: 600; }
.s-value { font-size: 18px; font-weight: 700; }
.s-sub { font-size: 11.5px; color: var(--muted); }
.s-list { font-size: 13px; }

/* --------------------------------------------------------------------------
   표
   -------------------------------------------------------------------------- */
.table-wrap {
  overflow-x: auto; max-width: 100%; border: 1px solid var(--line); border-radius: 4px;
  -webkit-overflow-scrolling: touch; background: var(--surface);
}
.table-wrap.tall { max-height: 74vh; overflow: auto; }
.card .table-wrap { margin-bottom: 4px; }
table.data { border-collapse: separate; border-spacing: 0; width: 100%; font-size: 13px; }
.data th {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 1;
  background: var(--surface-2); color: var(--ink-2); text-align: left; font-weight: 600; font-size: 12px;
  padding: 7px 8px; border-bottom: 1px solid var(--line-strong); white-space: nowrap;
}
.data td { padding: 6px 8px; border-bottom: 1px solid var(--line); vertical-align: top; }
.data tbody tr:last-child td { border-bottom: 0; }
.data tbody tr:hover td { background: var(--surface-3); }
.data.compact td { padding: 4px 8px; }
.data.compact th { padding: 5px 8px; }
.data .num, th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.data td.spec { min-width: 140px; max-width: 280px; color: var(--ink-2); }
.data .title-link { font-weight: 600; color: var(--ink); text-decoration: none; }
.data .title-link:hover { color: var(--accent); text-decoration: underline; }
.title-link { font-weight: 600; }
.data tr.empty td { color: var(--muted); text-align: center; padding: 16px; }
.unit { color: var(--muted); }
th.sortable a { color: inherit; text-decoration: none; display: inline-flex; gap: 3px; align-items: baseline; }
th.sortable.num a { justify-content: flex-end; }
th.sortable.sorted { color: var(--accent-strong); }
.sort-ind { font-size: 10px; color: var(--muted); }
th.sorted .sort-ind { color: var(--accent-strong); }
.items-table { font-size: 12.5px; }
.items-table td, .items-table th { padding-left: 6px; padding-right: 6px; }
th.two-sort { line-height: 1.5; }
th.two-sort a { white-space: nowrap; }
.items-table td:first-child { min-width: 140px; }
.items-table td.spec { min-width: 110px; max-width: 180px; }
.notice-cell { min-width: 130px; max-width: 185px; }
.ellip { display: block; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rec-table td:nth-child(2), .notices-table td:nth-child(2) { min-width: 220px; }

tr.row-cancelled td, tr.muted-row td, tr.row-ineligible td, tr.row-failed td { color: var(--muted); }
tr.row-cancelled .title-link { text-decoration: line-through; color: var(--muted); }
tr.ours-row td:first-child { box-shadow: inset 3px 0 0 var(--ours); }
tr.by-user td:first-child { box-shadow: inset 3px 0 0 var(--user); }
tr.hl td, .data tbody tr.hl:hover td { background: var(--hl-bg); }
tr.decision-row-go td:first-child { box-shadow: inset 3px 0 0 var(--ok); }
tr.runrow-failed td:first-child { box-shadow: inset 3px 0 0 var(--bad); }
tr.runrow-partial td:first-child { box-shadow: inset 3px 0 0 var(--warn); }
tr.runrow-running td:first-child { box-shadow: inset 3px 0 0 var(--accent); }
tr.lvl-row-fail td:first-child { box-shadow: inset 3px 0 0 var(--bad); }
tr.lvl-row-stale td:first-child, tr.lvl-row-warn td:first-child { box-shadow: inset 3px 0 0 var(--warn); }
.err-cell { max-width: 360px; }
.err-text { color: var(--bad); overflow-wrap: anywhere; }
.hint-text { color: var(--ink-2); overflow-wrap: anywhere; margin-top: 2px; }
.last-job p { margin: 2px 0; }
.formula { font-family: ui-monospace, "SF Mono", Menlo, Consolas, "D2Coding", monospace; font-size: 12.5px; background: var(--surface-2); padding: 6px 10px; border-radius: 4px; overflow-wrap: anywhere; margin: 0 0 8px; }
.basis-text { margin: 4px 0 8px; }
.rule-cell { min-width: 180px; color: var(--ink-2); font-size: 12px; }
.scen-name { min-width: 150px; max-width: 220px; }
dl.kv-tree { margin: 4px 0; font-size: 12.5px; }
.kvt-row { display: grid; grid-template-columns: minmax(110px, max-content) minmax(0, 1fr); gap: 2px 12px; padding: 2px 0; border-bottom: 1px dotted var(--line); }
.kvt-row:last-child { border-bottom: 0; }
.kvt-row > dt { color: var(--muted); }
.kvt-row > dd { margin: 0; min-width: 0; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.kvt-row dl.kv-tree { margin: 0; padding-left: 8px; border-left: 2px solid var(--line); }
details.assumptions > summary { margin-bottom: 4px; }
.err-pre { white-space: pre-wrap; overflow-wrap: anywhere; max-width: 420px; font-size: 11px; margin: 4px 0 0; color: var(--bad); }

table.kv { border-collapse: collapse; width: 100%; font-size: 13px; }
.kv th { text-align: left; color: var(--muted); font-weight: 500; padding: 4px 14px 4px 0; white-space: nowrap; vertical-align: top; width: 1%; }
.kv td { padding: 4px 0; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.kv tr.sep-row th, .kv tr.sep-row td { border-top: 1px solid var(--line); padding-top: 8px; }
.kv.compact th, .kv.compact td { padding-block: 2px; }

/* --------------------------------------------------------------------------
   배지
   -------------------------------------------------------------------------- */
.badge {
  display: inline-block; padding: 0 6px; border-radius: 3px; font-size: 11.5px; font-weight: 700;
  line-height: 1.6; white-space: nowrap; border: 1px solid transparent; vertical-align: 1px;
  background: var(--neutral-bg); color: var(--neutral); text-decoration: none;
}
a.badge:hover { border-color: currentColor; }
.b-muted { background: var(--neutral-bg); color: var(--muted); font-weight: 600; }
.verdict-eligible { background: var(--ok-bg); color: var(--ok); }
.verdict-review { background: var(--warn-bg); color: var(--warn); }
.verdict-ineligible { background: var(--bad-bg); color: var(--bad); }
.decision-go { background: var(--ok-solid); color: var(--on-solid); }
.decision-review { background: var(--warn-bg); color: var(--warn); border-color: var(--warn); }
.decision-skip { background: var(--neutral-bg); color: var(--neutral); }
.decision-low { background: transparent; color: var(--neutral); border-color: var(--neutral); }
.conf { min-width: 20px; text-align: center; }
.conf-A { background: var(--conf-a-bg); color: var(--conf-a); }
.conf-B { background: var(--conf-b-bg); color: var(--conf-b); }
.conf-C { background: var(--conf-c-bg); color: var(--conf-c); }
.conf-D { background: var(--conf-d-bg); color: var(--conf-d); border-color: var(--conf-d); }
.method { font-weight: 600; }
.method-quote { background: var(--m-quote-bg); color: var(--m-quote); }
.method-market { background: var(--m-market-bg); color: var(--m-market); }
.method-mas { background: var(--m-mas-bg); color: var(--m-mas); }
.method-past_award { background: var(--m-past-bg); color: var(--m-past); }
.method-blend { background: var(--m-blend-bg); color: var(--m-blend); }
.method-manual { background: var(--m-manual-bg); color: var(--m-manual); }
.method-none { background: var(--surface); color: var(--bad); border-color: var(--bad); }
.status-open { background: var(--accent-soft); color: var(--accent-strong); }
.status-closed, .status-opened { background: var(--neutral-bg); color: var(--neutral); }
.status-cancelled { background: var(--bad-bg); color: var(--bad); }
.status-awarded, .award-awarded { background: var(--ok-bg); color: var(--ok); }
.status-failed, .award-failed, .award-rebid { background: var(--warn-bg); color: var(--warn); }
.run-success { background: var(--ok-bg); color: var(--ok); }
.run-partial { background: var(--warn-bg); color: var(--warn); }
.run-failed { background: var(--bad-bg); color: var(--bad); }
.run-running, .b-run { background: var(--accent-soft); color: var(--accent-strong); }
.run-skipped { background: var(--neutral-bg); color: var(--neutral); }
.rule-pass { background: var(--ok-bg); color: var(--ok); }
.rule-fail { background: var(--bad-bg); color: var(--bad); }
.rule-warn { background: var(--warn-bg); color: var(--warn); }
.rule-unknown { background: var(--neutral-bg); color: var(--neutral); }
.b-stale, .b-warn { background: var(--warn-bg); color: var(--warn); }
.b-fail { background: var(--bad-bg); color: var(--bad); }
.b-user { background: var(--user-bg); color: var(--user); }
.b-ours { background: var(--ours-bg); color: var(--ours); }
.b-entity { background: var(--surface); color: var(--ink-2); border-color: var(--line-strong); font-weight: 600; }
.b-side-buy { background: var(--accent-soft); color: var(--accent-strong); font-weight: 600; }
.b-side-sell { background: var(--neutral-bg); color: var(--neutral); font-weight: 600; }

.dday { font-variant-numeric: tabular-nums; white-space: nowrap; }
.dday-urgent { color: var(--bad); font-weight: 700; }
.dday-soon { color: var(--warn); font-weight: 600; }
.dday-past, .dday-none { color: var(--muted); }

/* --------------------------------------------------------------------------
   버튼·폼
   -------------------------------------------------------------------------- */
.btn {
  font: inherit; font-size: 13px; font-weight: 600; line-height: 1.2;
  display: inline-flex; align-items: center; gap: 4px; min-height: 32px; padding: 6px 12px;
  border: 1px solid var(--line-strong); border-radius: 4px; background: var(--surface); color: var(--ink);
  cursor: pointer; text-decoration: none; white-space: nowrap;
}
.btn:hover { border-color: var(--accent); color: var(--accent-strong); }
.btn.primary { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.btn.primary:hover { background: var(--accent-strong); border-color: var(--accent-strong); color: var(--accent-ink); }
.btn.ghost { background: transparent; }
.btn.danger { color: var(--bad); border-color: var(--bad); background: var(--surface); }
.btn.xs { min-height: 26px; padding: 2px 8px; font-size: 12px; }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
.ext { font-size: 13px; font-weight: 600; white-space: nowrap; }
form.inline { display: inline; margin: 0; }

input, select, textarea {
  font: inherit; font-size: 13px; color: var(--ink); background: var(--surface);
  border: 1px solid var(--line-strong); border-radius: 4px; padding: 5px 8px; min-height: 32px; max-width: 100%;
}
input:hover, select:hover { border-color: var(--muted); }
input[type="checkbox"], input[type="radio"] { min-height: 0; accent-color: var(--accent); }

.filters {
  display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: flex-end;
  padding: 10px 12px; background: var(--surface); border: 1px solid var(--line); border-radius: 4px; margin-bottom: 12px;
}
.filters > * { min-width: 0; }
.filters label { display: flex; flex-direction: column; gap: 3px; font-size: 12px; color: var(--ink-2); font-weight: 600; }
.filters label.f-q { flex: 1 1 220px; }
.filters label.f-q input { width: 100%; }
.filters label.check { flex-direction: row; align-items: center; gap: 6px; min-height: 32px; }
.f-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.inline-filters { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-left: auto; font-size: 12px; }

.form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; align-items: start; }
.form-grid > * { min-width: 0; }
.form-card { border: 1px solid var(--line); border-radius: 4px; padding: 12px; background: var(--surface-2); display: flex; flex-direction: column; gap: 6px; }
.form-card h3 { margin: 0 0 2px; }
.form-card label { display: flex; flex-direction: column; gap: 3px; font-size: 12px; font-weight: 600; color: var(--ink-2); }
.form-card > input, .form-card label input:not([type="checkbox"]):not([type="radio"]) { width: 100%; }
.form-card label.check { flex-direction: row; align-items: center; gap: 6px; font-weight: 500; }
.form-card .row { display: flex; gap: 8px; margin-top: 4px; }
.form-card .row2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; }
.form-card .hint { font-weight: 400; color: var(--muted); font-size: 11px; }
.form-card .state { margin: 0; font-size: 12.5px; color: var(--muted); }
.form-card .state.on { color: var(--user); font-weight: 600; }
.form-card .preview { margin: 0; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.radios { border: 0; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12.5px; }
.radios legend { font-size: 12px; font-weight: 600; color: var(--ink-2); padding: 0; margin-bottom: 2px; }
.radios label, .form-card .radios label { flex-direction: row; align-items: center; gap: 5px; font-weight: 500; font-size: 12.5px; color: var(--ink); }
.clear-form { align-self: start; }

.form-inline-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px 12px; align-items: end; margin-bottom: 12px; }
.form-inline-grid > * { min-width: 0; }
.form-inline-grid label { display: flex; flex-direction: column; gap: 3px; font-size: 12px; font-weight: 600; color: var(--ink-2); }
.form-inline-grid label.wide { grid-column: 1 / -1; }
.form-inline-grid input, .form-inline-grid select { width: 100%; }

.job-buttons { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.pager { display: flex; gap: 10px; align-items: center; justify-content: center; margin-top: 10px; }

details.more { margin-top: 10px; }
details.more > summary, .err-cell summary { cursor: pointer; color: var(--accent); font-weight: 600; font-size: 13px; }
details.more[open] > summary { margin-bottom: 8px; }

/* --------------------------------------------------------------------------
   변경 표시
   -------------------------------------------------------------------------- */
.change-list { list-style: none; padding: 0; margin: 0; }
.change-list > li { padding: 10px 0; border-bottom: 1px solid var(--line); }
.change-list > li:last-child { border-bottom: 0; }
.chg-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; }
.chg-head > * { min-width: 0; }
.chg-meta { font-size: 12.5px; display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; }
.chg-fields { list-style: none; margin: 6px 0 0; padding: 0; }
.chg-fields li { padding: 2px 0; font-size: 13px; }
.chg-fields.tight { margin: 0; }
.chg-field { color: var(--ink-2); font-weight: 700; margin-right: 4px; }
.chg-old { color: var(--muted); text-decoration: line-through; text-decoration-color: var(--line-strong); }
.chg-new { color: var(--ink); font-weight: 700; }
.chg-arrow { color: var(--muted); margin: 0 4px; }
.chg-old-cell { color: var(--muted); }
.chg-new-cell { font-weight: 600; }

/* --------------------------------------------------------------------------
   추정가 상세
   -------------------------------------------------------------------------- */
.notice-box-title { margin: 0 0 6px; }
.est-grid { display: grid; grid-template-columns: minmax(200px, 1fr) minmax(0, 2.2fr); gap: 16px 24px; }
.est-grid > * { min-width: 0; }
.est-main { padding: 10px 14px; border-left: 3px solid var(--accent); background: var(--accent-soft); border-radius: 0 4px 4px 0; }
.est-label { font-size: 12px; color: var(--ink-2); font-weight: 600; }
.est-label.mt { margin-top: 10px; }
.est-big { font-size: 30px; font-weight: 800; line-height: 1.15; letter-spacing: -0.01em; }
.est-mid { font-size: 19px; font-weight: 700; }
.est-sub { font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; }
.method-label { color: var(--ink-2); }
.method-text {
  white-space: pre-wrap; overflow-wrap: anywhere; background: var(--surface-2); border-left: 3px solid var(--line-strong);
  padding: 10px 12px; font-size: 13.5px; line-height: 1.65; border-radius: 0 4px 4px 0; font-variant-numeric: tabular-nums;
}
.flags { list-style: none; padding: 0; margin: 10px 0 0; }
.flags li { color: var(--ink); background: var(--warn-bg); border-left: 3px solid var(--warn); padding: 5px 10px; margin: 4px 0; font-size: 13px; border-radius: 0 4px 4px 0; }

.range-bar { position: relative; height: 16px; margin: 12px 6px 4px; }
.rb-track { position: absolute; top: 7px; left: 0; right: 0; height: 2px; background: var(--line-strong); }
.rb-range { position: absolute; top: 3px; height: 10px; background: var(--accent-soft); border: 1px solid var(--accent); border-radius: 2px; }
.rb-mark { position: absolute; top: 0; width: 3px; height: 16px; margin-left: -1px; border-radius: 1px; }
.rb-cost { background: var(--accent-strong); }
.rb-sell { background: var(--ok); }
.rb-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; color: var(--muted); }
.key { display: inline-block; width: 10px; height: 10px; margin-right: 4px; vertical-align: -1px; border-radius: 2px; }
.key-range { background: var(--accent-soft); border: 1px solid var(--accent); }
.key-cost { background: var(--accent-strong); width: 3px; }
.key-sell { background: var(--ok); width: 3px; }

.ref-group { margin-top: 6px; }
.ref-group + .ref-group { border-top: 1px dashed var(--line); margin-top: 14px; }
.ref-group h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 6px; }
.refs-table .ref-title { min-width: 200px; max-width: 380px; overflow-wrap: anywhere; }
.refs-table td.match { min-width: 140px; max-width: 260px; }
.refs-table .score { font-weight: 700; font-variant-numeric: tabular-nums; }
tr.state-user_excluded td, tr.state-auto_excluded td { color: var(--muted); }
tr.state-user_excluded .ref-title a { text-decoration: line-through; }
.use-yes { color: var(--ok); font-weight: 700; }
.use-no { color: var(--bad); font-weight: 700; }
tr.ref-detail-row td { background: var(--surface-2); padding-top: 4px; padding-bottom: 6px; font-size: 12px; }
.data tbody tr.ref-detail-row:hover td { background: var(--surface-2); }
.detail-inline { display: flex; flex-wrap: wrap; gap: 2px 16px; margin: 0; }
.detail-inline > div { display: flex; gap: 5px; }
.detail-inline dt { color: var(--muted); }
.detail-inline dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }

/* --------------------------------------------------------------------------
   추천 패널
   -------------------------------------------------------------------------- */
.rec-decision { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: flex-start; padding: 10px 12px; border-left: 4px solid var(--neutral); background: var(--surface-2); border-radius: 0 4px 4px 0; }
.rec-decision.dec-go { border-left-color: var(--ok); }
.rec-decision.dec-review { border-left-color: var(--warn); }
.rec-decision.dec-low { border-left-color: var(--neutral); }
.rec-decision-badge .badge { font-size: 14px; padding: 2px 10px; }
.reasons { margin: 0; padding-left: 18px; font-size: 13px; min-width: 0; flex: 1 1 260px; }
.figures { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; margin: 12px 0; }
.figures > * { min-width: 0; }
.fig { border: 1px solid var(--line); border-radius: 4px; padding: 9px 12px; display: flex; flex-direction: column; gap: 1px; background: var(--surface); }
.fig-main { border-color: var(--accent); background: var(--accent-soft); }
.fig-label { font-size: 12px; color: var(--ink-2); font-weight: 600; }
.fig-value { font-size: 21px; font-weight: 800; letter-spacing: -0.01em; overflow-wrap: anywhere; }
.fig-sub { font-size: 12px; color: var(--muted); }

.curves { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px 20px; }
.curves > * { min-width: 0; }
figure.curve { margin: 0; position: relative; border: 1px solid var(--line); border-radius: 4px; padding: 8px 8px 4px; background: var(--surface); }
figure.curve figcaption { font-size: 13px; font-weight: 700; margin: 0 0 4px 4px; }
figure.curve figcaption .muted { font-weight: 400; font-size: 12px; }
figure.curve svg { display: block; width: 100%; height: auto; overflow: visible; }
.c-grid { stroke: var(--chart-grid); stroke-width: 1; }
.c-axis { stroke: var(--line-strong); stroke-width: 1; }
.c-zero { stroke: var(--muted); stroke-width: 1; }
.c-line { fill: none; stroke: var(--series-1); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.c-area { fill: var(--series-1); fill-opacity: 0.1; stroke: none; }
.c-rec-line { stroke: var(--ink-2); stroke-width: 1; }
.c-rec-dot { fill: var(--series-1); stroke: var(--surface); stroke-width: 2; }
.c-rec-label { fill: var(--ink); font-size: 12px; font-weight: 700; paint-order: stroke; stroke: var(--surface); stroke-width: 4px; stroke-linejoin: round; }
.c-tick { fill: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.c-hover { stroke: var(--muted); stroke-width: 1; }
.c-hit { fill: transparent; cursor: crosshair; }
.c-tip {
  position: absolute; z-index: 3; pointer-events: none; padding: 6px 8px; font-size: 12px; line-height: 1.45;
  background: var(--surface); color: var(--ink); border: 1px solid var(--line-strong); border-radius: 4px;
  white-space: nowrap; font-variant-numeric: tabular-nums;
}

/* --------------------------------------------------------------------------
   반응형 (태블릿·좁은 화면)
   -------------------------------------------------------------------------- */
@media (max-width: 960px) {
  .grid-2 { grid-template-columns: minmax(0, 1fr); }
  .est-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  body { font-size: 13.5px; }
  .gen-stamp { margin-left: 0; width: 100%; }
  .brand-sub { display: none; }
  .freshbar { flex-wrap: wrap; }
  .fb-chips { flex-basis: 100%; order: 2; }
  .seg { margin-left: 0; }
  .card { padding: 12px; }
  .tile-value { font-size: 22px; }
  .est-big { font-size: 26px; }
  .filters label:not(.f-q):not(.check) { flex: 1 1 140px; }
  .filters select, .filters input { width: 100%; }
  .inline-filters { margin-left: 0; }
  .stat-strip > div { border-right: 0; border-bottom: 1px solid var(--line); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* --------------------------------------------------------------------------
   인쇄 (오늘의 브리핑을 종이로)
   -------------------------------------------------------------------------- */
@media print {
  :root, :root[data-theme="dark"] {
    color-scheme: light;
    --bg: #ffffff; --surface: #ffffff; --surface-2: #f2f2f2; --surface-3: #ffffff;
    --ink: #000000; --ink-2: #222222; --muted: #555555; --line: #cccccc; --line-strong: #999999;
    --accent: #000000; --accent-strong: #000000; --accent-soft: #f2f2f2;
  }
  body { font-size: 11px; padding-left: 0; padding-right: 0; }
  .mainnav, .no-print, .fb-more, .flashes, .head-actions, form, details.more > summary { display: none !important; }
  details.more { display: block; }
  .freshbar { padding-block: 4px; }
  .card { border: 0; padding: 0; margin-bottom: 12px; break-inside: auto; }
  .card-head { break-after: avoid; }
  .table-wrap, .table-wrap.tall { overflow: visible; max-height: none; border: 0; }
  .data th { position: static; }
  .data tr { break-inside: avoid; }
  table.data, .items-table { font-size: 9.5px; }
  .data td, .data th { padding: 3px 4px; }
  .data .sub { font-size: 8.5px; }
  a { color: inherit; text-decoration: none; }
  .tiles { grid-template-columns: repeat(5, 1fr); }
}

.rec-legend { margin: 0 0 10px; font-size: 12.5px; line-height: 1.5; max-width: 110ch; }