div {
  display: flex;
  flex-direction: column;
}

body {
  margin: 0;
  background: #f5f6fa;
  font-family: -apple-system, system-ui, sans-serif;
  color: #2f3542;
  overscroll-behavior-y: none;
  -webkit-tap-highlight-color: transparent;
}

.container {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
}

.page-title { font-size: 1.4rem; margin-bottom: 4px; }

.card {
  background: #fff;
  border-radius: 12px;
  padding: 24px;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  margin: 10px;
}
.card .msg-query {
  font-size: 1.05rem; font-weight: 650; color: #1f2937;
  line-height: 1.3;
}
.card .msg-response {
  display: block; margin-top: 10px;
  color: #374151; font-size: 1rem; line-height: 1.55;
}

.artifact {
  margin-top: 18px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 16px 18px 18px;
  background: #fbfcfe;
}
.artifact h2.chart-title { font-size: 1.05rem; margin: 0 0 12px; }

.chart { height: 320px; }

.empty-state { padding: 80px 20px; text-align: center; }
.empty-state h1 { font-size: 1.6rem; margin-bottom: 8px; }
.empty-state p { color: #747d8c; }