:root {
  --brand: #173f5f;
  --brand-strong: #0f2f48;
  --brand-soft: #eaf3f8;
  --accent: #f29f05;
  --accent-hover: #dc8d00;
  --ink: #17212b;
  --muted: #607180;
  --line: #d9e3ea;
  --page: #f4f7f9;
  --surface: #ffffff;
  --surface-muted: #f7fafc;
  --overlay: rgba(8, 26, 40, 0.62);
  --ready: #16845b;
  --ready-soft: #e7f6ef;
  --risk: #b66a00;
  --risk-soft: #fff4df;
  --blocked: #b53b3b;
  --blocked-soft: #fdeaea;
  --focus-ring: rgba(23, 63, 95, 0.24);
}

body {
  color: var(--ink);
  background: var(--page);
}

button,
input,
select,
textarea {
  font: inherit;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 2px;
}

.modal,
.dialog-backdrop {
  background: var(--overlay);
}

.modal-card,
.dialog {
  color: var(--ink);
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: 0 24px 70px rgba(15, 47, 72, 0.24);
}

.modal-head,
.modal-actions {
  background: var(--surface);
  border-color: var(--line);
}

.modal-head h2,
.modal h2,
.dialog h2 {
  color: var(--brand-strong);
}

.control {
  color: var(--ink);
  background: var(--surface);
  border-color: #bccbd5;
}

.control:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

.btn-primary,
.button:not(.secondary):not(.accent):not(.danger) {
  color: #fff;
  background: var(--brand);
  border-color: var(--brand);
}

.btn-primary:hover,
.button:not(.secondary):not(.accent):not(.danger):hover {
  background: var(--brand-strong);
  border-color: var(--brand-strong);
}

.btn-accent,
.button.accent {
  color: var(--brand-strong);
  background: var(--accent);
  border-color: var(--accent);
}

.btn-accent:hover,
.button.accent:hover {
  background: var(--accent-hover);
  border-color: var(--accent-hover);
}

.btn-outline,
.button.secondary {
  color: var(--brand);
  background: var(--surface);
  border-color: var(--line);
}

.btn-danger,
.button.danger {
  color: var(--blocked);
  background: var(--surface);
  border-color: #e8bcbc;
}

/* Unified Lean-planner presentation palette. */
.app-shell,
.planner-projectbar,
.gantt-table-stage,
#gantt .gantt_container,
.mobile-tasks-panel {
  background: var(--surface-muted);
  border-color: var(--line);
}

.planner-project-summary strong,
.gantt-grid-task-name,
.task-row-title,
.planner-selected-summary strong {
  color: var(--ink);
}

.planner-project-summary span,
.planner-project-icon,
.planner-selected-summary,
.planner-legend,
.footer,
.task-row-meta {
  color: var(--muted);
}

.planner-pdf-button,
.planner-actions-popover,
.gantt-scale-control .btn,
.mobile-view-toggle .btn,
.task-card {
  color: var(--ink);
  background: var(--surface);
  border-color: var(--line);
}

.planner-actions-popover {
  box-shadow: 0 18px 45px rgba(15, 47, 72, 0.18);
}

.gantt-scale-control .btn[aria-pressed="true"],
.mobile-view-toggle .btn[aria-pressed="true"] {
  color: #fff;
  background: var(--brand);
  border-color: var(--brand);
}

.gantt-scale-control .btn[aria-pressed="false"],
.mobile-view-toggle .btn[aria-pressed="false"] {
  color: var(--brand);
  background: var(--surface);
}

#gantt .gantt_grid_scale,
#gantt .gantt_task_scale {
  color: var(--muted);
  background: var(--brand-soft);
  border-color: var(--line);
}

#gantt .gantt_grid_data,
#gantt .gantt_task_bg,
#gantt .gantt_grid_row,
#gantt .gantt_task_row {
  background: var(--surface);
  border-color: var(--line);
}

#gantt .gantt_grid_row:hover,
#gantt .gantt_task_row:hover {
  background: var(--brand-soft);
}

#gantt .gantt_task_line.gantt-ready {
  color: #0d6848 !important;
  background: var(--ready-soft) !important;
  border-color: var(--ready) !important;
}

#gantt .gantt_task_line.gantt-risk {
  color: #8c5200 !important;
  background: var(--risk-soft) !important;
  border-color: var(--risk) !important;
}

#gantt .gantt_task_line.gantt-blocked {
  color: #8e2d2d !important;
  background: var(--blocked-soft) !important;
  border-color: var(--blocked) !important;
}

.planner-legend i[data-decision="ready"],
.task-row-status i[data-decision="ready"] { background: var(--ready); }
.planner-legend i[data-decision="risk"],
.task-row-status i[data-decision="risk"] { background: var(--risk); }
.planner-legend i[data-decision="blocked"],
.task-row-status i[data-decision="blocked"] { background: var(--blocked); }
.planner-legend i.today { background: var(--blocked); }

@media print {
  body { background: #fff; }
}