/* Touch suggestions */
.touch-combo {
  display: grid;
  gap: 0.6rem;
}

.touch-combo input {
  block-size: 3.25rem;
  border: 1px solid var(--border);
  border-radius: 0.9rem;
  background: var(--card);
  padding: 0 1rem;
  font-size: 0.95rem;
  font-weight: 500;
}

.touch-combo [role="listbox"] {
  display: grid;
  gap: 0.4rem;
  max-block-size: 16rem;
  overflow: auto;
}

.touch-combo [role="option"] {
  min-block-size: 3rem;
  display: flex;
  align-items: center;
  text-align: start;
  border: 1px solid var(--border);
  border-radius: 0.9rem;
  background: var(--card);
  padding: 0 1rem;
  font-size: 0.9rem;
  font-weight: 500;
  transition: background-color 0.1s ease, border-color 0.1s ease;
}

.touch-combo [role="option"]:hover {
  background: var(--accent);
  border-color: var(--ring);
}

.touch-combo mark {
  background: color-mix(in srgb, var(--primary) 22%, transparent);
  color: inherit;
  border-radius: 0.2rem;
}