#overviewView {
  --ov-bg: #f8fafc;
  --ov-card: #fff;
  --ov-text: #0f172a;
  --ov-muted: #475569;
  --ov-border: #e2e8f0;
  --ov-accent: #0f766e;
  background: var(--ov-bg);
  color: var(--ov-text);
}

.accessibility-dark-mode #overviewView {
  --ov-bg: #0f172a;
  --ov-card: #182233;
  --ov-text: #f1f5f9;
  --ov-muted: #cbd5e1;
  --ov-border: #334155;
  --ov-accent: #5eead4;
}

#overviewView .overview-content {
  max-width: 1440px;
  padding: clamp(16px, 4vw, 48px);
}

#overviewView .welcome-line {
  gap: 16px;
  flex-wrap: wrap;
  align-items: center;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--ov-border);
}

#overviewView .welcome-line h1 {
  color: var(--ov-text);
  font-size: calc(30px * var(--accessibility-scale, 1));
  letter-spacing: -.035em;
}

#overviewView :is(.welcome-subtitle, .eyebrow, .metric-muted, .metric-card > small) {
  color: var(--ov-muted);
}

#overviewView .welcome-subtitle {
  font-size: calc(14px * var(--accessibility-scale, 1));
}

#overviewView .metrics-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
  gap: 12px;
  margin-top: 24px;
}

#overviewView :is(.metric-card, .overview-project-link, .overview-analytics article) {
  background: var(--ov-card);
  color: var(--ov-text);
  border: 1px solid var(--ov-border);
  border-radius: 12px;
  box-shadow: 0 1px 2px #0f172a0a;
}

#overviewView .metric-card {
  padding: 16px;
  height: auto;
  min-height: 145px;
}

#overviewView .metric-card > span:not(.metric-icon) {
  color: var(--ov-text);
}

#overviewView .overview-analytics {
  padding: 0;
  border: 0;
  background: transparent;
}

#overviewView .overview-dashboard > h2 {
  font-size: calc(21px * var(--accessibility-scale, 1));
  letter-spacing: -.025em;
}

#overviewView .overview-analytics article {
  padding: 18px;
  min-width: 0;
}

#overviewView .overview-analytics h3 {
  font-size: calc(14px * var(--accessibility-scale, 1));
}

#overviewView .overview-analytics :is(dt, .overview-chart-row span) {
  color: var(--ov-muted);
}

#overviewView .overview-analytics dl {
  font-size: calc(13px * var(--accessibility-scale, 1));
}

#overviewView .overview-donut strong {
  background: var(--ov-card);
}

#overviewView .overview-chart-track {
  background: var(--ov-border);
}

#overviewView .secondary-button {
  background: var(--ov-card);
  color: var(--ov-text);
  border-color: var(--ov-border);
  border-radius: 8px;
}

#overviewView :is(button, summary):focus-visible {
  outline: 2px solid var(--ov-accent);
  outline-offset: 3px;
}

.accessibility-high-contrast #overviewView {
  --ov-bg: Canvas;
  --ov-card: Canvas;
  --ov-text: CanvasText;
  --ov-muted: CanvasText;
  --ov-border: CanvasText;
  --ov-accent: Highlight;
}
.executive-workspace #overviewView .overview-content > :not(#openingInbox),
.executive-workspace .primary-nav [data-nav]:not([data-nav="overview"]):not([data-nav="mayor"]),
.executive-workspace #searchButton,
.executive-workspace #helpCard {
  display: none !important;
}

.executive-inbox {
  display: grid;
  gap: 14px;
  overflow-wrap: anywhere;
}

.executive-inbox :is(h1, h2, h3, p) {
  margin: 0;
}

.executive-inbox h2 {
  margin-top: 12px;
  font-size: 1.1em;
}

.executive-inbox article {
  display: grid;
  gap: 8px;
  justify-items: start;
  padding: 18px;
  border: 1px solid var(--ov-border);
  border-radius: 12px;
  background: var(--ov-card);
  color: var(--ov-text);
}
.executive-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

#overviewView .executive-tabs [aria-pressed="true"] {
  background: var(--ov-accent);
  color: var(--ov-bg);
  border-color: var(--ov-accent);
}

.executive-queue:not([hidden]) {
  display: grid;
  gap: 12px;
}

.executive-queue > h2 {
  padding: 12px 16px;
  border-radius: 8px;
  background: var(--ov-card);
  border-inline-start: 4px solid var(--queue-accent);
}

.executive-projects { --queue-accent: #0f766e; }
.executive-deadlines { --queue-accent: #b7791f; }
.executive-queue article { border-inline-start: 4px solid var(--queue-accent); }
.collaborator-workspace #overviewView .metrics-grid,
.collaborator-workspace #overviewView .overview-project-link,
.collaborator-workspace #newAllProjects,
.collaborator-workspace #overviewCharts {
  display: none !important;
}

.collaborator-workspace #overviewView .overview-dashboard {
  grid-template-columns: minmax(0, 480px);
}