@media (max-width: 1240px) {
  .layout,
  .top-grid,
  .bottom-grid,
  .ai-grid,
  .executive-grid,
  .decision-ribbon,
  .playbook-grid {
    grid-template-columns: 1fr;
  }

  .category-bars {
    grid-template-columns: repeat(5, minmax(88px, 1fr));
    overflow-x: auto;
    padding-bottom: 6px;
  }

  .category-overview-grid {
    grid-template-columns: 1fr;
  }

  .ring-overview-grid {
    grid-template-columns: 1fr;
  }

  .control-panel {
    position: static;
  }

  .hero-side {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .executive-grid.compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  body {
    padding: 18px;
  }

  .hero {
    flex-direction: column;
    align-items: flex-start;
  }

  .hero-side,
  .overview-header {
    grid-template-columns: 1fr;
  }

  .ai-panel-title,
  .ai-powered,
  .ai-hero-meta {
    display: grid;
    justify-items: start;
  }

  .hero h1 {
    font-size: 34px;
  }

  .overview-header {
    display: grid;
  }

  .overview-header h2 {
    font-size: 26px;
  }

  .quick-judgment p {
    font-size: 16px;
  }

  .grade-cluster {
    justify-items: start;
  }

  .executive-grid.compact {
    grid-template-columns: 1fr;
  }

  .map-stage {
    height: 420px;
  }

  .metrics-grid {
    grid-template-columns: 1fr;
  }

  .category-bars {
    grid-template-columns: repeat(5, minmax(76px, 1fr));
  }

  .category-rank-card strong {
    font-size: 22px;
  }

  .category-headline {
    font-size: 15px;
  }

  .ai-hero-card p {
    font-size: 18px;
  }

  .ring-row-head {
    display: grid;
  }

  .ring-row-meta {
    justify-items: start;
    grid-auto-flow: column;
    justify-content: flex-start;
  }
}