.mobile-only {
  display: none;
}

@media (max-width: 980px) {
  .model-row {
    flex-wrap: wrap;
  }

  .model-row label {
    width: 100%;
  }

  .model-row select {
    max-width: none;
  }

  .model-hint {
    width: 100%;
  }
}

@media (max-width: 760px) {
  .mobile-only {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .topbar {
    padding: 12px 14px;
  }

  .topbar h1 {
    font-size: 18px;
  }

  .messages {
    padding: 14px;
    gap: 12px;
  }

  .message {
    max-width: 92%;
    font-size: 13px;
  }

  .input-area {
    padding: 10px 12px;
  }

  .input-row {
    gap: 8px;
  }

  .input-row button {
    padding: 0 14px;
    min-width: 88px;
  }

  .sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 20;
    width: min(88vw, 340px);
    border-right: 1px solid var(--border);
    transform: translateX(-102%);
    transition: transform 0.2s ease;
  }

  .sidebar.open {
    transform: translateX(0);
  }
}