/* Keep the ambient glow inside the layout without clipping focus or shadows. */
.scene-halo { left: 0; right: 0; }
.live-workspace > *, .columns > *, .approach > *, .form-row > * { min-width: 0; }
html { scroll-padding-top: 88px; }
.founder-email { display: flex; flex-direction: column; gap: 3px; }
.contact-actions .secondary-button { display: inline-flex; align-items: center; justify-content: center; text-decoration: none; }
.founder-email .form-note { max-width: 340px; margin: 6px 0; font-size: 13px; }
.email-apps { display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: 13px; }
.email-apps a:hover { color: var(--ink); }

@media (max-width: 1024px) {
  /* Touch targets stay generous; typography and pill styling stay compact. */
  .button, .button.small, .secondary-button, .dialog-close,
  .phase-controls button, .motion-control, .theme-picker button {
    min-height: 44px;
    height: auto;
  }
  .field input, .field textarea { font-size: 16px; }
  .field input { height: 44px; }
  .field label { font-size: 14px; }
  .inquiry-dialog { overscroll-behavior: contain; }
  .email-apps a, .founder-email > a { display: inline-flex; align-items: center; min-height: 44px; }
}

@media (max-width: 800px) {
  .columns { grid-template-columns: 1fr; gap: 36px; }
  .columns article { max-width: none; }
  .work-visual { height: 140px; }
  .columns p { font-size: 16px; }
  .phase-controls { max-width: 100%; }
  .phase-controls button { padding-inline: 10px; }
  .live-demo .demo-foot > div { display: flex; flex-shrink: 0; }
}

@media (min-width: 651px) and (max-width: 900px) {
  .source-pane { padding: 24px; }
  .output-pane { padding: 24px; }
  .phase-content { min-height: 290px; }
}

@media (max-width: 480px) {
  .contact-actions .button, .contact-actions .secondary-button { padding: 12px; }
  .dialog-top > div { min-width: 0; }
  .dialog-top h2 { overflow-wrap: break-word; }
  .dialog-close { padding-inline: 10px; }
  .live-demo .demo-foot { align-items: center; flex-wrap: wrap; }
  .live-demo .demo-foot > span { flex: 1 1 140px; }
}
