.cp-page {
  --cp-blue: #2255d9;
  --cp-blue-soft: #eef4ff;
  --cp-green: #16834b;
  --cp-green-soft: #edf9f2;
  --cp-amber: #a45b08;
  --cp-amber-soft: #fff7e8;
  --cp-red: #b6362c;
  --cp-ink: #101b32;
  --cp-muted: #647086;
  --cp-border: #d9e1ed;
  --cp-surface: #ffffff;
  --cp-canvas: #f5f7fb;
  min-width: 1180px;
  background: var(--cp-canvas);
}

.cp-page .brand-header {
  width: calc(100% - 28px) !important;
  max-width: 2200px;
  margin: 12px auto 0;
}

.cp-shell {
  width: calc(100% - 28px);
  max-width: 2200px;
  margin: 12px auto 28px;
  color: var(--cp-ink);
}

.cp-toolbar,
.cp-progress-band,
.cp-context-panel,
.cp-workspace,
.cp-summary-panel,
.cp-access-notice {
  border: 1px solid var(--cp-border);
  border-radius: 7px;
  background: var(--cp-surface);
}

.cp-toolbar {
  min-height: 92px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.cp-title-block { min-width: 250px; }
.cp-title-block .eyebrow { margin: 0 0 2px; color: var(--cp-blue); font-size: 12px; }
.cp-title-block h1 { margin: 0; font-size: 30px; line-height: 1; letter-spacing: 0; }
.cp-title-block > p:last-child { margin: 7px 0 0; color: var(--cp-muted); font-size: 13px; }

.cp-project-actions {
  min-width: 0;
  display: flex;
  align-items: end;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.cp-project-picker { width: min(320px, 25vw); }
.cp-project-picker span,
.cp-context-panel label > span:first-child,
.cp-quick-inputs label > span:first-child,
.cp-fee-fields label > span:first-child,
.cp-review-grid label > span:first-child {
  display: block;
  margin-bottom: 5px;
  color: #536077;
  font-size: 12px;
  font-weight: 800;
}

.cp-page input,
.cp-page select,
.cp-page textarea {
  width: 100%;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid #d7dfeb;
  border-radius: 6px;
  background: #fff;
  color: var(--cp-ink);
  font: inherit;
  font-size: 13px;
  letter-spacing: 0;
}

.cp-page textarea { resize: vertical; line-height: 1.4; }
.cp-page input:focus,
.cp-page select:focus,
.cp-page textarea:focus { outline: 3px solid rgba(37, 99, 235, .14); border-color: #7da3ff; }
.cp-page input:disabled,
.cp-page select:disabled,
.cp-page textarea:disabled { background: #f1f3f6; color: #7d8799; }

.cp-command,
.cp-icon-command {
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid #d4dcea;
  border-radius: 6px;
  background: #fff;
  color: var(--cp-ink);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0;
  cursor: pointer;
}

.cp-command:hover,
.cp-icon-command:hover { border-color: #91a8d1; background: #f7f9fd; }
.cp-command.primary { border-color: var(--cp-blue); background: var(--cp-blue); color: #fff; }
.cp-command.primary:hover { background: #1948c5; }
.cp-command:disabled { cursor: not-allowed; opacity: .52; }
.cp-icon-command { width: 38px; padding: 0; font-size: 21px; line-height: 1; }
.cp-access-badge { min-height: 38px; padding: 0 12px; display: inline-flex; align-items: center; border-radius: 6px; background: #eaf1ff; color: #2451bf; font-size: 12px; font-weight: 850; }
.cp-access-badge.is-pro { background: #eaf8f0; color: #126f3e; }

.cp-access-notice {
  margin-top: 10px;
  padding: 13px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-color: #c6d7ff;
  background: linear-gradient(90deg, #eef4ff, #f7fbff);
}

.cp-access-notice strong { color: #1646bc; }
.cp-access-notice p { margin: 3px 0 0; color: #4d5f81; font-size: 13px; }

.cp-progress-band {
  margin-top: 10px;
  padding: 8px;
  display: grid;
  grid-template-columns: auto minmax(180px, .55fr) minmax(0, 1.45fr);
  align-items: center;
  gap: 12px;
  overflow: hidden;
}

.cp-mode-switch { display: flex; flex: 0 0 auto; padding: 3px; border: 1px solid #dbe2ed; border-radius: 6px; background: #f3f5f8; }
.cp-mode-switch button,
.cp-work-tabs button,
.cp-steps button {
  border: 0;
  background: transparent;
  color: #526078;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  cursor: pointer;
}
.cp-mode-switch button { min-height: 32px; padding: 0 10px; border-radius: 4px; }
.cp-mode-switch button.is-active { background: var(--cp-blue); color: #fff; box-shadow: 0 2px 8px rgba(34, 85, 217, .22); }

.cp-mode-description {
  margin: 0;
  padding: 0 4px;
  color: #4f5d75;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.35;
}

.cp-steps { min-width: 0; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(8, minmax(78px, 1fr)); list-style: none; flex: 1; }
.cp-steps li { min-width: 0; display: flex; align-items: center; justify-content: center; gap: 6px; border-left: 1px solid #edf0f5; }
.cp-steps span { width: 21px; height: 21px; display: inline-grid; place-items: center; border-radius: 50%; background: #edf1f7; color: #68748a; font-size: 11px; font-weight: 850; }
.cp-steps li.is-active span { background: var(--cp-blue); color: #fff; }
.cp-steps li.is-active button { color: var(--cp-blue); }

.cp-layout {
  margin-top: 10px;
  display: grid;
  grid-template-columns: minmax(245px, .68fr) minmax(680px, 2.35fr) minmax(250px, .74fr);
  gap: 10px;
  align-items: start;
}

.cp-context-panel,
.cp-summary-panel { padding: 14px; }
.cp-summary-panel { position: sticky; top: 10px; }
.cp-panel-heading { min-height: 32px; margin-bottom: 12px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cp-panel-heading h2 { margin: 0; font-size: 17px; }
.cp-panel-heading > span { color: var(--cp-muted); font-size: 11px; font-weight: 750; }
.cp-fields { display: grid; gap: 11px; }
.cp-field-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.cp-context-panel small { display: block; margin-top: 5px; color: #7a6340; font-size: 10px; line-height: 1.35; }
.cp-unit-input { position: relative; display: block; }
.cp-unit-input input { padding-right: 40px; }
.cp-unit-input em { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: #68748a; font-size: 11px; font-style: normal; font-weight: 800; }

.cp-quick-inputs { margin-top: 16px; padding-top: 14px; border-top: 1px solid #e5e9f0; display: grid; gap: 10px; }
#cpQuickInputs[hidden],
#cpSteps[hidden] { display: none !important; }
.cp-quick-inputs h3 { margin: 0; font-size: 15px; }
.cp-quick-inputs p { margin: 0; color: #6b5a3a; font-size: 11px; line-height: 1.4; }

.cp-workspace { min-width: 0; overflow: hidden; }
.cp-work-tabs { display: flex; align-items: stretch; overflow-x: auto; border-bottom: 1px solid var(--cp-border); background: #f8f9fc; }
.cp-work-tabs button { min-height: 46px; padding: 0 14px; white-space: nowrap; border-right: 1px solid #e7ebf2; }
.cp-work-tabs button.is-active { background: #fff; color: var(--cp-blue); box-shadow: inset 0 -3px 0 var(--cp-blue); }
.cp-view { display: none; padding: 16px; }
.cp-view.is-active { display: block; }
.cp-view-head { min-height: 47px; margin-bottom: 13px; display: flex; align-items: start; justify-content: space-between; gap: 16px; }
.cp-view-head h2 { margin: 0; font-size: 20px; }
.cp-view-head p { margin: 4px 0 0; color: var(--cp-muted); font-size: 12px; line-height: 1.4; }
.cp-inline-actions { display: flex; gap: 7px; }

.cp-table-wrap { width: 100%; overflow: auto; border: 1px solid #e0e5ed; border-radius: 6px; }
.cp-page table { width: 100%; border-collapse: collapse; font-size: 12px; }
.cp-page th { padding: 9px 8px; background: #f4f6f9; color: #56637a; font-size: 10px; text-align: left; text-transform: uppercase; }
.cp-page td { min-width: 72px; padding: 6px; border-top: 1px solid #e5e9ef; vertical-align: middle; }
.cp-page td:first-child { min-width: 28px; width: 28px; }
.cp-page td input,
.cp-page td select { min-height: 34px; padding: 6px 7px; border-color: transparent; background: transparent; }
.cp-page td input:hover,
.cp-page td select:hover { border-color: #d7dfeb; background: #fff; }
.cp-page td .cp-row-title { min-width: 190px; }
.cp-page td .cp-row-source { min-width: 170px; }
.cp-table-total { color: #14254a; font-weight: 850; white-space: nowrap; }
.cp-row-actions { display: flex; gap: 3px; }
.cp-row-actions button { width: 30px; height: 30px; border: 0; border-radius: 4px; background: transparent; color: #66738a; cursor: pointer; font-weight: 900; }
.cp-row-actions button:hover { background: #eef2f8; color: var(--cp-blue); }
.cp-row-actions button[data-delete]:hover { color: var(--cp-red); }

.cp-item-inspector { margin-top: 12px; padding: 12px; border-top: 1px solid var(--cp-border); background: #fafbfd; }
.cp-item-inspector h3 { margin: 0 0 10px; font-size: 15px; }
.cp-expert-grid { display: grid; grid-template-columns: repeat(4, minmax(110px, 1fr)); gap: 8px; }

.cp-adjustment-grid { display: grid; grid-template-columns: repeat(3, minmax(150px, 1fr)); gap: 10px; }
.cp-adjustment-field { padding: 10px; border-left: 3px solid #93b1f7; background: #f7f9fd; }
.cp-adjustment-field label { display: block; font-size: 11px; font-weight: 800; color: #4e5d75; }
.cp-adjustment-field small { display: block; margin-top: 5px; color: #758198; font-size: 10px; }
.cp-adjustment-field .cp-included-check { display: flex; align-items: center; gap: 7px; margin-top: 8px; color: #526077; font-size: 10px; font-weight: 700; }
.cp-adjustment-field .cp-included-check input { width: 15px; height: 15px; margin: 0; accent-color: var(--cp-blue); }
.cp-adjustment-field:has(.cp-included-check input:checked) { border-left-color: #7e8797; background: #f1f3f6; }
.cp-formula-chain { margin-top: 16px; display: grid; gap: 1px; background: #dfe5ee; border: 1px solid #dfe5ee; }
.cp-formula-line { padding: 9px 11px; display: flex; justify-content: space-between; gap: 16px; background: #fff; font-size: 12px; }
.cp-formula-line.total { background: #edf4ff; color: #173e9a; font-weight: 850; }

.cp-risk-table input { min-width: 105px; }
.cp-risk-table input[data-risk-title] { min-width: 220px; }
.cp-fee-layout { display: grid; grid-template-columns: minmax(210px, .8fr) minmax(300px, 1.2fr); gap: 16px; }
.cp-fee-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.cp-phases { margin: 0; padding: 12px; border: 1px solid #dde3ec; border-radius: 6px; }
.cp-phases legend { padding: 0 6px; font-size: 12px; font-weight: 850; }
.cp-phases > div { display: grid; grid-template-columns: repeat(3, minmax(90px, 1fr)); gap: 7px; }
.cp-phase-option { min-height: 38px; padding: 7px; display: flex; align-items: center; gap: 7px; border: 1px solid #e1e6ee; border-radius: 5px; background: #fafbfd; font-size: 11px; font-weight: 750; }
.cp-phase-option input { width: 16px; min-height: 16px; }
.cp-fee-summary { grid-column: 1 / -1; padding: 13px; display: flex; justify-content: space-between; gap: 14px; border-top: 1px solid var(--cp-border); background: #f5f8ff; }
.cp-fee-summary > div { display: grid; gap: 4px; }
.cp-fee-summary span { color: var(--cp-muted); font-size: 11px; }
.cp-fee-summary strong { font-size: 17px; }

.cp-review-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.cp-review-grid small { color: var(--cp-muted); font-size: 10px; }
.cp-revision-fields { display: grid; gap: 10px; }
.cp-revision-history { border-left: 1px solid var(--cp-border); padding-left: 14px; }
.cp-revision-history h3 { margin: 0 0 10px; font-size: 15px; }
.cp-revision-entry { padding: 9px 0; display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid #e6eaf0; font-size: 11px; }
.cp-scenario-panel { grid-column: 1 / -1; padding-top: 14px; border-top: 1px solid var(--cp-border); }
.cp-scenario-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.cp-scenario-heading h3 { margin: 0; font-size: 15px; }
.cp-scenario-heading p { margin: 4px 0 0; max-width: 620px; color: var(--cp-muted); font-size: 11px; }
.cp-scenario-fields { display: grid; grid-template-columns: minmax(170px, 1fr) 110px auto; align-items: end; gap: 8px; }
.cp-scenario-fields .cp-command { white-space: nowrap; }

.cp-kpis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.cp-kpi { min-height: 78px; padding: 10px; display: grid; align-content: space-between; border: 1px solid #dce3ee; border-radius: 6px; background: #f8faff; }
.cp-kpi.primary { grid-column: 1 / -1; border-color: #9bcdb0; background: var(--cp-green-soft); }
.cp-kpi span { color: #5c6980; font-size: 10px; font-weight: 800; }
.cp-kpi strong { font-size: clamp(15px, 1.2vw, 20px); overflow-wrap: anywhere; }
.cp-kpi.primary strong { color: #146c3f; font-size: 24px; }
.cp-quality { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--cp-border); }
.cp-quality > div { margin-top: 8px; display: flex; justify-content: space-between; gap: 10px; font-size: 11px; }
.cp-quality progress { width: 100%; height: 8px; accent-color: var(--cp-blue); }
.cp-cost-bars { margin-top: 14px; display: grid; gap: 8px; }
.cp-cost-bar-label { display: flex; justify-content: space-between; gap: 8px; color: #526079; font-size: 10px; font-weight: 750; }
.cp-cost-bar-track { height: 9px; overflow: hidden; border-radius: 3px; background: #e8edf4; }
.cp-cost-bar-track i { display: block; height: 100%; min-width: 1px; background: var(--cp-blue); }
.cp-cost-bar:nth-child(2) i { background: var(--cp-green); }
.cp-cost-bar:nth-child(3) i { background: #dd8a21; }
.cp-summary-list { margin-top: 14px; border-top: 1px solid var(--cp-border); }
.cp-summary-list > div { padding: 8px 0; display: flex; justify-content: space-between; gap: 10px; border-bottom: 1px solid #edf0f4; font-size: 11px; }
.cp-summary-list strong { text-align: right; }
.cp-precision-note { margin: 12px 0 0; color: #6f7b90; font-size: 10px; line-height: 1.45; }

.cp-dialog { width: min(760px, calc(100vw - 40px)); padding: 0; border: 1px solid #cbd4e2; border-radius: 7px; box-shadow: 0 28px 90px rgba(10, 24, 52, .24); }
.cp-dialog::backdrop { background: rgba(16, 27, 50, .34); backdrop-filter: blur(2px); }
.cp-dialog form { padding: 18px; }
.cp-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.cp-dialog-head h2 { margin: 0; font-size: 20px; }
.cp-dialog-head button { width: 34px; height: 34px; border: 0; background: transparent; cursor: pointer; font-size: 23px; }
.cp-dialog > form > p { color: var(--cp-muted); font-size: 12px; }
.cp-dialog textarea { min-height: 240px; font-family: Consolas, monospace; }
.cp-dialog-actions { margin-top: 12px; display: flex; justify-content: flex-end; gap: 8px; }
.cp-export-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.cp-export-option { min-height: 84px; padding: 13px; display: grid; align-content: center; gap: 4px; border: 1px solid #d6deea; border-radius: 6px; background: #fff; text-align: left; cursor: pointer; }
.cp-export-option:hover { border-color: #7ea4ff; background: #f5f8ff; }
.cp-export-option strong { color: var(--cp-blue); font-size: 17px; }
.cp-export-option span { color: var(--cp-muted); font-size: 11px; }

.cp-toast { position: fixed; z-index: 1000; left: 50%; bottom: 26px; transform: translateX(-50%); max-width: min(520px, calc(100vw - 40px)); padding: 11px 15px; border: 1px solid #b9c9ec; border-radius: 6px; background: #edf4ff; color: #173e9a; box-shadow: 0 16px 44px rgba(18, 45, 99, .18); font-size: 12px; font-weight: 800; }
.cp-toast.error { border-color: #e4b9b6; background: #fff0ef; color: #9c2922; }
.cp-toast.success { border-color: #add7bc; background: #edf9f2; color: #146b3e; }
.cp-readonly .cp-context-panel input,
.cp-readonly .cp-context-panel select,
.cp-readonly .cp-context-panel textarea,
.cp-readonly .cp-workspace input,
.cp-readonly .cp-workspace select,
.cp-readonly .cp-workspace textarea { pointer-events: none; }

@media (max-width: 1450px) {
  .cp-progress-band { grid-template-columns: auto minmax(0, 1fr); }
  .cp-steps { grid-column: 1 / -1; }
  .cp-layout { grid-template-columns: 245px minmax(650px, 1fr); }
  .cp-summary-panel { position: static; grid-column: 1 / -1; display: grid; grid-template-columns: 170px 1fr 1fr; gap: 14px; }
  .cp-summary-panel .cp-panel-heading { align-self: start; }
  .cp-summary-panel .cp-kpis { grid-template-columns: repeat(5, minmax(130px, 1fr)); }
  .cp-summary-panel .cp-kpi.primary { grid-column: auto; }
  .cp-summary-panel .cp-quality { margin: 0; padding: 0; border: 0; }
  .cp-summary-panel .cp-precision-note { grid-column: 1 / -1; }
}

@media (max-width: 1180px) {
  .cp-page { min-width: 0; }
  .cp-page .brand-header,
  .cp-shell { width: auto; margin-inline: 8px; }
  .cp-toolbar { align-items: flex-start; flex-direction: column; }
  .cp-project-actions { width: 100%; justify-content: flex-start; }
  .cp-project-picker { width: min(100%, 360px); }
  .cp-progress-band { grid-template-columns: 1fr; align-items: stretch; overflow-x: auto; }
  .cp-steps { grid-column: auto; }
  .cp-steps { min-width: 860px; }
  .cp-layout { grid-template-columns: 230px minmax(620px, 1fr); overflow-x: auto; }
  .cp-summary-panel { min-width: 850px; }
  .cp-scenario-heading { align-items: stretch; flex-direction: column; }
  .cp-scenario-fields { grid-template-columns: minmax(190px, 1fr) 130px auto; }
}

@media (max-width: 760px) {
  .cp-page { overflow-x: hidden; }
  .cp-toolbar { padding: 13px; gap: 14px; }
  .cp-title-block { min-width: 0; }
  .cp-title-block h1 { font-size: 27px; }
  .cp-project-actions { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: end; }
  .cp-project-picker { grid-column: 1 / -1; width: 100%; }
  .cp-access-badge { grid-column: 1 / -1; justify-content: center; }
  .cp-access-notice { align-items: stretch; flex-direction: column; }
  .cp-access-notice .cp-command { width: 100%; }

  .cp-progress-band { overflow: hidden; }
  .cp-mode-switch { width: 100%; overflow-x: auto; }
  .cp-mode-switch button { flex: 1 0 auto; }
  .cp-steps {
    width: 100%;
    min-width: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px;
  }
  .cp-steps li { min-height: 34px; justify-content: flex-start; padding: 0 5px; border: 0; }

  .cp-layout { display: block; overflow: visible; }
  .cp-context-panel,
  .cp-workspace,
  .cp-summary-panel { width: 100%; min-width: 0; }
  .cp-workspace,
  .cp-summary-panel { margin-top: 10px; }
  .cp-summary-panel { display: block; }
  .cp-summary-panel .cp-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cp-summary-panel .cp-kpi.primary { grid-column: 1 / -1; }
  .cp-summary-panel .cp-quality { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--cp-border); }
  .cp-work-tabs { width: 100%; max-width: 100%; }
  .cp-view { padding: 13px; }
  .cp-view-head { align-items: stretch; flex-direction: column; }
  .cp-inline-actions { flex-wrap: wrap; }
  .cp-field-pair,
  .cp-adjustment-grid,
  .cp-fee-layout,
  .cp-fee-fields,
  .cp-review-grid,
  .cp-expert-grid { grid-template-columns: 1fr; }
  .cp-phases > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cp-revision-history { padding: 14px 0 0; border-top: 1px solid var(--cp-border); border-left: 0; }
  .cp-scenario-fields { grid-template-columns: 1fr; }
  .cp-export-grid { grid-template-columns: 1fr; }
  .cp-dialog { width: calc(100vw - 20px); }
}

@media print {
  .cp-page .brand-header,
  .cp-toolbar,
  .cp-progress-band,
  .cp-context-panel,
  .cp-work-tabs,
  .cp-summary-panel,
  .cp-access-notice { display: none !important; }
  .cp-page { min-width: 0; background: #fff; }
  .cp-shell { width: 100%; margin: 0; }
  .cp-layout { display: block; }
  .cp-workspace { border: 0; }
  .cp-view { display: block !important; break-before: page; }
  .cp-view:first-of-type { break-before: auto; }
  .cp-row-actions,
  .cp-view-head button { display: none !important; }
}