@media (max-width: 760px) {
  .shell {
    width: min(100vw, 100%);
    padding: 20px 12px 32px;
  }

  .hero {
    margin-bottom: 16px;
  }

  h1 {
    font-size: clamp(1.7rem, 10vw, 2.5rem);
    line-height: 1.0;
  }

  .lede {
    font-size: 0.96rem;
    line-height: 1.45;
  }

  .domains {
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 14px;
  }

  .domain-card,
  .panel {
    border-radius: 20px;
  }

  .domain-card {
    padding: 12px;
  }

  .panel {
    padding: 16px;
  }

  .control-strip {
    gap: 10px;
    margin-bottom: 14px;
  }

  .control-group p,
  #domain-summary,
  .result-provenance,
  small {
    font-size: 0.88rem;
    line-height: 1.4;
  }

  .inline-chip-list,
  .chip-list {
    gap: 4px;
  }

  .chip {
    padding: 4px 8px;
    font-size: 0.85rem;
  }

  .primary-request {
    padding: 12px;
  }

  textarea {
    min-height: 160px;
    padding: 12px;
    font-size: 0.96rem;
    line-height: 1.45;
  }

  .inline-field,
  .meta {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .secondary,
  .submit {
    min-height: 44px;
  }

  .report {
    min-height: 240px;
    padding: 14px;
    line-height: 1.55;
  }

  .run-indicator {
    width: 100%;
    justify-content: center;
  }

  .control-group {
    gap: 10px;
  }

  .field {
    gap: 6px;
  }

  .panel-head {
    margin-bottom: 12px;
  }
}

@media (max-width: 520px) {
  .domains {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .eyebrow {
    font-size: 11px;
    letter-spacing: 0.18em;
  }

  .panel-head-top {
    gap: 8px;
  }

  .chip {
    padding: 3px 7px;
    font-size: 0.82rem;
  }

  .llm-panel {
    padding: 10px;
  }

  .meta div {
    gap: 6px;
  }

  dt, dd {
    font-size: 0.86rem;
  }
}